:root{
  --sand:#EDE6D6; --stucco:#F7F3EA; --stucco-2:#F1EBDD;
  --ink:#1C2430; --ink-2:#232D3B; --ink-3:#2C3745;
  --ink-soft:#3E4A58; --ink-faint:#6E7884;
  --line:rgba(28,36,48,0.14); --line-strong:rgba(28,36,48,0.28);
  --line-d:rgba(251,248,241,0.12); --line-d2:rgba(251,248,241,0.24);
  --euc:#5C7A6A; --euc-deep:#3F5A4C; --euc-light:#8FAA9B; --euc-soft:rgba(92,122,106,0.14);
  --terra:#D8672E; --terra-deep:#B9531F; --terra-soft:rgba(216,103,46,0.16);
  --white:#FBF8F1; --peach:#F6D9BE;
  --serif:"Fraunces", Georgia, "Times New Roman", serif;
  --sans:"IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  --tab-h:76px;
  --sat:env(safe-area-inset-top, 0px);
  --sab:env(safe-area-inset-bottom, 0px);
}
*{ box-sizing:border-box; }
html{ height:100%; }
body{ margin:0; min-height:100%; background:var(--ink); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased; -webkit-tap-highlight-color:transparent; overscroll-behavior-y:none; }
button{ font:inherit; color:inherit; }
button, input, textarea, select{ font-family:var(--sans); }
a{ color:inherit; }
h1,h2,h3{ font-family:var(--serif); font-weight:500; letter-spacing:-0.02em; margin:0; text-wrap:balance; }
h1 em, h2 em{ font-style:italic; font-weight:400; color:var(--terra-deep); }
p{ margin:0; }
.num{ font-variant-numeric:tabular-nums; }
.label{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.16em; text-transform:uppercase; color:var(--ink-faint); }
.hide{ display:none !important; }
:focus-visible{ outline:2px solid var(--terra); outline-offset:3px; }
@media (prefers-reduced-motion: reduce){ *{ animation-duration:0.01ms !important; transition-duration:0.01ms !important; } }

/* App frame: phone column, ink surround on wide screens */
.app{ position:relative; margin:0 auto; max-width:480px; min-height:100dvh; background:var(--stucco); display:flex; flex-direction:column; }
@media (min-width:600px){ .app{ box-shadow:0 0 0 1px var(--line-d2), 0 40px 100px -40px rgba(0,0,0,0.8); } }
.screen{ flex:1; padding:calc(18px + var(--sat)) 18px calc(var(--tab-h) + var(--sab) + 24px); display:none; animation:fade .3s ease both; }
.screen.on{ display:block; }
@keyframes fade{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:none; } }

.topbar{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:18px; }
.wm{ font-family:var(--serif); font-weight:600; font-size:19px; display:flex; align-items:center; gap:7px; letter-spacing:-0.02em; text-decoration:none; }
.wm i{ width:7px; height:7px; border-radius:50%; background:var(--terra); display:inline-block; }
.topbar .tm{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.12em; color:var(--ink-faint); text-transform:uppercase; }
.back{ display:inline-flex; align-items:center; gap:6px; background:none; border:0; padding:6px 0; color:var(--ink-soft); font-weight:500; font-size:14px; cursor:pointer; }
.back svg{ width:16px; height:16px; }

.hgroup h1{ font-size:clamp(30px, 8vw, 38px); line-height:1.02; }
.hgroup .dek{ margin-top:8px; color:var(--ink-soft); font-size:15px; }

/* Segmented control */
.seg{ display:inline-flex; background:var(--sand); border:1px solid var(--line); border-radius:999px; padding:3px; position:relative; }
.seg button{ position:relative; z-index:1; background:transparent; border:0; padding:8px 13px; border-radius:999px; font:600 12.5px/1 var(--sans); color:var(--ink-soft); cursor:pointer; transition:color .3s; white-space:nowrap; }
.seg button[aria-pressed="true"]{ color:var(--white); }
.seg .pill{ position:absolute; top:3px; bottom:3px; left:3px; width:calc(50% - 3px); background:var(--ink); border-radius:999px; transition:left .4s cubic-bezier(.2,.8,.2,1); }
.seg.b .pill{ left:50%; }
.seg.wide{ display:flex; } .seg.wide button{ flex:1; }

