.tdi-shell{position:relative;width:100%;height:100%;min-height:0;background:#04050b;overflow:hidden}
.tdi-stage{position:absolute;top:0;left:50%;width:1280px;height:720px;transform-origin:top center;background:#04050b;overflow:hidden;box-shadow:0 0 0 1px #2a3550,0 0 42px #000}
.tdi-stage canvas{display:block;width:1280px;height:720px;image-rendering:pixelated;touch-action:none;cursor:crosshair}
.tdi-scan{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.16) 0 1px,transparent 1px 3px);mix-blend-mode:multiply;z-index:2}
.tdi-overlay{position:absolute;inset:0;z-index:5;display:grid;place-items:center;background:radial-gradient(circle at 50% 40%,rgba(10,14,40,.55),rgba(2,2,8,.82));text-align:center}
.tdi-overlay[hidden]{display:none}
.tdi-overlay>div{width:min(620px,86%);padding:26px 30px;border:2px solid #5ee7ff;background:rgba(8,8,22,.92);box-shadow:8px 8px 0 #ff6fb5}
.tdi-overlay small{color:#ffd93a;font:900 12px "Courier New",monospace;letter-spacing:.08em}
.tdi-overlay h1{margin:10px 0 6px;color:#5ee7ff;font:900 76px/1 "Courier New",monospace;letter-spacing:.02em;text-shadow:4px 4px 0 #14227a}
.tdi-overlay h1 span{color:#ff6fb5;text-shadow:4px 4px 0 #7c0f52}
.tdi-overlay p{color:#c9d2e2;font:14px/1.55 "Courier New",monospace;margin:8px 0}
.tdi-overlay .tdi-note{color:#8d95ad;font-size:12px}
.tdi-overlay ul{list-style:none;margin:12px auto;padding:0;text-align:left;width:fit-content;color:#c9d2e2;font:13px/1.8 "Courier New",monospace}
.tdi-overlay li b{display:inline-block;min-width:64px;color:#ffd93a}
.tdi-overlay button,.tdi-controls button{cursor:pointer;padding:11px 18px;border:1px solid #5ee7ff;background:#0b2a33;color:#5ee7ff;font:900 13px "Courier New",monospace;letter-spacing:.06em}
.tdi-overlay button:hover,.tdi-controls button:hover{background:#5ee7ff;color:#05040a}
.tdi-controls{position:absolute;z-index:6;right:12px;bottom:40px;display:flex;gap:6px}
.tdi-controls button{padding:7px 10px;font-size:11px;background:rgba(5,8,18,.85)}
.tdi-controls button.active{border-color:#ff6fb5;color:#ff6fb5}
.tdi-banner{position:absolute;z-index:4;left:50%;top:150px;transform:translateX(-50%);text-align:center;pointer-events:none}
.tdi-banner[hidden]{display:none}
.tdi-banner b{display:block;color:#ffd93a;font:900 34px "Courier New",monospace;letter-spacing:.06em;text-shadow:3px 3px #7c0f52}
.tdi-banner span{display:block;margin-top:4px;color:#5ee7ff;font:900 14px "Courier New",monospace;letter-spacing:.12em;text-shadow:2px 2px #05040a}
.tdi-banner.on{animation:tdi-pop 2.2s both}
@keyframes tdi-pop{0%{opacity:0;transform:translate(-50%,16px) scale(.8)}12%,78%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-14px)}}
body.tdi-playing .workspace{padding:0;overflow:hidden}
@media(max-width:900px){.tdi-overlay h1{font-size:54px}.tdi-overlay ul{font-size:12px}}
@media(prefers-reduced-motion:reduce){.tdi-banner.on{animation:none}}

.tdi-endbtns{display:flex;gap:12px;justify-content:center;margin-top:10px}.tdi-overlay button.tdi-pick{background:#5ee7ff;color:#05040a}