*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--bg: #06060f;--tile-bg: #0d0d1e;--tile-bd: #1b1b38;--cyan: #00e5ff;--cg: rgba(0, 229, 255, .12);--dim: #21213f;--mid: #4a4a8a;--bright: #c8c8f0;--red: #ff4466;--green: #44ffaa;--yellow: #ffcc00;--ts: clamp(72px, 10vw, 108px);--tg: clamp(7px, 1vw, 12px);--tf: clamp(12px, 1.5vw, 16px);--tl: clamp(5.5px, .8vw, 8.5px);--te: clamp(9px, 1.1vw, 12px)}body{background:var(--bg);color:var(--bright);font-family:Share Tech Mono,monospace;height:100dvh;display:flex;flex-direction:column;overflow:hidden;-webkit-user-select:none;user-select:none}#app{flex:1;display:flex;flex-direction:column;overflow:hidden;min-height:0}#hdr{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:10px 18px;border-bottom:1px solid var(--tile-bd);flex-shrink:0;gap:8px}#ttl{font-family:"Press Start 2P",monospace;font-size:clamp(7px,1.2vw,10px);letter-spacing:3px;color:var(--mid);white-space:nowrap;display:flex;align-items:center;gap:6px}#ttl .pi{color:var(--cyan);font-size:clamp(18px,2.5vw,26px);line-height:1}#ctrls{display:flex;align-items:center;gap:8px;flex-shrink:1;flex-wrap:wrap;max-width:100%}.ctrl-group{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.btn{font-family:"Press Start 2P",monospace;font-size:clamp(6px,1vw,8px);padding:5px 9px;border:1px solid var(--tile-bd);background:none;color:var(--mid);cursor:pointer;transition:all .15s;white-space:nowrap}.btn.on{border-color:var(--cyan);color:var(--cyan);background:var(--cg)}.btn.step-btn{border-color:var(--green);color:var(--green)}@media (hover: hover){.btn:hover{border-color:var(--cyan);color:var(--cyan)}.btn.step-btn:hover{background:#44ffaa14}}.sep{width:1px;height:22px;background:var(--tile-bd);flex-shrink:0}#info-bar{background:#07071a;border-bottom:1px solid var(--tile-bd);flex-shrink:0;overflow:hidden;transition:max-height .35s ease;max-height:340px}#info-bar.collapsed{max-height:0}#info-inner{padding:14px 22px 16px;display:grid;grid-template-columns:1fr auto;gap:10px 24px;align-items:start}#info-text{font-size:clamp(11px,1.4vw,14px);line-height:1.8;color:#8080b0;max-width:940px;user-select:text;-webkit-user-select:text;cursor:text}#info-text .pi-big{color:var(--cyan);font-size:1.5em;vertical-align:middle}#info-text strong{color:var(--cyan)}#info-text em{color:var(--bright);font-style:normal}#info-right{display:flex;flex-direction:column;gap:7px;align-items:flex-end;flex-shrink:0}.lang-btn{font-family:"Press Start 2P",monospace;font-size:7px;padding:5px 9px;border:1px solid var(--tile-bd);background:none;color:var(--mid);cursor:pointer;transition:all .15s}.lang-btn.on{border-color:var(--cyan);color:var(--cyan);background:var(--cg)}#info-close{font-family:"Press Start 2P",monospace;font-size:7px;padding:5px 9px;border:1px solid var(--tile-bd);background:none;color:var(--mid);cursor:pointer;transition:all .15s}@media (hover: hover){.lang-btn:hover{border-color:var(--cyan);color:var(--cyan)}#info-close:hover{border-color:var(--red);color:var(--red)}}#main{flex:1;display:flex;overflow:hidden;min-height:0}#prog-panel{width:clamp(170px,19vw,245px);flex-shrink:0;background:#040410;border-right:1px solid var(--tile-bd);display:flex;flex-direction:column;overflow:hidden;transition:width .3s ease,opacity .3s ease}#prog-panel.hidden{width:0!important;opacity:0;pointer-events:none}#prog-hdr{font-family:"Press Start 2P",monospace;font-size:clamp(7px,1.1vw,9px);letter-spacing:2px;color:var(--mid);padding:9px 12px;border-bottom:1px solid var(--tile-bd);flex-shrink:0;white-space:nowrap}#prog-list{flex:1;overflow-y:auto;overflow-x:hidden;padding:4px 0;scrollbar-width:thin;scrollbar-color:var(--dim) transparent}#scene-col{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;min-height:0}#prog-mobile{display:none;flex-shrink:0;background:#040410;border-bottom:1px solid var(--tile-bd);overflow:hidden;transition:max-height .3s ease;max-height:122px}#prog-mobile.hidden{max-height:0!important}#prog-mobile-list{overflow-y:hidden;padding:4px 0}.pl{display:flex;align-items:baseline;padding:3px 10px;gap:7px;font-size:clamp(10px,1.4vw,13px);color:var(--mid);white-space:nowrap;border-left:2px solid transparent;min-height:24px}.pl.sec{font-family:"Press Start 2P",monospace;font-size:clamp(4.5px,.75vw,6px);color:var(--dim);padding:7px 10px 2px;letter-spacing:1px;border:none;display:block;min-height:unset}.pl.active{background:#00e5ff12;border-left-color:var(--cyan)}.pl.active .op{color:var(--cyan)}.pl .ln{color:var(--dim);font-size:clamp(7px,.95vw,9px);min-width:22px;text-align:right;flex-shrink:0}.pl .op{color:var(--mid);min-width:clamp(62px,7.5vw,82px)}.pl .arg{color:var(--bright)}.pl.active .arg{color:var(--yellow)}#scene{flex:1;position:relative;overflow:hidden;background-image:radial-gradient(circle,#101030 1px,transparent 1px);background-size:28px 28px}#scene:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at center,transparent 30%,#06060f 100%);pointer-events:none;z-index:1}#floor{position:absolute;top:50%;left:50%;transform:translate(-50%,-52%);display:grid;grid-template-columns:repeat(5,var(--ts));grid-template-rows:repeat(3,var(--ts));gap:var(--tg);z-index:3}.tile{background:var(--tile-bg);border:1px solid var(--tile-bd);border-radius:2px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:5px 4px 4px;transition:border-color .18s,box-shadow .18s,background .18s;overflow:hidden}.tile.const-tile{border-color:#141428}.tile.phantom{visibility:hidden}.tile.active{border-color:var(--cyan);background:#080820;box-shadow:0 0 16px #00e5ff33,inset 0 0 8px #00e5ff0a}.tile.write{border-color:var(--green);background:#081a10;box-shadow:0 0 14px #44ffaa2e}.tile.bump{border-color:var(--yellow);background:#1a1400;box-shadow:0 0 14px #ffcc002e}.tlbl{font-family:"Press Start 2P",monospace;font-size:var(--tl);color:#4a4a7a;margin-bottom:4px;letter-spacing:1px;transition:color .18s;flex-shrink:0;text-align:center;width:100%}.tile.active .tlbl{color:var(--cyan)}.tile.write .tlbl{color:var(--green)}.tile.bump .tlbl{color:var(--yellow)}.tval-wrap{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}.tval-main{font-size:var(--tf);color:var(--mid);max-width:calc(var(--ts) - 8px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;transition:color .18s;display:block}.tval-exp{font-size:var(--te);color:#5a5a9a;text-align:center;transition:color .18s;display:block;letter-spacing:-.5px}.tile.active .tval-main,.tile.write .tval-main,.tile.bump .tval-main{color:var(--bright)}.tile.active .tval-exp,.tile.write .tval-exp,.tile.bump .tval-exp{color:#8080b0}@keyframes wflash{0%{color:var(--green);text-shadow:0 0 7px var(--green)}to{color:var(--bright);text-shadow:none}}@keyframes bflash{0%{color:var(--yellow);text-shadow:0 0 7px var(--yellow)}to{color:var(--bright);text-shadow:none}}.tval-main.flash{animation:wflash .45s ease-out forwards}.tval-main.bump-flash{animation:bflash .45s ease-out forwards}#outbox{position:static;transform:none;font-family:"Press Start 2P",monospace;font-size:clamp(6px,.9vw,8px);letter-spacing:1px;z-index:3;padding:7px 14px;border-radius:2px;cursor:pointer;transition:all .3s;-webkit-user-select:none;user-select:none;border:1px solid var(--tile-bd);background:var(--tile-bg);color:var(--mid)}#outbox.ls-on{border-color:var(--cyan);color:var(--cyan);background:var(--cg);box-shadow:0 0 14px #00e5ff59;animation:outpulse 1s ease-in-out infinite}@keyframes outpulse{50%{box-shadow:0 0 30px #00e5ffb3}}#outbox-wrap{position:absolute;bottom:32px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;z-index:3}.ls-tip{font-family:Share Tech Mono,monospace;font-size:clamp(8px,1vw,10px);color:var(--mid);background:#070715;border:1px solid var(--tile-bd);padding:3px 8px;border-radius:2px;white-space:nowrap;opacity:0;transition:opacity .2s;pointer-events:none}@media (hover: hover){#outbox:hover{border-color:var(--cyan);color:var(--cyan)}#outbox-wrap:hover .ls-tip{opacity:1}}#robot{position:absolute;z-index:10;pointer-events:none;width:clamp(28px,3.5vw,38px);height:clamp(28px,3.5vw,38px)}.rshadow{position:absolute;bottom:-4px;left:50%;width:80%;height:6px;background:#00000073;border-radius:50%;filter:blur(3px);animation:shadow-breathe 3.8s ease-in-out infinite}.rhead{position:relative;width:100%;height:100%;border-radius:50%;background:radial-gradient(circle at 38% 35%,#f2f2ff,#9090b8);box-shadow:0 0 12px #c8c8ff38,0 3px 7px #00000080;animation:float 3.8s ease-in-out infinite}.reye{position:absolute;width:27%;height:27%;background:var(--bg);border-radius:50%;top:31%;display:flex;align-items:center;justify-content:center;transform-origin:center;animation:eyeblink 5.5s ease-in-out infinite}.reye.l{left:13%}.reye.r{right:13%;animation-delay:.03s}.pupil{width:55%;height:55%;background:var(--cyan);border-radius:50%;transition:transform .25s ease;box-shadow:0 0 3px var(--cyan)}#hand{position:absolute;top:-34px;left:50%;transform:translate(-50%);font-family:Share Tech Mono,monospace;font-size:clamp(9px,1.2vw,12px);color:#000;background:var(--yellow);padding:3px 7px;border-radius:2px;display:none;white-space:nowrap;box-shadow:0 0 12px #ffcc008c;max-width:140px;overflow:hidden;text-overflow:ellipsis}#hand:after{content:"";position:absolute;bottom:-6px;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:var(--yellow);border-bottom:none}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes shadow-breathe{0%,to{transform:translate(-50%) scaleX(1);opacity:.45}50%{transform:translate(-50%) scaleX(.72);opacity:.22}}@keyframes eyeblink{0%,90%,to{transform:scaleY(1)}93%{transform:scaleY(.06)}96%{transform:scaleY(1)}}#robot.lightspeed .rhead{animation:radiate .7s ease-in-out infinite;box-shadow:0 0 30px #00e5ffe6,0 0 60px #00e5ff66}#robot.lightspeed .rshadow{animation:none;transform:translate(-50%)}#robot.lightspeed .reye{animation:none}@keyframes radiate{0%,to{box-shadow:0 0 20px #00e5ffb3,0 0 50px #00e5ff4d}50%{box-shadow:0 0 50px #00e5ff,0 0 100px #00e5ff99,0 0 140px #00e5ff33}}#robot.lightspeed .pupil{animation:pupilspin .4s linear infinite;background:#fff}@keyframes pupilspin{to{transform:rotate(360deg) translateY(-40%)}}.pd.ls-slide{animation:lsSlide .1s ease-out forwards}@keyframes lsSlide{0%{transform:translate(16px);opacity:0}to{transform:translate(0);opacity:1}}#status{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-family:"Press Start 2P",monospace;font-size:clamp(6px,.9vw,8px);letter-spacing:2px;color:var(--dim);z-index:5;transition:color .3s}#status.sortie{color:var(--green)}#status.raffine{color:var(--red)}#status.init{color:var(--yellow)}#status.check{color:var(--mid)}#status.ls{color:var(--cyan);animation:blink .5s step-start infinite}#status.paused{color:var(--yellow);animation:blink .8s step-start infinite}@keyframes blink{50%{opacity:.3}}#refine-badge{position:absolute;top:12px;left:14px;z-index:5;font-family:"Press Start 2P",monospace;font-size:clamp(5.5px,.8vw,7.5px);line-height:1.8;pointer-events:none}#rb-digit{color:#5a5a9a;display:block}#rb-refine{color:var(--red);display:block}.op-popup{position:absolute;z-index:25;display:flex;align-items:center;gap:9px;background:#06060ff0;border:1px solid var(--cyan);border-radius:3px;padding:6px 13px;pointer-events:none;font-size:clamp(12px,1.5vw,15px);white-space:nowrap;transition:opacity .15s;box-shadow:0 0 16px #00e5ff24;transform:translate(-50%)}.op-a,.op-b{color:var(--bright);transition:transform .2s ease,opacity .2s ease}.op-s{color:var(--cyan);font-size:1.15em;transition:opacity .2s ease}.op-result{color:var(--green);font-size:1.05em;opacity:0;transition:opacity .12s}.float-num{position:absolute;z-index:22;pointer-events:none;color:var(--yellow);font-family:Share Tech Mono,monospace;font-size:clamp(11px,1.3vw,14px);background:#06060fd1;padding:2px 6px;border-radius:2px;white-space:nowrap;transform:translate(-50%,-50%);box-shadow:0 0 8px #ffcc004d}#pi-strip{flex-shrink:0;height:clamp(56px,8vh,74px);background:#040410;border-top:1px solid var(--tile-bd);padding:0 16px;display:flex;align-items:center;gap:12px}#pi-eq{font-family:"Press Start 2P",monospace;font-size:clamp(11px,1.6vw,15px);color:var(--mid);flex-shrink:0}#pi-digits{font-size:clamp(19px,2.5vw,27px);white-space:nowrap;overflow-x:auto;flex:1;cursor:text;user-select:text;-webkit-user-select:text;scrollbar-width:thin;scrollbar-color:var(--dim) transparent;padding-bottom:3px}#pi-digits::-webkit-scrollbar{height:3px}#pi-digits::-webkit-scrollbar-thumb{background:var(--dim);border-radius:2px}.pd{display:inline-block;color:#2e2e58}.pd.dot{color:#4a4a7a}.pd.r5{color:#2a2a50}.pd.r4{color:#363670}.pd.r3{color:#4a4a90}.pd.r2{color:#7070b0}.pd.r1{color:var(--bright)}.pd.rn{color:var(--cyan);animation:dpop .5s ease-out forwards}@keyframes dpop{0%{transform:scale(1.5);color:#fff;text-shadow:0 0 14px var(--cyan)}to{transform:scale(1);color:var(--cyan);text-shadow:none}}#pi-right{flex-shrink:0;display:flex;flex-direction:column;align-items:flex-end;gap:5px}#pi-count{font-family:"Press Start 2P",monospace;font-size:clamp(6px,1vw,8px);color:var(--mid)}#copy-btn{font-family:"Press Start 2P",monospace;font-size:clamp(6px,1vw,8px);padding:5px 9px;border:1px solid var(--tile-bd);background:none;color:var(--mid);cursor:pointer;transition:all .15s}#copy-btn.copied{border-color:var(--green);color:var(--green)}@media (hover: hover){#copy-btn:hover{border-color:var(--cyan);color:var(--cyan)}}@media (max-width: 900px){#main{flex-direction:column}#info-bar{max-height:25dvh;overflow-y:auto}#prog-panel{display:flex!important;width:100%!important;border-right:none;border-bottom:1px solid var(--tile-bd);max-height:200px;transition:max-height .3s ease,opacity .3s ease}#prog-panel.hidden{max-height:0!important;width:100%!important;border-bottom-width:0}#prog-list{flex:none;height:128px}#prog-mobile{display:none!important}}@media (max-width: 720px){:root{--ts: clamp(52px, 14vw, 80px);--tf: clamp(11px, 2.8vw, 14px);--tl: clamp(4px, 1.2vw, 6px);--te: clamp(8px, 2vw, 11px)}}@media (max-width: 480px){#ttl{font-size:6px;letter-spacing:1px}#info-inner{grid-template-columns:1fr}#info-right{flex-direction:row;justify-content:flex-start;flex-wrap:wrap}}