/* Cards */
.card{ background:var(--white); border:1px solid var(--line); border-radius:18px; padding:16px; box-shadow:0 14px 30px -24px rgba(28,36,48,0.45); }
.card + .card{ margin-top:12px; }
.card.enter{ animation:rise .55s cubic-bezier(.2,.8,.2,1) both; }
@keyframes rise{ from{ opacity:0; transform:translateY(12px);} to{ opacity:1; transform:none; } }
.card .ch{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.card .ch b{ font-family:var(--serif); font-weight:600; font-size:17px; letter-spacing:-0.01em; }
.card .ch span{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-faint); white-space:nowrap; }
.card .meta{ margin-top:4px; font-size:13px; color:var(--ink-faint); }
.card dl{ margin:12px 0 0; display:grid; grid-template-columns:auto 1fr; gap:8px 12px; font-size:14px; line-height:1.45; }
.card dt{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--euc-deep); padding-top:3px; max-width:88px; }
.card dd{ margin:0; color:var(--ink-soft); }
.card .line{ display:flex; justify-content:space-between; gap:12px; font-size:14px; padding:9px 0; border-top:1px solid var(--line); }
.card .line.total{ font-weight:600; color:var(--ink); }
.card .sent{ margin-top:10px; display:inline-flex; align-items:center; gap:8px; font-size:12.5px; color:var(--euc-deep); font-weight:600; }
.card .sent i{ width:8px; height:8px; border-radius:50%; background:var(--euc); display:inline-block; }
.tag{ display:inline-block; font-family:var(--mono); font-size:10px; letter-spacing:0.12em; text-transform:uppercase; padding:4px 8px; border-radius:999px; background:var(--sand); color:var(--ink-soft); }
.tag.paid{ background:var(--euc-soft); color:var(--euc-deep); }
.tag.sent{ background:var(--terra-soft); color:var(--terra-deep); }
.tag.ex{ background:var(--peach); color:var(--terra-deep); }

.toast{ display:flex; align-items:center; gap:12px; background:var(--ink); color:var(--white); border-radius:16px; padding:13px 14px; animation:rise .5s cubic-bezier(.2,.8,.2,1) both; }
.toast .ic{ width:36px; height:36px; border-radius:50%; background:var(--terra); display:grid; place-items:center; flex:none; }
.toast .ic svg{ width:16px; height:16px; }
.toast b{ display:block; font-size:14.5px; }
.toast span{ font-size:12.5px; color:rgba(251,248,241,0.7); }
.toast.euc .ic{ background:var(--euc); }
.toast + .card, .card + .toast{ margin-top:12px; }

/* Buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:15px 22px; border-radius:999px; border:1px solid transparent; font:600 15px/1 var(--sans); text-decoration:none; cursor:pointer; transition:transform .25s cubic-bezier(.2,.8,.2,1), background .25s, border-color .25s, opacity .2s; white-space:nowrap; }
.btn:active{ transform:scale(.98); }
.btn[disabled]{ opacity:.5; pointer-events:none; }
.btn.primary{ background:var(--ink); color:var(--white); }
.btn.terra{ background:var(--terra); color:var(--white); box-shadow:0 12px 30px -14px rgba(216,103,46,0.8); }
.btn.line{ background:transparent; color:var(--ink); border-color:var(--line-strong); }
.btn.sm{ padding:10px 14px; font-size:13px; }
.btn.full{ width:100%; }
.btn svg{ width:16px; height:16px; }
.row{ display:flex; gap:10px; }
.row .btn{ flex:1; }
.stack{ display:grid; gap:12px; }
.mt{ margin-top:16px; } .mt2{ margin-top:24px; } .mt3{ margin-top:32px; }

/* Today */
.today-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:12px; }
.tiles{ margin-top:18px; display:grid; grid-template-columns:1fr 1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:18px; overflow:hidden; }
.tile{ background:var(--white); padding:14px 12px 12px; min-width:0; }
.tile .big{ font-family:var(--serif); font-weight:600; font-size:26px; line-height:1; color:var(--ink); font-variant-numeric:tabular-nums; }
.tile .big small{ font-family:var(--sans); font-size:12px; font-weight:400; color:var(--ink-faint); margin-left:3px; }
.tile p{ margin-top:6px; font-size:11.5px; line-height:1.35; color:var(--ink-faint); }
.jar{ margin-top:8px; height:6px; border-radius:999px; background:var(--sand); overflow:hidden; }
.jar i{ display:block; height:100%; width:0; background:var(--euc); transition:width 1.2s cubic-bezier(.2,.8,.2,1); }
.visits{ margin-top:22px; display:grid; gap:10px; }
.visit{ display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; background:var(--white); border:1px solid var(--line); border-radius:16px; padding:14px; text-align:left; cursor:pointer; width:100%; transition:border-color .2s; }
.visit:hover{ border-color:var(--line-strong); }
.visit.next{ border-color:var(--terra); background:var(--white); box-shadow:0 18px 40px -28px rgba(216,103,46,0.7); }
.visit .t{ font-family:var(--mono); font-size:11px; letter-spacing:0.08em; color:var(--ink-faint); line-height:1.5; white-space:nowrap; }
.visit .n{ font-family:var(--serif); font-weight:600; font-size:17px; line-height:1.15; }
.visit .s{ font-size:12.5px; color:var(--ink-faint); margin-top:2px; }
.visit .st{ display:flex; flex-direction:column; align-items:flex-end; gap:4px; }
.avatar{ width:40px; height:40px; border-radius:50%; background:var(--sand); display:grid; place-items:center; font-family:var(--serif); font-weight:600; font-size:15px; color:var(--ink); flex:none; }
.avatar.euc{ background:var(--euc-soft); color:var(--euc-deep); }
.avatar.terra{ background:var(--terra-soft); color:var(--terra-deep); }

