:root{--bg: #0a0a0b;--bg-2: #0e0e10;--card: #141416;--card-2: #17171a;--border: #26262b;--border-hi: #33333a;--text: #ececf0;--muted: #83838f;--faint: #5a5a63;--accent: #5b8cff;--mono: ui-monospace, "SF Mono", "JetBrains Mono", "Roboto Mono", Menlo, Consolas, monospace;--sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;touch-action:none}#scene{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;touch-action:none;background:radial-gradient(120% 120% at 50% 0%,rgba(91,140,255,.05),transparent 55%),radial-gradient(120% 90% at 50% 120%,rgba(0,0,0,.6),transparent 60%),var(--bg)}#scene:before{content:"";position:absolute;top:-2px;right:-2px;bottom:-2px;left:-2px;background-image:radial-gradient(rgba(255,255,255,.045) 1px,transparent 1px);background-size:26px 26px;background-position:-1px -1px;pointer-events:none;z-index:0}#scene:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(130% 100% at 50% 45%,transparent 50%,rgba(0,0,0,.55) 100%);pointer-events:none;z-index:3}.card{position:absolute;top:0;left:0;width:244px;height:132px;will-change:transform;transform-style:preserve-3d;transform:translate3d(-9999px,-9999px,0);cursor:grab;touch-action:none;z-index:1;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}.card.lifted{cursor:grabbing;z-index:2}.card__inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .46s cubic-bezier(.2,.8,.2,1)}.card.flipped .card__inner{transform:rotateY(180deg)}.card__face{position:absolute;top:0;right:0;bottom:0;left:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:14px;border:1px solid var(--border);background:linear-gradient(180deg,var(--card-2),var(--card));box-shadow:0 1px #ffffff08 inset,0 10px 22px -14px #000000b3;padding:15px 16px;display:flex;flex-direction:column;overflow:hidden;transition:box-shadow .18s ease,border-color .18s ease}.card__face--back{transform:rotateY(180deg);background:linear-gradient(180deg,#101013,#0c0c0e);justify-content:center}.card.lifted .card__face{border-color:var(--border-hi);box-shadow:0 1px #ffffff0d inset,0 26px 44px -18px #000000d9,0 0 0 1px #5b8cff1f}.card__top{display:flex;align-items:center;gap:10px}.card__mono{flex:0 0 auto;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-family:var(--mono);font-size:13px;font-weight:600;color:var(--text);background:#1c1c20;border:1px solid var(--border-hi);letter-spacing:-.5px}.card__title{font-size:14.5px;font-weight:600;letter-spacing:-.1px;line-height:1.2;margin:0;display:flex;align-items:center;gap:7px}.card__dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px #5b8cff99;flex:0 0 auto}.card__meta{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px}.card__line{font-size:12.5px;color:var(--muted);line-height:1.35;margin:10px 0 0}.card__link{font-family:var(--mono);font-size:11px;color:var(--faint);text-decoration:none;border-bottom:1px solid transparent;transition:color .14s ease,border-color .14s ease;white-space:nowrap}.card__link:hover{color:var(--accent);border-color:#5b8cff66}.card__note{font-size:12.5px;color:var(--muted);line-height:1.5;margin:0}.card__note strong{color:var(--text);font-weight:600}.card__flip-hint{position:absolute;bottom:12px;left:16px;font-family:var(--mono);font-size:10px;color:var(--faint)}.card--live .card__face{border-color:#5b8cff47}.live-row{display:flex;gap:6px;margin-top:11px;align-items:center}.live-input{flex:1 1 auto;min-width:0;background:#0d0d0f;border:1px solid var(--border-hi);border-radius:8px;color:var(--text);font-family:var(--mono);font-size:11.5px;padding:6px 8px;outline:none}.live-input:focus{border-color:var(--accent)}.live-btn{flex:0 0 auto;background:var(--accent);color:#06070d;border:none;border-radius:8px;font-family:var(--mono);font-size:11.5px;font-weight:600;padding:6px 10px;cursor:pointer;transition:filter .14s ease,transform 80ms ease}.live-btn:hover{filter:brightness(1.08)}.live-btn:active{transform:translateY(1px)}.live-btn--ghost{background:#1c1c20;color:var(--text);border:1px solid var(--border-hi)}.live-count{font-family:var(--mono);font-size:10.5px;color:var(--faint);margin-top:8px}.card--spawned .card__face{border-style:dashed;border-color:#5b8cff66}.hud{position:fixed;left:calc(16px + env(safe-area-inset-left));bottom:calc(14px + env(safe-area-inset-bottom));z-index:5;font-family:var(--mono);font-size:11.5px;color:var(--faint);line-height:1.7;pointer-events:none;-webkit-user-select:none;user-select:none}.hud-controls{color:var(--muted)}.hud-engine{color:var(--faint)}#engine-line{color:var(--accent)}.hud-btn{pointer-events:auto;background:transparent;border:none;border-bottom:1px dotted var(--faint);color:var(--muted);font:inherit;padding:0;cursor:pointer}.hud-btn:hover,.hud.gravity-on .hud-btn{color:var(--accent);border-color:var(--accent)}.brand{position:fixed;right:calc(16px + env(safe-area-inset-right));bottom:calc(14px + env(safe-area-inset-bottom));z-index:5;font-family:var(--mono);font-size:11px;color:var(--faint);-webkit-user-select:none;user-select:none}.brand a{color:var(--muted);text-decoration:none;border-bottom:1px dotted var(--faint)}.brand a:hover{color:var(--accent);border-color:var(--accent)}#html-canvas{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1}.diag-error{display:none;position:fixed;left:0;right:0;bottom:0;z-index:9999;padding:8px calc(12px + env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));background:#180808f0;border-top:1px solid #ff6b6b;color:#ff9d9d;font-family:var(--mono);font-size:11px;line-height:1.5;letter-spacing:.02em;word-break:break-word;white-space:pre-wrap;cursor:pointer;pointer-events:auto;-webkit-tap-highlight-color:transparent}@media(max-width:560px),(max-height:480px){.card{width:188px;height:116px}.card__face{padding:12px 13px;border-radius:13px}.card__mono{width:26px;height:26px;border-radius:8px;font-size:12px}.card__title{font-size:13.5px}.card__line{font-size:11.5px;margin-top:8px}.card__note{font-size:11.5px}.brand{display:none}.hud{font-size:11px;line-height:1.6}.hud-btn{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border:1px solid var(--border-hi);border-bottom:1px solid var(--border-hi);border-radius:8px;vertical-align:middle}.live-input{font-size:16px;padding:8px 9px}.live-btn{font-size:13px;padding:8px 12px;min-height:34px}}@media(max-width:400px){.card{width:168px;height:108px}.card__line{font-size:11px;line-height:1.3}}@media(prefers-reduced-motion:reduce){.card__inner{transition-duration:0ms}}