:root{color:#f7f3df;font-synthesis:none;background:#0d211d;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 50% 0,#234d42 0,#102c26 45%,#091815 100%);min-width:320px;min-height:100dvh;margin:0}button{font:inherit}.spike-shell{width:min(1180px,100%);padding:max(18px,env(safe-area-inset-top)) max(clamp(10px,2.5vw,28px),env(safe-area-inset-right)) max(26px,env(safe-area-inset-bottom)) max(clamp(10px,2.5vw,28px),env(safe-area-inset-left));margin:0 auto}.experiment-notice{color:#fff2ca;background:#4b351ddd;border:1px solid #f1cc7766;border-radius:12px;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;padding:9px 12px;display:flex;box-shadow:0 8px 24px #0003}.experiment-notice strong{letter-spacing:.015em;font-size:.78rem}.experiment-notice span{color:#e1cda7;text-align:right;font-size:.7rem}.spike-header{justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:12px;display:flex}.spike-header h1{margin:2px 0 0;font-size:clamp(1.5rem,4vw,2.5rem);line-height:1}.eyebrow{letter-spacing:.14em;color:#b9d3c3;text-transform:uppercase;font-size:.68rem}.resources{gap:8px;display:flex}.resource{background:#102d27dd;border:1px solid #fff2;border-radius:14px;min-width:128px;padding:8px 12px;position:relative;box-shadow:0 8px 24px #0005}.resource span{color:#b8cec2;text-transform:uppercase;letter-spacing:.08em;font-size:.7rem;display:block}.resource strong{margin-top:2px;font-size:1.15rem;display:block}.resource em{color:#ffba83;font-style:normal;font-weight:800;animation:1.8s both delta-pop;position:absolute;bottom:-20px;right:8px}.resource.changed{animation:.8s resource-pulse}.game-frame{background:#98c8a8;border:1px solid #cfe9d744;border-radius:22px;overflow:hidden;box-shadow:0 22px 70px #0008}.world{aspect-ratio:5/3;touch-action:none;-webkit-user-select:none;user-select:none;background:linear-gradient(#a6d3bc 0 23%,#85b99c 23% 26%,#bcac83 26% 100%);width:100%;position:relative;overflow:hidden}.skyline{background:linear-gradient(#77b9d0,#c6e1d2);height:25%;position:absolute;inset:0 0 auto}.skyline span{clip-path:polygon(0 100%,16% 25%,34% 80%,53% 8%,75% 72%,100% 30%,100% 100%);opacity:.75;background:#789c84;width:16%;height:43%;position:absolute;bottom:0}.skyline span:nth-child(2){width:29%;left:33%}.skyline span:nth-child(3){width:30%;right:2%;transform:scaleX(-1)}.school{color:#61513b;text-align:center;letter-spacing:.15em;background:#d9c991;border:5px solid #5d655b;border-bottom-width:11px;width:30%;height:23%;padding-top:2%;font-size:clamp(.55rem,1.6vw,1rem);position:absolute;top:9%;left:7%;box-shadow:0 8px #0002}.school:before{content:"";clip-path:polygon(0 100%,50% 0,100% 100%);background:#704d3f;width:110%;height:24%;position:absolute;top:-20%;left:-5%}.school i{background:linear-gradient(135deg,#bde5e7,#6f9ca2);border:3px solid #715e48;width:17%;height:40%;margin:4% 3%;display:inline-block}.court-lines{pointer-events:none;border:3px solid #efe4bd99;border-radius:50%;position:absolute}.line-a{width:29%;height:48%;top:35%;left:33%}.line-b{border-radius:8px;width:21%;height:35%;top:39%;right:4%}.tree{width:8%;height:20%;position:absolute}.tree i{background:#6f5137;width:16%;height:55%;position:absolute;bottom:0;left:42%}.tree b{background:#3f7951;border-radius:50%;position:absolute;inset:0 0 35%;box-shadow:-13px 12px #4f8a5d,13px 12px #346d49}.tree-one{top:5%;left:42%}.tree-two{top:8%;right:8%;transform:scale(.8)}.bench{width:16%;height:10%;position:absolute;top:44%;left:12%}.bench b{background:#795846;border-radius:4px;height:30%;position:absolute;top:18%;left:0;right:0}.bench i{background:#3e4c45;width:8%;height:55%;position:absolute;bottom:0}.bench i:first-child{left:18%}.bench i:nth-child(2){right:18%}.workshop{color:#443b32;z-index:2;background:#d3c7a5;border:4px solid #4b5048;border-radius:9px;place-items:center;width:14%;height:17%;display:grid;position:absolute;transform:translate(-50%,-55%);box-shadow:0 12px #0002}.workshop:before{content:"";clip-path:polygon(0 0,100% 0,94% 100%,6% 100%);background:repeating-linear-gradient(90deg,#d86653 0 20%,#f1dbab 20% 40%);position:absolute;inset:-22% -7% 76%}.workshop span{font-size:clamp(.45rem,1vw,.75rem);font-weight:900}.workshop b{font-size:clamp(1rem,3vw,2rem)}.object{z-index:4;position:absolute;transform:translate(-50%,-65%)}.scooter-object{width:15%;min-width:88px}.scooter{filter:drop-shadow(0 6px 2px #0003);width:100%;display:block;overflow:visible}.scooter-fixed{animation:.7s scooter-fixed}.warning-mark{animation:1.2s ease-in-out infinite warning}.fixed-label{color:#123d2b;text-align:center;background:#d4f4c8;border-radius:999px;margin-top:-2px;padding:2px 7px;font-size:clamp(.45rem,1vw,.7rem);font-weight:800;display:block}.character{z-index:8;pointer-events:none;filter:drop-shadow(0 8px 5px #0003);width:9.5%;min-width:52px;max-width:104px;position:absolute;transform:translate(-50%,-86%)}.avatar{width:100%;display:block;overflow:visible}.avatar-shadow{fill:#18372c55}.eyes{fill:#1f302a}.mouth-speaking{opacity:0}.mouth-speaking.active{opacity:1;animation:.22s ease-in-out infinite alternate talk}.mouth-speaking.active+*{opacity:0}.is-walking .avatar-body{animation:.28s ease-in-out infinite alternate bob}.is-walking .leg-left,.is-walking .arm-right{transform-origin:50% 60%;animation:.35s ease-in-out infinite alternate limb}.is-walking .leg-right,.is-walking .arm-left{transform-origin:50% 60%;animation:.35s ease-in-out infinite alternate-reverse limb}.mood-concerned .brow-left{transform-origin:50%;transform:rotate(10deg)}.mood-concerned .brow-right{transform-origin:50%;transform:rotate(-10deg)}.mood-thinking .avatar-head{transform-origin:50%;transform:rotate(-3deg)}.name-tag{color:#fff8dc;white-space:nowrap;background:#102c27e8;border-radius:999px;padding:2px 7px;font-size:clamp(.45rem,1vw,.7rem);position:absolute;bottom:-1px;left:50%;transform:translate(-50%)}.mentor.arrives{animation:1s cubic-bezier(.2,.9,.25,1.15) both mentor-arrive}.inspect-action{z-index:12;color:#243b31;cursor:pointer;background:#fff2b7;border:0;border-radius:999px;padding:9px 16px;font-weight:900;animation:1s ease-in-out infinite alternate action-float;position:absolute;transform:translate(-50%,-50%);box-shadow:0 7px 20px #0005}.speech{z-index:15;color:#1b3028;text-align:left;pointer-events:auto;background:#fff8de;border:2px solid #203c34;border-radius:16px;width:min(340px,42%);padding:11px 13px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 12px 30px #0006}.speech:after{content:"";background:#fff8de;border-bottom:2px solid #203c34;border-right:2px solid #203c34;width:18px;height:18px;position:absolute;bottom:-11px;left:45%;transform:rotate(45deg)}.speech b{color:#4e7162;text-transform:uppercase;letter-spacing:.06em;font-size:clamp(.55rem,1vw,.72rem);display:block}.speech p{margin:4px 0 0;font-size:clamp(.65rem,1.3vw,.93rem);line-height:1.3}.speech-player{background:#dff2e4;width:min(240px,32%);padding:8px 10px}.speech-player:after{background:#dff2e4}.dialogue-choices{grid-template-columns:1fr 1fr;gap:7px;margin-top:9px;display:grid}.dialogue-choices button{color:#18332b;cursor:pointer;background:#e7ead1;border:1px solid #5d786c;border-radius:9px;min-height:42px;padding:7px;font-size:clamp(.55rem,1.05vw,.75rem);font-weight:800}.dialogue-choices button:hover,.dialogue-choices button:focus-visible{outline-offset:2px;background:#f6d889;outline:3px solid #20493c}.joystick{z-index:20;touch-action:none;background:#102c2775;border:2px solid #fff7d65c;border-radius:50%;width:88px;height:88px;position:absolute;bottom:5%;left:5%}.joystick:before,.joystick:after{content:"";background:#fff7d633;position:absolute}.joystick:before{width:2px;top:12px;bottom:12px;left:43px}.joystick:after{height:2px;top:43px;left:12px;right:12px}.joystick-knob{background:#f4deb2dd;border-radius:50%;width:38px;height:38px;position:absolute;top:25px;left:25px;box-shadow:0 5px 14px #0006}.keyboard-hint{z-index:10;color:#fff6d8;background:#163a31aa;border-radius:8px;padding:5px 9px;font-size:.68rem;position:absolute;bottom:2.5%;right:2.5%}.caption-bar{background:#102b26;border:1px solid #ffffff1f;border-radius:15px;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-top:10px;padding:10px 12px;display:grid;box-shadow:0 10px 30px #0004}.caption-bar>span{color:#9fc8b4;text-transform:uppercase;letter-spacing:.09em;font-size:.68rem}.caption-bar p{margin:0;line-height:1.35}.audio-actions{flex-wrap:wrap;justify-content:flex-end;gap:6px;display:flex}.audio-actions button{color:#f8f3db;cursor:pointer;background:#1a4238;border:1px solid #8eb8a4;border-radius:9px;padding:7px 9px}.audio-actions button:hover,.audio-actions button:focus-visible{background:#2d6655;outline:2px solid #d9f2d8}.spike-shell footer{color:#8fb0a1;padding:8px 3px 0;font-size:.72rem}@keyframes bob{to{transform:translateY(-3px)}}@keyframes limb{to{transform:rotate(8deg)}}@keyframes talk{to{transform:scaleY(.45)}}@keyframes mentor-arrive{0%{opacity:0;transform:translate(160%,-86%)}to{opacity:1;transform:translate(-50%,-86%)}}@keyframes action-float{to{transform:translate(-50%,calc(-50% - 5px))}}@keyframes warning{50%{opacity:.3}}@keyframes scooter-fixed{50%{transform:scale(1.08)}}@keyframes resource-pulse{50%{background:#704431;border-color:#ffbc83}}@keyframes delta-pop{0%{opacity:0;transform:translateY(8px)}20%,75%{opacity:1;transform:none}to{opacity:0;transform:translateY(-8px)}}@media (width<=700px){.spike-shell{padding:max(10px,env(safe-area-inset-top)) max(7px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(7px,env(safe-area-inset-left))}.experiment-notice{margin-bottom:10px;padding:8px 10px;display:block}.experiment-notice strong,.experiment-notice span{text-align:left;display:block}.experiment-notice span{margin-top:3px}.spike-header{flex-direction:column;align-items:stretch;gap:8px}.resources{width:100%}.resource{flex:1;min-width:0}.game-frame{border-radius:14px}.character{width:12%}.speech{width:64%;padding:7px 8px}.speech-mentor{max-height:92%;overflow:auto;transform:translate(-50%);top:4%!important;left:65%!important}.speech-mentor:after{display:none}.dialogue-choices{grid-template-columns:1fr 1fr;gap:5px}.dialogue-choices button{min-height:48px}.joystick{width:80px;height:80px}.joystick:before{left:39px}.joystick:after{top:39px}.joystick-knob{width:36px;height:36px;top:22px;left:22px}.caption-bar{grid-template-columns:1fr;gap:7px}.audio-actions{justify-content:flex-start}.audio-actions button{min-height:44px}.keyboard-hint{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}