/* Mic */
.mic-wrap{ display:flex; flex-direction:column; align-items:center; gap:16px; padding:28px 0 12px; }
.mic{ width:104px; height:104px; border-radius:50%; border:0; background:var(--terra); color:var(--white); display:grid; place-items:center; cursor:pointer; position:relative; transition:transform .25s cubic-bezier(.2,.8,.2,1), background .25s; box-shadow:0 22px 44px -16px rgba(216,103,46,0.85); }
.mic:active{ transform:scale(.96); }
.mic svg{ width:40px; height:40px; }
.mic::after{ content:""; position:absolute; inset:-10px; border-radius:50%; border:2px solid rgba(216,103,46,0.5); opacity:0; }
.mic.live{ background:var(--ink); box-shadow:0 22px 44px -16px rgba(28,36,48,0.8); }
.mic.live::after{ border-color:rgba(28,36,48,0.4); animation:ring 1.6s ease-out infinite; }
@keyframes ring{ 0%{ transform:scale(.9); opacity:.9;} 100%{ transform:scale(1.5); opacity:0;} }
.mic-hint{ font-size:14px; color:var(--ink-soft); text-align:center; max-width:30ch; line-height:1.5; }
.wave{ display:flex; gap:3px; align-items:center; justify-content:center; height:28px; }
.wave i{ width:3px; height:6px; border-radius:2px; background:var(--euc); }
.wave.live i{ animation:wv .9s ease-in-out infinite; }
.wave.live i:nth-child(2n){ animation-duration:.7s; } .wave.live i:nth-child(3n){ animation-duration:1.1s; }
@keyframes wv{ 0%,100%{ height:6px;} 50%{ height:24px;} }
.timer{ font-family:var(--mono); font-size:12px; letter-spacing:0.12em; color:var(--ink-faint); }
.transcript{ font-family:var(--serif); font-size:17px; line-height:1.45; color:var(--ink); min-height:120px; padding:14px 16px; background:var(--sand); border-radius:16px; border:1px solid var(--line); white-space:pre-wrap; word-break:break-word; }
.transcript .interim{ color:var(--ink-faint); }
.transcript .cur{ display:inline-block; width:2px; height:1em; background:var(--terra); vertical-align:-2px; margin-left:2px; animation:blink 1s steps(2) infinite; }
@keyframes blink{ 50%{ opacity:0; } }
.transcript.edit{ width:100%; resize:vertical; font-family:var(--serif); outline:none; }
.transcript.edit:focus{ border-color:var(--euc); box-shadow:0 0 0 4px var(--euc-soft); }
.steps{ display:flex; gap:6px; align-items:center; margin:14px 0 6px; }
.steps i{ flex:1; height:3px; border-radius:2px; background:var(--line-strong); transition:background .3s; }
.steps i.on{ background:var(--terra); }
.progress{ display:grid; gap:12px; padding:22px 4px; }
.progress .p{ display:flex; align-items:center; gap:12px; font-size:14.5px; color:var(--ink-faint); transition:color .3s; }
.progress .p i{ width:22px; height:22px; border-radius:50%; border:1.5px solid var(--line-strong); display:grid; place-items:center; flex:none; transition:all .3s; }
.progress .p i svg{ width:11px; height:11px; opacity:0; }
.progress .p.doing{ color:var(--ink); } .progress .p.doing i{ border-color:var(--terra); border-top-color:transparent; animation:spin .9s linear infinite; }
.progress .p.done{ color:var(--ink); } .progress .p.done i{ background:var(--euc); border-color:var(--euc); color:var(--white); } .progress .p.done i svg{ opacity:1; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.note-text{ font-size:14.5px; line-height:1.55; color:var(--ink-soft); margin-top:12px; }
.money-big{ font-family:var(--serif); font-size:36px; line-height:1; font-weight:600; color:var(--ink); font-variant-numeric:tabular-nums; }
.money-big small{ font-size:13px; font-weight:400; color:var(--ink-faint); margin-left:6px; font-family:var(--sans); }
.notice{ font-size:13px; color:var(--ink-faint); line-height:1.5; text-align:center; padding:0 8px; }
.notice b{ color:var(--terra-deep); font-weight:600; }

/* Lists */
.list{ display:grid; gap:10px; }
.item{ display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:center; background:var(--white); border:1px solid var(--line); border-radius:16px; padding:13px 14px; text-align:left; width:100%; cursor:pointer; }
.item .n{ font-family:var(--serif); font-weight:600; font-size:16.5px; line-height:1.15; }
.item .s{ font-size:12.5px; color:var(--ink-faint); margin-top:2px; }
.item .r{ text-align:right; font-family:var(--mono); font-size:11px; letter-spacing:0.06em; color:var(--ink-faint); line-height:1.5; }
.item .r b{ display:block; font-family:var(--serif); font-size:16px; letter-spacing:0; color:var(--ink); font-weight:600; }
.item.static{ cursor:default; }
.section-h{ display:flex; justify-content:space-between; align-items:baseline; margin:26px 0 10px; }
.section-h h2{ font-size:22px; }
.section-h .label{ margin:0; }
.kv{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px; }
.kv .card{ padding:12px 14px; }
.kv .card .label{ display:block; margin-bottom:4px; }
.kv .card b{ font-family:var(--serif); font-size:18px; font-weight:600; }

/* Settings */
.field{ display:grid; gap:6px; margin-top:14px; font-size:13px; font-weight:600; color:var(--ink-soft); }
.field input, .field select{ font-size:16px; padding:13px 14px; border-radius:12px; border:1px solid var(--line-strong); background:var(--white); color:var(--ink); width:100%; }
.field input:focus{ border-color:var(--euc); box-shadow:0 0 0 4px var(--euc-soft); outline:none; }
.field .hint{ font-weight:400; color:var(--ink-faint); font-size:12.5px; }
.field .inline{ display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center; }
.install{ display:none; }
.install.show{ display:block; }

/* Tab bar */
.tabs{ position:fixed; left:0; right:0; bottom:0; z-index:40; pointer-events:none; }
.tabs .in{ pointer-events:auto; margin:0 auto; max-width:480px; height:calc(var(--tab-h) + var(--sab)); padding:8px 6px var(--sab); background:rgba(28,36,48,0.94); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); border-top:1px solid var(--line-d); display:grid; grid-template-columns:1fr 1fr 1.2fr 1fr 1fr; align-items:center; }
.tab{ background:none; border:0; color:rgba(251,248,241,0.6); display:flex; flex-direction:column; align-items:center; gap:4px; font:500 10.5px/1 var(--sans); letter-spacing:0.02em; padding:8px 0; cursor:pointer; transition:color .2s; }
.tab svg{ width:22px; height:22px; }
.tab[aria-current="page"]{ color:var(--white); }
.tab.rec{ position:relative; top:-14px; }
.tab.rec .o{ width:60px; height:60px; border-radius:50%; background:var(--terra); display:grid; place-items:center; color:var(--white); box-shadow:0 14px 30px -10px rgba(216,103,46,0.9); transition:transform .25s cubic-bezier(.2,.8,.2,1); }
.tab.rec:active .o{ transform:scale(.95); }
.tab.rec .o svg{ width:26px; height:26px; }

