:root{--bg:#FFFFFF;--side:#F9F9F9;--surface:#F4F4F4;--surface-2:#ECECEC;--text:#0D0D0D;--muted:#5D5D5D;--line:#E5E5E5;--accent:#0D0D0D;--accent-text:#FFFFFF;--link:#0B57D0;--ad:#FFF7D6;--ad-line:#E9C84A;--ok:#10A37F;
--font:ui-sans-serif,-apple-system,system-ui,"Segoe UI",Helvetica,"Apple Color Emoji",Arial,sans-serif;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--col:48rem;--side-w:17rem}
@media (prefers-color-scheme:dark){:root{--bg:#212121;--side:#171717;--surface:#2F2F2F;--surface-2:#3A3A3A;--text:#ECECEC;--muted:#B4B4B4;--line:#3A3A3A;--accent:#FFFFFF;--accent-text:#0D0D0D;--link:#8AB4F8;--ad:#3A3420;--ad-line:#8C7A2B}}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--font);color:var(--text);background:var(--bg);font-size:1rem;line-height:1.75}
img,svg{max-width:100%;height:auto}a{color:inherit;text-underline-offset:.2em}
:focus-visible{outline:2px solid var(--text);outline-offset:2px;border-radius:.5rem}
h1,h2,h3{line-height:1.25;margin:0 0 .6em;font-weight:600;letter-spacing:-.01em}h1{font-size:clamp(1.6rem,3.2vw,2.1rem)}h2{font-size:1.4rem}h3{font-size:1.08rem}p{margin:0 0 1em}
.skip{position:absolute;inset-inline-start:-999px}.skip:focus{inset-inline-start:1rem;top:1rem;background:var(--accent);color:var(--accent-text);padding:.6rem 1rem;z-index:20;border-radius:.6rem}

.app{display:grid;grid-template-columns:var(--side-w) minmax(0,1fr);min-height:100dvh}
.side{background:var(--side);position:sticky;top:0;height:100dvh;overflow-y:auto;padding:.75rem;display:flex;flex-direction:column;gap:.25rem;font-size:.9rem}
.brand{display:flex;align-items:center;gap:.55rem;padding:.55rem .6rem;font-weight:600;font-size:1rem;text-decoration:none}
.mark{inline-size:1.6rem;block-size:1.6rem;border-radius:50%;background:var(--accent);color:var(--accent-text);display:grid;place-items:center;font-size:.72rem;font-weight:700;letter-spacing:-.03em;flex:none}
.side a.item{display:block;padding:.45rem .6rem;border-radius:.6rem;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side a.item:hover,.side a.item[aria-current]{background:var(--surface-2)}
.side .new{display:flex;align-items:center;gap:.5rem;font-weight:500}
.side .group{margin-block-start:1rem;padding:0 .6rem .2rem;color:var(--muted);font-size:.8rem}
.side .foot{margin-block-start:auto;padding-block-start:1rem;border-block-start:1px solid var(--line);display:grid;gap:.1rem}
.main{min-inline-size:0;display:flex;flex-direction:column}
.top{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(8px);display:flex;align-items:center;gap:.75rem;padding:.6rem 1rem;min-block-size:3.4rem}
.top .title{font-weight:600;font-size:1.05rem}.top .sub{color:var(--muted);font-weight:400}
.top .right{margin-inline-start:auto;display:flex;gap:.5rem;align-items:center}
.menu-btn{display:none;background:none;border:0;color:inherit;font:inherit;padding:.4rem .6rem;border-radius:.6rem;cursor:pointer}.menu-btn:hover{background:var(--surface)}
.btn{display:inline-flex;align-items:center;gap:.4rem;background:var(--accent);color:var(--accent-text);text-decoration:none;font-weight:500;font-size:.92rem;padding:.55rem 1rem;border-radius:999px;border:1px solid var(--accent);cursor:pointer;font-family:inherit}
.btn:hover{opacity:.85}.btn.ghost{background:transparent;color:var(--text);border-color:var(--line)}.btn.ghost:hover{background:var(--surface);opacity:1}
.col{inline-size:100%;max-inline-size:var(--col);margin-inline:auto;padding-inline:1.1rem}
main{flex:1;padding-block:1.5rem 4rem}

.hero{min-block-size:calc(62dvh - 3.4rem);display:grid;align-content:center;gap:1.4rem;text-align:center;padding-block:2rem}
.hero h1{font-size:clamp(1.7rem,4vw,2.3rem);font-weight:500;margin:0}
.hero p{color:var(--muted);max-inline-size:36rem;margin-inline:auto;margin-block-end:0}
.composer{background:var(--surface);border:1px solid var(--line);border-radius:1.75rem;padding:.55rem .55rem .55rem 1.2rem;display:flex;align-items:center;gap:.5rem;text-align:start}
.composer:focus-within{border-color:var(--muted)}
.composer input{flex:1;min-inline-size:0;background:transparent;border:0;outline:0;font:inherit;color:inherit;padding:.6rem 0}
.composer input::placeholder{color:var(--muted)}
.send{inline-size:2.4rem;block-size:2.4rem;border-radius:50%;border:0;background:var(--accent);color:var(--accent-text);display:grid;place-items:center;cursor:pointer;flex:none}.send:hover{opacity:.8}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center}
.chip{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:999px;padding:.5rem .95rem;font:inherit;font-size:.9rem;cursor:pointer;text-decoration:none}.chip:hover{background:var(--surface);color:var(--text)}

.chat{display:grid;gap:1.6rem}
.msg.user{justify-self:end;max-inline-size:85%;background:var(--surface);border-radius:1.5rem;padding:.7rem 1.15rem}
.msg.user h1,.msg.user p{font-size:1rem;font-weight:400;margin:0;letter-spacing:0;line-height:1.6}
.msg.bot{min-inline-size:0}
.msg.bot>.meta{display:flex;align-items:center;gap:.5rem;color:var(--muted);font-size:.85rem;margin-block-end:.8rem}
.prose h2{margin-block-start:2em;scroll-margin-top:5rem}.prose h3{margin-block-start:1.6em}.prose li{margin-block-end:.4em}.prose ul,.prose ol{padding-inline-start:1.4rem}
.prose a,.lede a,.note a{color:var(--link)}
.prose blockquote{margin:1.2rem 0;padding:.2rem 0 .2rem 1rem;border-inline-start:3px solid var(--line);color:var(--muted)}
.prose code{font-family:var(--mono);font-size:.88em;background:var(--surface);padding:.1em .35em;border-radius:.35rem}
.table-scroll{overflow-x:auto;margin-block:1.3rem;border:1px solid var(--line);border-radius:.9rem}
.prose table{inline-size:100%;border-collapse:collapse;font-size:.93rem}.prose th{text-align:start;font-weight:600;background:var(--surface)}
.prose th,.prose td{padding:.65rem .85rem;border-block-end:1px solid var(--line);vertical-align:top}.prose tr:last-child td{border-block-end:0}
.lede{font-size:1.05rem;color:var(--muted)}
.sources{display:flex;flex-wrap:wrap;gap:.4rem;margin-block:1rem 1.6rem}
.sources a,.sources span{display:inline-flex;align-items:center;gap:.35rem;background:var(--surface);border-radius:999px;padding:.3rem .75rem;font-size:.8rem;text-decoration:none;color:var(--muted)}.sources a:hover{background:var(--surface-2);color:var(--text)}
.sources .ok{color:var(--ok);font-weight:600}
details.toc{border:1px solid var(--line);border-radius:.9rem;padding:.6rem 1rem;margin-block-end:1.6rem;font-size:.93rem}details.toc summary{cursor:pointer;font-weight:500}details.toc ol{margin:.6rem 0 .3rem;padding-inline-start:1.2rem;color:var(--muted)}details.toc a{text-decoration:none}details.toc a:hover{text-decoration:underline}
.actions{display:flex;gap:.3rem;color:var(--muted);margin-block-start:1.2rem}.actions button,.actions a{background:none;border:0;color:inherit;font:inherit;font-size:.85rem;padding:.35rem .6rem;border-radius:.5rem;cursor:pointer;text-decoration:none}.actions button:hover,.actions a:hover{background:var(--surface);color:var(--text)}

.ad{border:1px solid var(--line);border-radius:1rem;padding:1rem 1.1rem;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.3rem 1rem;align-items:center;background:var(--bg)}
.ad .lab{grid-column:1/-1;font-size:.75rem;color:var(--muted)}
.ad .who{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:var(--muted)}
.ad strong{display:block;font-weight:600;font-size:1.02rem}.ad p{margin:0;color:var(--muted);font-size:.92rem}
.ad.demo{background:var(--ad);border-color:var(--ad-line)}
.unit{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:.9rem;border:1px solid var(--line);border-radius:1rem;padding:.8rem;align-items:center;margin-block:.8rem}
.unit .img{block-size:5.5rem;border-radius:.7rem;background:var(--surface-2);display:grid;place-items:center;color:var(--muted);font-size:.72rem;text-align:center;padding:.3rem}
.unit .lab{font-size:.72rem;color:var(--muted)}.unit strong{display:block;font-size:.98rem;line-height:1.35}.unit p{margin:.15rem 0 0;font-size:.88rem;color:var(--muted);line-height:1.5}
.unit .who{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:var(--muted);margin-block-end:.15rem}.unit .fav{inline-size:1rem;block-size:1rem;border-radius:.25rem;background:var(--accent);flex:none}
.note{background:var(--surface);border-radius:.9rem;padding:.8rem 1rem;font-size:.92rem;color:var(--muted);margin-block:1.2rem}

.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.7rem;margin-block:1rem}
.card{border:1px solid var(--line);border-radius:1rem;padding:1rem;text-decoration:none;display:block}.card:hover{background:var(--surface)}
.card h3{margin:0 0 .3rem;font-size:1rem}.card p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.55}
.facts{display:grid;gap:0;margin-block:1rem;border:1px solid var(--line);border-radius:1rem;overflow:hidden}
.fact{display:grid;grid-template-columns:11rem minmax(0,1fr);gap:1rem;padding:.9rem 1.1rem;border-block-end:1px solid var(--line)}.fact:last-child{border-block-end:0}
.fact b{font-weight:600}.fact span{color:var(--muted);font-size:.95rem}.fact a{color:var(--link);font-size:.85rem}
.steps{counter-reset:s;list-style:none;padding:0;margin:1rem 0;display:grid;gap:1rem}.steps li{counter-increment:s;display:grid;grid-template-columns:2rem minmax(0,1fr);gap:.8rem}
.steps li::before{content:counter(s);inline-size:1.8rem;block-size:1.8rem;border-radius:50%;background:var(--surface);display:grid;place-items:center;font-size:.85rem;font-weight:600}
.steps h3{margin:0 0 .2rem}.steps p{margin:0;color:var(--muted)}
.faq details{border-block-end:1px solid var(--line);padding-block:.85rem}.faq summary{cursor:pointer;font-weight:500}.faq details p{margin:.6rem 0 0;color:var(--muted)}
.tool{background:var(--surface);border-radius:1.2rem;padding:1.2rem;display:grid;gap:.9rem;margin-block:1.2rem}
.tool label{display:grid;gap:.3rem;font-weight:500;font-size:.9rem}.tool label>span{display:flex;gap:.6rem;align-items:flex-start;font-weight:400}
.tool input:not([type=checkbox]),.tool select,.tool textarea{font:inherit;padding:.65rem .8rem;border:1px solid var(--line);border-radius:.8rem;background:var(--bg);color:var(--text);inline-size:100%}
.tool output{display:block;background:var(--bg);border:1px solid var(--line);border-radius:.9rem;padding:.9rem 1rem;word-break:break-word}.tool .row{display:grid;grid-template-columns:1fr 1fr;gap:.9rem}
.site-foot{border-block-start:1px solid var(--line);color:var(--muted);font-size:.82rem;padding-block:1.5rem}.site-foot a{color:inherit}.site-foot p{margin:0 0 .4rem}
.scrim{display:none}
.typing::after{content:"";display:inline-block;inline-size:.6rem;block-size:.6rem;border-radius:50%;background:var(--text);margin-inline-start:.2rem;animation:pulse 1s ease-in-out infinite}
@keyframes pulse{50%{opacity:.25;transform:scale(.8)}}
@media (max-width:900px){.app{grid-template-columns:minmax(0,1fr)}.side{position:fixed;inset-block:0;inset-inline-start:0;inline-size:min(19rem,86vw);z-index:30;transform:translateX(-102%);transition:transform .2s ease}
[dir=rtl] .side{transform:translateX(102%)}.side.open{transform:none}.scrim.open{display:block;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:25}.menu-btn{display:inline-block}
.fact{grid-template-columns:1fr;gap:.2rem}.tool .row{grid-template-columns:1fr}.top .sub{display:none}.msg.user{max-inline-size:94%}.ad{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
.hero.asked{min-block-size:0;padding-block:1rem}.hero.asked h1,.hero.asked>p{display:none}
.msg.user p{margin:0}.prose .note{margin-block:1.2rem}