body { background: radial-gradient(circle at 82% 10%, #dff3f1 0, transparent 33%), #f5f8fb; }
.topbar { height: 68px; padding: 0 26px; }
.shell { grid-template-columns: 252px minmax(0, 1fr); min-height: calc(100vh - 68px); }
.sidebar { background: #f9fbfe; min-height: calc(100vh - 68px); }
.workspace { padding: 12px clamp(20px, 3.4vw, 52px) 44px; max-width: 1460px; }
.welcome { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(330px, .85fr); border: 1px solid #d9e4ef; border-radius: 24px; overflow: hidden; background: #fff; box-shadow: 0 18px 55px #17355714; }
.welcome-main { display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: column; padding: clamp(34px, 4.5vw, 58px); position: relative; }
.welcome-main::after { content: ""; position: absolute; width: 230px; height: 230px; border-radius: 50%; border: 46px solid #e8f5f3; right: -120px; bottom: -125px; }
.welcome h1 { font-size: clamp(2.45rem, 5vw, 4.4rem); line-height: .98; max-width: 650px; letter-spacing: -.065em; margin: 11px 0 18px; color: #10233e; }
.welcome-copy { font-size: 1.08rem; line-height: 1.65; color: #5a6d86; max-width: 600px; margin: 0 0 27px; }
.hero-action { font-size: .98rem; padding: 13px 18px; border-radius: 12px; box-shadow: 0 8px 20px #2463bd2b; position: relative; z-index: 1; }
.hero-action span { padding-left: 9px; }
.privacy-note { display: flex; align-items: center; gap: 9px; color: #61728a; font-size: .84rem; margin-top: 24px; position: relative; z-index: 1; }
.privacy-note > span:first-child { display: grid; place-items: center; background: #dff4ef; color: #237b6b; width: 23px; height: 23px; border-radius: 50%; font-weight: 900; }
.privacy-note strong { color: #364c68; }
.welcome-guide { display: flex; flex-direction: column; justify-content: flex-start; padding: clamp(34px, 4.5vw, 58px); background: linear-gradient(155deg, #e7f5f2, #dceef2); color: #173b44; position: relative; }
.welcome-guide::before { content: ""; position: absolute; inset: 20px; border: 1px solid #176a5b12; border-radius: 18px; pointer-events: none; }
.guide-label { color: #267b6d; font-size: .72rem; letter-spacing: .13em; font-weight: 800; }
.steps { list-style: none; margin: 25px 0 18px; padding: 0; display: grid; gap: 8px; }
.steps li { display: flex; gap: 16px; padding: 16px 0; border-bottom: 1px solid #2c73651c; }
.steps li:last-child { border-bottom: 0; }
.steps li > span { flex: 0 0 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: #c8e7e1; color: #236f62; font-weight: 800; }
.steps strong { font-size: .98rem; }
.steps p { margin: 5px 0 0; color: #54747a; font-size: .86rem; line-height: 1.45; }
.ready-note { display: flex; align-items: center; gap: 9px; color: #426b69; font-size: .8rem; padding-top: 8px; }
.ready-dot { width: 8px; height: 8px; border-radius: 50%; background: #3c9d8b; box-shadow: 0 0 0 5px #3c9d8b1b; }
.help-link { color: #c9d7e9; text-decoration: none; font-size: .83rem; font-weight: 700; padding: 8px 2px; }
.help-link:hover { color: #fff; }
.trust-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 18px 0; overflow: hidden; border: 1px solid #dce5ef; border-radius: 16px; background: #dce5ef; box-shadow: 0 8px 24px #17355709; }
.trust-row > div { background: #fff; padding: 20px 22px; display: grid; grid-template-columns: 34px 1fr; column-gap: 11px; align-items: center; }
.trust-row span { grid-row: 1 / 3; align-self: start; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: #edf4fd; color: #3c6ca9; font-size: .72rem; font-weight: 800; }
.trust-row strong { font-size: .9rem; color: #213651; }
.trust-row p { margin: 3px 0 0; color: #6b7a8e; font-size: .8rem; line-height: 1.4; }
.faq { display: grid; grid-template-columns: minmax(230px, .65fr) minmax(0, 1.35fr); gap: clamp(30px, 5vw, 75px); background: #fff; border: 1px solid #dce5ef; border-radius: 20px; padding: clamp(30px, 4.5vw, 58px); scroll-margin-top: 86px; }
.faq-intro h2 { margin: 9px 0 12px; font-size: clamp(1.7rem, 3vw, 2.35rem); letter-spacing: -.045em; color: #142943; }
.faq-intro p { color: #65768b; line-height: 1.6; margin: 0; }
.faq-list { border-top: 1px solid #dce5ef; }
.faq-list details { border-bottom: 1px solid #dce5ef; }
.faq-list summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 19px 2px; color: #233a57; font-weight: 750; cursor: pointer; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { color: #4b78ad; font-size: 1.25rem; transition: transform .2s ease; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { color: #617187; font-size: .91rem; line-height: 1.65; margin: -4px 34px 20px 2px; }
.modal-reassurance { margin: -1px 0 0; color: #718196; font-size: .82rem; font-weight: 500; }
.calm-state { display: flex; align-items: flex-start; gap: 13px; margin: 0 0 16px; padding: 15px 17px; border: 1px solid #bfe3dc; border-radius: 14px; background: #eaf7f4; color: #23584f; }
.calm-state strong { font-size: .94rem; }
.calm-state p { margin: 3px 0 0; color: #52746f; font-size: .84rem; line-height: 1.45; }
.calm-check { flex: 0 0 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #3c9d8b; color: #fff; font-weight: 900; }
.resolved-state { background: #e6f5ef; border-color: #aedccc; }
.next { background: linear-gradient(145deg, #e4f3f3, #edf7f5); color: #173d45; border-color: #bcded8; box-shadow: 0 8px 28px #246b6012; }
.next::before { background: #3c9d8b; }
.next .eyebrow { color: #27796c; }
.next p { color: #506f73; }
.next .script { background: #fff; border-color: #c4ddd9; color: #263f46; box-shadow: 0 3px 12px #246b600c; }
.next .script-label { color: #2d7f72; }
.next .pill { background: #d6e9e7; color: #315f5a; }
.next .pill.overdue { background: #f9e6df; color: #9b4b35; }
.next .pill.today,.next .pill.upcoming { background: #dcebf4; color: #315f7d; }
.next .pill.resolved-pill { background: #cceade; color: #216b58; }
.next .pill.caution-pill { background: #f8ead0; color: #86601f; }
.next-resolved { background: linear-gradient(145deg, #e4f5ed, #eff9f5); }
.method-note { margin-top: 15px; padding-top: 13px; border-top: 1px solid #e4ebf2; }
.method-note summary { color: #376b72; font-size: .82rem; font-weight: 750; cursor: pointer; }
.method-note p { color: #6b7b8e; font-size: .79rem; line-height: 1.5; margin: 9px 0 0; }
@media (max-width: 980px) { .welcome { grid-template-columns: 1fr; } .welcome-main { padding: 38px 42px; } .welcome-main::after { display: none; } .welcome-guide { padding: 34px 42px; } .steps { grid-template-columns: repeat(3, 1fr); gap: 18px; } .steps li { display: block; border: 0; padding: 7px 0; } .steps li > span { margin-bottom: 13px; } .trust-row { grid-template-columns: 1fr; } .faq { grid-template-columns: 1fr; gap: 28px; } }
@media (max-width: 700px) { .sidebar { min-height: 0; } .claim-list { min-height: 0; } .claim-list .smallnote { margin: 0; padding: 6px 5px 12px !important; } .workspace { padding: 10px 12px 38px; } .welcome { border-radius: 18px; min-height: 0; } .welcome-main { padding: 30px 24px; } .welcome h1 { font-size: 2.5rem; } .welcome-copy { font-size: 1rem; } .welcome-guide { padding: 28px 24px; } .welcome-guide::before { display: none; } .steps { grid-template-columns: 1fr; gap: 2px; } .steps li { display: flex; padding: 13px 0; border-bottom: 1px solid #2c73651c; } .steps li > span { margin: 0; } .trust-row { margin: 12px 0; } .trust-row > div { padding: 17px 18px; } .faq { padding: 28px 23px; border-radius: 18px; } .help-link { display: none; } .calm-state { margin-bottom: 12px; } }

.contact-link { color: #c9d7e9; text-decoration: none; font-size: .83rem; font-weight: 700; padding: 8px 2px; }
.contact-link:hover { color: #fff; }
.sidefoot a, .support-email a { color: #2463bd; font-weight: 750; text-decoration: none; }
.sidefoot a:hover, .support-email a:hover { text-decoration: underline; }
.faq-intro .support-email { margin-top: 16px; }
@media (max-width: 700px) { .contact-link { font-size: .76rem; } }

.legal-footer { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px 24px; padding: 22px 18px 30px; background: #f3f6fa; border-top: 1px solid #dfe5ed; font-size: .8rem; }
.legal-footer a { color: #526983; text-decoration: none; font-weight: 700; }
.legal-footer a:hover { color: #1d5ca8; text-decoration: underline; }
.file-pick { position: relative; cursor: pointer; }
.file-pick input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; pointer-events: none; }
