:root{color-scheme:light;--paper:#f5f0e4;--card:#fffaf0;--ink:#382b32;--muted:#75636b;--line:#e3d1c8;--accent:#a53861;--pink:#f46aa6;--orange:#ff9b55;--gradient:linear-gradient(115deg,var(--pink),var(--orange));--soft:linear-gradient(115deg,#ffe2ef,#ffe7cf);--shadow:#e8baa7}
*{box-sizing:border-box}
html{scroll-padding-top:104px}
body{margin:0;color:var(--ink);background:var(--paper);font:16px/1.7 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
a{color:var(--accent);text-underline-offset:4px;text-decoration-thickness:1.5px}
a:hover{color:#823049}
button,input,summary{font:inherit}
button,summary{cursor:pointer}
:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:18px;top:-100px;z-index:50;background:var(--card);padding:10px 16px}
.skip-link:focus{top:12px}
.site-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:24px;padding:16px 32px;border-bottom:3px solid transparent;background:var(--gradient) bottom/100% 3px no-repeat,var(--paper)}
.brand{color:var(--ink);font:bold 23px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:2px;text-decoration:none;white-space:nowrap}
.license-badge{font:12px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--accent);border:1px solid #eab7bd;background:var(--soft);padding:7px 10px;text-decoration:none;white-space:nowrap}
.search{position:relative;margin-left:auto;width:min(310px,34vw)}
.search input{width:100%;border:1px solid #c8afa8;background:var(--card);padding:9px 12px;font-size:14px;color:var(--ink);border-radius:0}
.search-results{position:absolute;right:0;top:calc(100% + 10px);width:min(480px,85vw);max-height:65vh;overflow:auto;background:var(--card);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--line)}
.search-results a{display:block;padding:14px 16px;border-bottom:1px solid var(--line);text-decoration:none}
.search-results a:hover{background:var(--soft)}
.search-results strong{display:block;font-size:14px;line-height:1.5}
.search-results span,.search-results p{display:block;font-size:13px;line-height:1.5;color:var(--muted);margin:4px 0 0}
.search-results p{padding:16px}
.site-layout{display:grid;grid-template-columns:232px minmax(0,1fr);max-width:1450px;margin:auto}
.sidebar{position:sticky;top:79px;align-self:start;max-height:calc(100vh - 79px);overflow:auto;padding:20px 16px 32px 24px;border-right:1px solid var(--line)}
.sidebar a,.mobile-navigation nav a{display:block;padding:6px 10px;font-size:14px;text-decoration:none;color:var(--muted)}
.sidebar a.active,.mobile-navigation a.active{color:var(--ink);font-weight:650;background:var(--soft);box-shadow:inset 3px 0 var(--pink)}
.sidebar a:hover,.mobile-navigation nav a:hover{color:var(--accent);background:var(--soft)}
.nav-group{margin:20px 10px 6px;color:var(--ink);font:600 12px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace}
.nav-group:first-child{margin-top:0}
.mobile-navigation{display:none}
main{min-width:0;padding:44px clamp(24px,5vw,72px) 32px}
article{max-width:940px}
h1,h2,h3{color:var(--ink);line-height:1.25}
h1{margin:0 0 22px;font-size:clamp(32px,4vw,46px);letter-spacing:-1.2px}
h2{margin:40px 0 16px;font-size:27px;letter-spacing:-.5px}
h3{font-size:20px;margin:24px 0 12px}
p{margin:0 0 18px}
article>p{max-width:78ch}
ul,ol{padding-left:24px}
li{margin-bottom:8px}
img{max-width:100%;height:auto}
table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px;line-height:1.6;overflow-wrap:anywhere}
th,td{padding:12px;border:1px solid var(--line);text-align:left;vertical-align:top}
th{background:var(--soft)}
.comparison-scroll{max-width:100%;overflow-x:auto;margin:26px 0;border:1px solid var(--line);background:var(--card);scrollbar-color:var(--accent) var(--card);overscroll-behavior-x:contain}
.comparison-scroll table{margin:0;font-size:13px;line-height:1.6}
.comparison-scroll caption{text-align:left;padding:14px 12px;color:var(--muted);font-size:13px;background:var(--paper)}
.comparison-scroll th,.comparison-scroll td{padding:13px 12px}
.comparison-scroll tbody th{background:var(--paper);font-size:14px;font-weight:600}
.comparison-scroll thead th{font-size:13px;font-weight:650}
.setup-comparison{min-width:780px}
.setup-comparison th:first-child{width:19%}
.setup-comparison thead th:not(:first-child){width:27%}
.model-comparison{min-width:820px}
.model-comparison th:first-child{width:19%}
.table-detail{display:block;margin-top:5px;font-size:12px;line-height:1.55;color:var(--muted);font-weight:400}
.quality-status{display:inline-block;padding:3px 6px;border:1px solid var(--line);background:var(--paper);font:11px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace}
.comparison-hint{display:none;color:var(--muted);font-size:13px}
@media(max-width:1100px){.comparison-hint{display:block}}
code,pre{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
:not(pre)>code{font-size:.9em;background:#f3e0dc;padding:2px 5px;overflow-wrap:anywhere}
pre{overflow:auto;margin:0;padding:20px;background:#f0e5df;font-size:13px;line-height:1.65;tab-size:2}
pre code{color:var(--ink)}
.code-block{position:relative;margin:22px 0;border:1px solid var(--line)}
.code-block pre{padding-top:42px}
.code-block button{position:absolute;top:7px;right:8px;border:1px solid #d5aaa8;background:var(--card);color:var(--accent);font-size:12px;padding:3px 8px}
.page-toc{border:1px solid var(--line);padding:12px 16px;margin:0 0 28px;background:var(--card);font-size:14px}
.page-toc summary{font-weight:600}
.page-toc nav{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:12px}
.hero h1{font-size:clamp(38px,5.1vw,64px);max-width:820px;line-height:1.05;letter-spacing:-2px}
.hero p{font-size:18px;max-width:760px}
.hero .hero-label{font:13px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.4px;color:var(--accent);margin-bottom:18px}
.hero .hero-note{font-size:14px;color:var(--muted);margin:18px 0 26px}
.hero>img{display:block;width:100%;border:3px solid transparent;border-image:var(--gradient) 1;margin:28px 0 32px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:24px 0}
.button{display:inline-block;border:2px solid var(--accent);background:var(--card);color:var(--accent);padding:10px 16px;text-decoration:none;font-size:14px;font-weight:600;box-shadow:3px 3px 0 var(--shadow)}
.button.primary{background:var(--gradient);color:var(--ink)}
.button:hover{color:var(--ink);background:var(--soft);box-shadow:1px 1px 0 var(--shadow)}
.home-page article>h2{margin-top:64px}
.feature-list{list-style:none;padding:0;margin:26px 0;border-top:1px solid var(--line)}
.feature-list li{display:grid;grid-template-columns:minmax(210px,.8fr) minmax(0,1.6fr);gap:16px;padding:17px 0;margin:0;border-bottom:1px solid var(--line)}
.feature-list strong{padding-left:14px;border-left:3px solid var(--pink);font-size:16px;line-height:1.55}
.feature-list li:nth-child(even) strong{border-left-color:var(--orange)}
.feature-list span{font-size:15px;line-height:1.65;color:var(--muted)}
.quickstart-steps{list-style:none;counter-reset:quickstart;padding:0;margin:26px 0}
.quickstart-steps>li{position:relative;counter-increment:quickstart;margin:0;padding:22px 0 22px 54px;border-top:1px solid var(--line)}
.quickstart-steps>li:last-child{border-bottom:1px solid var(--line)}
.quickstart-steps>li::before{content:counter(quickstart,decimal-leading-zero);position:absolute;left:0;top:22px;padding:4px 7px;border:1px solid #eab7bd;background:var(--soft);color:var(--accent);font:600 13px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace}
.quickstart-steps h3{margin:0 0 8px;font-size:20px}
.quickstart-steps p{margin:0;font-size:15px;line-height:1.7}
.quickstart-steps .prompt-card{margin:20px 0 4px}
.experience-list{margin:26px 0;border-top:1px solid var(--line)}
.experience-list>div{display:grid;grid-template-columns:100px minmax(0,1fr);gap:24px;padding:20px 0;border-bottom:1px solid var(--line)}
.experience-list dt{color:var(--accent);font:600 14px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace}
.experience-list dd{margin:0;font-size:15px;color:var(--muted)}
.experience-list strong{display:block;font-size:16px;color:var(--ink);margin-bottom:4px}
.reference-details{border:1px solid var(--line);padding:16px 20px;margin:24px 0;background:var(--card)}
.reference-details summary{font-weight:600;font-size:15px}
.reference-details[open] summary{margin-bottom:20px}
.reference-details p{font-size:14px}
.prompt-card{border:2px solid var(--accent);margin:24px 0;background:var(--card);box-shadow:4px 4px 0 var(--shadow)}
.prompt-card pre{background:var(--card);white-space:pre-wrap;overflow-wrap:anywhere}
.prompt-card button{border:0;border-top:1px solid var(--line);width:100%;text-align:left;padding:12px 20px;background:var(--soft);color:var(--accent);font-size:14px;font-weight:600}
.demo-feature{margin:26px 0;border:2px solid var(--ink);background:var(--card);box-shadow:5px 5px 0 var(--line)}
.demo-feature figcaption{padding:14px 18px;font-size:14px}
video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain;background:#211b20}
.demo-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:28px 0}
.demo-card{min-width:0;border:2px solid var(--accent);background:var(--card);box-shadow:5px 5px 0 var(--shadow)}
.demo-card.featured{grid-column:1/-1}
.demo-card.featured video{aspect-ratio:1338/1030}
.demo-caption{padding:18px}
.demo-caption h2,.demo-caption h3{font-size:21px;margin:0 0 10px}
.demo-caption p{font-size:14px;line-height:1.6}
.demo-caption a{font-size:14px}
.license-text{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--card);border:1px solid var(--line)}
.site-footer{max-width:940px;border-top:1px solid var(--line);margin-top:48px;padding-top:24px;color:var(--muted);font-size:13px}
.site-footer p{margin-bottom:12px}
.site-footer nav{display:flex;flex-wrap:wrap;gap:10px 20px}
.release-note{margin-top:16px}
@media(max-width:1000px){.site-header{gap:16px;padding:14px 20px}.license-badge{font-size:11px}.site-layout{grid-template-columns:205px minmax(0,1fr)}.sidebar{padding-left:14px}main{padding:36px 24px}}
@media(max-width:720px){html{scroll-padding-top:156px}.site-header{display:grid;grid-template-columns:1fr auto;padding:12px 16px;gap:12px}.brand{font-size:20px}.license-badge{font-size:10px;padding:5px 6px}.search{grid-column:1/-1;width:100%;margin:0}.search-results{width:100%}.site-layout{display:block}.sidebar{display:none}.mobile-navigation{display:block;border-bottom:1px solid var(--line);padding:10px 16px}.mobile-navigation summary{font-size:14px;font-weight:600}.mobile-navigation nav{padding:14px 0}.mobile-navigation .nav-group{margin-top:18px}main{padding:30px 16px}h1{font-size:34px}h2{font-size:24px}.hero h1{font-size:43px}.hero p{font-size:16px}.demo-gallery{grid-template-columns:1fr}.demo-card.featured{grid-column:auto}.hero-actions{gap:10px}.button{font-size:13px}pre{font-size:12px;padding:16px}.code-block pre{padding-top:42px}td,th{padding:9px}.site-footer{margin-top:36px}}
@media(max-width:720px){.home-page article>h2{margin-top:48px}.feature-list li{grid-template-columns:1fr;gap:8px;padding:16px 0}.feature-list span{padding-left:17px}.quickstart-steps>li{padding-left:44px}.quickstart-steps h3{font-size:18px}.experience-list>div{grid-template-columns:1fr;gap:6px;padding:16px 0}.reference-details{padding:14px 16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media(forced-colors:active){.site-header{border-bottom-color:CanvasText}.hero>img{border-image:none;border-color:CanvasText}}
@media(min-width:721px) and (max-width:1100px){.site-header{flex-wrap:wrap}.search{flex:1;min-width:200px}}
