:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;background:#0b111a;color:#e6edf5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button{font:inherit}.stage{position:relative;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;padding:28px 18px 40px;background:radial-gradient(circle at 50% 14%,rgba(91,157,255,.12),transparent 60%),#0b111a;overflow:hidden}.title{text-align:center;transition:opacity .6s ease}.back-btn{position:absolute;top:18px;left:18px;z-index:8;display:inline-flex;align-items:center;gap:6px;padding:8px 14px 8px 11px;border-radius:12px;border:1px solid rgba(120,140,170,.3);background:#101824b3;color:#cdd7e4;font-size:14px;font-weight:550;cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:border-color .2s,background .2s,transform .12s,color .2s}.back-btn:hover{transform:translateY(-1px);border-color:#5b9dff;color:#e6edf5}.back-btn svg{display:block}.title h1{margin:0 0 6px;font-size:clamp(22px,4vw,32px);font-weight:650;letter-spacing:.5px}.title p{margin:0;color:#8aa0b6;font-size:14px}.grid-area{position:relative;width:min(74vmin,560px);height:min(74vmin,560px)}.mood-grid{position:absolute;inset:0;border-radius:22px;border:1px solid rgba(120,140,170,.28);background:radial-gradient(circle at 0% 0%,rgba(239,68,68,.2),transparent 62%),radial-gradient(circle at 100% 0%,rgba(245,158,11,.2),transparent 62%),radial-gradient(circle at 0% 100%,rgba(59,130,246,.18),transparent 62%),radial-gradient(circle at 100% 100%,rgba(34,197,94,.18),transparent 62%),#0e162299;box-shadow:inset 0 0 60px #00000059;transition:opacity .7s ease}.axis-line{position:absolute;background:#96aac838}.ax-h{left:6%;right:6%;top:50%;height:1px}.ax-v{top:6%;bottom:6%;left:50%;width:1px}.quad{position:absolute;font-size:13px;font-weight:600;letter-spacing:.5px;color:#e1ebf5d1;pointer-events:none}.q-tl{top:14px;left:16px}.q-tr{top:14px;right:16px}.q-bl{bottom:14px;left:16px}.q-br{bottom:14px;right:16px}.ax-cap{position:absolute;font-size:11px;color:#7f93a8;pointer-events:none}.ax-top{top:6px;left:50%;transform:translate(-50%)}.ax-bottom{bottom:6px;left:50%;transform:translate(-50%)}.ax-left{left:8px;top:50%;transform:translateY(-50%) rotate(-90deg);transform-origin:left center}.ax-right{right:8px;top:50%;transform:translateY(-50%) rotate(90deg);transform-origin:right center}.avatar-wrap{position:absolute;transform:translate(-50%,-50%);transition:transform .85s cubic-bezier(.2,.8,.2,1),left .85s,top .85s;cursor:grab;touch-action:none;z-index:3}.avatar-wrap:active{cursor:grabbing}.avatar-react{will-change:transform}.avatar-canvas{display:block;width:auto;height:188px;filter:drop-shadow(0 10px 22px rgba(0,0,0,.45))}.stage.running .mood-grid,.stage.starting .mood-grid{opacity:0;pointer-events:none}.stage.running .quad,.stage.running .ax-cap,.stage.running .axis-line{opacity:0}.stage.running .avatar-wrap{transform:translate(-50%,-50%) scale(1.95);cursor:default}.dock{display:flex;flex-direction:column;align-items:center;gap:16px;z-index:4}.running-dock{flex-direction:row}.rest-presets{display:flex;gap:6px;align-items:center}.rest-chip{min-width:36px;padding:8px 10px;border-radius:10px;border:1px solid rgba(120,140,170,.3);background:#162130b3;color:#c7d4e2;font-size:13px;font-weight:550;cursor:pointer;transition:border-color .18s,background .18s,color .18s,transform .12s}.rest-chip:hover{transform:translateY(-1px);border-color:#5b9dff}.rest-chip.active{border-color:#5b9dff;background:#1f314feb;color:#fff}.animal-pick{display:flex;gap:10px}.animal-pick button{display:flex;flex-direction:column;align-items:center;gap:2px;width:64px;padding:8px 4px;border-radius:14px;border:1px solid rgba(120,140,170,.25);background:#141e2cb3;color:#c7d4e2;font-size:12px;cursor:pointer;transition:border-color .2s,transform .12s,background .2s}.animal-pick button .a-emoji{font-size:24px}.animal-pick button:hover{transform:translateY(-2px)}.animal-pick button.active{border-color:#5b9dff;background:#1f314fe6;color:#fff}.ctrl{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:14px;border:1px solid rgba(120,140,170,.3);background:#162130d9;color:#e6edf5;font-size:15px;font-weight:550;cursor:pointer;transition:border-color .2s,background .2s,transform .12s}.ctrl:hover{transform:translateY(-1px);border-color:#5b9dff}.ctrl:disabled{opacity:.55;cursor:default;transform:none}.ctrl.primary{background:linear-gradient(180deg,#3b82f6,#2563eb);border-color:transparent;padding:12px 34px;font-size:16px}.ctrl.primary.start-ctrl{position:relative;min-width:172px;justify-content:center;overflow:hidden;isolation:isolate}.start-progress-fill{position:absolute;inset:0 auto 0 0;background:#ffffff38;transition:width .32s ease;z-index:0;pointer-events:none}.start-content{position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px}.start-ctrl.loading{background:#1f3756b8;border-color:#7bb4ff59}.start-ctrl.loading:disabled{opacity:.82;color:#e6edf5d1}.start-ctrl.ready .start-progress-fill{background:#ffffff1f}.hint-error{position:absolute;bottom:14px;color:#f3a26b;font-size:12px}.hidden-video{position:absolute;width:2px;height:2px;opacity:0;pointer-events:none;left:-10px;top:-10px}.climb-stage{position:absolute;inset:0;overflow:hidden;transition:filter 1.6s ease,background 2s ease}.climb-stage.is-rest{filter:saturate(.85) brightness(.96)}.climb-canvas{position:absolute;inset:0;display:block}.climb-back{z-index:0}.climb-front{z-index:3;pointer-events:none}.climb-character{position:absolute;left:44%;top:49%;transform:translate(-50%,-50%);z-index:2;display:flex;flex-direction:column;align-items:center;will-change:transform;animation:climbBob 3.2s ease-in-out infinite}.climb-stage.is-rest .climb-character{animation:restBreathe 4.5s ease-in-out infinite}.climb-character .avatar-canvas{width:auto;height:340px}@keyframes climbBob{0%,to{transform:translate(-50%,-50%) translateY(0) rotate(-1deg)}50%{transform:translate(-50%,-50%) translateY(-2px) rotate(1deg)}}@keyframes restBreathe{0%,to{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.02)}}.rest-hint{position:absolute;top:18px;left:50%;transform:translate(-50%);z-index:5;padding:7px 16px;border-radius:999px;background:#0c121c99;border:1px solid rgba(150,170,200,.3);color:#dbe7f5;font-size:13px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.milestone-toast{position:absolute;top:26%;left:44%;transform:translate(-50%);z-index:6;display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 20px;border-radius:16px;background:#0e1622b8;border:1px solid rgba(123,180,255,.5);box-shadow:0 0 32px #7bb4ff59;text-align:center;pointer-events:none;animation:milestonePop 3.2s ease forwards}.milestone-toast strong{font-size:18px;color:#fff}.milestone-toast span{font-size:12px;color:#aebfd2}@keyframes milestonePop{0%{opacity:0;transform:translate(-50%) translateY(10px) scale(.9)}12%{opacity:1;transform:translate(-50%) translateY(0) scale(1)}82%{opacity:1;transform:translate(-50%) translateY(0) scale(1)}to{opacity:0;transform:translate(-50%) translateY(-12px) scale(.98)}}.stage.running .running-dock,.stage.starting .running-dock{position:absolute;bottom:24px;left:50%;transform:translate(-50%);z-index:7}.mode-select{display:flex;flex-direction:column;align-items:center;gap:28px}.brand-logo{width:min(300px,72vw);height:auto}.mode-cards{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}.mode-card{width:220px;min-height:230px;display:flex;flex-direction:column;align-items:center;gap:10px;padding:26px 20px;border-radius:20px;border:1px solid rgba(120,140,170,.28);background:#101824b3;color:#e6edf5;cursor:pointer;text-align:center;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.mode-card:hover{transform:translateY(-4px);border-color:#7bb4ffb3;box-shadow:0 14px 40px #0006,0 0 24px #7bb4ff2e}.mode-card strong{font-size:18px}.mode-card span{font-size:12.5px;line-height:1.5;color:#93a6bb}.mode-card-art{width:96px;height:96px;display:flex;align-items:center;justify-content:center;font-size:46px;border-radius:16px;background:#0a101a99;margin-bottom:4px}.mc-frame{width:52px;height:60px;border-radius:12px;border:3px solid #3dbe8b;box-shadow:0 0 16px #3dbe8b73}.focus-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0}.grid-area.simple{width:min(64vmin,460px);height:min(64vmin,460px)}.simple-dot-wrap{cursor:grab}.simple-dot{display:block;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 35% 32%,#cfe2ff,#5b9dff 70%);box-shadow:0 0 0 6px #5b9dff2e,0 6px 18px #00000073}