:root{
  --cream:#f5f0e8;
  --paper:#fffdf8;
  --clay:#ff6b35;
  --yellow:#d9b44a;
  --green:#95ba78;
  --pink:#c05a62;
  --lavender:#a58bb4;
  --cyan:#1ecad3;
  --ink:#171717;
  --mud:#735742;
  --terminal:#05090b;
  --terminal-2:#0a1114;
  --terminal-line:#203238;
  --white:#fff;
  --shadow:6px 6px 0 var(--ink);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--cream);scroll-padding-top:78px}
body{min-width:280px;background:var(--cream);color:var(--ink);font-family:"Space Mono","IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;overflow-x:hidden;cursor:crosshair}
button,select,input,textarea{font:inherit}
button,a{cursor:crosshair}
button{border-radius:0}
a{color:inherit}
[hidden]{display:none!important}
.skip{position:fixed;top:-100px;left:12px;z-index:1000;padding:10px 14px;background:var(--ink);color:var(--cream);border:2px solid var(--clay)}
.skip:focus{top:12px}

.grainy{position:relative}
.grainy::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:4;opacity:.55;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.055'/%3E%3C/svg%3E")}

.site-nav{position:fixed;inset:0 0 auto;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:22px;min-height:68px;padding:.8rem clamp(1rem,3vw,2.6rem);background:rgba(245,240,232,.94);border-bottom:3px solid var(--ink);backdrop-filter:blur(12px)}
.nav-logo{flex:none;font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:1.08rem;font-weight:950;letter-spacing:-.045em;text-decoration:none;white-space:nowrap}
.nav-logo span{color:var(--clay)}
.nav-links{display:flex;align-items:center;justify-content:center;gap:clamp(.8rem,2vw,2rem);margin-left:auto}
.nav-links a{position:relative;text-decoration:none;font-size:.69rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:3px;background:var(--clay);transition:right .18s ease}
.nav-links a:hover::after,.nav-links a:focus-visible::after{right:0}
.nav-actions{display:flex;align-items:center;gap:9px}
.top-status{display:flex;align-items:center;gap:7px;max-width:190px;padding:.52rem .7rem;border:2px solid var(--ink);background:var(--paper);font-size:.61rem;font-weight:900;white-space:nowrap;overflow:hidden}
.top-status i{flex:none;width:8px;height:8px;border-radius:50%;background:#35c759;box-shadow:0 0 0 4px rgba(53,199,89,.13)}
.top-status.busy i{background:var(--yellow);animation:pulse .8s ease-in-out infinite alternate}
.top-status.error i{background:var(--pink)}
.top-status span{overflow:hidden;text-overflow:ellipsis}
.nav-cta,.install-btn,.menu-btn{min-height:38px;padding:.55rem 1rem;border:2px solid var(--ink);background:var(--ink);color:var(--cream);font-size:.65rem;font-weight:900;letter-spacing:.07em;text-transform:uppercase;box-shadow:3px 3px 0 var(--clay);transition:transform .14s,box-shadow .14s,background .14s}
.nav-cta:hover,.install-btn:hover,.menu-btn:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--clay);background:var(--clay)}
.menu-btn{display:none;min-width:42px;padding:.45rem;font-size:1rem;line-height:1}
@keyframes pulse{to{transform:scale(1.35)}}

.hero{position:relative;isolation:isolate;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;padding:calc(68px + 5rem) clamp(1.2rem,3vw,2.6rem) 4.5rem;border-bottom:4px solid var(--ink);background:var(--cream)}
.parallax-strip{position:absolute;inset:-12% 0 -10%;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));pointer-events:none;z-index:0}
.parallax-col{position:relative;overflow:hidden;border-right:2px solid rgba(23,23,23,.35);will-change:transform}
.parallax-col:nth-child(odd){margin-top:-5%}
.parallax-col:nth-child(even){margin-top:5%}
.parallax-col pre{height:128%;padding:6.5rem 1rem 2rem;background:var(--terminal);color:#dff9ef;font:700 clamp(.55rem,.85vw,.8rem)/1.8 ui-monospace,monospace;white-space:pre-wrap;overflow:hidden;opacity:.93;background-image:linear-gradient(rgba(30,202,211,.055) 1px,transparent 1px);background-size:100% 24px}
.parallax-col:nth-child(2) pre,.parallax-col:nth-child(5) pre{background-color:#11120c;color:#efffc8}
.parallax-col:nth-child(3) pre,.parallax-col:nth-child(6) pre{background-color:#16101a;color:#f7dff2}
.parallax-col b{color:var(--clay);letter-spacing:.12em}
.hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,rgba(245,240,232,.03) 0%,rgba(245,240,232,.3) 35%,rgba(245,240,232,.9) 72%,var(--cream) 100%)}
.hero-content{position:relative;z-index:5;max-width:1050px}
.hero-chip{display:inline-block;margin-bottom:1.1rem;padding:.3rem .72rem;border:2px solid var(--ink);background:var(--yellow);font-size:.62rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase;box-shadow:3px 3px 0 var(--ink)}
.hero h1{font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:clamp(3.7rem,10vw,9.6rem);font-weight:950;line-height:.82;letter-spacing:-.065em;text-transform:uppercase}
.hero h1 span{display:block}
.hero h1 .fill{color:var(--ink)}
.hero h1 .stroke{color:transparent;-webkit-text-stroke:clamp(2px,.25vw,4px) var(--ink)}
.hero h1 .clay-fill{color:var(--clay);text-shadow:5px 5px 0 rgba(23,23,23,.13)}
.hero-sub{max-width:680px;margin-top:1.5rem;font-size:clamp(.77rem,1.2vw,.9rem);line-height:1.75;font-weight:600}
.hero-actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}
.btn-primary,.btn-ghost{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:.8rem 1.5rem;border:3px solid var(--ink);font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:.72rem;font-weight:950;letter-spacing:.055em;text-transform:uppercase;text-decoration:none;box-shadow:5px 5px 0 var(--ink);transition:transform .14s,box-shadow .14s,background .14s}
.btn-primary{background:var(--clay);color:#fff}
.btn-ghost{background:var(--cream);color:var(--ink)}
.btn-primary:hover,.btn-ghost:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 var(--ink)}
.btn-ghost:hover{background:var(--yellow)}
.btn-primary.green{background:var(--green);color:var(--ink)}
.ghost-bg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:0;pointer-events:none;color:var(--mud);opacity:.045;font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:clamp(9rem,23vw,22rem);font-weight:950;letter-spacing:-.08em;white-space:nowrap}

