:root{color-scheme:light;--canvas:#f6f8f7;--surface:#fff;--ink:#18241e;--muted:#717b75;--line:#e7ece9;--soft:#f2f5f3;--accent:#126842;--accent-bg:#e9f8ee;--up:#d8384f;--down:#2664d8;--up-bg:#fff0f2;--down-bg:#edf3ff;--warn-bg:#fff4dd;--warn:#806026;font-size:16px;line-height:1.5;color:var(--ink);background:var(--canvas);font-synthesis:none;-webkit-font-smoothing:antialiased}
:root[data-theme=dark]{color-scheme:dark;--canvas:#0c120f;--surface:#101714;--ink:#eef4f0;--muted:#98a59e;--line:#27322c;--soft:#19231d;--accent:#79f2b0;--accent-bg:#19382a;--up:#ff7e90;--down:#85adff;--up-bg:#322127;--down-bg:#1b2b43;--warn-bg:#322a18;--warn:#e5c981}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a,summary{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}button:disabled{cursor:wait}button{color:inherit}p{margin:0}h1,h2,h3{margin:0;word-break:keep-all}button,summary{touch-action:manipulation}.app{max-width:1040px;margin:40px auto;background:var(--surface);border:1px solid var(--line);border-radius:20px;overflow:hidden}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;height:80px;padding:0 36px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:720;letter-spacing:-.6px}.app-logo{display:block;width:30px;height:30px;border-radius:8px}.theme-toggle{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:transparent;flex:none}.theme-toggle:hover{background:var(--soft)}.theme-toggle svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.sun{display:none}:root[data-theme=dark] .sun{display:block}:root[data-theme=dark] .moon{display:none}main{padding:0 36px}.demo-note{display:flex;gap:5px;align-items:center;font-size:12px;color:var(--muted);padding-top:24px}.demo-note strong{font-weight:550}.heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:12px}.heading h1{font-size:30px;line-height:1.3;letter-spacing:-1px;font-weight:740}.eyebrow{font-size:14px;color:var(--muted);margin-top:7px}.currency{display:flex;background:var(--soft);padding:4px;border-radius:10px;flex:none}.currency button{border:0;background:transparent;border-radius:7px;font-size:14px;color:var(--muted);padding:7px 15px;min-height:36px;font-weight:550}.currency button.selected{background:var(--surface);color:var(--ink);box-shadow:0 1px 4px #0000000d}.update-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:14px 0 22px;color:var(--muted);font-size:12px}#asof{font-variant-numeric:tabular-nums}#asof small{font-size:11px}.refresh{border:0;background:transparent;color:var(--muted);font-size:12px;min-height:36px;padding:4px 0 4px 12px}.refresh span{font-size:18px;vertical-align:-1px;margin-right:4px}.refresh:hover{color:var(--ink)}.stocks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.stock{min-width:0;border:1px solid var(--line);border-radius:14px;padding:22px 20px 0;background:var(--surface)}.stock-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.stock-title h3{font-size:18px;font-weight:680;letter-spacing:-.5px}.stock-code{font-size:11px;letter-spacing:.02em;color:var(--muted)}.direction{font-size:12px;font-weight:550;white-space:nowrap}.up{color:var(--up)}.down{color:var(--down)}.quote-row{display:flex;flex-direction:column-reverse;align-items:stretch;gap:14px;margin:23px 0 20px}.price-label{font-size:12px;color:var(--muted);margin-bottom:4px}.price{font-variant-numeric:tabular-nums;font-size:32px;font-weight:680;line-height:1.2;letter-spacing:-1.1px;white-space:nowrap}.price .unit{font-size:18px;font-weight:500;margin-left:3px;letter-spacing:0}.movement{font-size:24px;font-weight:620;letter-spacing:-.6px;line-height:1.2;font-variant-numeric:tabular-nums}.movement small{font-size:17px}.movement>span{color:var(--muted);font-weight:400;letter-spacing:0;font-size:12px;display:inline-block;margin-left:8px}.comparison{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid var(--line);padding-top:14px;font-size:12px;font-variant-numeric:tabular-nums}.comparison>span:first-child{color:var(--muted)}.comparison b{font-weight:500;color:var(--ink);margin-left:4px}.comparison>span:last-child{font-weight:550}details summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px}summary::-webkit-details-marker{display:none}summary>span{font-size:18px;font-weight:350;line-height:1}details[open]>summary>span{transform:rotate(45deg)}.stock-detail summary{color:var(--muted);font-size:12px;min-height:42px}.details-body{padding:0 0 18px;color:var(--muted);font-size:14px;line-height:1.8;word-break:keep-all}.details-body p+p{margin-top:12px}.details-body strong{color:var(--ink);font-weight:550}.support-grid{display:grid;grid-template-columns:1fr 1.25fr;gap:40px;margin-top:30px;padding-top:28px;border-top:1px solid var(--line)}.market-heading,.market-line,.market-baseline{display:flex;align-items:center;justify-content:space-between;gap:10px}.market-heading{margin-bottom:18px}.market-heading h2{font-size:17px;letter-spacing:-.3px;font-weight:650}.market-heading>span{font-size:11px;color:var(--muted)}.market-line{font-size:15px;font-weight:550}.market-line small{display:inline-block;font-size:11px;color:var(--accent);background:var(--accent-bg);border-radius:4px;padding:2px 5px;font-weight:500;margin-left:5px}.market-line strong{font-size:24px;font-weight:620;letter-spacing:-.5px}.market-baseline{font-size:12px;font-variant-numeric:tabular-nums;color:var(--muted);margin-top:9px}.market-context summary{font-size:12px;color:var(--muted);min-height:44px;margin-top:5px}.definition{font-size:13px;line-height:1.75;color:var(--muted);margin:0 0 15px;word-break:keep-all}.explanation>details{border-top:1px solid var(--line)}.explanation>details>summary{min-height:52px;font-size:14px;font-weight:500}.formula{padding:12px;background:var(--soft);border-radius:6px;font-size:12px;color:var(--ink);margin:12px 0}.source-list{margin:0 0 16px;font-size:13px}.source-list>div{display:grid;grid-template-columns:78px 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}.source-list dd{margin:0}.source-list small{font-size:12px}.footer{padding:28px 0;margin-top:24px;border-top:1px solid var(--line);color:var(--muted)}.footer>p{font-size:12px;line-height:1.8}.preview-tools{font-size:12px;margin-top:14px}.preview-tools summary{justify-content:flex-start;min-height:30px}.scenario-buttons{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0}.scenario-buttons button{border:1px solid var(--line);background:var(--surface);font-size:12px;border-radius:6px;padding:9px 12px}.scenario-buttons button[aria-pressed=true]{color:var(--accent);border-color:var(--accent)}.footer-links{display:flex;gap:18px;font-size:12px;margin-top:17px}.footer-links a:hover{text-decoration:underline}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,12px);opacity:0;pointer-events:none;background:var(--ink);color:var(--surface);padding:13px 18px;border-radius:10px;width:max-content;max-width:calc(100vw - 32px);font-size:14px;transition:opacity .2s,transform .2s}.toast.show{opacity:1;transform:translate(-50%,0)}#state-message{background:var(--warn-bg);color:var(--warn);font-size:13px;line-height:1.6;padding:12px 16px;border-radius:8px;margin-bottom:16px}.unavailable{color:var(--muted)!important}.loading{opacity:.5}
@media(max-width:1100px){.app{margin:24px;}.price{font-size:29px}.stock{padding-left:16px;padding-right:16px}}
@media(max-width:800px){:root{background:var(--surface)}.app{max-width:560px;border:0;border-radius:0;margin:0 auto}.topbar{height:64px;padding:0 24px}.brand{font-size:18px}.theme-toggle{width:36px;height:36px}.app-logo{width:28px;height:28px}.topbar .brand{gap:9px}main{padding:0 24px}.demo-note{padding-top:15px}.heading{margin-top:13px;gap:10px}.heading h1{font-size:24px;letter-spacing:-.7px}.eyebrow{font-size:13px;margin-top:5px}.currency button{min-height:34px;padding:5px 10px;font-size:13px}.currency{padding:3px;border-radius:8px}.update-row{margin:6px 0 8px}.stocks{display:block}.stock{border:0;border-top:1px solid var(--line);border-radius:0;padding:16px 0 0}.stock-title{display:flex;align-items:baseline;gap:9px}.stock-title h3{font-size:17px}.stock-code{font-size:11px}.direction{font-size:12px}.quote-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;margin:12px 0 14px}.price-block{grid-column:1;grid-row:1}.movement{grid-column:2;grid-row:1;text-align:right;font-size:26px;line-height:1.3}.movement small{font-size:17px}.movement>span{display:block;margin:3px 0 0;font-size:11px}.price{font-size:29px;font-weight:670;letter-spacing:-.8px}.price .unit{font-size:17px}.price-label{font-size:11px;margin-bottom:4px}.comparison{padding-top:10px;font-size:12px;border:0;background:var(--soft);border-radius:6px;padding:8px 10px}.stock-detail summary{min-height:36px;font-size:12px}.support-grid{display:block;margin-top:5px;padding-top:20px;border-top:1px solid var(--line)}.market-heading{margin-bottom:14px}.market-heading h2{font-size:16px}.market-context{padding-bottom:12px}.explanation{border-top:1px solid var(--line);padding-top:20px}.footer{margin-top:15px;padding-top:20px}.market-line strong{font-size:23px}}
@media(max-width:370px){main{padding:0 20px}.topbar{padding:0 20px}.brand{font-size:17px}.heading h1{font-size:22px}.price{font-size:27px}.movement{font-size:24px}.stock-title{gap:6px}.stock-code{font-size:10px}.currency button{padding:5px 8px}}
@media(max-width:330px){.heading{flex-wrap:wrap}.quote-row{grid-template-columns:1fr}.movement{grid-column:1;grid-row:2;text-align:left}.movement>span{display:inline-block;margin-left:8px}.comparison{flex-wrap:wrap}.brand{font-size:15px}.market-baseline{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.connection-info{display:flex;align-items:baseline;gap:12px;min-width:0;flex-wrap:wrap}
.refresh{white-space:nowrap;flex:none}
#connection{font-size:12px;color:var(--muted)}
#connection.connected{color:var(--accent)}
.details-body a{text-decoration:underline;text-underline-offset:2px}
@media(max-width:800px){.heading{margin-top:23px}.update-row{margin:11px 0 8px}.connection-info{gap:2px 10px}#connection{font-size:12px}}
.notify-slot{margin:0 0 20px;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--accent-bg)}
.notify-slot h2{font-size:17px;line-height:1.35}.notify-slot p{font-size:12px;line-height:1.6;margin-top:7px;color:var(--muted)}
.notify-slot button{display:block;width:100%;margin-top:13px;border:0;border-radius:9px;min-height:44px;padding:10px 16px;background:var(--accent);color:#fff;font-weight:650}
.notify-slot button:disabled{opacity:.6}
.notify-slot .notify-status{color:var(--ink);font-weight:600}
.notify-slot.notify-complete{margin-bottom:12px;padding:9px 12px;border-radius:8px;background:var(--accent-bg)}
.notify-slot.notify-complete h2{font-size:13px;line-height:1.3;font-weight:600;color:var(--accent)}
.notify-slot.notify-complete h2::before{content:'✓';margin-right:7px}
.ad-slot{width:100%;margin:16px 0 0}
#ad-banner{width:100%}