@font-face{font-family:Satoshi;src:url('/assets/Satoshi-400.woff2');font-weight:400;font-display:swap}
@font-face{font-family:Satoshi;src:url('/assets/Satoshi-500.woff2');font-weight:500;font-display:swap}

/* one dusk, the same warm brown as ray's film canvas */
:root{
 --dusk:oklch(0.219 0.012 52);--dusk-2:oklch(0.25 0.015 55);--dusk-3:oklch(0.295 0.02 58);
 --ink:oklch(0.93 0.025 80);--ink-soft:oklch(0.84 0.03 76);--ink-faint:oklch(0.68 0.03 68);--ink-ghost:oklch(0.54 0.025 62);
 --line:oklch(0.42 0.025 60 / .55);--line-soft:oklch(0.42 0.025 60 / .28);
 --honey:oklch(0.84 0.11 78);--coral:oklch(0.77 0.1 32);--sky:oklch(0.85 0.045 235);--red:oklch(0.62 0.17 27);
 --ease:cubic-bezier(.22,1,.36,1);
 font-family:Satoshi,system-ui,sans-serif;font-synthesis:none;color:var(--ink);background:var(--dusk);
 -webkit-font-smoothing:antialiased;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;font-size:16px;line-height:1.5;text-transform:lowercase;background:var(--dusk);min-height:100svh}
button,input,select,textarea{font:inherit;color:inherit;text-transform:inherit}
button{cursor:pointer;background:none;border:0;padding:0;-webkit-tap-highlight-color:transparent}
button:disabled{cursor:default;opacity:.4}
a{color:inherit}
:focus-visible{outline:2px solid var(--honey);outline-offset:4px;border-radius:6px}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.text-button{font-size:14px;color:var(--ink-faint);padding:8px 2px}
.text-button:hover:not(:disabled){color:var(--ink)}

