:root{color-scheme:dark;--bg:#07121c;--text:#ebf6fa;--muted:#a1b8c4;--border:#304553;--mint:#55eab8;--violet:#c49cf9;--round:16px}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}body{overflow-x:hidden}button,select,input{font:inherit}button{touch-action:manipulation;cursor:pointer}button:disabled{opacity:.55;cursor:progress}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #86ffe0;outline-offset:3px}[hidden]{display:none!important}a{color:#9cfbdd;text-decoration:none}.app-shell{min-height:100svh;display:flex;flex-direction:column}.topbar{height:68px;padding:0 clamp(16px,3vw,46px);display:flex;align-items:center;gap:18px;border-bottom:1px solid #29404b;position:relative;z-index:30;background:#081622}.logo{font-size:26px;font-weight:900;letter-spacing:-1.8px;color:#efffff}.logo span{color:var(--mint)}.logo i{display:inline-block;width:6px;height:6px;background:#c9b7fe;border-radius:50%;margin:0 0 14px 3px}.app-name{padding-left:17px;border-left:1px solid #35505c;display:flex;gap:3px;flex-direction:column}.app-name strong{font-size:14px}.app-name span{font-size:9px;letter-spacing:.18em;color:var(--muted);font-weight:700}.top-actions{margin-left:auto;display:flex;gap:14px;align-items:center}.live-indicator{color:#afc9d6;font-size:12px;white-space:nowrap}.icon-button{border:1px solid #38505c;background:#172b37;color:#e9f7fa;padding:10px 14px;border-radius:12px;font-size:14px;font-weight:700}.experience{width:100%;max-width:1720px;margin:auto;padding:clamp(8px,1.4vw,18px);flex:1;display:flex;flex-direction:column}.play-surface{position:relative;isolation:isolate;border:1px solid #2e5260;border-radius:23px;overflow:hidden;min-height:610px;height:calc(100svh - 126px);background:radial-gradient(ellipse 75% 64% at 50% 32%,#1d3c4c 0%,#102433 53%,#081521 100%);touch-action:none;box-shadow:0 21px 60px #0008}.play-surface #world{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1;touch-action:none}.play-surface.is-three #world{opacity:0}.three-mount{position:absolute;inset:0;z-index:0;pointer-events:none}.three-mount canvas{width:100%;height:100%;display:block}.ambient{position:absolute;width:260px;height:260px;filter:blur(90px);opacity:.19;pointer-events:none}.ambient-left{top:15%;left:-130px;background:#3ca6be}.ambient-right{bottom:10%;right:-130px;background:#d379cf}.game-heading{position:absolute;z-index:3;top:clamp(16px,2.8vw,38px);left:clamp(18px,3.4vw,50px);pointer-events:none;max-width:55%}.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:800;color:#a3c6ce}.tiny-spark{color:var(--mint);font-size:16px}.game-heading h1{margin:8px 0 5px;font-weight:800;letter-spacing:-.045em;font-size:clamp(24px,3.4vw,46px);line-height:1.04}.game-heading p{font-size:clamp(11px,1.25vw,14px);margin:0;color:#a9c5d1;line-height:1.45}.game-top-right{position:absolute;z-index:4;top:23px;right:26px;display:flex;align-items:center;gap:9px}.view-switch{display:flex;gap:2px;padding:4px;border-radius:13px;border:1px solid #476476;background:#0c2434da;backdrop-filter:blur(12px)}.view-switch button{border:0;background:transparent;color:#bbcfdb;border-radius:9px;font-size:13px;padding:8px 16px;font-weight:800;min-width:58px}.view-switch button.selected{background:#58e9c1;color:#07332c}.small-tag{font-size:11px;color:#a5becd;background:#0c2435c9;border-radius:10px;padding:9px;border:1px solid #315267;white-space:nowrap;max-width:210px;overflow:hidden;text-overflow:ellipsis}.challenge-pill{z-index:4;position:absolute;top:clamp(116px,13.5vw,151px);right:clamp(18px,3.4vw,50px);display:flex;align-items:center;gap:clamp(10px,1.4vw,24px);background:#0a1e2cde;padding:11px 18px;border-radius:16px;border:1px solid #365869;box-shadow:0 12px 28px #0006;backdrop-filter:blur(12px)}.challenge-pill>div:not(.stat-separator){display:flex;flex-direction:column;align-items:center;gap:3px;min-width:48px}.challenge-caption{font-size:9px;letter-spacing:.14em;color:#96b5c4;font-weight:800}.challenge-pill strong{font-size:clamp(19px,2.4vw,29px);line-height:1.1;font-variant-numeric:tabular-nums}.stat-separator{width:1px;height:30px;background:#3f5863}.challenge-pill div:nth-of-type(3) strong{color:#69f3c3}.camera-pip{position:absolute;bottom:clamp(116px,11vw,135px);left:clamp(12px,1.7vw,28px);width:clamp(146px,22vw,255px);z-index:6;border-radius:16px;overflow:hidden;border:1px solid #578a8b;box-shadow:0 15px 36px #0009;background:#0a202d}.pip-head{height:34px;padding:0 10px;display:flex;align-items:center;justify-content:space-between;color:#dcf6f0;font-size:11px;font-weight:700}.pip-head button{border:0;background:#203844;color:#e0fff4;border-radius:5px;padding:1px 9px;font-weight:800}.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#68efb8;margin-right:5px;box-shadow:0 0 8px #57d9b1}.cam{aspect-ratio:4/3;position:relative;background:#0b1925;overflow:hidden}.cam video,.cam canvas{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;transform:scaleX(-1)}.cam canvas{pointer-events:none}.cam-center{position:absolute;inset:0;display:grid;place-items:center;color:#a3c4ce;text-align:center;font-size:12px;padding:10px;line-height:1.6}.pip-action{width:100%;border:0;background:#4de4b8;color:#0c302a;min-height:35px;font-size:12px;font-weight:800}.camera-pip.minimized .cam,.camera-pip.minimized .pip-action{display:none}.camera-pip.minimized{width:150px}.view-tools{position:absolute;right:22px;bottom:clamp(124px,12.5vw,148px);z-index:5;display:flex;gap:5px;background:#0c2231df;padding:7px;border:1px solid #3f6875;border-radius:14px;backdrop-filter:blur(10px)}.view-tools button{background:#233b49;color:#cfe5ea;border:1px solid #39596b;padding:8px 10px;border-radius:9px;font-size:12px;font-weight:750;min-width:35px}.view-tools button.selected{color:#072b29;background:#5debc4;border-color:#5debc4}.game-bottom{position:absolute;z-index:4;left:50%;bottom:39px;transform:translateX(-50%);width:min(510px,70%);text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}.status-line{padding:8px 11px;border:1px solid #416170;background:#0a2132d9;border-radius:11px;font-size:12px;color:#c2dce7;line-height:1.35;backdrop-filter:blur(12px)}.accent-dot{display:inline-block;background:var(--mint);height:6px;width:6px;border-radius:50%;vertical-align:middle;margin-right:6px}.game-actions{display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap}.start-button{border:0;border-radius:13px;background:linear-gradient(105deg,#60edb9,#6ce8d4);box-shadow:0 7px 22px #25d8a838;color:#063229;font-size:15px;font-weight:850;padding:13px 22px;min-height:45px}.quiet-button{border:1px solid #4a6975;background:#123343e5;color:#d9f1f0;font-size:13px;font-weight:750;padding:12px 17px;border-radius:12px;min-height:45px}.progress-track{height:5px;border-radius:15px;background:#385263;width:min(380px,90%);overflow:hidden}.progress-fill{width:100%;height:100%;background:linear-gradient(90deg,#39f0aa,#c1b5ff);border-radius:15px;transition:width .14s linear}.stage-hint{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);z-index:4;font-size:10px;color:#9fb4c0;background:#0b2532a6;padding:5px 12px;border-radius:8px;max-width:90%;text-align:center;pointer-events:none}.physics-toast,.win-toast{position:absolute;z-index:7;top:185px;left:50%;transform:translateX(-50%);background:#153e46e8;padding:9px 13px;border:1px solid #76ddc9;border-radius:11px;color:#baf8e8;font-size:12px;pointer-events:none}.win-toast{font-size:23px;top:43%;font-weight:900;box-shadow:0 12px 26px #0008}.below{padding:9px 13px 3px;display:flex;justify-content:space-between;gap:15px;color:#7f9eac;font-size:10px;line-height:1.4}.below strong{color:#9fc5c7}.settings-drawer{position:fixed;z-index:101;right:0;top:0;height:100dvh;width:min(440px,100vw);overflow:auto;background:#0a1926;box-shadow:-18px 0 60px #000a;border-left:1px solid #385566;padding:24px;overscroll-behavior:contain}.scrim{position:fixed;inset:0;z-index:100;background:#02070bbd;backdrop-filter:blur(4px)}.drawer-head{display:flex;justify-content:space-between;align-items:start;border-bottom:1px solid #304857;padding-bottom:20px}.drawer-head h2{font-size:24px;letter-spacing:-.04em;margin:5px 0}.setting-section{padding:19px 0;border-bottom:1px solid #29404e}.setting-section h3{font-size:13px;margin:0 0 15px;display:flex;justify-content:space-between}.field{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#c4d8e0;margin:10px 0;font-size:13px}.field select{width:60%;border:1px solid #456273;background:#152c3b;color:#e4f6fa;padding:10px;border-radius:9px}.setting-btn{border:1px solid #4b6474;border-radius:9px;background:#193342;color:#e3f3f4;padding:10px 13px;margin:7px 8px 0 0;font-size:12px}.field-range{display:grid;grid-template-columns:95px 1fr 48px;align-items:center;gap:10px;margin:15px 0;font-size:12px;color:#bcd3dc}.field-range input{width:100%;accent-color:var(--mint)}.field-range output{text-align:right;font-size:11px;color:#98f5d4}.check{display:flex;gap:9px;align-items:center;padding:7px 0;color:#bcd3dc;font-size:12px}.check input{accent-color:#4fe5bd}.mjButtons{display:flex;gap:5px;flex-wrap:wrap}.mjButtons button{border:1px solid #466777;background:#1b3948;color:#d4eff2;border-radius:9px;padding:8px 11px}.mjButtons button.mjSelected{background:#5de8c3;color:#0b3229}.help-text{color:#92aeba;font-size:12px;line-height:1.5;margin-top:10px}.text-link{border:0;background:none;color:#a2e9d5;font-size:11px}.history-list{font-size:12px;color:#aac6d0;line-height:2}.history-row{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #213d49}.technical{margin:20px 0;color:#9bbac6;font-size:12px}.technical summary{cursor:pointer}.technical>div{padding-top:8px}.technical #err{color:#f4b499;white-space:pre-wrap;overflow-wrap:anywhere;margin-top:8px}.diag{padding-top:10px}.safety-note{padding:17px;background:#132c35;border:1px solid #39616b;border-radius:12px;font-size:12px;color:#aac7cc;line-height:1.6;margin-bottom:25px}.safety-note strong{color:#e4f7ed}.safety-note p{margin:8px 0 0}.results-backdrop{position:fixed;inset:0;z-index:110;background:#01080bdc;display:flex;align-items:center;justify-content:center;padding:20px}.results-card{width:min(410px,100%);padding:30px 25px;border-radius:25px;border:1px solid #4c766d;text-align:center;background:radial-gradient(circle at 50% 0,#265652,#102832 66%);box-shadow:0 28px 70px #000c}.results-spark{font-size:40px;color:#7cf5c7}.results-card h2{font-size:35px;letter-spacing:-.04em;margin:6px}.results-big{display:flex;flex-direction:column}.results-big strong{font-size:82px;color:#7effcf;line-height:1.05}.results-big span{font-size:13px;color:#b8d6d3}.results-card>p:not(.eyebrow){font-size:13px;color:#afc9cd;line-height:1.5}.results-stats{display:flex;justify-content:space-around;padding:16px;border:1px solid #3b656e;border-radius:12px;margin:20px 0}.results-stats div{display:flex;flex-direction:column;gap:5px}.results-stats span{font-size:11px;color:#9db9c4}.results-stats strong{font-size:20px}.results-card button{margin:5px}
@media(max-width:950px){.play-surface{height:calc(100svh - 116px)}.game-heading{max-width:54%}.game-top-right{top:17px;right:15px}.challenge-pill{right:18px;top:125px}.game-bottom{width:min(440px,65%)}.camera-pip{width:178px}}
@media(max-width:640px){.topbar{height:57px;padding:0 13px;gap:10px}.logo{font-size:23px}.app-name{padding-left:10px}.app-name strong{font-size:12px}.top-actions{gap:5px}.icon-button{padding:8px 10px;font-size:13px}.icon-button span{display:none}.live-indicator{max-width:100px;overflow:hidden;text-overflow:ellipsis;font-size:10px}.experience{padding:5px}.play-surface{min-height:500px;height:calc(100svh - 91px);border-radius:17px}.game-heading{top:12px;left:13px;max-width:60%}.game-heading h1{font-size:clamp(19px,5.2vw,28px);margin:5px 0 4px}.game-heading p{font-size:10px;max-width:215px}.eyebrow{font-size:8px}.game-top-right{top:10px;right:8px;flex-direction:column;align-items:end;gap:4px}.view-switch button{padding:7px 9px;min-width:45px}.small-tag{font-size:9px;padding:5px 7px;max-width:106px}.challenge-pill{top:100px;right:10px;padding:8px 10px;gap:9px;border-radius:11px}.challenge-pill strong{font-size:20px}.challenge-caption{font-size:8px}.challenge-pill>div:not(.stat-separator){min-width:32px}.stat-separator{height:25px}.camera-pip{width:130px;left:8px;bottom:151px;border-radius:10px}.pip-head{height:26px;padding:0 7px;font-size:9px}.pip-action{font-size:10px;min-height:30px}.cam-center{font-size:9px}.game-bottom{width:94%;bottom:35px;gap:8px}.status-line{font-size:10px;max-width:94%;padding:6px 8px}.start-button{font-size:13px;min-height:41px;padding:11px 15px}.quiet-button{font-size:11px;min-height:41px;padding:10px 12px}.stage-hint{font-size:9px;bottom:9px;width:96%}.view-tools{right:8px;bottom:151px;padding:4px;gap:3px;flex-wrap:wrap;justify-content:flex-end;max-width:205px}.view-tools button{padding:7px 8px;font-size:10px}.below{padding:8px 9px;flex-direction:column;gap:4px;font-size:9px}.physics-toast{top:163px;max-width:75%}}
@media(max-width:370px){.app-name span{display:none}.camera-pip{width:112px}.view-tools{max-width:178px}.view-tools button{padding:6px}.challenge-pill{top:89px}.game-heading h1{font-size:18px}.game-heading p{font-size:9px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Unobstructed interaction zone: the webcam sits above the physics floor. */
.camera-pip{top:clamp(195px,28%,265px);bottom:auto}
@media(max-width:640px){.camera-pip{top:clamp(218px,30%,258px);bottom:auto}}

/* Keep the translucent HUD from intercepting object drag gestures. */
.game-bottom{pointer-events:none}
.game-actions button{pointer-events:auto}

/* Put orbit and view controls above the active drop zone. */
.view-tools{top:clamp(230px,32%,310px);bottom:auto}
@media(max-width:640px){.view-tools{top:clamp(235px,31%,270px);bottom:auto}}