/* Global toast (bottom) */
.gtoast{ position:fixed; left:50%; bottom:calc(var(--tab-h) + var(--sab) + 14px); transform:translateX(-50%) translateY(20px); background:var(--ink); color:var(--white); padding:12px 18px; border-radius:999px; font-size:14px; font-weight:500; opacity:0; transition:opacity .3s, transform .3s; z-index:60; white-space:nowrap; box-shadow:0 20px 40px -20px rgba(0,0,0,0.7); pointer-events:none; max-width:calc(100vw - 32px); }
.gtoast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

/* Modal sheet */
.sheet-bg{ position:fixed; inset:0; background:rgba(28,36,48,0.55); z-index:70; display:none; align-items:flex-end; justify-content:center; }
.sheet-bg.show{ display:flex; }
.sheet{ width:100%; max-width:480px; background:var(--stucco); border-radius:24px 24px 0 0; padding:18px 18px calc(24px + var(--sab)); max-height:88dvh; overflow:auto; animation:up .35s cubic-bezier(.2,.8,.2,1) both; }
@keyframes up{ from{ transform:translateY(40px); opacity:0;} to{ transform:none; opacity:1;} }
.sheet .grab{ width:40px; height:4px; border-radius:2px; background:var(--line-strong); margin:0 auto 14px; }

