:root{--bg:#040608;--panel:#071116;--cyan:#18E2EF;--yellow:#F7C948;--fg:#F6F6F1;--muted:#94A3AA;--green:#A6FF3D;--red:#FF443D;--orange:#FF9800;--line:rgba(24,226,239,.28)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}body{min-width:320px}
.app-shell{min-height:100svh;padding:max(14px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));display:grid;place-items:center;position:relative;isolation:isolate;background:radial-gradient(circle at 50% 18%,rgba(24,226,239,.12),transparent 34%),radial-gradient(circle at 50% 72%,rgba(247,201,72,.08),transparent 36%),linear-gradient(180deg,#030506,var(--bg))}
.app-shell:before{content:"";position:fixed;inset:0;z-index:-2;background:linear-gradient(rgba(24,226,239,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(24,226,239,.035) 1px,transparent 1px);background-size:28px 28px;mask-image:radial-gradient(circle at 50% 45%,#000 0 62%,transparent 90%)}.app-shell:after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(246,246,241,.035) 0 1px,transparent 1px 7px);opacity:.18}.data-rail{position:fixed;top:12%;bottom:12%;width:min(118px,10vw);border:1px solid rgba(24,226,239,.1);opacity:.55;background:linear-gradient(180deg,transparent,rgba(24,226,239,.055),transparent)}.rail-left{left:2vw}.rail-right{right:2vw}
.console{width:min(860px,100%);border:1px solid rgba(24,226,239,.36);background:linear-gradient(180deg,rgba(7,17,22,.97),rgba(4,6,8,.98));box-shadow:0 0 0 1px rgba(24,226,239,.1),0 28px 80px rgba(0,0,0,.52),inset 0 0 48px rgba(24,226,239,.055);padding:clamp(14px,2.4vw,26px);position:relative;overflow:hidden}.console:before{content:"";position:absolute;inset:10px;border:1px solid rgba(246,246,241,.06);pointer-events:none}.console-header{display:flex;justify-content:space-between;gap:18px;align-items:start;position:relative;z-index:1}.eyebrow{margin:0 0 5px;color:var(--yellow);font:800 11px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.16em}.console h1{margin:0;color:var(--fg);font-size:clamp(32px,8vw,70px);line-height:.9;letter-spacing:0}.status-stack{display:grid;gap:7px;min-width:max-content;color:var(--muted);font:800 11px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace}.status-stack span{display:flex;gap:7px;align-items:center}.status-light{width:8px;height:8px;border-radius:50%;background:#3a4448;box-shadow:0 0 0 transparent}.is-online .light-server{background:var(--cyan);box-shadow:0 0 14px var(--cyan)}.is-online .light-groan,.is-approved .light-groan{background:var(--green);box-shadow:0 0 14px var(--green)}
.mascot-stage{display:grid;place-items:center;margin:4px 0 8px}.mascot{width:min(310px,72vw);height:auto;overflow:visible}.server-body,.face,.mustache,.status-dots circle,.brow,.pupil,.lid{transform-box:fill-box;transform-origin:center}.phase-boot .server-body{animation:wake .8s ease both}.phase-query .pupil{animation:scanEyes 1.2s ease-in-out infinite}.phase-search .pupil{animation:readRows .7s ease-in-out infinite}.is-approved .pupil-left,.is-approved .pupil-right{animation:eyeRoll 1.35s ease both}.is-approved .brow-left{animation:browLeft 1.35s ease both}.is-approved .brow-right{animation:browRight 1.35s ease both}.is-approved .lid{animation:dryBlink 1.35s ease both}.is-approved .mustache{animation:mustacheSigh 1.25s ease both}.dot-one{fill:var(--cyan)}.dot-two{fill:var(--yellow)}.dot-three{fill:var(--green)}.phase-search .status-dots circle{animation:pulse .65s ease-in-out infinite}.phase-search .dot-two{animation-delay:.12s}.phase-search .dot-three{animation-delay:.24s}
.query-panel{position:relative;z-index:1;border:1px solid rgba(24,226,239,.26);background:rgba(4,6,8,.48);padding:clamp(12px,2vw,18px)}.phase-text{margin:0 0 10px;color:var(--cyan);font:900 13px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em}.query{margin:0;min-height:98px;white-space:pre-wrap;color:var(--fg);font:800 clamp(11px,2.7vw,15px)/1.45 ui-monospace,SFMono-Regular,Consolas,monospace}.query:after{content:"";display:inline-block;width:8px;height:1em;background:var(--yellow);vertical-align:-2px;animation:cursor .8s steps(2,end) infinite}.progress-row{display:grid;grid-template-columns:74px minmax(0,1fr);gap:14px;align-items:center;margin-top:12px}.progress-ring{width:74px;height:74px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--cyan) var(--pct,0%),rgba(148,163,170,.2) 0);position:relative}.progress-ring:after{content:"";position:absolute;inset:9px;border-radius:50%;background:#050a0d}.progress-ring span{position:absolute;inset:0;display:grid;place-items:center;z-index:1;color:var(--fg);font:900 18px/1 ui-monospace,SFMono-Regular,Consolas,monospace}.progress-copy{min-width:0}.progress-copy p{margin:0 0 8px;color:var(--muted);font:900 12px/1.25 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.06em}.bar{height:10px;border:1px solid rgba(24,226,239,.3);background:rgba(246,246,241,.05);overflow:hidden}.bar span{display:block;width:var(--pct,0%);height:100%;background:linear-gradient(90deg,var(--cyan),var(--green));transition:width .22s ease}.phase-hold .progress-ring{background:conic-gradient(var(--yellow) var(--pct,99%),rgba(148,163,170,.2) 0)}.phase-found .progress-ring,.is-approved .progress-ring{background:conic-gradient(var(--green) var(--pct,100%),rgba(148,163,170,.2) 0)}.data-stream{display:grid;gap:4px;min-height:54px;margin-top:10px;color:rgba(148,163,170,.9);font:700 11px/1.15 ui-monospace,SFMono-Regular,Consolas,monospace}.data-stream span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-bottom:1px solid rgba(24,226,239,.09);padding-bottom:3px}
.diagnostics{display:none;margin-top:12px;border:1px solid rgba(247,201,72,.28);background:rgba(247,201,72,.045);padding:11px}.phase-found .diagnostics,.phase-result .diagnostics,.is-approved .diagnostics{display:block}.diagnostics dl{margin:0;display:grid;gap:7px}.diagnostics div{display:flex;justify-content:space-between;gap:16px;color:var(--muted);font:900 12px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace}.diagnostics dt,.diagnostics dd{margin:0}.diagnostics dd{color:var(--yellow);text-align:right}
.result-card{display:none;margin-top:12px;border:1px solid rgba(247,201,72,.48);background:linear-gradient(180deg,rgba(247,201,72,.09),rgba(7,17,22,.72));padding:clamp(15px,3vw,25px);text-align:center;box-shadow:inset 0 0 28px rgba(247,201,72,.055)}.phase-result .result-card,.is-approved .result-card{display:block;animation:cardIn .28s ease both}.result-label{margin:0 0 10px;color:var(--green);font:900 12px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.14em}.joke-setup{margin:0;color:var(--fg);font-size:clamp(22px,5.4vw,42px);line-height:1.04;font-weight:900;letter-spacing:0}.joke-punchline{margin:12px 0 0;color:var(--yellow);font-size:clamp(26px,6.5vw,54px);line-height:1.02;font-weight:900;letter-spacing:0}
.approval{display:none;text-align:center;margin-top:12px}.is-approved .approval{display:block;animation:cardIn .32s ease both}.approval p{margin:0 0 5px;color:var(--muted);font:900 12px/1 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.12em}.approval strong{color:var(--green);font-size:clamp(19px,4.8vw,34px);line-height:1;font-weight:900}.actions{display:grid;justify-items:center;gap:9px;margin-top:13px}.query-button,.buy-button{min-height:52px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;font:900 13px/1 Arial,Helvetica,sans-serif;text-decoration:none;letter-spacing:.04em;cursor:pointer;transition:transform .2s ease,filter .2s ease,opacity .24s ease,visibility .24s ease}.query-button{border:1px solid rgba(24,226,239,.66);background:#071116;color:var(--fg);padding:0 22px;opacity:0;visibility:hidden;pointer-events:none}.buy-button{display:none;width:min(340px,100%);background:var(--orange);border:1px solid rgba(255,152,0,.92);color:#120b00;padding:0 22px;opacity:0;visibility:hidden;pointer-events:none}.is-approved .query-button{opacity:1;visibility:visible;pointer-events:auto}.has-buy-link.is-approved .buy-button{display:inline-flex;opacity:1;visibility:visible;pointer-events:auto}.query-button:hover,.buy-button:hover{transform:translateY(-2px);filter:brightness(1.08)}.query-button:focus-visible,.buy-button:focus-visible{outline:2px solid var(--yellow);outline-offset:3px}
@keyframes cursor{50%{opacity:0}}@keyframes pulse{50%{opacity:.3}}@keyframes wake{0%{opacity:0;transform:translateY(14px) scale(.96)}100%{opacity:1;transform:none}}@keyframes scanEyes{50%{transform:translateX(7px)}}@keyframes readRows{25%{transform:translate(-6px,-2px)}60%{transform:translate(6px,3px)}}@keyframes eyeRoll{0%{transform:translate(0,0)}22%{transform:translate(0,-11px)}45%{transform:translate(6px,-10px)}70%{transform:translate(0,-10px)}85%{transform:translate(0,0)}100%{transform:translate(3px,-2px)}}@keyframes browLeft{25%,70%{transform:translateY(-5px) rotate(-5deg)}100%{transform:translateY(-2px)}}@keyframes browRight{25%,70%{transform:translateY(-5px) rotate(5deg)}100%{transform:translateY(-2px)}}@keyframes dryBlink{0%,70%,100%{opacity:0}78%,85%{opacity:1}}@keyframes mustacheSigh{55%{transform:translateY(3px)}100%{transform:translateY(1px)}}@keyframes cardIn{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:none}}
@media(max-width:700px){.data-rail{display:none}.app-shell{place-items:start center}.console{padding:12px}.console-header{display:grid}.status-stack{min-width:0}.mascot{width:min(250px,72vw)}.query{min-height:112px}.progress-row{grid-template-columns:66px minmax(0,1fr);gap:11px}.progress-ring{width:66px;height:66px}.joke-setup{font-size:clamp(22px,7vw,32px)}.joke-punchline{font-size:clamp(27px,8.4vw,39px)}}
@media(max-width:380px){.console h1{font-size:30px}.query{font-size:11px}.joke-setup{font-size:22px}.joke-punchline{font-size:27px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.phase-query .pupil,.phase-search .pupil,.is-approved .pupil-left,.is-approved .pupil-right{transform:translate(3px,-2px)}}