:root{--brand:#f26a24;--brand-ink:#0b0107;--accent:#f7931e;--accent-end:#f2513a;--deep:#0b0107;--brand-grad:linear-gradient(120deg, var(--accent), var(--accent-end));--bg:#f6f7fb;--card:#fff;--ink:#1d2433;--muted:#5d6475;--brand-text:#b8400e;--line:#e6e8ef;--ok:#16a34a;--bad:#dc2626;--radius:18px;--shadow:0 6px 20px #141e4614;color:var(--ink);background:var(--bg);-webkit-tap-highlight-color:transparent;font-family:Nunito,Noto Sans Thai,system-ui,sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);margin:0}body{min-height:100dvh}#root{max-width:520px;min-height:100dvh;margin:0 auto}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0}input,textarea{font:inherit}h1,h2,h3{color:var(--deep);margin:.2em 0 .4em;line-height:1.25}h2{font-size:1.45rem;font-weight:900}h3{font-size:1.1rem}p{line-height:1.6}.small{color:var(--muted);font-size:.85rem}.center{text-align:center}.splash{min-height:100dvh;color:var(--muted);place-items:center;display:grid}.shell{padding-bottom:calc(76px + env(safe-area-inset-bottom))}.topbar{z-index:5;padding:calc(10px + env(safe-area-inset-top)) 16px 10px;background:color-mix(in srgb, var(--bg) 88%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);align-items:center;gap:10px;display:flex;position:sticky;top:0}.logo{width:auto;height:26px}.logo.big{height:40px}.app-name{color:var(--muted);border-left:1.5px solid var(--line);padding-left:10px;font-weight:800}.tabbar{z-index:10;background:var(--card);border-top:1px solid var(--line);width:100%;max-width:520px;padding:6px 4px calc(6px + env(safe-area-inset-bottom));grid-template-columns:repeat(4,1fr);display:grid;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.tabbar button{color:var(--muted);border-radius:12px;flex-direction:column;align-items:center;gap:2px;padding:6px 0;font-size:.78rem;display:flex}.tabbar button .i{filter:grayscale();opacity:.7;font-size:1.3rem}.tabbar button.on{color:var(--brand-text);font-weight:800}.tabbar button.on .i{filter:none;opacity:1}.screen{padding:12px 16px calc(28px + env(safe-area-inset-bottom));flex-direction:column;gap:12px;display:flex}#root>.screen{padding-top:calc(12px + env(safe-area-inset-top))}.center-col{text-align:center;justify-content:center;align-items:center;min-height:90dvh}.kicker{color:var(--brand-text);text-transform:uppercase;letter-spacing:.02em;font-size:.8rem;font-weight:800}.section{margin-top:6px}.btn{background:var(--card);border:1.5px solid var(--line);-webkit-user-select:none;user-select:none;touch-action:manipulation;border-radius:14px;justify-content:center;align-items:center;gap:6px;min-height:46px;padding:12px 18px;font-weight:800;display:inline-flex}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5}.btn.primary{background:var(--brand-grad);color:var(--brand-ink);border-color:var(--brand);box-shadow:0 6px 16px color-mix(in srgb, var(--brand) 35%, transparent)}.btn.danger{background:var(--bad);color:#fff;border-color:var(--bad)}.btn.ghost{color:var(--muted);background:0 0;border-color:#0000}.btn.big{width:100%;min-height:56px;padding:16px;font-size:1.05rem}.btn.small{min-height:36px;padding:8px 12px;font-size:.85rem}.link{color:var(--brand-text);padding:4px 0;font-weight:700}.back{align-self:flex-start}.row{flex-wrap:wrap;gap:8px;display:flex}.row.center{justify-content:center}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;gap:8px;padding:14px;display:flex}.card-title{color:var(--deep);font-size:.95rem;font-weight:900}.card p{margin:.2em 0}.alert{color:#8a1c1c;background:#fde8e8;border-radius:12px;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;display:flex}.warn{color:#8a4b00;background:#fff4e5;border-radius:12px;padding:10px 12px;font-size:.9rem}.notice{background:var(--deep);color:#fff;text-align:center;border-radius:12px;padding:8px 12px;font-size:.85rem}.hint{color:var(--muted);text-align:center;margin:0;font-size:.85rem}.empty{color:var(--muted);text-align:center;padding:30px 10px}.or{text-align:center;color:var(--muted);font-size:.85rem}textarea,.search,.field input,.type-help input{border:1.5px solid var(--line);background:var(--card);width:100%;color:var(--ink);border-radius:14px;padding:12px}textarea:focus,input:focus{outline:2px solid color-mix(in srgb, var(--brand) 40%, transparent)}.hero{align-items:center;gap:8px;display:flex}.bubble{background:var(--card);box-shadow:var(--shadow);border-radius:18px 18px 18px 4px;flex:1;padding:12px 14px;line-height:1.5}.bubble b{color:var(--deep)}.en-note{color:var(--muted);margin-top:4px;font-style:italic}.stats{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.stat{background:var(--card);text-align:center;box-shadow:var(--shadow);border-radius:16px;flex-direction:column;gap:2px;padding:10px 6px;display:flex}.stat b{color:var(--deep);font-size:1.05rem}.stat span{color:var(--muted);font-size:.72rem}.task-card{text-align:left;border-radius:var(--radius);background:var(--card);width:100%;box-shadow:var(--shadow);border-left:6px solid var(--accent);align-items:center;gap:12px;padding:16px;display:flex}.task-card.night{border-left-color:#6366f1}.task-card.prep{border-left-color:var(--brand)}.task-card.more{border-left-color:var(--ok)}.task-card.done{opacity:.7}.task-card.static{cursor:default}.tc-icon{font-size:1.8rem}.tc-body{flex:1}.tc-title{color:var(--deep);font-size:1.05rem;font-weight:900}.tc-sub{color:var(--muted);font-size:.85rem}.tc-go{color:var(--brand-text);white-space:nowrap;font-weight:800}.task-card.done .tc-go{color:var(--ok)}.plan{flex-direction:column;gap:6px;display:flex}.plan-row{background:var(--card);box-shadow:var(--shadow);border-radius:14px;align-items:center;gap:10px;padding:12px;display:flex}.plan-row.dim{opacity:.35}.plan-row .n{background:var(--brand);color:#fff;border-radius:50%;flex:none;place-items:center;width:28px;height:28px;font-weight:900;display:grid}.plan-row .t{flex:1;font-weight:700}.plan-row .m{color:var(--muted);white-space:nowrap;font-size:.85rem}.toggle{color:var(--muted);align-items:center;gap:8px;font-size:.9rem;display:flex}.toggle input{width:20px;height:20px;accent-color:var(--brand)}.bullets{margin:0;padding-left:20px;line-height:1.8}.phrase-row{text-align:left;background:#f3f5fb;border-radius:12px;flex-direction:column;gap:2px;width:100%;padding:10px 12px;display:flex}.phrase-row.static{cursor:default}.phrase-row .en{color:var(--deep);font-weight:800}.phrase-row .th{color:var(--muted);font-size:.88rem}.phrase-item{background:var(--card);box-shadow:var(--shadow);border-radius:16px;padding:8px}.phrase-item .meta{color:var(--muted);justify-content:space-between;gap:8px;padding:6px 6px 0;font-size:.75rem;display:flex}.phrase-item .meta span:first-child{color:var(--accent);letter-spacing:1px}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{color:var(--deep);background:#f3f5fb;border-radius:999px;padding:8px 12px;font-weight:800}.chip small{color:var(--muted);margin-left:4px;font-weight:500}.call{min-height:100dvh;padding:calc(12px + env(safe-area-inset-top)) 16px calc(16px + env(safe-area-inset-bottom));flex-direction:column;gap:10px;display:flex}.call.ready{align-items:stretch}.call.ready h2,.call.ready .kicker{text-align:center}.call.live{background:linear-gradient(180deg, #eef2ff 0%, var(--bg) 45%)}.call-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.call-title{color:var(--deep);font-size:.95rem;font-weight:900}.timer{font-variant-numeric:tabular-nums;background:var(--card);box-shadow:var(--shadow);border-radius:999px;padding:6px 12px;font-weight:900}.timer.low{color:var(--bad)}.timer.big{align-self:center;font-size:1.6rem}.avatar-wrap{justify-content:center;display:flex;position:relative}.avatar-wrap .avatar-svg{filter:drop-shadow(0 10px 22px #141e462e);border-radius:50%}.avatar-wrap.state-listening .avatar-svg{filter:drop-shadow(0 0 #0000)drop-shadow(0 0 14px #16a34a73)}.avatar-wrap.state-speaking .avatar-svg{filter:drop-shadow(0 0 16px color-mix(in srgb, var(--accent) 55%, transparent))}.who{text-align:center;color:var(--muted)}.who b{color:var(--deep)}.situation{background:var(--card);box-shadow:var(--shadow);border-radius:14px;margin:0;padding:12px}.state-pill{background:var(--card);box-shadow:var(--shadow);border-radius:999px;align-self:center;align-items:center;gap:6px;padding:6px 14px;font-size:.9rem;font-weight:800;display:flex}.state-pill .tag{color:#8a4b00;background:#fff4e5;border-radius:999px;padding:2px 8px;font-size:.75rem}.dot{background:var(--muted);border-radius:50%;width:10px;height:10px}.dot.listening{background:var(--ok);animation:1.4s infinite pulse}.dot.speaking{background:var(--accent)}.dot.thinking,.dot.connecting{background:#eab308;animation:.9s infinite pulse}@keyframes pulse{50%{opacity:.3}}.subs{flex-direction:column;flex:1;gap:6px;min-height:120px;max-height:32dvh;padding:4px 2px;display:flex;overflow-y:auto}.sub{border-radius:16px;max-width:88%;padding:8px 12px;line-height:1.45}.sub.ai{background:var(--card);box-shadow:var(--shadow);border-bottom-left-radius:4px;align-self:flex-start}.sub.jam{background:color-mix(in srgb, var(--brand) 12%, white);border-bottom-right-radius:4px;align-self:flex-end}.sub .en{font-weight:700}.sub .th{color:var(--muted);margin-top:2px;font-size:.85rem}.sub.muted{color:var(--muted)}.help-card{background:#fffbeb;border:2px solid #fcd34d;border-radius:16px;flex-direction:column;gap:4px;padding:12px;display:flex}.help-en{color:var(--deep);font-size:1.2rem;font-weight:900}.help-say{color:#8a4b00;font-size:.9rem}.help-th{color:var(--muted);font-size:.9rem}.drawer{background:var(--card);box-shadow:var(--shadow);border-radius:16px;flex-direction:column;gap:6px;max-height:30dvh;padding:10px;display:flex;overflow-y:auto}.tasks{color:var(--muted);gap:2px;padding:2px 4px 6px;font-size:.85rem;display:grid}.type-help{gap:6px;display:flex}.controls{gap:6px;margin-top:auto;display:flex}.controls .ctl{flex:1}.controls .ctl.help{flex:2}.ctl{background:var(--card);box-shadow:var(--shadow);-webkit-user-select:none;user-select:none;touch-action:none;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:2px;min-height:68px;padding:10px 4px;font-size:1.3rem;display:flex}.ctl span{color:var(--muted);text-align:center;font-size:.78rem;font-weight:800;line-height:1.2}.ctl.help{background:var(--brand-grad)}.ctl.help span{color:var(--brand-ink)}.ctl.help.holding{background:var(--bad);transform:scale(1.03)}.ctl.end span{color:var(--ok)}.ctl:disabled{opacity:.5}.review{flex-direction:column;gap:12px;display:flex}.review-head{align-items:center;gap:8px;display:flex}.levelup{background:var(--brand-grad);color:#fff;text-align:center;border-radius:16px;padding:14px;font-size:1.05rem;font-weight:800}.star-row{justify-content:space-between;align-items:center;font-weight:800;display:flex}.stars{color:#f5b301;letter-spacing:2px;font-size:1.4rem}.stars .off{color:#e3e6ee}.good-row .en{color:var(--deep);font-weight:800}.good-row .th,.better-row .said{color:var(--muted);font-size:.85rem}.better-row{flex-direction:column;gap:4px;display:flex}.step-count{color:var(--muted);align-items:center;gap:6px;font-size:.85rem;font-weight:700;display:flex}.shadow,.snapshot{flex-direction:column;gap:12px;display:flex}.shadow-card{background:var(--card);box-shadow:var(--shadow);text-align:center;border-radius:20px;padding:24px 18px}.shadow-card .en.big{color:var(--deep);font-size:1.45rem;font-weight:900;line-height:1.35}.shadow-card .th{color:var(--muted);margin-top:8px}.rec-status{text-align:center;color:var(--bad);font-weight:700}.rec-dot{background:var(--bad);border-radius:50%;width:10px;height:10px;margin-right:4px;animation:1s infinite rec-blink;display:inline-block}@keyframes rec-blink{50%{opacity:.2}}.meter{background:#00000014;border-radius:6px;height:12px;margin:8px 0 4px;overflow:hidden}.meter-fill{background:linear-gradient(90deg,#22c55e,#f59e0b);height:100%;transition:width 80ms linear}.rec-hint{text-align:center;color:var(--muted);font-size:.85rem;font-weight:400}.meter.big{border-radius:11px;height:22px;margin:4px 0}.miccheck{flex-direction:column;gap:12px;display:flex}.mic-ok{color:var(--ok);text-align:center;flex-direction:column;align-items:center;gap:10px;font-size:1.1rem;font-weight:900;display:flex}.alert.column{flex-direction:column;align-items:stretch;gap:6px}.bullets.small{font-size:.85rem;line-height:1.6}.select{border:1.5px solid var(--line);background:var(--card);width:100%;color:var(--ink);font:inherit;border-radius:14px;padding:12px}.night-screen{color:#e0e7ff;background:linear-gradient(#1e1b4b 0%,#312e81 60%);min-height:100dvh}.night-screen h2,.night-screen h3{color:#fff}.night-screen .kicker{color:#a5b4fc}.night-screen .link{color:#c7d2fe}.night-screen .plan-row,.night-screen .shadow-card,.night-screen .option{box-shadow:none;color:#e0e7ff;background:#ffffff14}.night-screen .shadow-card .en.big{color:#fff}.night-screen .shadow-card .th,.night-screen .step-count,.night-screen .plan-row .m{color:#c7d2fe}.night-screen .btn:not(.primary){color:#fff;background:#ffffff1a;border-color:#0000}.listen-big{background:#ffffff1f;border-radius:50%;flex-direction:column;justify-content:center;align-self:center;align-items:center;width:140px;height:140px;font-size:3rem;display:flex}.listen-big span{color:#c7d2fe;margin-top:4px;font-size:.75rem}.reveal{text-align:center;color:#fff;font-size:1.15rem;font-weight:900}.options{gap:8px;display:grid}.option{text-align:left;border:2px solid #0000;border-radius:14px;padding:14px;font-weight:700}.option.right{border-color:#4ade80;background:#4ade8033!important}.option.wrong{border-color:#f87171;background:#f8717133!important}.level-row{border-bottom:1px solid var(--line);gap:10px;padding:8px 0;display:flex}.level-row:last-child{border-bottom:0}.level-row.locked{opacity:.5}.level-row .badge{background:#eef1f8;border-radius:50%;flex:none;place-items:center;width:30px;height:30px;font-weight:900;display:grid}.level-row.cur .badge{background:var(--brand);color:#fff}.level-row>div{flex:1}.bar{background:#eef1f8;border-radius:99px;height:8px;margin:6px 0 2px;overflow:hidden}.bar i{background:var(--brand-grad);border-radius:99px;height:100%;display:block}.snap-row,.hist-row{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:8px;padding:6px 0;font-size:.9rem;display:flex}.hist-row .t{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.hist-row .stars{font-size:.9rem}.field{flex-direction:column;gap:6px;font-size:.9rem;font-weight:700;display:flex}.seg{background:#eef1f8;border-radius:12px;grid-auto-columns:1fr;grid-auto-flow:column;padding:3px;display:grid}.seg button{color:var(--muted);border-radius:10px;padding:8px 4px;font-size:.85rem;font-weight:700}.seg button.on{background:var(--card);color:var(--brand);box-shadow:0 2px 6px #00000014}.style-pick{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.style-opt{border:2px solid var(--line);border-radius:14px;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;font-size:.8rem;font-weight:800;display:flex}.style-opt.on{border-color:var(--brand);background:color-mix(in srgb, var(--brand) 8%, white)}.login h1{font-size:1.6rem}.onboard .card p{margin:.4em 0}.usage-card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;gap:6px;margin-top:14px;padding:12px 14px;display:flex}.usage-title{font-weight:800}.usage-row{justify-content:space-between;gap:10px;font-size:.92rem;display:flex}.usage-row b{text-align:right}.usage-row b.ok{color:var(--ok)}.usage-row b.warn{color:var(--accent-end)}.usage-note{color:var(--muted);font-size:.78rem}.privacy-note{color:var(--muted);text-align:center;margin:4px 8px 0;font-size:.82rem}.live-caption{opacity:.85}.call-head{flex:1;min-width:0}.call-top .link{white-space:nowrap}input,textarea,select{font-size:16px}.call.live .avatar-wrap .avatar-svg{width:calc(min(265px,30dvh)/1.15);height:min(265px,30dvh)}.call.live .controls{bottom:calc(8px + env(safe-area-inset-bottom));z-index:2;position:sticky}.hold{touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.chip-pair{gap:2px;display:inline-flex}