:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{min-height:100vh;background:#0b0e14;color:#e8e8e8;overflow-x:hidden}.game-root{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:1.5rem 1rem 2rem;gap:1rem}.game-header{text-align:center;max-width:400px}.game-header h1{font-size:1.35rem;font-weight:700;letter-spacing:-.02em;background:linear-gradient(135deg,#60a5fa,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.instruction{font-size:.82rem;color:#ffffff80;margin-top:.3rem}.hud{display:flex;justify-content:center;gap:1.5rem;margin-top:.6rem;font-size:.85rem;font-weight:600}.score{color:#4ade80}.timer{color:#60a5fa;min-width:2.5rem;text-align:center}.timer.urgent{color:#f87171;animation:pulse .5s ease infinite alternate}@keyframes pulse{to{transform:scale(1.2)}}.phone-area{flex:1;display:flex;align-items:center;justify-content:center}.phone{position:relative;width:260px;height:500px;border-radius:36px;background:#1a1a2e;box-shadow:0 0 0 3px #2a2a4a,0 0 0 6px #111128,0 20px 60px #0009,inset 0 1px #ffffff0d;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;touch-action:none}.phone-bezel{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:36px;border:2px solid rgba(255,255,255,.06);pointer-events:none}.phone-notch{position:absolute;top:8px;left:50%;transform:translate(-50%);width:60px;height:6px;background:#111128;border-radius:3px;z-index:10}.phone-screen{position:relative;width:220px;height:420px;border-radius:20px;overflow:hidden;background:#0f1629}.phone-home{position:absolute;bottom:10px;left:50%;transform:translate(-50%);width:40px;height:40px;border-radius:50%;border:2px solid rgba(255,255,255,.1)}.menu-content{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:.6rem;position:relative;padding:1.5rem;text-align:center}.cracked-glass{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,transparent 40%,rgba(255,255,255,.03) 41%,transparent 42%),linear-gradient(225deg,transparent 35%,rgba(255,255,255,.03) 36%,transparent 37%),linear-gradient(45deg,transparent 50%,rgba(255,255,255,.02) 51%,transparent 52%),linear-gradient(160deg,transparent 30%,rgba(255,255,255,.03) 31%,transparent 32%)}.cracked-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse at 30% 40%,rgba(255,50,50,.06) 0%,transparent 50%),radial-gradient(ellipse at 70% 60%,rgba(255,50,50,.04) 0%,transparent 50%)}.menu-content h2{font-size:1.3rem;font-weight:700;z-index:1;color:#fff}.menu-content p{font-size:.8rem;color:#ffffff80;z-index:1}.btn-primary{margin-top:.5rem;padding:.6rem 1.8rem;border:none;border-radius:999px;background:linear-gradient(135deg,#3b82f6,#8b5cf6);color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;z-index:1;transition:transform .15s,box-shadow .15s}.btn-primary:hover{transform:scale(1.05);box-shadow:0 4px 20px #6366f166}.btn-primary:active{transform:scale(.97)}.crack-dot{position:absolute;width:22px;height:22px;border-radius:50%;background:#ef4444b3;border:2px solid rgba(255,255,255,.3);cursor:pointer;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%);transition:background .2s,transform .2s;animation:crack-pulse 1.2s ease infinite;z-index:5}.crack-dot:hover{background:#ef4444e6;transform:translate(-50%,-50%) scale(1.15)}.crack-dot.tapped{background:#4ade8080;border-color:#4ade8099;animation:none;cursor:default;pointer-events:none}.crack-dot .check{font-size:.7rem;color:#fff;font-weight:700}@keyframes crack-pulse{0%,to{box-shadow:0 0 #ef444466}50%{box-shadow:0 0 0 8px #ef444400}}.shard{position:absolute;cursor:pointer;transition:opacity .3s,transform .3s;z-index:5}.shard.safe{background:linear-gradient(135deg,#93c5fd80,#c4b5fd66);border:1px solid rgba(255,255,255,.3);clip-path:polygon(10% 0%,100% 5%,90% 100%,0% 85%)}.shard.safe:hover{background:linear-gradient(135deg,#93c5fdcc,#c4b5fdb3);transform:scale(1.15)}.shard.trap{background:linear-gradient(135deg,#f8717180,#ef444466);border:1px solid rgba(255,100,100,.4);clip-path:polygon(5% 10%,95% 0%,100% 90%,15% 100%)}.shard.trap:hover{background:linear-gradient(135deg,#f87171cc,#ef4444b3)}.adhesive-phase{position:relative;width:100%;height:100%}.adhesive-bar{position:absolute;top:6px;left:10px;right:10px;height:6px;background:#ffffff1a;border-radius:3px;z-index:10}.adhesive-fill{height:100%;background:linear-gradient(90deg,#22c55e,#4ade80);border-radius:3px;transition:width .3s ease}.adhesive-dot{position:absolute;width:20px;height:20px;border-radius:50%;transform:translate(-50%,-50%);z-index:5;transition:all .2s}.adhesive-dot.active{background:#4ade80cc;border:2px solid #4ade80;box-shadow:0 0 12px #4ade8080;animation:adhesive-pulse .8s ease infinite}.adhesive-dot.done{background:#4ade804d;border:2px solid rgba(74,222,128,.4)}.adhesive-dot.pending{background:#ffffff1a;border:2px solid rgba(255,255,255,.15)}@keyframes adhesive-pulse{0%,to{box-shadow:0 0 #4ade8066}50%{box-shadow:0 0 0 10px #4ade8000}}.target-zone{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:190px;height:60px;border:2px dashed rgba(74,222,128,.4);border-radius:10px;display:flex;align-items:center;justify-content:center;animation:target-glow 1.5s ease infinite}.target-label{font-size:.7rem;color:#4ade8080;text-transform:uppercase;letter-spacing:.1em}@keyframes target-glow{0%,to{border-color:#4ade804d}50%{border-color:#4ade8099}}.new-screen{position:absolute;left:50%;transform:translate(-50%);width:190px;height:60px;background:linear-gradient(180deg,#1e293b,#0f172a);border:2px solid rgba(96,165,250,.5);border-radius:10px;cursor:grab;z-index:20;transition:box-shadow .2s;overflow:hidden}.new-screen.dragging{cursor:grabbing;box-shadow:0 0 20px #60a5fa66}.new-screen.placed{cursor:default;border-color:#4ade8099;box-shadow:0 0 20px #4ade804d;animation:screen-snap .3s ease}@keyframes screen-snap{0%{transform:translate(-50%) scale(1.05)}to{transform:translate(-50%) scale(1)}}.screen-shine{position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.08) 45%,rgba(255,255,255,.12) 50%,rgba(255,255,255,.08) 55%,transparent 60%);animation:shine-move 3s linear infinite}@keyframes shine-move{0%{transform:translate(-100%)}to{transform:translate(100%)}}.screw{position:absolute;width:28px;height:28px;border-radius:50%;background:#374151;border:2px solid #6b7280;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%);z-index:5;cursor:pointer;transition:all .2s}.screw.done{background:#22c55e;border-color:#4ade80;cursor:default}.screw-check{font-size:.7rem;color:#fff;font-weight:700}.screw-ring{position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:50%;border:2px solid rgba(96,165,250,.6);animation:screw-ring-pulse .8s ease infinite}@keyframes screw-ring-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.3);opacity:.3}}.timing-bar{position:absolute;bottom:15px;left:15px;right:15px;height:14px;background:#1e293b;border-radius:7px;border:1px solid rgba(255,255,255,.1);overflow:hidden;z-index:10}.timing-green{position:absolute;left:42%;width:16%;top:0;bottom:0;background:#4ade804d}.timing-indicator{position:absolute;top:-2px;width:4px;height:18px;background:#f87171;border-radius:2px;z-index:5;transition:left 16ms linear;box-shadow:0 0 6px #f8717199}.complete-content{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:.8rem;position:relative;padding:1.5rem;text-align:center}.repair-glow{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at center,rgba(74,222,128,.08) 0%,transparent 70%)}.quality-badge{font-size:1.8rem;font-weight:800;letter-spacing:-.02em;z-index:1;background:linear-gradient(135deg,#4ade80,#22d3ee);-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:badge-in .5s ease}@keyframes badge-in{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}.final-score{font-size:.9rem;color:#fff9;z-index:1}.complete-msg{font-size:.8rem;color:#ffffff73;z-index:1;max-width:180px}