/* ---------- OASIS ---------- */
.meter{ background:var(--ink); color:var(--white); border-radius:20px; padding:18px 18px 16px; position:relative; overflow:hidden; }
.meter .label{ color:var(--peach); }
.meter .big{ font-family:var(--serif); font-weight:600; font-size:40px; line-height:1; margin-top:6px; font-variant-numeric:tabular-nums; }
.meter .big small{ font-family:var(--sans); font-size:13px; font-weight:400; color:rgba(251,248,241,0.7); margin-left:8px; }
.meter.behind{ background:var(--terra-deep); }
.meter .row3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; margin-top:14px; padding-top:12px; border-top:1px solid var(--line-d2); }
.meter .row3 b{ display:block; font-family:var(--serif); font-size:17px; font-weight:600; font-variant-numeric:tabular-nums; }
.meter .row3 span{ font-family:var(--mono); font-size:9.5px; letter-spacing:0.14em; text-transform:uppercase; color:rgba(251,248,241,0.6); }
.meter .bar{ height:6px; border-radius:999px; background:rgba(251,248,241,0.15); margin-top:14px; overflow:hidden; }
.meter .bar i{ display:block; height:100%; background:var(--peach); width:0; transition:width .9s cubic-bezier(.2,.8,.2,1); }
.meter .sub{ margin-top:8px; font-size:12.5px; color:rgba(251,248,241,0.7); }
.secs{ display:grid; gap:8px; margin-top:12px; }
.sec{ display:grid; grid-template-columns:auto 1fr auto; gap:12px; align-items:center; background:var(--white); border:1px solid var(--line); border-radius:16px; padding:12px 14px; text-align:left; width:100%; cursor:pointer; transition:border-color .2s; }
.sec:hover{ border-color:var(--line-strong); }
.sec.next{ border-color:var(--terra); }
.sec .badge{ width:38px; height:38px; border-radius:11px; background:var(--sand); display:grid; place-items:center; font-family:var(--mono); font-size:12px; font-weight:500; color:var(--ink); }
.sec.done .badge{ background:var(--euc); color:var(--white); }
.sec.part .badge{ background:var(--peach); color:var(--terra-deep); }
.sec .n{ font-family:var(--serif); font-weight:600; font-size:16px; line-height:1.15; }
.sec .s{ font-size:12.5px; color:var(--ink-faint); margin-top:2px; }
.sec .r{ font-family:var(--mono); font-size:11px; letter-spacing:0.06em; color:var(--ink-faint); text-align:right; white-space:nowrap; }
.sec .r b{ display:block; color:var(--ink); font-family:var(--serif); font-size:15px; letter-spacing:0; }
.mini-prog{ height:4px; border-radius:2px; background:var(--sand); overflow:hidden; margin-top:6px; }
.mini-prog i{ display:block; height:100%; background:var(--euc); }
.script{ background:var(--sand); border:1px solid var(--line); border-radius:16px; padding:14px 16px; font-family:var(--serif); font-size:16.5px; line-height:1.45; color:var(--ink); }
.script .label{ display:block; margin-bottom:6px; font-family:var(--mono); }
.flags{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.flag{ display:inline-flex; align-items:center; gap:6px; background:var(--terra-soft); color:var(--terra-deep); border-radius:999px; padding:6px 11px; font-size:12.5px; font-weight:600; }
.flag::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--terra); }
.ans{ display:grid; gap:8px; }
.ai{ display:grid; grid-template-columns:1fr auto; gap:10px; align-items:center; background:var(--white); border:1px solid var(--line); border-radius:14px; padding:11px 13px; text-align:left; width:100%; cursor:pointer; }
.ai .q{ font-size:13.5px; color:var(--ink); line-height:1.35; }
.ai .q small{ display:block; font-family:var(--mono); font-size:10px; letter-spacing:0.1em; color:var(--ink-faint); margin-bottom:3px; }
.ai .ev{ font-size:12px; color:var(--ink-faint); margin-top:3px; font-style:italic; }
.ai .a{ display:inline-flex; align-items:center; gap:7px; max-width:150px; font-size:12.5px; font-weight:600; color:var(--ink); background:var(--sand); border-radius:999px; padding:7px 11px; text-align:right; line-height:1.2; }
.ai .a i{ flex:none; width:8px; height:8px; border-radius:50%; background:var(--euc); }
.ai.med .a i{ background:#E0A72E; } .ai.low .a i{ background:var(--terra); }
.ai.med{ border-color:rgba(224,167,46,0.6); } .ai.low{ border-color:rgba(216,103,46,0.6); }
.ai.empty .a{ background:transparent; border:1px dashed var(--line-strong); color:var(--ink-faint); font-weight:500; }
.ai.empty .a i{ display:none; }
.pills{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.pill{ background:var(--white); border:1px solid var(--line-strong); border-radius:999px; padding:9px 13px; font:500 13.5px/1.2 var(--sans); color:var(--ink); cursor:pointer; text-align:left; }
.pill[aria-pressed="true"]{ background:var(--ink); color:var(--white); border-color:var(--ink); }
.pill .c{ font-family:var(--mono); font-size:10.5px; opacity:.6; margin-right:6px; }
.rep-grid{ display:grid; grid-template-columns:1fr auto; gap:6px 12px; font-size:13.5px; line-height:1.4; }
.rep-grid .k{ color:var(--ink-soft); } .rep-grid .v{ font-weight:600; text-align:right; white-space:nowrap; }
.rep-grid .v.na{ color:var(--ink-faint); font-weight:400; }
.legend-dots{ display:flex; gap:14px; font-size:12px; color:var(--ink-faint); margin-top:10px; }
.legend-dots span{ display:inline-flex; align-items:center; gap:6px; } .legend-dots i{ width:8px; height:8px; border-radius:50%; display:inline-block; }
@media print{ .tabs, .topbar, .btn, .gtoast{ display:none !important; } .app{ max-width:none; box-shadow:none; } .screen{ padding:0; } body{ background:#fff; } }

/* ---------- OASIS form items: options inline, AI picks softly selected ---------- */
.form{ display:grid; gap:10px; }
.fi{ background:var(--white); border:1px solid var(--line); border-left:4px solid var(--line-strong); border-radius:16px; padding:12px 14px 12px 13px; }
.fi.soft{ border-left-color:var(--terra); background:#FFFBF5; }
.fi.ok{ border-left-color:var(--euc); }
.fq{ font-size:14px; line-height:1.35; color:var(--ink); }
.fq small{ display:block; font-family:var(--mono); font-size:10px; letter-spacing:0.1em; color:var(--ink-faint); margin-bottom:3px; }
.fq .ev{ font-size:12.5px; color:var(--terra-deep); margin-top:4px; font-style:italic; }
.opts{ display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; }
.opt{ background:var(--stucco); border:1px solid var(--line-strong); border-radius:999px; padding:8px 11px; font:500 12.5px/1.2 var(--sans); color:var(--ink); cursor:pointer; text-align:left; max-width:100%; transition:background .15s, border-color .15s, color .15s; }
.opt .c{ font-family:var(--mono); font-size:10px; opacity:.6; margin-right:5px; }
.opt.soft{ background:var(--peach); border:1.5px dashed var(--terra); color:var(--terra-deep); font-weight:600; box-shadow:0 0 0 3px var(--terra-soft); animation:softpulse 1.8s ease-in-out infinite; }
.opt.soft .c{ opacity:.8; }
@keyframes softpulse{ 0%,100%{ box-shadow:0 0 0 3px var(--terra-soft);} 50%{ box-shadow:0 0 0 6px rgba(216,103,46,0.08);} }
.opt.sel{ background:var(--ink); color:var(--white); border-color:var(--ink); font-weight:600; }
.opt.sel .c{ opacity:.7; }
.fv{ width:100%; font-size:15px; padding:10px 12px; border-radius:10px; border:1px solid var(--line-strong); background:var(--white); color:var(--ink); }
.fv.soft{ background:var(--peach); border:1.5px dashed var(--terra); }
.fv.ok{ border-color:var(--euc); }
.fa{ display:flex; align-items:center; gap:10px; margin-top:10px; min-height:22px; }
.fa .hint{ font-size:12px; color:var(--ink-faint); }
.okbtn{ display:inline-flex; align-items:center; gap:6px; background:var(--terra); color:var(--white); border:0; border-radius:999px; padding:8px 13px; font:600 12.5px/1 var(--sans); cursor:pointer; box-shadow:0 8px 20px -10px rgba(216,103,46,0.8); }
.okbtn svg{ width:12px; height:12px; }
.okd{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; color:var(--euc-deep); }
.okd svg{ width:12px; height:12px; }
.meter .bar{ display:flex; } .meter .bar em{ display:block; height:100%; background:rgba(246,217,190,0.45); }
.mini-prog{ display:flex; } .mini-prog em{ display:block; height:100%; background:var(--peach); }

/* ---------- Prompter (live cue list) ---------- */
.prompter{ background:var(--white); border:1px solid var(--line); border-radius:16px; padding:12px 14px; }
.pr-head{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:8px; }
.pr-count{ color:var(--euc-deep); }
.pr-list{ display:grid; gap:4px; }
.pr{ display:grid; grid-template-columns:20px 1fr auto; gap:10px; align-items:center; padding:7px 8px; border-radius:10px; font-size:14px; color:var(--ink); transition:opacity .5s, transform .5s, background .3s; }
.pr i{ width:18px; height:18px; border-radius:50%; border:1.5px solid var(--line-strong); display:grid; place-items:center; color:var(--white); }
.pr i svg{ width:10px; height:10px; }
.pr small{ font-family:var(--mono); font-size:10px; letter-spacing:0.1em; color:var(--ink-faint); }
.pr.now{ background:var(--sand); font-weight:600; }
.pr.now i{ border-color:var(--terra); box-shadow:0 0 0 3px var(--terra-soft); }
.pr.gone, .pr.done{ opacity:.55; text-decoration:line-through; text-decoration-color:var(--euc); }
.pr.gone i, .pr.done i{ background:var(--euc); border-color:var(--euc); }
.pr.done{ text-decoration:none; opacity:1; color:var(--euc-deep); font-weight:600; }
.transcript.capped{ max-height:132px; overflow:auto; font-size:15px; min-height:72px; }
.mic-wrap.tight{ padding:10px 0 6px; } .mic-wrap.tight .mic{ width:72px; height:72px; } .mic-wrap.tight .mic svg{ width:28px; height:28px; }
