:root { --ink:#172538; --muted:#617087; --canvas:#f5f7fb; --paper:#fff; --line:#d9e1eb; --blue:#1e5bc6; --navy:#102b55; --red:#bd253b; --green:#176b4e; --amber:#986600; --radius:16px; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:var(--canvas); }
* { box-sizing:border-box; } body { margin:0; min-width:320px; } button,input,select,textarea { font:inherit; } button { cursor:pointer; } button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #99c5ff; outline-offset:2px; }
.shell { max-width:1160px; margin:0 auto; padding:28px 22px 56px; } .topbar { display:flex; justify-content:space-between; align-items:center; gap:18px; border-bottom:1px solid var(--line); padding-bottom:22px; } .brand { display:flex; gap:12px; align-items:center; } .mark { width:38px; height:44px; display:grid; place-items:center; color:white; background:var(--red); clip-path:polygon(50% 0,94% 14%,94% 57%,50% 100%,6% 57%,6% 14%); font-weight:900; }.eyebrow { color:var(--blue); letter-spacing:.12em; font-size:.72rem; font-weight:800; margin:0 0 3px; }.brand h1 { font-size:1.1rem; margin:0; letter-spacing:-.02em; }.local { border:1px solid #b8c9e7; background:#eaf1ff; color:var(--navy); border-radius:100px; padding:7px 10px; font-size:.75rem; font-weight:700; }
.hero { max-width:720px; padding:58px 0 32px; }.hero h2 { font-size:clamp(2.1rem,5vw,4.6rem); line-height:.99; letter-spacing:-.06em; margin:12px 0 18px; }.hero p { color:var(--muted); line-height:1.65; max-width:650px; }.privacy-note { background:#e9f5f0; color:#174d3c; border-left:4px solid var(--green); padding:14px 16px; border-radius:0 12px 12px 0; font-size:.93rem; }
.lanes { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:30px 0; }.lane,.panel { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); }.lane { text-align:left; padding:22px; min-height:220px; display:flex; flex-direction:column; transition:transform .16s ease, border-color .16s ease; }.lane:hover { transform:translateY(-3px); border-color:#88aee7; }.lane .number { color:var(--blue); font-weight:800; font-size:.8rem; }.lane h3 { margin:18px 0 8px; font-size:1.3rem; letter-spacing:-.03em; }.lane p { margin:0; color:var(--muted); line-height:1.5; }.lane strong { margin-top:auto; padding-top:20px; color:var(--blue); font-size:.88rem; }.content { display:grid; grid-template-columns:minmax(280px,430px) 1fr; gap:24px; align-items:start; }.panel { padding:25px; }.panel h2,.panel h3 { letter-spacing:-.035em; margin:0 0 10px; }.panel p { line-height:1.55; color:var(--muted); }.label { display:grid; gap:7px; margin:17px 0; font-size:.88rem; font-weight:700; }.label span { color:#33445b; }.label small { color:var(--muted); font-weight:400; line-height:1.35; }.label input,.label select,.label textarea { border:1px solid #bdc9d9; background:#fff; border-radius:10px; padding:11px 12px; color:var(--ink); width:100%; }.label textarea { min-height:115px; resize:vertical; }.row { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.primary,.secondary,.quiet { border-radius:10px; padding:11px 14px; font-weight:750; border:1px solid transparent; }.primary { background:var(--blue); color:white; width:100%; }.primary:disabled { opacity:.55; cursor:not-allowed; }.secondary { background:white; border-color:#b9c7da; color:var(--navy); width:100%; margin-top:10px; }.quiet { background:transparent; color:var(--blue); padding:7px 0; }.codes { background:#edf3fc; border-radius:12px; padding:16px; font-size:.82rem; color:#2a4264; }.codes b { display:block; margin-bottom:8px; color:var(--navy); }.codes code { display:block; margin:5px 0; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }.error { background:#fff0f2; border:1px solid #f5b6bf; color:#9d1b30; padding:11px; border-radius:10px; font-size:.88rem; }.success { background:#e9f5f0; border:1px solid #b4dbc9; color:#15533d; padding:11px; border-radius:10px; font-size:.88rem; }.hidden { display:none!important; }
.workspace { display:grid; grid-template-columns:1fr 320px; gap:24px; }.context { display:flex; flex-wrap:wrap; gap:8px; padding:0 0 17px; }.chip { background:#edf3fc; color:#28476f; padding:6px 9px; border-radius:100px; font-size:.76rem; font-weight:700; }.chip.parent { background:#f8efe8; color:#874f22; }.chip.staff { background:#ecf4ed; color:#236546; }.history { display:grid; gap:10px; }.report { border:1px solid var(--line); border-radius:12px; padding:15px; }.report-top { display:flex; justify-content:space-between; gap:10px; }.report h4 { margin:0; text-transform:capitalize; }.report p { margin:9px 0; font-size:.9rem; }.status { font-size:.73rem; padding:5px 8px; border-radius:99px; height:max-content; background:#fff4d9; color:var(--amber); font-weight:750; }.status.verified { background:#e7f5ed; color:var(--green); }.status.dismissed { background:#fbe9eb; color:#a51d31; }.meta { color:var(--muted); font-size:.76rem; }.actions { display:flex; gap:8px; margin-top:12px; }.actions button { font-size:.79rem; padding:7px 9px; }.evidence { margin-top:9px; font-size:.8rem; color:#355679; }.empty { color:var(--muted); padding:17px 0; }.staff-toolbar { display:flex; gap:9px; justify-content:space-between; align-items:center; margin-bottom:15px; }.staff-toolbar button { width:auto; }.name-disclosure { margin-top:8px; padding:8px 10px; background:#f7f2e9; border-radius:8px; color:#70460e; font-size:.82rem; }.footer-note { color:var(--muted); font-size:.78rem; text-align:center; margin-top:34px; }
@media (max-width:820px){.lanes,.content,.workspace { grid-template-columns:1fr; }.hero { padding-top:38px; }.topbar { align-items:flex-start; }.local { white-space:nowrap; }.workspace { gap:15px; }.row { grid-template-columns:1fr; }}
@media (prefers-reduced-motion:reduce){.lane{transition:none}.lane:hover{transform:none}}