.paint-app .paint-start{isolation:isolate;background:linear-gradient(90deg,#0d182bfa,#0d182be6 31%,#0d182b2e 73%)}.paint-app .paint-start:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 8% 40%,rgba(173,117,145,.1),transparent 34%),linear-gradient(180deg,rgba(9,17,32,.22),transparent 22%,transparent 75%,rgba(9,17,32,.3))}.paint-app .paint-brand{color:#fff9ef;letter-spacing:.2em;text-shadow:0 2px 18px #111d31}.paint-app .paint-mark{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(255,218,174,.45);border-radius:13px;background:linear-gradient(145deg,#ffd7a730,#ffd7a705);font-size:24px;box-shadow:inset 0 1px #fff3}.paint-app .paint-brand small{color:#aebcd1}.paint-app .paint-intro{max-width:490px}.paint-app .paint-eyebrow{display:flex;align-items:center;gap:10px;color:#f9ce9c}.paint-app .paint-eyebrow:before{content:"";width:23px;height:1px;background:currentColor;opacity:.75}.paint-app .paint-intro h1{font-size:clamp(66px,7.5vw,112px);line-height:.94;text-shadow:0 8px 40px rgba(2,10,24,.3)}.paint-app .paint-intro h1 em{color:#ffc990}.paint-app .paint-intro p{color:#c2cddd;font-size:16px;max-width:355px}.paint-app .paint-buttons{gap:12px}.paint-app .primary,.paint-app .secondary{border-radius:12px;transition:background-color .18s,border-color .18s,transform .18s,box-shadow .18s}.paint-app .primary{background:linear-gradient(135deg,#ffdaa8,#f2b984);box-shadow:inset 0 1px #ffffff94,0 8px 24px #080d1b33}.paint-app .primary:hover{background:linear-gradient(135deg,#ffe4bd,#ffc992);box-shadow:inset 0 1px #fff8e6,0 10px 25px #00000047}.paint-app .secondary{border-color:#d5e4fa47;background:#1c2e4894;box-shadow:inset 0 1px #ffffff14}.paint-app .secondary:hover{border-color:#d5e4fa85;background:#3b4d68a6}.paint-app button:active:not(:disabled){transform:translateY(1px)}.paint-app button:disabled{cursor:not-allowed;opacity:.55}.paint-app .paint-hint{color:#adbbce;letter-spacing:.03em}.paint-app .paint-hint span{display:grid;place-items:center;color:#f3c999;font-size:9px;width:23px;height:23px;border:1px solid rgba(243,201,153,.28);border-radius:50%}.paint-app .paint-hint b{font-size:13px;color:#71849c}.paint-app .paint-footer{color:#9babc0}.paint-app .text-button{border-radius:8px}.paint-app .text-button:hover{background:#ffffff12;color:#fff}.paint-app .paint-score{padding:14px 18px 12px;border:1px solid rgba(212,227,249,.18);border-radius:16px;background:linear-gradient(145deg,#1d2f4ae0,#0f1d33c2);box-shadow:0 12px 35px #060c192e,inset 0 1px #ffffff14;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.paint-app .paint-score small,.paint-app .paint-board-title{color:#b4c5d8}.paint-app .paint-score strong{color:#fff6e8;font-variant-numeric:tabular-nums}.paint-app .paint-score sup{color:#f9c992}.paint-app .icon-button{background:linear-gradient(145deg,#30415c,#1b2a42);border-color:#d8e7fa40;box-shadow:0 8px 25px #050c1a40,inset 0 1px #ffffff1f}.paint-app .icon-button:hover{background:#40536e}.paint-app .paint-board{background:linear-gradient(150deg,#1d2f4ae0,#0f1d33cc);border-color:#d4e3f92e;border-radius:16px;box-shadow:0 16px 40px #060c1933,inset 0 1px #ffffff14}.paint-app .paint-board-title span{display:flex;align-items:center;gap:5px;font-size:8px}.paint-app .paint-board-title span:before{content:"";width:5px;height:5px;border-radius:50%;background:#8ce5ba;box-shadow:0 0 8px #8ce5ba}.paint-app .paint-board li i{box-shadow:0 0 0 3px #ffffff12}.paint-app .paint-board b{font-variant-numeric:tabular-nums;color:#f9f2e8}.paint-app .paint-control-hint{padding:9px 14px;border-radius:30px;background:#0c17297a;border:1px solid rgba(255,255,255,.09);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.paint-app .paint-gain{top:max(150px,calc(env(safe-area-inset-top) + 126px));background:linear-gradient(135deg,#ffdfb2,#f3c18b);box-shadow:0 8px 25px #0b132333}.paint-app .paint-status{border:1px solid rgba(212,227,249,.18);box-shadow:0 10px 30px #0003}.paint-app .paint-modal{background:#08101fc2}.paint-app .paint-dialog{background:linear-gradient(145deg,#293d59,#17283f);border-color:#d4e3f938;border-radius:20px;box-shadow:0 28px 100px #03091399,inset 0 1px #ffffff1c}.paint-app .paint-dialog h2{color:#fff8ed}.paint-app .dialog-actions select{border-radius:9px}.paint-app .paint-joystick{box-shadow:0 0 30px #0d182b2e,inset 0 0 25px #ffffff0d}.paint-app .paint-joystick-knob{box-shadow:0 3px 16px #050c1847}@media(max-width:700px){.paint-app .paint-start{background:linear-gradient(0deg,#0d182bfc,#0d182bde 50%,#0d182b2e)}.paint-app .paint-intro h1{font-size:clamp(58px,13vw,75px)}.paint-app .paint-intro p{font-size:14px}.paint-app .paint-score{padding:10px 13px}.paint-app .paint-gain{top:max(125px,calc(env(safe-area-inset-top) + 105px))}.paint-app .paint-board{border-radius:13px}.paint-app .paint-control-hint{bottom:max(12px,env(safe-area-inset-bottom));padding:7px 10px}}@media(prefers-reduced-motion:reduce){.paint-app .primary,.paint-app .secondary{transition:none}}.paint-joystick{position:absolute;z-index:1;width:104px;height:104px;transform:translate(-50%,-50%);border:2px solid rgba(255,255,255,.7);border-radius:50%;background:#101c3552;pointer-events:none}.paint-joystick-knob{position:absolute;left:50%;top:50%;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.85);background:#f3c48dd9;transform:translate(-50%,-50%)}.paint-gain{position:absolute;top:max(96px,env(safe-area-inset-top));left:max(30px,env(safe-area-inset-left));z-index:2;padding:8px 12px;color:#16233a;background:#f3c48d;border-radius:16px;font-size:13px;font-weight:700;pointer-events:none}:root{--ink:#101c35;--cream:#fff8e9;--peach:#ffc88f;--glass:rgba(20,35,60,.8);--edge:rgba(212,227,249,.18)}@media(max-width:700px){.paint-gain{top:max(78px,env(safe-area-inset-top));left:max(20px,env(safe-area-inset-left))}}:root{font-family:DM Sans,system-ui,sans-serif;color:#f7f4ec;background:#101c35;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #f1cf7b;outline-offset:4px}[hidden]{display:none!important}.paint-app{position:relative;width:100%;height:100dvh;overflow:hidden;background:radial-gradient(circle at 72% 47%,#304363,#101c35 56%)}.paint-viewport{position:absolute;inset:0;touch-action:none}.paint-viewport canvas{display:block;width:100%;height:100%}.paint-start{position:absolute;inset:0;padding:max(36px,env(safe-area-inset-top)) max(5vw,env(safe-area-inset-right)) max(28px,env(safe-area-inset-bottom)) max(5vw,env(safe-area-inset-left));pointer-events:none;background:linear-gradient(90deg,#101c35f7,#101c35e0 29%,#101c351f 68%);display:flex;flex-direction:column;justify-content:space-between}.paint-start button{pointer-events:auto}.paint-brand{font-size:14px;font-weight:700;letter-spacing:.17em;display:flex;align-items:center;gap:10px}.paint-brand small{font-size:9px;color:#a9b5c9;letter-spacing:.16em;border-left:1px solid #52627a;padding-left:15px;margin-left:8px}.paint-mark{color:#f6c88f;font-size:27px}.paint-intro{max-width:450px}.paint-eyebrow{font-size:10px;letter-spacing:.22em;font-weight:700;color:#f4c789}.paint-intro h1,.paint-dialog h2{font-family:Fraunces,Georgia,serif;letter-spacing:-.05em;line-height:.98}.paint-intro h1{font-size:clamp(60px,7.2vw,110px);margin:22px 0}.paint-intro h1 em{font-style:italic;color:#f3c38c}.paint-intro p,.paint-dialog p{color:#b9c3d2;line-height:1.7;font-size:15px;max-width:340px}.paint-buttons{display:flex;gap:10px;margin:32px 0}.primary,.secondary{border-radius:7px;padding:16px 21px;font-weight:700;font-size:13px;border:1px solid transparent;min-height:50px}.primary{background:#f3c48d;color:#17233a}.primary:hover{background:#ffdbac}.secondary{background:#ffffff12;color:#fff;border-color:#fff3}.secondary:hover{background:#ffffff24}.paint-buttons button{min-width:170px;text-align:left}.paint-buttons button span{float:right}.paint-hint{font-size:10px;color:#aebacc;display:flex;align-items:center;gap:9px}.paint-hint span{font-weight:700;color:#f2c48e}.paint-hint b{color:#67758a}.paint-footer{display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:.16em;color:#94a2b7}.text-button{border:0;background:none;color:#ccd5e1;padding:10px}.paint-hud{position:absolute;inset:0;pointer-events:none;padding:max(24px,env(safe-area-inset-top)) max(30px,env(safe-area-inset-right)) max(22px,env(safe-area-inset-bottom)) max(30px,env(safe-area-inset-left))}.paint-top{display:flex;justify-content:space-between;align-items:flex-start}.paint-score small,.paint-board-title{font-size:9px;font-weight:700;letter-spacing:.18em;color:#bac5d3}.paint-score strong{display:block;font-family:Fraunces,Georgia,serif;font-size:46px;line-height:1.2}.paint-score sup{font-family:DM Sans,sans-serif;font-size:18px;top:-.5em;position:relative}.icon-button{pointer-events:auto;width:44px;height:44px;border:1px solid #607087;border-radius:50%;color:#fff;background:#202e46;font-size:18px}.paint-board{position:absolute;right:max(30px,env(safe-area-inset-right));top:100px;width:215px;padding:18px;background:#132035bd;border:1px solid rgba(255,255,255,.1);border-radius:10px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.paint-board-title{display:flex;justify-content:space-between}.paint-board-title span{color:#80d5ad}.paint-board ol{list-style:none;padding:0;margin:16px 0 0}.paint-board li{display:flex;align-items:center;gap:8px;font-size:11px;margin:12px 0}.paint-board li i{width:8px;height:8px;border-radius:50%;flex:none}.paint-board .rank{color:#8190a5;font-size:9px}.paint-board .player-name{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.paint-board b{font-size:10px}.paint-control-hint{position:absolute;bottom:max(25px,env(safe-area-inset-bottom));left:50%;transform:translate(-50%);white-space:nowrap;font-size:9px;letter-spacing:.12em;color:#b6c3d1}.paint-control-hint span{color:#e8bc87;padding:0 7px}.paint-status{position:absolute;top:25px;left:50%;transform:translate(-50%);background:#223149;border-radius:30px;padding:12px 20px;font-size:13px}.paint-modal{position:absolute;inset:0;display:grid;place-items:center;padding:20px;background:#091120b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.paint-dialog{width:min(100%,400px);padding:35px;background:#22324c;border:1px solid #4d5b70;border-radius:14px;box-shadow:0 20px 80px #07101f}.paint-dialog h2{font-size:38px;margin:16px 0}.dialog-actions{display:grid;gap:9px;margin-top:25px}.dialog-actions label{font-size:10px;letter-spacing:.1em;font-weight:700;display:grid;gap:10px;margin-bottom:10px}.dialog-actions input{width:100%;accent-color:#f3c48d}.dialog-actions select{padding:10px;background:#15243b;color:#fff;border:1px solid #607087;border-radius:5px}@media(max-width:700px){.paint-start{padding:24px;justify-content:space-between;background:linear-gradient(0deg,#101c35fa,#101c35d4 50%,#101c3526)}.paint-brand small{display:none}.paint-intro{margin-top:auto;margin-bottom:40px}.paint-intro h1{font-size:65px}.paint-intro p{font-size:14px}.paint-buttons{margin:20px 0;flex-direction:column;max-width:330px}.paint-hint{font-size:9px;gap:6px}.paint-footer{font-size:8px}.paint-hud{padding:20px}.paint-board{right:20px;top:80px;width:160px;padding:12px}.paint-score strong{font-size:36px}.paint-control-hint{font-size:8px;bottom:18px}.paint-board li{margin:9px 0}}@media(pointer:coarse){.paint-control-hint{font-size:0}.paint-control-hint:after{content:"DRAG ANYWHERE TO STEER";font-size:9px}}.paint-modal:has(.cosmetic-items) .paint-dialog{max-height:calc(100dvh - 40px);overflow-y:auto;width:min(100%,700px)}.collection-tabs{display:flex;gap:8px;margin:2px 0 8px}.collection-tabs button{flex:1;min-height:44px}.collection-tabs button[aria-pressed=true]{background:#fbd0a0;color:#172438;border-color:#fbd0a0}.collection-tabs span{margin-left:.35em;opacity:.7;font-variant-numeric:tabular-nums}.cosmetic-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.cosmetic-item{display:grid;grid-template-columns:72px minmax(0,1fr);align-items:center;gap:12px;padding:14px;border:1px solid rgba(220,234,252,.14);border-radius:14px;background:linear-gradient(145deg,#ffffff12,#ffffff06);min-width:0}.cosmetic-preview{position:relative;display:grid;place-items:center;width:72px;height:72px;border-radius:12px;overflow:hidden;background:radial-gradient(circle at 48% 32%,#7ba9c94d,#0c192db3 72%);border:1px solid rgba(220,234,252,.13)}.cosmetic-preview svg{display:block;width:64px;height:64px;filter:drop-shadow(0 3px 6px rgba(2,8,18,.35))}.cosmetic-copy{min-width:0}.cosmetic-copy strong,.cosmetic-copy small{display:block}.cosmetic-copy strong{font-size:14px;line-height:1.25}.cosmetic-copy small{margin-top:5px;font-size:12px;line-height:1.4;color:#c5d1df}.cosmetic-item button{grid-column:1/-1;min-height:40px;width:100%;padding:8px 12px;white-space:nowrap}.cosmetic-item button:disabled{opacity:.6;cursor:default}.cosmetic-notice{min-height:1em;font-size:12px;color:#f3c48d}@media(max-width:560px){.cosmetic-items{grid-template-columns:1fr}.cosmetic-item{grid-template-columns:58px minmax(0,1fr) auto;gap:10px;padding:10px}.cosmetic-preview{width:58px;height:58px}.cosmetic-preview svg{width:52px;height:52px}.cosmetic-item button{grid-column:auto;width:auto;min-width:76px}.cosmetic-copy small{font-size:11px}}@media(max-width:380px){.cosmetic-item{grid-template-columns:52px minmax(0,1fr)}.cosmetic-preview{width:52px;height:52px}.cosmetic-preview svg{width:46px;height:46px}.cosmetic-item button{grid-column:1/-1;width:100%}}.paint-app .paint-start{overflow-y:auto;pointer-events:auto;gap:24px;padding:clamp(22px,3.5vw,52px) clamp(24px,5vw,76px);background:linear-gradient(90deg,#0a1527fa,#0a1527e8 30%,#0a15272e 74%)}.paint-menu-header{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%}.paint-app .paint-brand{font-size:13px;letter-spacing:.16em}.menu-settings{display:flex;align-items:center;gap:12px;padding:12px 15px;border:1px solid rgba(216,231,250,.25);border-radius:12px;background:#111f33a6;color:#f4f5f2;font-weight:650;font-size:13px}.menu-settings:hover{background:#3a4c66d9;border-color:#d8e7fa80}.menu-settings span{color:#f7cd9d;font-size:17px;line-height:1}.paint-app .paint-intro{width:min(100%,510px);max-width:510px;margin:auto 0}.paint-app .paint-intro h1{margin:20px 0 18px;font-size:clamp(64px,7vw,104px)}.paint-app .paint-intro p{max-width:420px;margin:0;color:#d0d9e4;line-height:1.55}.paint-app .paint-buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:26px 0 10px}.paint-app .paint-buttons button{position:relative;min-width:0;min-height:82px;padding:17px 42px 16px 18px;text-align:left}.paint-buttons strong,.paint-buttons small,.paint-collection strong,.paint-collection small{display:block}.paint-buttons strong,.paint-collection strong{font-size:15px;line-height:1.25}.paint-buttons small,.paint-collection small{margin-top:5px;font-size:12px;font-weight:500;line-height:1.3;opacity:.78}.paint-buttons button span{position:absolute;right:18px;top:50%;float:none;transform:translateY(-50%);font-size:20px}.paint-collection{width:100%;min-height:76px;display:flex;align-items:center;gap:15px;text-align:left;padding:12px 17px;border:1px solid rgba(245,200,151,.34);border-radius:12px;background:linear-gradient(100deg,#875b6959,#22334ead);color:#fff9f0}.paint-collection:hover{border-color:#ffd8abb3;background:linear-gradient(100deg,#99667285,#31435fcc)}.collection-icon{display:grid;place-items:center;flex:none;width:43px;height:43px;border-radius:11px;background:#ffcd9b21;color:#ffd29d;font-size:25px}.paint-collection b{margin-left:auto;color:#f5c999;font-size:20px}.paint-how{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:22px;color:#c1ccda;font-size:12px}.paint-key{padding:5px 7px;border:1px solid rgba(209,224,244,.23);border-radius:5px;background:#0e1b308c;color:#e2eaf2;font-size:10px;font-weight:700;letter-spacing:.03em}.paint-app .dialog-actions .mouse-option{display:flex;align-items:flex-start;gap:10px;font-size:13px;letter-spacing:0;text-transform:none}.paint-app .mouse-option input{width:18px;height:18px;flex:none;margin:0;accent-color:#f3c48d}.mouse-option small{display:block;margin-top:5px;color:#b9c3d2;font-size:12px;font-weight:400;line-height:1.4}@media(max-width:700px){.paint-app .paint-start{gap:20px;padding:22px 22px max(22px,env(safe-area-inset-bottom));background:linear-gradient(0deg,#0a1527fc,#0a1527e8 52%,#0a152773)}.paint-app .paint-intro{margin:auto 0;width:100%}.paint-app .paint-intro h1{font-size:clamp(52px,11vw,76px);margin:15px 0}.paint-app .paint-intro p{font-size:14px}.paint-app .paint-buttons{grid-template-columns:1fr 1fr;max-width:none;margin:20px 0 10px}.paint-app .paint-buttons button{min-height:76px;padding-left:14px;padding-right:30px}.paint-buttons button span{right:11px}.paint-how{margin-top:17px}}@media(max-width:380px){.paint-app .paint-buttons{grid-template-columns:1fr}.paint-app .paint-buttons button{min-height:62px;padding-top:10px;padding-bottom:10px}.paint-collection{min-height:64px}.paint-app .paint-intro h1{font-size:48px}}@media(pointer:coarse){.paint-how .paint-key{display:none}.paint-how>span:last-child{font-size:0}.paint-how>span:last-child:after{content:"Drag on the planet to steer";font-size:12px}}