/* sky */
.stars{position:fixed;inset:-14px;pointer-events:none;z-index:0;overflow:hidden;animation:star-drift 68s ease-in-out infinite alternate}
.stars i{position:absolute;width:var(--size);height:var(--size);border-radius:50%;background:#efddbf;opacity:var(--alpha);box-shadow:0 0 6px #ecc99885;animation:star-breathe var(--twinkle) ease-in-out var(--delay) infinite alternate}
@keyframes star-breathe{from{opacity:calc(var(--alpha)*.62)}to{opacity:var(--alpha)}}
@keyframes star-drift{from{transform:translate3d(-4px,3px,0)}to{transform:translate3d(5px,-4px,0)}}

/* top */
.top{position:fixed;inset:0 0 auto;z-index:20;height:64px;display:flex;align-items:center;gap:32px;padding:0 32px;background:linear-gradient(var(--dusk) 55%,oklch(0.219 0.012 52 / 0))}
.wordmark{font-size:23px;font-weight:500;letter-spacing:-.03em;text-decoration:none;color:var(--ink);margin-right:auto}
.sections{display:flex;gap:28px}
.sections a{font-size:15px;text-decoration:none;color:var(--ink-faint);transition:color .2s}
.sections a:hover{color:var(--ink)}
.settings{font-size:15px;color:var(--ink-faint)}
.settings:hover{color:var(--ink)}

/* the conversation */
.stage{position:relative;z-index:1;min-height:100svh;display:grid;grid-template-columns:minmax(200px,270px) auto minmax(200px,270px);justify-content:center;align-items:center;column-gap:clamp(36px,6vw,104px);padding:84px 32px 36px}
.center{display:flex;flex-direction:column;align-items:center;gap:14px}
.rail-title{font-size:13px;font-weight:500;letter-spacing:.05em;color:var(--ink-ghost);margin:0 0 14px}

.modes{display:flex;flex-direction:column}
.modes button{display:grid;gap:3px;text-align:left;padding:13px 0 13px 24px;position:relative}
.modes .mode-name{font-size:19px;letter-spacing:-.01em;color:var(--ink-faint);transition:color .25s}
.modes .mode-hint{font-size:14px;color:var(--ink-ghost);line-height:1.4}
.modes button:hover:not(:disabled) .mode-name{color:var(--ink-soft)}
.modes button[aria-checked=true] .mode-name{color:var(--ink)}
.modes button[aria-checked=true] .mode-hint{color:var(--ink-faint)}
.modes button:before{content:"";position:absolute;left:4px;top:23px;width:7px;height:7px;border-radius:50%;background:var(--honey);opacity:0;transform:scale(.4);transition:opacity .35s var(--ease),transform .35s var(--ease);box-shadow:0 0 12px var(--honey)}
.modes button[aria-checked=true]:before{opacity:1;transform:none}

.families{display:flex;flex-direction:column;gap:2px}
.family{display:grid;grid-template-columns:38px 1fr;column-gap:13px;align-items:center;text-align:left;padding:9px 10px;border-radius:16px;transition:background .25s}
.family:hover:not(:disabled){background:oklch(1 0 0 / .03)}
.family[aria-checked=true]{background:oklch(1 0 0 / .055)}
.monogram{grid-row:span 2;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:16px;font-weight:500;color:oklch(0.92 0.05 var(--hue));background:oklch(0.45 0.07 var(--hue) / .5);box-shadow:inset 0 0 0 1px oklch(0.75 0.07 var(--hue) / .25)}
.family[aria-checked=true] .monogram{box-shadow:inset 0 0 0 1px oklch(0.8 0.08 var(--hue) / .6),0 0 18px oklch(0.7 0.09 var(--hue) / .35)}
.family-name{font-size:17px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.family[aria-checked=true] .family-name{color:var(--ink)}
.family-meta{font-size:13px;color:var(--ink-ghost)}
.family-actions{display:flex;flex-wrap:wrap;gap:4px 14px;padding:2px 10px 10px 61px}
.family-actions button{font-size:13px;color:var(--ink-faint)}
.family-actions button:hover{color:var(--ink)}
.family-actions .confirm{color:var(--coral)}
.family-add{font-size:15px;color:var(--ink-faint);text-align:left;padding:12px 10px}
.family-add:hover{color:var(--ink)}
.family-input{width:100%;margin:6px 0;padding:10px 12px;font-size:17px;color:var(--ink);background:oklch(1 0 0 / .045);border:1px solid var(--line);border-radius:12px;outline:0}
.family-input:focus{border-color:oklch(0.84 0.11 78 / .6)}
.family-input::placeholder{color:var(--ink-ghost)}
.families-group{font-size:13px;font-weight:500;letter-spacing:.05em;color:var(--ink-ghost);margin:22px 0 6px 10px}
.family.example .family-meta{color:var(--ink-ghost)}

.voice-pick{display:flex;flex-direction:column;align-items:center;gap:8px}
.providers{display:flex;gap:2px;padding:4px;border-radius:999px;background:oklch(1 0 0 / .04);box-shadow:inset 0 0 0 1px var(--line-soft)}
.providers button{font-size:15px;color:var(--ink-faint);padding:7px 15px;border-radius:999px;transition:color .2s,background .2s}
.providers button:hover:not(:disabled){color:var(--ink)}
.providers button[aria-pressed=true]{color:var(--ink);background:oklch(1 0 0 / .08)}
.voices{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px;min-height:30px}
.voices button{font-size:14px;color:var(--ink-ghost);padding:4px 10px;border-radius:999px;transition:color .2s}
.voices button:hover:not(:disabled){color:var(--ink-soft)}
.voices button[aria-pressed=true]{color:var(--honey)}
.voice-label{font-size:14px;color:var(--ink-ghost);margin-right:2px}
.lookup-note{font-size:13px;color:var(--ink-faint);min-height:20px;margin:0}

/* the phone */
.device{height:min(700px,calc(100svh - 196px));aspect-ratio:390/820;padding:6px;border-radius:45px;background:linear-gradient(115deg,#75746b,#292a26 20%,#42443e 65%,#8c897b);box-shadow:0 30px 85px #0008,0 0 0 1px #080a09,0 0 0 2px #62635a55;position:relative}
.device:before,.device:after{content:"";position:absolute;width:3px;background:#50514a;border-radius:2px;left:-3px;top:130px;height:49px}
.device:after{top:194px}
.app{height:100%;position:relative;overflow:hidden;border-radius:39px;background:var(--dusk);box-shadow:0 0 0 2px #101310}
.island{position:absolute;z-index:3;top:11px;left:50%;transform:translateX(-50%);width:78px;height:22px;background:#151713;border-radius:20px}
.home-indicator{position:absolute;width:85px;height:3px;background:#c3ad8755;border-radius:8px;bottom:8px;left:50%;transform:translateX(-50%)}
main{height:100%;position:relative}
.presence{position:absolute;inset:0;transition:opacity .6s}
.presence iframe{border:0;width:100%;height:100%;opacity:0;transition:opacity 1.4s ease;pointer-events:none}
.presence[data-ready=true] iframe{opacity:1}
#render-status{position:absolute;top:47%;left:12%;right:12%;font-size:13px;text-align:center;color:var(--ink-faint)}
.app[data-phase=connecting] .presence,.app[data-phase=closing] .presence{opacity:.75}
.phone-head{position:absolute;z-index:2;top:46px;left:18px;right:18px;text-align:center;pointer-events:none}
.phone-head p{margin:0}
#mode-name{font-size:17px;font-weight:500;color:var(--ink);letter-spacing:-.01em}
#mode-with{font-size:13px;color:var(--ink-faint);margin-top:3px}

/* live words: settled phrases, the one before fades above */
.live-words{position:absolute;z-index:2;left:22px;right:22px;bottom:calc(7% + 66px);pointer-events:none}
.caption-lines{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:8px;min-height:96px}
.caption-line{margin:0;text-align:center;font-size:18px;line-height:1.38;letter-spacing:-.012em;color:var(--ink);text-shadow:0 1px 14px oklch(0.219 0.012 52 / .9);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;overflow-wrap:anywhere;transition:opacity .5s var(--ease),transform .5s var(--ease),filter .5s var(--ease)}
.caption-line[data-speaker=parent]{color:var(--sky);font-size:16px}
.caption-line.entering{opacity:0;transform:translateY(10px);filter:blur(5px)}
.caption-line.past{opacity:.36;transform:scale(.94);-webkit-line-clamp:2}
.caption-line.leaving{opacity:0;transform:translateY(-8px) scale(.94);filter:blur(3px)}

.conversation-foot{position:absolute;z-index:2;left:20px;right:20px;bottom:7%;text-align:center}
.actions{display:flex;align-items:center;justify-content:center;gap:22px;min-height:46px}
.primary{padding:14px 24px;font-size:17px;font-weight:500;letter-spacing:.01em;position:relative;isolation:isolate;color:#e4bd70;background-image:linear-gradient(105deg,#e4bd70,#df9baa,#f0ce88,#e6ad82,#d79fac,#e4bd70);background-size:240% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:shimmer 8s linear infinite}
.primary:before{content:"";position:absolute;inset:12px 15px;z-index:-1;background:linear-gradient(100deg,#edc27880,#e2acb560,#efd38a90);filter:blur(15px);opacity:.26;animation:glow 6s ease-in-out infinite}
.primary:hover:before{opacity:.6}
.round{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;color:var(--ink-soft);background:oklch(1 0 0 / .07);box-shadow:inset 0 0 0 1px var(--line-soft);transition:background .25s}
.round:hover{background:oklch(1 0 0 / .12)}
.round svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.round[aria-pressed=true]{background:oklch(0.84 0.11 78 / .2);color:var(--honey)}
.end{background:var(--red);color:#fff9f4;box-shadow:0 3px 14px oklch(0.62 0.17 27 / .3)}
.end:hover{background:oklch(0.58 0.17 27)}
.end svg{fill:currentColor;stroke-width:1}
.interrupt{display:none!important}
.app .actions .text-button{font-size:14px}
.error{font-size:13px;line-height:1.55;color:var(--coral);margin:10px auto 0;max-width:270px}
@keyframes shimmer{to{background-position:-240% 0}}
@keyframes glow{0%,100%{filter:blur(15px);opacity:.22}50%{filter:blur(19px);opacity:.42}}

/* settings and transcript */
dialog{padding:30px;width:min(480px,calc(100% - 28px));max-height:85svh;overflow:auto;color:var(--ink);background:var(--dusk-2);border:1px solid var(--line);border-radius:24px;box-shadow:0 25px 100px #0009}
dialog::backdrop{background:#080605b0;backdrop-filter:blur(6px)}
dialog[open]{animation:arrive .3s var(--ease) both}
dialog section{border-top:1px solid var(--line-soft);margin-top:22px;padding-top:18px}
dialog h3{font-size:15px;font-weight:500;margin:0;color:var(--ink)}
dialog p{font-size:14px;line-height:1.6;color:var(--ink-faint)}
.drawer-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}
.drawer-heading h2{font-size:22px;font-weight:400;letter-spacing:-.02em;margin:0}
.drawer-note{font-size:14px;line-height:1.55;color:var(--ink-faint)}
.preview-options{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}
.preview-options button{padding:8px 13px;border-radius:999px;font-size:14px;color:var(--ink-soft);box-shadow:inset 0 0 0 1px var(--line)}
.preview-options button:hover{color:var(--ink)}
.small-note{font-size:13px!important}
details{margin-top:18px;font-size:14px;color:var(--ink-faint)}
summary{cursor:pointer}
pre{font-size:12px;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--ink-faint);text-transform:none}
#sarvam-key,#gemini-key{width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--dusk);color:var(--ink);text-transform:none}
#sarvam-setup,#gemini-setup{text-transform:none}
.captions{position:fixed;z-index:15;right:20px;top:80px;bottom:24px;width:380px;max-width:calc(100% - 28px);background:var(--dusk-2);border:1px solid var(--line);border-radius:22px;padding:24px;display:flex;flex-direction:column;animation:arrive .3s var(--ease) both;box-shadow:0 20px 70px #0008}
#transcript{flex:1;overflow:auto;min-height:80px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}
#transcript p{font-size:15px;line-height:1.6;margin:18px 0;overflow-wrap:anywhere;color:var(--ink-soft)}
#transcript b{display:block;font-size:12px;letter-spacing:.05em;color:var(--ink-ghost);font-weight:500;margin-bottom:3px}
#sources{font-size:13px;max-height:110px;overflow:auto;line-height:1.5}
#sources a{display:block;color:var(--honey);margin:5px 0}
@keyframes arrive{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* a small live call that follows you down the page */
.live-island{position:fixed;z-index:25;top:12px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:7px 8px 7px 10px;border-radius:999px;background:oklch(0.16 0.01 50 / .94);box-shadow:0 10px 40px #000a,inset 0 0 0 1px var(--line-soft);max-width:min(560px,calc(100vw - 24px));animation:arrive .35s var(--ease) both}
.island-return{display:flex;align-items:center;gap:10px;min-width:0;flex:1;text-align:left}
.island-orb{width:22px;height:22px;flex:none;border-radius:50%;background:radial-gradient(circle at 40% 38%,#f6dfae,#e4ab73 45%,#c97f7a 75%,transparent 76%);box-shadow:0 0 14px #e2ae7488;animation:orb 3.6s ease-in-out infinite}
.live-island[data-role=listening] .island-orb{animation-duration:2.4s}
.live-island[data-role=responding] .island-orb{animation-duration:1.6s}
.island-words{font-size:14px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.island-mute,.island-end{font-size:13px;padding:7px 13px;border-radius:999px;color:var(--ink-soft);background:oklch(1 0 0 / .07)}
.island-end{background:var(--red);color:#fff9f4}
@keyframes orb{0%,100%{transform:scale(.92)}50%{transform:scale(1.06)}}

/* understanding and evals */
.workspace-section{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:120px 32px 40px}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:40px}
.eyebrow{font-size:13px;font-weight:500;letter-spacing:.05em;color:var(--ink-ghost);margin:0 0 10px}
.section-heading h2{font-size:clamp(34px,4.6vw,56px);font-weight:400;letter-spacing:-.035em;line-height:1.05;margin:0;color:var(--ink)}
.section-note{font-size:14px;color:var(--ink-faint);line-height:1.6}
.empty-copy{font-size:16px;color:var(--ink-ghost)}
.workspace-warning{position:fixed;z-index:30;left:50%;bottom:20px;transform:translateX(-50%);padding:12px 18px;border-radius:14px;background:var(--dusk-3);color:var(--coral);font-size:14px;box-shadow:0 10px 40px #0008}

/* phones and narrow windows */
@media(max-width:980px){
 .stage{grid-template-columns:1fr;row-gap:22px;padding:76px 16px 28px;align-items:start;justify-items:center}
 .center{order:1}
 .rail-modes{order:2;width:100%;max-width:520px}
 .rail-families{order:3;width:100%;max-width:520px}
 .rail-title{margin-left:4px}
 .modes{flex-direction:row;overflow-x:auto;gap:8px;padding-bottom:4px;scrollbar-width:none}
 .modes button{flex:none;padding:10px 15px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-soft)}
 .modes button:before,.modes .mode-hint{display:none}
 .modes .mode-name{font-size:15px}
 .modes button[aria-checked=true]{background:oklch(1 0 0 / .07)}
 .families{flex-direction:row;flex-wrap:wrap;gap:6px}
 .family{grid-template-columns:30px auto;padding:6px 14px 6px 6px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-soft)}
 .monogram{width:30px;height:30px;font-size:14px}
 .family-meta{display:none}
 .family-name{font-size:15px}
 .family-actions{padding:6px 4px;flex-basis:100%}
 .families-group{flex-basis:100%;margin:12px 0 2px 4px}
 .family-add{padding:8px 12px}
 .device{height:min(640px,calc(100svh - 190px))}
 .top{padding:0 16px;gap:16px}
 .sections{gap:16px}
 .sections a,.settings{font-size:14px}
}
@media(max-width:480px){
 .device{height:auto;width:min(330px,calc(100vw - 40px),calc((100svh - 190px)*390/820))}
 .wordmark{font-size:20px}
 .caption-line{font-size:16px}
 .caption-line[data-speaker=parent]{font-size:14.5px}
 .providers button{font-size:14px;padding:6px 11px}
 .workspace-section{padding:96px 16px 32px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.access{display:flex;gap:8px;align-items:center;justify-content:center}
.access input{width:150px;padding:11px 14px;border-radius:999px;border:1px solid var(--line);background:oklch(1 0 0 / .05);color:var(--ink);font-size:15px;text-transform:none;outline:0}
.access input:focus{border-color:oklch(0.84 0.11 78 / .6)}
.access button{padding:11px 16px;border-radius:999px;background:oklch(0.84 0.11 78 / .16);color:var(--honey);font-size:15px}

/* families: examples and bringing one in */
.family.seed .family-meta{white-space:normal;line-height:1.35}
.family-add.subtle{font-size:14px;color:var(--ink-ghost);padding-top:2px}
.families.dropping{outline:1px dashed oklch(0.84 0.11 78 / .6);outline-offset:8px;border-radius:16px}

/* what ray understands */
.section-sub{font-size:16px;color:var(--ink-faint);margin:12px 0 0;max-width:62ch}
.pulse{animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.45}}
.change-strip{margin:0 0 44px;padding:18px 20px;border-radius:18px;background:oklch(0.84 0.11 78 / .06);box-shadow:inset 0 0 0 1px oklch(0.84 0.11 78 / .18);display:grid;gap:8px}
.change-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;font-size:14px;color:var(--ink-faint);margin-bottom:4px}
.change{display:flex;align-items:baseline;gap:10px;font-size:15px;color:var(--ink-soft);flex-wrap:wrap}
.change-mark{width:16px;flex:none;color:var(--honey);text-align:center}
.change-text{flex:1;min-width:200px}
.change.undone{opacity:.45;text-decoration:line-through}
.change.held .change-mark{color:var(--coral)}
.change-check{font-size:13px;font-weight:500;letter-spacing:.05em;color:var(--coral);margin:10px 0 0}
.understanding-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:40px 56px}
.column-title{font-size:13px;font-weight:500;letter-spacing:.05em;color:var(--ink-ghost);margin:0 0 18px}
.understanding-column{display:grid;gap:22px;align-content:start}
.field-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.field h4{margin:0;font-size:14px;font-weight:500;color:var(--ink-faint)}
.add-note{font-size:17px;line-height:1;color:var(--ink-ghost);width:24px;height:24px;border-radius:50%}
.add-note:hover{color:var(--honey);background:oklch(1 0 0 / .05)}
.note{padding:6px 0 10px;border-bottom:1px solid var(--line-soft)}
.note:last-child{border-bottom:0}
.note-text{margin:0;font-size:17px;line-height:1.45;color:var(--ink)}
.note-text b{font-weight:500;color:var(--ink-soft)}
.note-example{margin:4px 0 0;font-size:14px;line-height:1.5;color:var(--ink-faint)}
.note-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:6px}
.note-when{font-size:12px;color:var(--ink-ghost)}
.note-action{font-size:13px;color:var(--ink-ghost)}
.note-action:hover{color:var(--ink)}
.note:not(:hover) .note-action{opacity:.0}
@media(hover:none){.note:not(:hover) .note-action{opacity:1}}
.chip{display:inline-block;font-size:12px;line-height:1;padding:5px 9px;border-radius:999px;background:oklch(1 0 0 / .06);color:var(--ink-faint)}
.chip.source-parent_said{background:oklch(0.85 0.045 235 / .14);color:var(--sky)}
.chip.source-agreed{background:oklch(0.84 0.11 78 / .16);color:var(--honey)}
.chip.source-ray_view{background:oklch(0.77 0.1 32 / .14);color:var(--coral)}
.chip.source-ray_noticed{background:oklch(0.8 0.07 160 / .14);color:oklch(0.82 0.07 160)}
.chip.source-you_edited{background:oklch(1 0 0 / .1);color:var(--ink)}
.chip.area,.chip.status{background:transparent;box-shadow:inset 0 0 0 1px var(--line)}
.chip.confidence-early{opacity:.7}
.empty-copy{margin:0;color:var(--ink-ghost)}
.inline-edit{width:100%;resize:none;overflow:hidden;font-size:17px;line-height:1.45;color:var(--ink);background:oklch(1 0 0 / .05);border:1px solid oklch(0.84 0.11 78 / .45);border-radius:10px;padding:8px 10px;outline:0;text-transform:none}
.evidence{margin-top:6px;font-size:13px}
.evidence blockquote{margin:6px 0 0 12px;color:var(--ink-faint);font-style:normal}
.activity{margin-top:6px;font-size:14px}
.activity p{color:var(--ink-faint);margin:6px 0 0}
.week{display:grid;grid-template-columns:62px auto 1fr;align-items:center;gap:12px;font-size:14px;color:var(--ink-faint);padding:3px 0}
.week-days{display:flex;gap:5px}
.week-days i{width:9px;height:9px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line)}
.week-days i.on{background:var(--honey);box-shadow:0 0 8px oklch(0.84 0.11 78 / .5)}
.timeline{margin-top:52px;max-width:760px}
.timeline-row{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:12px 0;border-top:1px solid var(--line-soft)}
.timeline-when{font-size:14px;color:var(--ink-ghost)}
.timeline-row p{margin:0;font-size:16px;line-height:1.5;color:var(--ink-soft)}
.picture-history{margin-top:28px}
.picture-history p{font-size:14px;color:var(--ink-faint);margin:8px 0}

/* evals */
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 30px}
.chip-button{font-size:14px;padding:7px 13px;border-radius:999px;color:var(--ink-faint);box-shadow:inset 0 0 0 1px var(--line-soft)}
.chip-button:hover{color:var(--ink)}
.chip-button[aria-pressed=true]{color:var(--ink);background:oklch(1 0 0 / .08);box-shadow:none}
.latency{margin-bottom:44px;overflow-x:auto}
.latency-table,.coverage{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
.latency-table th,.latency-table td{text-align:left;padding:12px 14px 12px 0;border-bottom:1px solid var(--line-soft);font-size:16px;white-space:nowrap}
.latency-table tr:first-child th{font-size:13px;font-weight:500;color:var(--ink-ghost);letter-spacing:.03em}
.latency-table tr:not(:first-child) th{font-weight:500;color:var(--ink)}
.latency-table td{color:var(--ink-soft)}
.latency-table td:nth-child(2){color:var(--honey);font-size:18px}
.latency-table tr.empty td{color:var(--ink-ghost)}
.matrix{margin-bottom:44px;overflow-x:auto}
.coverage th,.coverage td{padding:6px 10px 6px 0;text-align:left;font-size:15px}
.coverage tr:first-child th{font-size:13px;font-weight:500;color:var(--ink-ghost)}
.coverage tr:not(:first-child) th{font-weight:400;color:var(--ink-soft);white-space:nowrap}
.cell{min-width:96px;padding:9px 12px;border-radius:10px;font-size:15px;color:var(--ink-ghost);text-align:left;box-shadow:inset 0 0 0 1px var(--line-soft)}
.cell.has-rounds{color:var(--ink);background:oklch(1 0 0 / .04)}
.cell.broke{box-shadow:inset 0 0 0 1px oklch(0.77 0.1 32 / .7)}
.agreement{margin-bottom:44px;display:grid;gap:8px;max-width:620px}
.agree-row{display:grid;grid-template-columns:200px 1fr 120px;align-items:center;gap:14px;font-size:15px;color:var(--ink-soft)}
.agree-bar{height:6px;border-radius:4px;background:linear-gradient(90deg,var(--honey) var(--pct),oklch(1 0 0 / .08) var(--pct))}
.agree-num{font-size:13px;color:var(--ink-faint)}
.rounds{display:grid;gap:18px}
.round-card{padding:22px 24px;border-radius:20px;background:oklch(1 0 0 / .03);box-shadow:inset 0 0 0 1px var(--line-soft);display:grid;gap:10px}
.round-heading{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap}
.round-heading h4{margin:0;font-size:18px;font-weight:500;color:var(--ink)}
.round-meta{font-size:13px;color:var(--ink-ghost)}
.round-latency{margin:0;font-size:15px;color:var(--honey);font-variant-numeric:tabular-nums}
.round-text{margin:0;font-size:14px;color:var(--ink-faint)}
.round-summary{margin:4px 0;font-size:16px;line-height:1.55;color:var(--ink-soft);max-width:70ch}
.attention,.guardrail.broke{margin:0;font-size:14px;color:var(--coral)}
.finding{padding:12px 0 4px;border-top:1px solid var(--line-soft)}
.finding-top{display:flex;align-items:baseline;gap:10px}
.finding-mark{width:16px;text-align:center;color:var(--ink-ghost)}
.finding.supported .finding-mark{color:oklch(0.82 0.07 160)}
.finding.needs_attention .finding-mark{color:var(--coral)}
.finding-label{font-size:16px;font-weight:500;color:var(--ink)}
.finding-status{font-size:13px;color:var(--ink-ghost)}
.finding-ask{margin:4px 0 0 26px;font-size:13px;color:var(--ink-ghost)}
.finding-text{margin:6px 0 0 26px;font-size:15px;line-height:1.5;color:var(--ink-soft);max-width:70ch}
.evidence-link{display:block;margin:6px 0 0 26px;font-size:14px;color:var(--sky);text-align:left;text-transform:none}
.evidence-link:hover{text-decoration:underline}
.verdict{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:10px 0 4px 26px}
.verdict .chip-button{font-size:13px;padding:5px 11px}
.verdict.overall{margin-left:0;padding-top:10px;border-top:1px solid var(--line-soft)}
.verdict-label{font-size:13px;color:var(--ink-ghost);margin-right:4px}
.verdict .inline-edit{font-size:15px;max-width:520px}
.round-transcript{font-size:15px}
.round-transcript p{margin:10px 0;line-height:1.55;color:var(--ink-soft);max-width:70ch;scroll-margin:120px;border-radius:8px;transition:background 1.2s}
.round-transcript p b{display:block;font-size:12px;font-weight:500;color:var(--ink-ghost);letter-spacing:.04em}
.round-transcript p.flash{background:oklch(0.84 0.11 78 / .16);transition:none}
@media(max-width:700px){.timeline-row{grid-template-columns:1fr;gap:4px}.agree-row{grid-template-columns:1fr 90px}.agree-row .agree-bar{grid-column:1/-1;grid-row:2}.round-card{padding:18px}}

/* v2 of the shell (V, 26.10.23): quieter modes, families as one row under the phone, settings as a bottom sheet */
.stage{grid-template-columns:minmax(170px,230px) auto minmax(170px,230px)}
.modes button{padding:9px 0 9px 20px;gap:0}
.modes .mode-name{font-size:16px;color:var(--ink-ghost)}
.modes .mode-hint{display:none}
.modes button[aria-checked=true] .mode-name{color:var(--ink-soft)}
.modes button:before{width:5px;height:5px;left:5px;top:18px;box-shadow:0 0 8px var(--honey)}
.families{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;max-width:min(560px,92vw);margin-top:6px}
.family{grid-template-columns:24px auto;column-gap:8px;padding:5px 12px 5px 5px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-soft)}
.family .monogram{grid-row:auto;width:24px;height:24px;font-size:12px}
.family .family-name{font-size:14px;color:var(--ink-faint)}
.family .family-meta{display:none}
.family[aria-checked=true]{background:oklch(1 0 0 / .07);box-shadow:inset 0 0 0 1px oklch(0.84 0.11 78 / .35)}
.family[aria-checked=true] .family-name{color:var(--ink)}
.family.seed{opacity:.6;box-shadow:inset 0 0 0 1px var(--line-soft);border-style:dashed}
.family.seed:hover{opacity:1}
.family-add{width:34px;height:34px;padding:0;border-radius:50%;font-size:19px;line-height:1;color:var(--ink-faint);box-shadow:inset 0 0 0 1px var(--line-soft);display:grid;place-items:center}
.family-add:hover{color:var(--honey)}
.family-input{width:170px;margin:0;padding:7px 14px;border-radius:999px;font-size:14px}
.family-actions{flex-basis:100%;justify-content:center;padding:4px 0 0}
.family-ask{font-size:13px;color:var(--ink-faint)}
.settings-dot{position:fixed;z-index:21;right:20px;bottom:16px;width:44px;height:44px;border-radius:50%;font-size:22px;line-height:1;color:var(--ink-ghost)}
.settings-dot:hover{color:var(--ink);background:oklch(1 0 0 / .05)}
dialog.sheet{position:fixed;inset:auto 0 0 0;margin:0 auto;width:min(560px,100%);max-width:100%;max-height:82svh;border-radius:26px 26px 0 0;border-bottom:0;padding:10px 26px 30px}
dialog.sheet[open]{animation:sheet-up .38s var(--ease) both}
.sheet-grip{width:38px;height:4px;border-radius:4px;background:var(--line);margin:0 auto 14px}
@keyframes sheet-up{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
#mode-with:empty{display:none}
@media(max-width:980px){
 .stage{grid-template-columns:1fr}
 .rail-balance{display:none}
 .rail-modes{order:2}
 .families{max-width:100%}
 .modes button{padding:8px 14px}
 .modes .mode-name{font-size:14px}
}
.device{height:min(680px,calc(100svh - 240px))}
.center{gap:10px}
@media(max-width:480px){.device{height:auto;width:min(330px,calc(100vw - 40px),calc((100svh - 250px)*390/820))}}
dialog.sheet{background:var(--dusk-3);box-shadow:0 -20px 80px #000c,inset 0 1px 0 oklch(1 0 0 / .08)}
dialog.sheet::backdrop{background:#0806059a;backdrop-filter:blur(4px)}
.device{height:min(640px,calc(100svh - 290px))}
.change.held[data-reason]:after{content:attr(data-reason);font-size:12px;color:var(--ink-ghost)}