.ticker{position:relative;z-index:6;overflow:hidden;padding:.72rem 0;border-block:3px solid var(--ink);background:var(--clay);color:#fff;white-space:nowrap}
.ticker-inner{display:inline-flex;align-items:center;gap:2.8rem;width:max-content;animation:ticker-scroll 28s linear infinite}
.ticker-item{font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:.7rem;font-weight:950;letter-spacing:.12em}
.ticker-sep{opacity:.5}
@keyframes ticker-scroll{to{transform:translateX(-50%)}}

main{position:relative}
.section-studio{position:relative;overflow:hidden;padding:5.5rem clamp(1rem,3vw,2.6rem);background:var(--cream)}
.section-ghost{font-size:clamp(7rem,18vw,17rem);opacity:.035}
.section-header{position:relative;z-index:5;display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;max-width:1500px;margin:0 auto 2.6rem}
.section-label{margin-bottom:.55rem;font-size:.63rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase;opacity:.58}
.section-title{font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:clamp(2.4rem,5vw,5rem);line-height:.92;letter-spacing:-.055em;text-transform:uppercase}
.section-title .accent{color:var(--clay)}
.section-intro{max-width:550px;font-size:.78rem;line-height:1.7;font-weight:600;opacity:.72}

.engine-cards{position:relative;z-index:5;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));max-width:1500px;margin:0 auto 2rem}
.engine-card{min-width:0;padding:1.65rem;border:2px solid var(--ink);margin:-1px;background:var(--paper);overflow:hidden;transition:transform .15s,box-shadow .15s;isolation:isolate}
.engine-card:nth-child(1){background:var(--yellow)}
.engine-card:nth-child(2){background:var(--green)}
.engine-card:nth-child(3){background:#ecdce8}
.engine-card:hover{z-index:5;transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--ink)}
.engine-no{position:absolute;right:1rem;top:.7rem;font-family:"Arial Black",Impact,sans-serif;font-size:3.6rem;line-height:1;opacity:.12}
.engine-icon{display:grid;place-items:center;width:52px;height:52px;margin-bottom:1rem;border:3px solid var(--ink);background:var(--terminal);color:#fff;font-family:"Arial Black",Impact,sans-serif;font-size:1.35rem;box-shadow:4px 4px 0 var(--clay)}
.engine-card small{display:block;margin-bottom:.5rem;font-size:.58rem;font-weight:900;letter-spacing:.11em;text-transform:uppercase;opacity:.66}
.engine-card h3{font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:clamp(1.25rem,2vw,1.85rem);line-height:1;letter-spacing:-.04em}
.engine-card p{min-height:62px;margin:1rem 0;font-size:.72rem;line-height:1.65;font-weight:600}
.engine-card button{padding:.6rem .85rem;border:2px solid var(--ink);background:var(--ink);color:#fff;font-size:.62rem;font-weight:900;text-transform:uppercase;box-shadow:3px 3px 0 var(--clay)}

.mode-switch{position:relative;z-index:5;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;max-width:1500px;margin:0 auto 1rem;border:3px solid var(--ink);background:var(--ink)}
.mode-switch button{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;align-items:center;column-gap:.75rem;min-width:0;min-height:72px;padding:.8rem 1rem;border:0;border-right:2px solid var(--ink);background:var(--paper);color:var(--ink);text-align:left;transition:background .14s,transform .14s}
.mode-switch button:last-child{border-right:0}
.mode-switch button>span{grid-row:1/3;display:grid;place-items:center;width:36px;height:36px;border:2px solid var(--ink);background:var(--yellow);font-family:"Arial Black",Impact,sans-serif}
.mode-switch button strong{font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:.86rem;letter-spacing:.015em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mode-switch button small{font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;opacity:.58}
.mode-switch button.active{position:relative;z-index:2;background:var(--clay);color:#fff;box-shadow:inset 0 -5px 0 var(--ink)}
.mode-switch button.active>span{background:var(--ink);color:#fff;border-color:#fff}

.compiler-view,.search-view{position:relative;z-index:5;max-width:1500px;margin:0 auto}
.compiler-toolbar{display:grid;grid-template-columns:minmax(120px,.75fr) minmax(190px,1.3fr) minmax(105px,.55fr) minmax(105px,.55fr) auto;gap:10px;padding:13px;border:3px solid var(--ink);background:var(--yellow);box-shadow:var(--shadow)}
.compiler-toolbar label,.search-controls label,.runtime-fields label,.ai-assistant label{display:grid;gap:6px;min-width:0}
.compiler-toolbar label>span,.search-controls label>span,.runtime-fields label>span,.ai-assistant label>span{font-size:.59rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
select,input,textarea{width:100%;min-width:0;border:2px solid var(--ink);border-radius:0;background:var(--paper);color:var(--ink);outline:0}
select,input{height:44px;padding:0 11px}
textarea{padding:12px;resize:vertical;line-height:1.55}
select:focus,input:focus,textarea:focus{box-shadow:0 0 0 3px var(--cyan)}
button:focus-visible,a:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}
.toolbar-actions{display:flex;align-items:end;gap:7px}
.toolbar-actions button,.panel-actions button,.output-tabs button,.runbar button,.search-controls button,.ai-actions button{min-height:42px;padding:.55rem .8rem;border:2px solid var(--ink);background:var(--paper);color:var(--ink);font-size:.62rem;font-weight:900;text-transform:uppercase;box-shadow:3px 3px 0 var(--ink);transition:transform .12s,box-shadow .12s,background .12s}
.toolbar-actions button:hover,.panel-actions button:hover,.output-tabs button:hover,.runbar button:hover,.search-controls button:hover,.ai-actions button:hover{transform:translate(-2px,-2px);box-shadow:5px 5px 0 var(--ink)}

.compiler-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(350px,.92fr);min-height:720px;margin-top:18px}
.panel{position:relative;min-width:0;border:3px solid var(--ink);background:var(--paper)}
.editor-panel{border-right:0;box-shadow:-7px 8px 0 var(--green)}
.output-panel{display:flex;flex-direction:column;box-shadow:8px 8px 0 var(--clay)}
.panel-ribbon{position:absolute;right:-7px;top:-16px;z-index:8;transform:rotate(3deg);padding:.33rem .7rem;border:2px solid var(--ink);background:var(--clay);color:#fff;font-size:.56rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;box-shadow:3px 3px 0 var(--ink)}
.panel-ribbon.alt{background:var(--pink);transform:rotate(-3deg)}
.panel-title{position:relative;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:66px;padding:11px 14px;border-bottom:3px solid var(--ink);background:var(--paper)}
.panel-title>div:first-child{display:grid;gap:3px;min-width:0}
.panel-kicker{font-size:.58rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--clay)}
.panel-title strong{font-size:.79rem;overflow-wrap:anywhere}
.panel-actions{display:flex;gap:7px;flex:none}
.output-heading{display:flex;align-items:baseline;justify-content:center;gap:.6rem;min-height:66px;padding:.8rem 1rem;border-bottom:3px solid var(--ink);background:var(--paper);font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:clamp(1.2rem,2.3vw,2.1rem);letter-spacing:-.055em}
.output-heading span{color:transparent;-webkit-text-stroke:2px var(--ink)}
.output-heading strong{color:var(--clay)}
.editor-frame{position:relative;z-index:2;display:grid;grid-template-columns:52px minmax(0,1fr);height:500px;min-height:360px;background:var(--terminal);overflow:hidden;border-bottom:3px solid var(--ink)}
.line-numbers{margin:0;padding:18px 8px;overflow:hidden;border-right:1px solid var(--terminal-line);background:#0b1113;color:#6f8d92;text-align:right;font:500 14px/1.65 ui-monospace,monospace;user-select:none}
.editor-frame textarea{height:100%;min-height:100%;resize:none;border:0;padding:18px;font:700 14px/1.65 ui-monospace,monospace;white-space:pre;overflow:auto;tab-size:4;background-color:var(--terminal);background-image:linear-gradient(rgba(30,202,211,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,107,53,.026) 1px,transparent 1px);background-size:100% 23.1px,60px 100%;color:#f4fffb;caret-color:#dfff00;box-shadow:none}
.runtime-fields{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;background:var(--paper)}
.runtime-fields label{padding:12px}
.runtime-fields label+label{border-left:2px solid var(--ink)}
.runtime-fields textarea{min-height:88px;background:#fff}
.runbar{position:relative;z-index:5;display:flex;gap:10px;padding:14px;border-top:2px solid var(--ink);background:var(--green)}
.runbar .primary{flex:1;background:var(--ink);color:#fff;box-shadow:4px 4px 0 var(--clay)}
.runbar .primary:hover{background:var(--clay)}
.output-tabs{position:relative;z-index:5;display:flex;flex-wrap:wrap;gap:7px;padding:10px;border-bottom:3px solid var(--ink);background:var(--yellow)}
.output-tabs button.active{background:var(--ink);color:#fff;box-shadow:3px 3px 0 var(--clay)}
.output-tabs button:last-child{margin-left:auto}
.output-console{position:relative;z-index:2;flex:1;min-height:500px;max-height:780px;margin:0;padding:20px;overflow:auto;background-color:var(--terminal);background-image:linear-gradient(rgba(30,202,211,.04) 1px,transparent 1px);background-size:100% 25px;color:#eafff8;font:700 .84rem/1.72 ui-monospace,monospace;white-space:pre-wrap;overflow-wrap:anywhere}
.output-console.error{color:#ff9ba8}
.output-meta{position:relative;z-index:5;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:3px solid var(--ink);background:var(--ink);gap:2px}
.output-meta div{min-width:0;padding:11px;background:var(--paper)}
.output-meta span{display:block;font-size:.56rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;opacity:.58}
.output-meta strong{display:block;margin-top:4px;font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.engine-note{position:relative;z-index:5;padding:13px 15px;border-top:2px solid var(--ink);background:#eadfce;font-size:.69rem;line-height:1.55;font-weight:600}

.search-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px;padding:2rem;border:3px solid var(--ink);background:var(--green);box-shadow:var(--shadow)}
.search-head h2{font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:clamp(2.2rem,5.2vw,5rem);line-height:.88;letter-spacing:-.06em;text-transform:uppercase}
.search-head h2 span{color:var(--clay)}
.search-head p:last-child{max-width:760px;margin-top:1rem;font-size:.75rem;line-height:1.65;font-weight:600}
.index-stat{display:grid;place-items:center;min-width:170px;padding:1.2rem;border:3px solid var(--ink);background:var(--paper);box-shadow:6px 6px 0 var(--clay)}
.index-stat strong{font-family:"Arial Black",Impact,sans-serif;font-size:2.2rem}
.index-stat span{font-size:.6rem;font-weight:900;text-transform:uppercase}
.search-controls{display:grid;grid-template-columns:minmax(300px,1fr) minmax(160px,.28fr) minmax(150px,.28fr);gap:10px;margin-top:18px;padding:14px;border:3px solid var(--ink);background:var(--yellow);box-shadow:var(--shadow)}
.search-box div{display:grid;grid-template-columns:minmax(0,1fr) auto}
.search-box button{background:var(--ink);color:#fff;box-shadow:3px 3px 0 var(--clay)}
.search-layout{display:grid;grid-template-columns:minmax(310px,.72fr) minmax(0,1.28fr);min-height:720px;margin-top:18px}
.results-panel{border-right:0;box-shadow:-7px 8px 0 var(--green)}
.preview-panel{display:flex;flex-direction:column;box-shadow:8px 8px 0 var(--clay)}
.search-results{max-height:760px;overflow:auto;background:var(--paper)}
.empty-state{display:grid;place-items:center;align-content:center;gap:.6rem;min-height:460px;padding:30px;text-align:center}
.empty-state span{font-family:"Arial Black",Impact,sans-serif;font-size:4.5rem;color:var(--clay)}
.empty-state strong{font-family:"Arial Black",Impact,sans-serif;font-size:1.1rem;text-transform:uppercase}
.empty-state p{max-width:360px;font-size:.72rem;line-height:1.6;opacity:.65}
.result-card{display:grid;gap:8px;width:100%;padding:14px;border:0;border-bottom:2px solid var(--ink);background:var(--paper);color:var(--ink);text-align:left;box-shadow:none;transition:background .12s,padding-left .12s}
.result-card:hover,.result-card.active{transform:none;padding-left:19px;background:#f3d9ca;border-left:7px solid var(--clay)}
.result-top{display:flex;justify-content:space-between;gap:10px}
.result-repo{font-size:.59rem;font-weight:900;text-transform:uppercase;color:#8a3a21}
.result-score{font-size:.59rem;font-weight:900}
.result-path{font-size:.72rem;overflow-wrap:anywhere}
.result-summary{font-size:.68rem;line-height:1.5;opacity:.72}
.result-tags{display:flex;flex-wrap:wrap;gap:6px}
.result-tags span{padding:3px 6px;border:1px solid var(--ink);background:var(--yellow);font-size:.55rem;font-weight:800}
.code-preview{position:relative;z-index:2;flex:1;min-height:410px;max-height:580px;margin:0;padding:18px;overflow:auto;background:var(--terminal);color:#eafff8;font:600 .75rem/1.65 ui-monospace,monospace;white-space:pre;tab-size:4}
.ai-assistant{position:relative;z-index:5;display:grid;gap:10px;padding:14px;border-top:3px solid var(--ink);background:#eadfce}
.ai-assistant textarea{min-height:90px;background:var(--paper)}
.ai-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}
.ai-actions button{background:var(--clay);color:#fff}
.ai-answer{min-height:110px;padding:13px;border:2px solid var(--ink);background:var(--paper);font-size:.71rem;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
.ai-answer code{color:#8a3a21;font-weight:900}

.source-strip{position:relative;height:420px;overflow:auto hidden;border-block:4px solid var(--ink);background:var(--ink);scrollbar-width:thin;scrollbar-color:var(--clay) var(--ink)}
.source-strip-inner{display:flex;width:max-content;height:100%;animation:source-drift 18s ease-in-out infinite alternate}
.source-strip article{position:relative;display:flex;flex-direction:column;justify-content:flex-end;width:clamp(250px,26vw,420px);height:100%;flex:none;padding:2rem;border-right:3px solid var(--ink);background:var(--yellow);overflow:hidden}
.source-strip article:nth-child(2){background:var(--green)}
.source-strip article:nth-child(3){background:#ecdce8}
.source-strip article:nth-child(4){background:#d6e8e7}
.source-strip article:nth-child(5){background:#f0d6c9}
.source-strip article:nth-child(6){background:#d8cbe2}
.source-strip article:nth-child(7){background:var(--clay);color:#fff}
.source-strip article::before{content:"{ }";position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);font-family:"Arial Black",Impact,sans-serif;font-size:clamp(6rem,13vw,13rem);opacity:.12;white-space:nowrap}
.source-strip article span{position:absolute;top:1rem;right:1rem;font-family:"Arial Black",Impact,sans-serif;font-size:3rem;opacity:.2}
.source-strip article b{position:relative;font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:clamp(1.6rem,3vw,3.4rem);line-height:.9;letter-spacing:-.06em}
.source-strip article small{position:relative;margin-top:.5rem;font-size:.62rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.source-caption{position:sticky;left:1.5rem;bottom:1.2rem;display:inline-block;z-index:5;padding:.45rem .75rem;border:2px solid var(--cream);background:var(--ink);color:#fff;font-size:.58rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
@keyframes source-drift{to{transform:translateX(-18vw)}}

.section-vibes{position:relative;overflow:hidden;padding:5.5rem clamp(1rem,3vw,2.6rem);border-bottom:4px solid var(--ink);background:var(--ink);color:var(--cream)}
.section-vibes .ghost-bg{color:var(--clay);opacity:.06}
.vibes-grid{position:relative;z-index:5;display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,.9fr);gap:4rem;align-items:center;max-width:1500px;margin:auto}
.vibes-text .section-title .accent{color:var(--green)}
.vibes-text>p:not(.section-label){max-width:720px;margin-top:1.25rem;font-size:.78rem;line-height:1.8;opacity:.72}
.vibes-stats{display:grid;grid-template-columns:1fr 1fr}
.stat-box{min-width:0;padding:2rem;border:2px solid rgba(255,255,255,.22);margin:-1px;overflow:hidden}
.stat-box:nth-child(1){border-color:var(--clay)}
.stat-box:nth-child(2){border-color:var(--green)}
.stat-box:nth-child(3){border-color:var(--yellow)}
.stat-box:nth-child(4){border-color:var(--pink)}
.stat-num{font-family:"Arial Black","Unbounded",Impact,sans-serif;font-size:clamp(2.7rem,5vw,4.8rem);line-height:1;color:var(--cream)}
.stat-num .unit{font-size:.5em}
.stat-label{margin-top:.55rem;font-size:.58rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;opacity:.55}

footer{padding:3.4rem clamp(1rem,3vw,2.6rem) 2rem;border-top:4px solid var(--clay);background:var(--ink);color:var(--cream)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:3rem;max-width:1500px;margin:0 auto 3rem}
.footer-brand .nav-logo{display:inline-block;color:var(--cream)}
.footer-brand p{max-width:440px;margin-top:1rem;font-size:.72rem;line-height:1.7;opacity:.55}
.footer-col h4{margin-bottom:1rem;font-size:.61rem;letter-spacing:.15em;text-transform:uppercase;opacity:.45}
.footer-col a{display:block;margin-bottom:.65rem;color:var(--cream);font-size:.71rem;text-decoration:none;opacity:.72}
.footer-col a:hover{color:var(--clay);opacity:1}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:1rem;max-width:1500px;margin:auto;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.14)}
.footer-bottom p{font-size:.61rem;opacity:.42}
.toast{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom));z-index:999;max-width:min(90vw,700px);transform:translateX(-50%);padding:12px 16px;border:3px solid var(--ink);background:var(--yellow);color:var(--ink);box-shadow:6px 6px 0 var(--clay);font-size:.69rem;font-weight:900;text-align:center}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .55s ease,transform .55s ease}
.reveal.in-view{opacity:1;transform:none}

@media(max-width:1180px){
  .top-status{display:none}
  .compiler-toolbar{grid-template-columns:1fr 1fr}
  .toolbar-actions{grid-column:1/-1}
  .compiler-grid,.search-layout{grid-template-columns:1fr}
  .editor-panel,.results-panel{border-right:3px solid var(--ink);box-shadow:7px 7px 0 var(--green)}
  .output-panel,.preview-panel{margin-top:18px;box-shadow:7px 7px 0 var(--clay)}
  .search-results{max-height:520px}
  .vibes-grid{grid-template-columns:1fr;gap:2.5rem}
}

@media(max-width:860px){
  .site-nav{flex-wrap:wrap;gap:8px;min-height:64px;padding:.65rem 1rem}
  .nav-links{position:absolute;top:calc(100% + 3px);left:0;right:0;display:none;grid-template-columns:1fr 1fr;gap:0;margin:0;border-bottom:3px solid var(--ink);background:var(--cream)}
  .nav-links.open{display:grid}
  .nav-links a{padding:1rem;border-right:1px solid var(--ink);border-bottom:1px solid var(--ink)}
  .nav-links a::after{display:none}
  .nav-cta{display:none}
  .menu-btn{display:inline-grid;place-items:center}
  .hero{padding-top:calc(64px + 4rem)}
  .parallax-strip{grid-template-columns:repeat(3,1fr)}
  .parallax-col:nth-child(n+4){display:none}
  .section-header{align-items:flex-start;flex-direction:column}
  .engine-cards{grid-template-columns:1fr}
  .engine-card p{min-height:0}
  .mode-switch{grid-template-columns:1fr}
  .mode-switch button{border-right:0;border-bottom:2px solid var(--ink)}
  .mode-switch button:last-child{border-bottom:0}
  .search-head{grid-template-columns:1fr}
  .index-stat{width:100%}
  .search-controls{grid-template-columns:1fr}
  .source-strip{height:360px}
  .footer-grid{grid-template-columns:1fr}
}

@media(max-width:620px){
  html{scroll-padding-top:66px}
  .site-nav{padding:.6rem .75rem}
  .nav-logo{font-size:.92rem}
  .install-btn{padding:.45rem .65rem;font-size:.57rem}
  .hero{min-height:92svh;padding-inline:1rem;padding-bottom:3rem}
  .hero h1{font-size:clamp(3rem,17vw,5.2rem);line-height:.85}
  .hero-sub{font-size:.73rem}
  .hero-actions{display:grid;grid-template-columns:1fr;width:100%}
  .btn-primary,.btn-ghost{width:100%;min-width:0;padding:.75rem 1rem}
  .section-studio,.section-vibes{padding:3.8rem .72rem}
  .section-header{margin-bottom:1.8rem;padding-inline:.28rem}
  .section-title{font-size:clamp(2.1rem,13vw,3.5rem)}
  .section-intro{font-size:.71rem}
  .engine-card{padding:1.35rem}
  .mode-switch button{min-height:68px}
  .compiler-toolbar{grid-template-columns:1fr;padding:9px;box-shadow:4px 4px 0 var(--ink)}
  .toolbar-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
  .toolbar-actions button{padding:.45rem .3rem;font-size:.56rem}
  .compiler-grid{min-height:0;margin-top:14px}
  .panel-ribbon{right:5px;top:-13px;font-size:.5rem}
  .panel-title{align-items:flex-start;min-height:64px;padding:10px}
  .panel-actions{display:grid;grid-template-columns:1fr 1fr;width:100%;max-width:190px}
  .panel-actions button{min-width:0;padding:.45rem .35rem;font-size:.55rem}
  .editor-frame{grid-template-columns:42px minmax(0,1fr);height:430px;min-height:320px}
  .line-numbers{padding:14px 6px;font-size:12px}
  .editor-frame textarea{padding:14px 11px;font-size:12.5px;line-height:1.65}
  .runtime-fields{grid-template-columns:1fr}
  .runtime-fields label+label{border-left:0;border-top:2px solid var(--ink)}
  .runbar{flex-direction:column}
  .runbar button{width:100%}
  .output-heading{min-height:60px;font-size:1.35rem}
  .output-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:8px}
  .output-tabs button{min-width:0;padding:.45rem .25rem;font-size:.54rem}
  .output-tabs button:last-child{grid-column:1/-1;margin-left:0}
  .output-console{min-height:330px;max-height:520px;padding:14px;font-size:.75rem}
  .output-meta{grid-template-columns:1fr 1fr}
  .search-head{padding:1.25rem;box-shadow:4px 4px 0 var(--ink)}
  .search-head h2{font-size:clamp(2rem,12vw,3.3rem)}
  .search-controls{padding:9px;box-shadow:4px 4px 0 var(--ink)}
  .search-box div{grid-template-columns:1fr}
  .search-box button{margin-top:8px}
  .search-layout{margin-top:14px}
  .preview-panel .panel-title{flex-direction:column}
  .preview-panel .panel-actions{max-width:none}
  .code-preview{min-height:330px;font-size:.68rem}
  .ai-actions{grid-template-columns:1fr}
  .source-strip{height:310px}
  .source-strip article{width:78vw;padding:1.4rem}
  .source-caption{left:.65rem;bottom:.65rem;font-size:.5rem}
  .vibes-stats{grid-template-columns:1fr 1fr}
  .stat-box{padding:1.2rem}
  .footer-bottom{align-items:flex-start;flex-direction:column}
}

@media(max-width:390px){
  .nav-actions{gap:5px}
  .install-btn{display:none!important}
  .hero-chip{font-size:.52rem}
  .hero h1{font-size:clamp(2.7rem,16vw,4.2rem)}
  .toolbar-actions{grid-template-columns:1fr}
  .panel-title{flex-direction:column}
  .panel-actions{max-width:none}
  .output-tabs{grid-template-columns:1fr}
  .output-tabs button:last-child{grid-column:auto}
  .output-meta{grid-template-columns:1fr}
  .vibes-stats{grid-template-columns:1fr}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .reveal{opacity:1;transform:none}
}


/* ─── V50 MODERN VERTICAL SCROLL SYSTEM ─────────────────────────────── */
:root{
  --scroll-track:#eadfce;
  --scroll-thumb:var(--clay);
  --scroll-thumb-2:var(--yellow);
  --scroll-border:var(--ink);
  --page-scroll:0;
}

/* Standards-based fallback: Firefox and modern Chromium. */
*{
  scrollbar-width:thin;
  scrollbar-color:var(--scroll-thumb,var(--clay)) var(--scroll-track,#eadfce);
}
html{
  scrollbar-gutter:stable;
  scrollbar-width:auto;
  scrollbar-color:var(--clay) #e8dccb;
}

/* Chromium / Safari detail styling. The native scrollbar remains usable. */
*::-webkit-scrollbar{width:12px;height:12px}
*::-webkit-scrollbar-track{
  background:
    repeating-linear-gradient(180deg,rgba(23,23,23,.10) 0 2px,transparent 2px 12px),
    var(--scroll-track,#eadfce);
  box-shadow:inset 0 0 0 2px var(--scroll-border,var(--ink));
}
*::-webkit-scrollbar-thumb{
  min-height:46px;
  border:2px solid var(--scroll-border,var(--ink));
  background:
    linear-gradient(180deg,var(--scroll-thumb,var(--clay)) 0 58%,var(--scroll-thumb-2,var(--yellow)) 58% 100%);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.24),3px 0 0 rgba(23,23,23,.16);
}
*::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,var(--yellow) 0 44%,var(--clay) 44% 78%,var(--green) 78% 100%);
}
*::-webkit-scrollbar-thumb:active{
  background:linear-gradient(180deg,var(--cyan),var(--clay));
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.34);
}
*::-webkit-scrollbar-corner{background:var(--ink)}

html::-webkit-scrollbar{width:18px}
html::-webkit-scrollbar-track{
  border-left:3px solid var(--ink);
  background:
    repeating-linear-gradient(180deg,rgba(23,23,23,.18) 0 2px,transparent 2px 14px),
    linear-gradient(90deg,#f5f0e8,#e9dcc9);
  box-shadow:inset 4px 0 0 rgba(255,107,53,.20);
}
html::-webkit-scrollbar-thumb{
  min-height:82px;
  border:3px solid var(--ink);
  background:
    linear-gradient(180deg,var(--clay) 0 52%,var(--yellow) 52% 78%,var(--green) 78% 100%);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.32),-3px 0 0 rgba(23,23,23,.12);
}
html::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg,var(--cyan) 0 28%,var(--clay) 28% 72%,var(--yellow) 72% 100%);
}

/* Dark, code-oriented scroll surfaces receive a dedicated terminal palette. */
.editor-frame textarea,
.output-console,
.code-preview,
#stdinInput,
#aiPrompt,
.ai-answer{
  --scroll-track:#071014;
  --scroll-thumb:var(--cyan);
  --scroll-thumb-2:var(--clay);
  --scroll-border:#26383d;
  scrollbar-gutter:stable;
}
.search-results,
.runtime-fields textarea,
.search-controls,
.preview-panel{
  scrollbar-gutter:stable;
}
.source-strip{
  --scroll-track:var(--ink);
  --scroll-thumb:var(--clay);
  --scroll-thumb-2:var(--yellow);
  --scroll-border:var(--cream);
}

/* Scroll surfaces briefly glow while they are actively moving. */
.editor-frame textarea.scroll-active,
.output-console.scroll-active,
.code-preview.scroll-active,
.search-results.scroll-active,
#stdinInput.scroll-active,
#aiPrompt.scroll-active{
  outline:2px solid rgba(30,202,211,.58);
  outline-offset:-4px;
  box-shadow:inset -8px 0 20px rgba(30,202,211,.08);
}

/* Fixed vertical progress navigator: decorative only, never blocks pointer input. */
.scroll-orbit{
  position:fixed;
  top:94px;
  right:28px;
  bottom:26px;
  z-index:94;
  display:grid;
  grid-template-rows:auto minmax(110px,1fr) auto auto;
  justify-items:center;
  gap:8px;
  width:34px;
  pointer-events:none;
  color:var(--ink);
  filter:drop-shadow(3px 3px 0 rgba(23,23,23,.16));
}
.scroll-orbit-label{
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  padding:.42rem .25rem;
  border:2px solid var(--ink);
  background:var(--paper);
  font-size:.49rem;
  font-weight:950;
  letter-spacing:.16em;
}
.scroll-orbit-track{
  position:relative;
  width:10px;
  height:100%;
  min-height:120px;
  overflow:visible;
  border:2px solid var(--ink);
  background:repeating-linear-gradient(180deg,var(--paper) 0 8px,#d8ccba 8px 10px);
}
.scroll-orbit-fill{
  position:absolute;
  inset:0;
  transform:scaleY(var(--page-scroll));
  transform-origin:50% 0;
  background:linear-gradient(180deg,var(--clay),var(--yellow) 48%,var(--green));
  transition:transform .08s linear;
}
.scroll-orbit-thumb{
  position:absolute;
  left:50%;
  top:0;
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  transform:translate(-50%,-50%) rotate(0deg);
  border:2px solid var(--ink);
  background:var(--clay);
  color:#fff;
  font-size:.62rem;
  box-shadow:3px 3px 0 var(--ink);
  transition:top .08s linear,transform .08s linear,background .18s;
}
.scroll-orbit-section,
.scroll-orbit-percent{
  min-width:34px;
  padding:3px 4px;
  border:2px solid var(--ink);
  background:var(--yellow);
  font-size:.47rem;
  font-weight:950;
  text-align:center;
  letter-spacing:.04em;
}
.scroll-orbit-percent{background:var(--ink);color:#fff}
body.is-page-scrolling .scroll-orbit-thumb{
  background:var(--cyan);
  animation:scroll-spark .55s steps(2,end) infinite alternate;
}
@keyframes scroll-spark{
  to{box-shadow:5px 5px 0 var(--clay),0 0 0 5px rgba(30,202,211,.16)}
}

@media(max-width:1180px){
  .scroll-orbit{right:20px;width:28px}
  .scroll-orbit-label,.scroll-orbit-section{display:none}
}
@media(max-width:620px){
  html{scrollbar-gutter:auto;scrollbar-width:thin}
  html::-webkit-scrollbar{width:10px}
  html::-webkit-scrollbar-track{border-left:2px solid var(--ink)}
  html::-webkit-scrollbar-thumb{min-height:58px;border-width:2px}
  *::-webkit-scrollbar{width:9px;height:9px}
  .scroll-orbit{
    top:76px;
    right:8px;
    bottom:14px;
    width:16px;
    grid-template-rows:minmax(90px,1fr) auto;
    gap:5px;
    filter:none;
  }
  .scroll-orbit-track{width:6px;border-width:1px}
  .scroll-orbit-thumb{width:16px;height:16px;border-width:1px;box-shadow:2px 2px 0 var(--ink);font-size:.42rem}
  .scroll-orbit-percent{min-width:0;padding:2px;border-width:1px;font-size:.38rem}
}
@media(prefers-reduced-motion:reduce){
  .scroll-orbit-fill,.scroll-orbit-thumb{transition:none!important}
  body.is-page-scrolling .scroll-orbit-thumb{animation:none!important}
}


/* ─── V50 ACCURATE SEARCH + VERIFIED RECIPE EXPERIENCE ───────────── */
.search-stats{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px}
.search-stats .index-stat{min-width:150px}
.verified-stat{background:var(--yellow);box-shadow:6px 6px 0 var(--ink)}
.verified-stat strong{color:#7d2f18}
.search-controls{grid-template-columns:minmax(360px,1.5fr) minmax(170px,.36fr) minmax(140px,.28fr) minmax(170px,.36fr)}
.search-box{position:relative}
.search-input-wrap{position:relative;min-width:0}
.search-input-row{display:grid;grid-template-columns:minmax(0,1fr) auto}
.search-input-row input{padding-right:1rem}
.search-suggestions{position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:90;max-height:330px;overflow:auto;border:3px solid var(--ink);background:var(--paper);box-shadow:7px 7px 0 var(--ink)}
.search-suggestions button{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;width:100%;min-height:46px;padding:9px 12px;border:0;border-bottom:1px solid rgba(23,23,23,.22);background:var(--paper);color:var(--ink);box-shadow:none;text-align:left;text-transform:none}
.search-suggestions button:hover,.search-suggestions button.active{transform:none;background:#f2d9ca;box-shadow:inset 6px 0 0 var(--clay)}
.search-suggestions .suggest-icon{font-size:1rem;color:var(--clay)}
.search-suggestions .suggest-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.7rem;font-weight:800}
.search-suggestions .suggest-meta{font-size:.52rem;letter-spacing:.08em;opacity:.55;text-transform:uppercase}
.popular-searches{grid-column:1/-1;display:flex;align-items:center;gap:7px;overflow:auto;padding-top:3px;scrollbar-width:thin}
.popular-searches>span{flex:none;font-size:.57rem;font-weight:950;letter-spacing:.1em;text-transform:uppercase}
.popular-searches button{flex:none;min-height:30px;padding:.35rem .58rem;background:rgba(255,255,255,.44);box-shadow:2px 2px 0 var(--ink);font-size:.55rem}
.result-card.recipe-result{background:#fffaf1}
.result-card.recipe-result:hover,.result-card.recipe-result.active{background:#f6dfb6;border-left-color:var(--green)}
.result-card.source-result{background:#f1eee8}
.result-kind{display:inline-flex;align-items:center;gap:5px;padding:3px 6px;border:1px solid var(--ink);background:var(--green);font-size:.51rem;font-weight:950;letter-spacing:.06em;text-transform:uppercase}
.result-kind.source{background:#ded7ce;color:#4b4742}
.result-kind::before{content:'✓';font-weight:950}
.result-kind.source::before{content:'↗'}
.result-score{white-space:nowrap}
.preview-badges{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-top:7px}
.trust-badge,.code-meta{display:inline-flex;padding:4px 7px;border:1px solid var(--ink);font-size:.52rem;font-weight:950;letter-spacing:.08em;text-transform:uppercase}
.trust-badge.verified{background:var(--green)}
.trust-badge.reference{background:#ded7ce;color:#5f5a54}
.trust-badge.neutral{background:var(--paper)}
.code-meta{background:var(--yellow)}
.expected-panel{position:relative;z-index:5;border-top:3px solid var(--ink);background:var(--yellow)}
.expected-panel>span{display:block;padding:7px 12px;border-bottom:2px solid var(--ink);font-size:.56rem;font-weight:950;letter-spacing:.11em}
.expected-panel pre{max-height:150px;margin:0;padding:12px;overflow:auto;background:#fff9e8;font:700 .67rem/1.55 ui-monospace,monospace;white-space:pre-wrap}
#verifyCodeBtn{background:var(--green)}
.panel-actions{flex-wrap:wrap;justify-content:flex-end}
.search-view .panel-title{align-items:flex-start}
.search-confidence{font-size:.58rem;font-weight:900;color:#7d2f18}
@media(max-width:1100px){
  .search-controls{grid-template-columns:minmax(0,1fr) 1fr 1fr}
  .search-box{grid-column:1/-1}
  .repo-filter{grid-column:auto}
}
@media(max-width:760px){
  .search-stats{justify-content:flex-start}
  .search-stats .index-stat{min-width:0;flex:1}
  .search-controls{grid-template-columns:1fr}
  .search-box,.repo-filter{grid-column:auto}
  .search-input-row{grid-template-columns:1fr}
  .search-input-row button{margin-top:8px}
  .popular-searches{padding-bottom:4px}
  .search-suggestions{position:fixed;left:10px;right:10px;top:auto;bottom:12px;max-height:48vh;box-shadow:6px 6px 0 var(--ink)}
  .panel-actions{width:100%;justify-content:stretch}
  .panel-actions button{flex:1 1 120px}
}
