@font-face{font-family:Bowlby;src:url('../assets/fonts/bowlby.woff2') format('woff2');font-display:swap}
@font-face{font-family:RobotoCond;src:url('../assets/fonts/roboto-cond.woff2') format('woff2');font-display:swap}
:root{--scale:1;--gold:#ffd745;--green:#5bef86;--paper:#f6fcff;--steel:#a6c8dc;--navy:#072536;--edge:#010d1a}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#020912;color:var(--paper);font-family:RobotoCond,'Arial Narrow',Arial,sans-serif;font-weight:800;user-select:none;overscroll-behavior:none;touch-action:manipulation}body{background:radial-gradient(ellipse at 50% 40%,#174259,#030911 70%)}button{font:inherit;color:inherit;cursor:pointer}button:disabled{filter:grayscale(.7) brightness(.65);pointer-events:none}button:focus-visible{outline:5px solid #fff;outline-offset:5px}button:active{transform:translateY(5px) scale(.98)}[hidden]{display:none!important}#app{position:absolute;left:50%;top:50%;width:720px;height:1280px;overflow:hidden;transform:translate(-50%,-50%) scale(var(--scale));transform-origin:center center;isolation:isolate;box-shadow:0 0 120px #0009;background:#092739}.backdrop{position:absolute;inset:0;background:radial-gradient(ellipse at 48% 36%,#2d5968 0,#0e3445 43%,#061727 100%);overflow:hidden}.glow{position:absolute;width:680px;height:680px;border-radius:50%;filter:blur(80px);opacity:.4}.glow-a{left:-330px;top:40px;background:#4be9f838}.glow-b{right:-330px;top:460px;background:#f7aa3d38}.shelf{position:absolute;left:-10%;right:-10%;bottom:0;height:220px;background:linear-gradient(#253c44,#071c29);box-shadow:0 -4px 0 #61b2c12a}.workshop-grid{position:absolute;inset:0;background-image:linear-gradient(#65c8d606 1px,transparent 1px),linear-gradient(90deg,#65c8d606 1px,transparent 1px);background-size:70px 70px}#stage{position:absolute;inset:0;display:block;width:720px;height:1280px}.screen{position:absolute;inset:0;display:flex;flex-direction:column}.sheet-screen{align-items:center;padding:36px 32px 40px;overflow-y:auto;background:radial-gradient(ellipse at 20% 0%,#245668,#0a2b3c 45%,#061c2d);box-shadow:inset 0 0 0 3px #7ee7ef24}.sheet-screen:after{content:'';position:fixed;inset:0;pointer-events:none;box-shadow:inset 0 0 100px #0004}.hero-screen{overflow:hidden}.hero-art{position:absolute;inset:0;background:url('../assets/art/splash-master.png') center center/cover no-repeat;z-index:-3}.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,#02131e18 0%,transparent 30%,transparent 57%,#021626b8 74%,#021626 100%);z-index:-2}.hero-screen:before{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 70px #021525;z-index:-1}.logo{position:absolute;left:0;right:0;top:36px;display:flex;flex-direction:column;align-items:center;transform:rotate(-3deg);filter:drop-shadow(0 8px 3px #04121c88);pointer-events:none}.logo span{font-family:Bowlby,Impact,sans-serif}.logo-mecha{font-size:91px;line-height:1.05;letter-spacing:3px;color:#f4fdff;-webkit-text-stroke:3px #164057;text-shadow:0 4px 0 #88c1d6,0 8px 0 #2d647b,0 12px 0 #052b40,5px 16px 0 #00101d}.logo-screw{position:relative;font-size:110px;line-height:1.06;letter-spacing:0;color:#ffe45d;-webkit-text-stroke:3px #7d4c0a;text-shadow:0 5px 0 #f4a824,0 10px 0 #be6811,0 15px 0 #59320c,5px 19px 0 #00111e}.logo-3d{display:inline-block;font-size:60px;line-height:1.02;margin-left:9px;color:#80f4ff;-webkit-text-stroke:2px #18556b;text-shadow:0 4px 0 #2fa8bf,0 8px 0 #12607c,0 12px 0 #052b40;transform:rotate(7deg) translateY(-6px)}.logo-kicker{font-family:RobotoCond,Arial,sans-serif!important;font-size:19px;letter-spacing:3px;line-height:2.4;color:#c4f4fc;text-shadow:0 3px 3px #001521}.menu-logo{top:38px;transform:rotate(-3deg) scale(.94)}.mapi-logo{position:absolute;display:block;object-fit:contain;left:50%;transform:translateX(-50%);width:180px;height:77px;filter:drop-shadow(0 5px 7px #00111d)}.splash-mapi{top:1190px}.menu-mapi{top:1194px;width:146px;height:64px}.version{position:absolute;bottom:8px;right:16px;color:#79a6b7;font-size:12px;letter-spacing:1px}.splash-loader{position:absolute;top:1060px;left:100px;width:520px;text-align:center}.loadbar{height:17px;padding:3px;background:#031826;border:2px solid #39758b;border-radius:12px;box-shadow:0 4px 0 #00131d,0 0 25px #1bbae73b;overflow:hidden}.loadbar i{display:block;height:100%;width:0;background:linear-gradient(#ffeb7a,#efa721);border-radius:8px;box-shadow:0 0 20px #ffda53;transition:width .2s}.loadtext{font-size:20px;color:#bce3ed;text-shadow:0 2px #00131d;margin:14px auto 0;max-width:100%}.enter-btn{position:absolute;left:42px;top:1080px;width:636px;height:94px;background:linear-gradient(180deg,#ffd955,#f6aa1a);border:3px solid #fff094;border-radius:25px;box-shadow:inset 0 4px #fff8,0 8px 0 #985211,0 14px 24px #0007;color:#4a2c0a;font-family:Bowlby,Impact,sans-serif;font-size:32px;text-shadow:0 2px #ffe89d;animation:enter-pulse 2s ease-in-out infinite}@keyframes enter-pulse{50%{box-shadow:inset 0 4px #fff8,0 8px 0 #985211,0 14px 38px #ffd34265}}.menu-settings{position:absolute;top:31px;right:21px;width:84px;height:84px;border:0;background:url('../assets/ui/settings.png') center/contain no-repeat;filter:drop-shadow(0 5px 3px #0006);z-index:4}.menu-stats{position:absolute;left:50px;right:50px;top:317px;display:flex;gap:15px;justify-content:center;font-size:18px;color:#b9d6e1;text-shadow:0 2px #00111c}.menu-stats span{display:flex;align-items:center;gap:6px;background:#052334db;border:1px solid #8fe8f345;border-radius:30px;padding:8px 14px;box-shadow:0 4px 8px #00121c66}.menu-stats b{font-size:23px;color:white}.menu-stats i{font-style:normal;color:#ffdd48;font-size:24px}.hero-badge{position:absolute;top:728px;left:160px;right:160px;text-align:center;transform:rotate(-3deg);text-shadow:0 3px 4px #001522}.hero-badge span{display:block;color:#e9fbff;font-family:Bowlby,Impact,sans-serif;letter-spacing:4px;font-size:25px}.hero-badge small{display:block;color:#8fe7ed;font-size:15px;letter-spacing:2px;margin-top:2px}.menu-stack{position:absolute;left:39px;right:39px;top:822px}.art-btn{position:relative;display:flex;align-items:center;justify-content:center;border:0;background-color:transparent;background-repeat:no-repeat;background-position:center;background-size:100% 100%;filter:drop-shadow(0 7px 3px #0006);transition:filter .16s,transform .1s}.art-btn:hover{filter:brightness(1.12) drop-shadow(0 7px 4px #0006)}.art-btn span{font-family:Bowlby,Impact,sans-serif;text-shadow:0 3px 0 #0a332d,0 5px 5px #001b2766;-webkit-text-stroke:1px #123b38}.play-art{width:100%;height:146px;flex-direction:column;padding-left:44px;background-image:url('../assets/ui/play.png')}.play-art span{font-size:52px;line-height:1.05;color:white;text-transform:uppercase}.play-art small{font-size:17px;letter-spacing:1.5px;line-height:1.8;color:#d1ffe2;text-shadow:0 2px #063d23}.menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px 16px;margin-top:15px}.menu-grid .art-btn{height:91px;padding-left:65px}.menu-grid .art-btn span{font-size:25px;color:#fff3c9;-webkit-text-stroke:1px #373735;text-shadow:0 3px #1c303a,0 5px 5px #001726}.levels-art{background-image:url('../assets/ui/levels.png')}.garage-art{background-image:url('../assets/ui/garage.png')}.collection-art{background-image:url('../assets/ui/collection.png')}.trophies-art{background-image:url('../assets/ui/trophies.png')}
.big-btn{width:100%;height:90px;min-height:90px;border:3px solid #7dc6df;border-radius:24px;background:linear-gradient(#2d708b,#17485e 48%,#11374b);box-shadow:inset 0 4px 0 #b9f9ff3b,0 8px 0 #052234,0 13px 18px #0005;color:#f0faff;display:inline-flex;align-items:center;justify-content:center;gap:12px;font-family:Bowlby,Impact,sans-serif;text-transform:uppercase;font-size:26px;text-shadow:0 3px 0 #062c42;transition:transform .1s}.big-btn.play{background:linear-gradient(#8af06d,#38be5c 48%,#1e944b);border-color:#c2ffa0;box-shadow:inset 0 4px 0 #ffffff66,0 8px 0 #095e35,0 13px 18px #0005;text-shadow:0 3px #166c32}.big-btn.reward-btn{background:linear-gradient(#ffe988,#ffc63b 48%,#df921b);border-color:#fff3ac;box-shadow:inset 0 4px 0 #ffffff66,0 8px 0 #8b4b10,0 13px 18px #0005;color:#5b350b;text-shadow:0 2px #fff095}.big-btn.reward-btn svg{fill:#663d0e;width:34px;height:34px}.big-btn.ghost{height:74px;min-height:74px;font-size:22px;border-color:#4d8a9c;background:linear-gradient(#234f62,#14384d);color:#c6e4ed}.icon-btn{width:78px;height:78px;min-width:78px;flex:0 0 78px;border-radius:23px;border:3px solid #80bfd0;background:linear-gradient(#366e88,#123c54);box-shadow:inset 0 4px #c8ffff3b,0 6px #041d2f,0 9px 12px #0004;display:grid;place-items:center}.icon-btn svg{width:38px;height:38px;fill:#ecfcff;filter:drop-shadow(0 3px #063349)}
#hud{pointer-events:none}#hud button{pointer-events:auto}.topbar{position:absolute;top:22px;left:22px;right:22px;height:130px;display:flex;align-items:flex-start;gap:15px}.level-pill{flex:1;text-align:center;border:2px solid #65b2c594;border-radius:24px;padding:11px 12px 12px;background:linear-gradient(#123e52ee,#07263cee);box-shadow:inset 0 3px #bffbff19,0 6px #031a2b88}.level-pill strong{display:block;font-family:Bowlby,Impact,sans-serif;text-transform:uppercase;letter-spacing:1px;font-size:28px;line-height:1.2;color:#ffdf61;text-shadow:0 3px #744c14}.level-pill span{display:block;color:#c5e4ee;font-size:17px;line-height:1.2;margin:7px 0}.level-pill small{display:block;letter-spacing:1.5px;font-size:13px;color:#8fdbdf;margin-top:7px}.pips{display:flex;gap:7px;justify-content:center}.pips i{width:65px;height:8px;border-radius:5px;background:#041c2b;box-shadow:inset 0 1px #0009;overflow:hidden;transition:background .2s}.pips i.on{background:linear-gradient(#a4f68a,#3dbb69);box-shadow:0 0 12px #45f9855c}.wallet{display:grid;gap:10px;min-width:116px}.chip{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:8px 14px 8px 9px;border:2px solid #73b8cc75;border-radius:30px;background:linear-gradient(#123b50,#052338);box-shadow:inset 0 2px #d0ffff1c,0 4px #03192caa;font-size:24px;color:#fff4b5;font-variant-numeric:tabular-nums}.chip i{display:block;width:29px;height:29px;flex:0 0 29px;border:3px solid #ffe888;border-radius:50%;background:radial-gradient(circle at 30% 25%,#fff8ab,#ffba27 60%,#d7850e);box-shadow:inset 0 0 0 3px #e9a821,0 3px #8d500e}.chip.gem{color:#b3efff}.chip.gem i{width:23px;height:23px;flex-basis:23px;border:2px solid #a5f6ff;border-radius:5px;transform:rotate(45deg);background:linear-gradient(130deg,#d2ffff,#4dceda 45%,#16739d);box-shadow:inset -5px -5px #218cab,0 3px #084e73}.side-rail{position:absolute;top:187px;right:20px;display:grid;gap:15px}.rail-btn{position:relative;width:90px;height:88px;border:2px solid #5ea6bb;border-radius:24px;background:linear-gradient(#28627b,#123c53);box-shadow:inset 0 3px #d1ffff2b,0 6px #031e30,0 9px 10px #0003;display:grid;justify-items:center;align-content:center;gap:4px;font-size:13px;letter-spacing:.5px}.rail-btn svg{width:37px;height:37px;fill:#ffd94e;filter:drop-shadow(0 3px #7d5018)}.badge{position:absolute;right:-8px;top:-8px;min-width:28px;height:28px;display:grid;place-items:center;border:2px solid #ffc1a1;border-radius:20px;background:linear-gradient(#ff9573,#e84436);font-size:17px;font-style:normal;box-shadow:0 3px #7a251d}.badge:empty{display:none}.boosters{position:absolute;left:27px;right:27px;bottom:27px;height:145px;display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.booster{position:relative;border:3px solid #73b6c9;border-radius:28px;background:linear-gradient(#38788e,#1b4d66 60%,#10374d);box-shadow:inset 0 5px #d9ffff29,0 8px #042136,0 13px 20px #0005;display:grid;align-content:center;justify-items:center;gap:7px;font-family:Bowlby,Impact,sans-serif;font-size:20px;text-transform:uppercase;text-shadow:0 2px #04283a}.booster svg{width:51px;height:51px;fill:#ffdf62;filter:drop-shadow(0 4px #8c551e)}.booster .count{position:absolute;top:-13px;right:-9px;min-width:39px;height:39px;padding:0 8px;display:grid;place-items:center;border-radius:22px;border:3px solid #caffb0;background:linear-gradient(#8def73,#42b955);box-shadow:0 4px #0c5a37;font-size:21px;font-style:normal;color:#123d2b;text-shadow:0 1px #d3ffbd}.booster.spent{filter:grayscale(.7) brightness(.7)}.booster.armed{border-color:#fff3a4;box-shadow:inset 0 0 0 4px #ffcb30,0 8px #6b4f13,0 0 40px #ffc83088}.tray-caption{position:absolute;top:1030px;left:50%;transform:translateX(-50%);font-size:21px;letter-spacing:1px;color:#a2c6d4;background:#042134dd;border:2px solid #426b7b;padding:7px 23px;border-radius:30px;white-space:nowrap;text-transform:uppercase;box-shadow:0 4px #01182688}.tray-caption b{color:#fff0a4}.tray-caption.warn{color:#ffd48c;border-color:#f5ae52}.toast{position:absolute;top:181px;left:50%;transform:translateX(-50%);max-width:580px;width:max-content;padding:14px 26px;border-radius:24px;border:2px solid #93deea;background:#092c43ef;box-shadow:0 6px #001a2d88,0 9px 20px #0006;font-size:23px;text-align:center;color:#edfcff;z-index:18;pointer-events:none;animation:toast-in .2s ease}@keyframes toast-in{from{opacity:0;transform:translate(-50%,-12px)}}.tutorial{position:absolute;left:65px;right:65px;top:934px;text-align:center;padding:18px 22px;background:linear-gradient(#174f62f5,#082d44f5);border:2px solid #92d3dc;border-radius:25px;box-shadow:0 6px #021d30bb,0 9px 18px #0005;font-size:23px;color:#e7faff;pointer-events:none;z-index:12}.tutorial:before{content:'TIP';display:inline-block;color:#ffdc5e;font-family:Bowlby,Impact,sans-serif;font-size:18px;margin-right:12px}
.modal{align-items:center;justify-content:center;background:#00101bba;backdrop-filter:blur(9px);padding:35px;z-index:20}.card{width:580px;padding:36px 30px 34px;display:grid;justify-items:center;gap:20px;border:4px solid #7cb6c9;border-radius:38px;background:radial-gradient(ellipse at 35% 0,#31667a,#123d55 45%,#08283d);box-shadow:inset 0 5px #b5efff39,0 13px #02182b,0 27px 60px #0009;position:relative}.card:before,.card:after{content:'✚';position:absolute;top:15px;font-size:20px;color:#032235;text-shadow:0 1px #90c7d466}.card:before{left:18px}.card:after{right:18px}.card h2{font-family:Bowlby,Impact,sans-serif;text-align:center;margin:10px 0 14px;color:#ffdf67;font-size:39px;text-transform:uppercase;line-height:1.15;text-shadow:0 4px #865822,0 6px #03253c}.reason{margin:0 0 10px;font-size:25px;line-height:1.3;color:#b8d8e4;text-align:center}.reward{margin:0}.reward .chip{font-size:46px;padding:12px 30px}.reward .chip i{width:45px;height:45px;flex-basis:45px}.star-row{display:flex;gap:15px;margin:4px 0 10px;align-items:center}.star-row i{width:91px;height:91px;background:#09293e;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);transition:transform .3s cubic-bezier(.2,1.6,.4,1),background .3s}.star-row i:nth-child(2){width:110px;height:110px;transform:translateY(-10px)}.star-row i.on{background:linear-gradient(#fff5a7,#ffd746 55%,#ef971a);transform:scale(1.1)}.star-row i:nth-child(2).on{transform:translateY(-10px) scale(1.1)}.win-card{padding-top:35px}.sheet-head{width:100%;min-height:85px;display:flex;align-items:center;gap:18px;margin-bottom:34px;position:relative;z-index:1}.sheet-head h2{flex:1;font-family:Bowlby,Impact,sans-serif;font-size:36px;letter-spacing:1px;text-align:center;margin:0;color:#ffdf6b;text-shadow:0 4px #6a481d,0 6px #001b30}.sheet-head>span{min-width:80px;text-align:right}.stars-total{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:30px;color:#fff4aa}.stars-total i{display:block;width:33px;height:33px;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);background:linear-gradient(#fff0a4,#ffbc29)}.section-label{width:100%;margin:30px 0 14px;color:#a8d2dd;letter-spacing:2px;font-size:23px;text-transform:uppercase}.sheet-intro{font-size:24px;color:#b0d3df;margin:0 0 30px;text-align:center}.level-grid{width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:24px 18px;padding-bottom:20px}.level-tile{height:145px;border:3px solid #81c3ce;border-radius:24px;background:linear-gradient(#38778b,#1d4d63);box-shadow:inset 0 4px #d5ffff33,0 7px #042136,0 12px 16px #0004;color:#fff8c8;display:grid;place-items:center;align-content:center;gap:8px;font-family:Bowlby,Impact,sans-serif;font-size:40px;text-shadow:0 3px #082b3f}.level-tile.locked{border-color:#3c697c;color:#7694a1;background:linear-gradient(#244759,#17364b);filter:saturate(.5)}.level-tile.locked:before{content:'◆';font-size:19px;position:absolute;opacity:.22}.level-tile.cleared{background:linear-gradient(#49865d,#236044);border-color:#9bd895;box-shadow:inset 0 4px #d5ffce33,0 7px #123b2d,0 12px 16px #0004}.tile-stars{display:flex;gap:5px;height:20px}.tile-stars i{width:22px;height:22px;background:#0b2b3f;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}.tile-stars i.on{background:linear-gradient(#fff5ad,#ffbc27)}.level-tile small{font-family:RobotoCond,Arial,sans-serif;font-size:14px;color:#aacbd3;letter-spacing:1px;text-shadow:none}.skin-row{width:100%;display:grid;gap:18px}.skin-card{display:flex;align-items:center;gap:18px;min-height:130px;padding:16px 18px;border:2px solid #5b9bad;border-radius:26px;background:linear-gradient(#24576a,#12384f);box-shadow:inset 0 3px #a7e8ef22,0 6px #031d31;color:#eefaff;text-align:left}.skin-swatch{width:90px;height:90px;border-radius:20px;flex:0 0 90px;box-shadow:inset 0 0 0 4px #b3f5ff45,inset 0 -12px 0 #00121b44,0 5px #021f32}.skin-info{flex:1}.skin-info b{display:block;font-family:Bowlby,Impact,sans-serif;font-size:23px;text-shadow:0 2px #041d30}.skin-info span{display:block;margin-top:7px;font-size:20px;color:#acd0dc}.skin-card .price{font-size:24px}.skin-card .chip{font-size:21px;padding:7px 10px}.skin-card.owned .price{color:#b0f69b;font-size:32px}.skin-card.active{border-color:#ffdb70;box-shadow:inset 0 0 0 2px #ffd94d,0 6px #5d461b}.mission-list{width:100%;display:grid;gap:19px}.mission{padding:21px 23px;background:linear-gradient(#245365,#12394d);border:2px solid #4b879b;border-radius:24px;box-shadow:0 5px #041d30}.mission b{font-size:25px;color:#f4fbff}.mission .bar{height:16px;border-radius:8px;background:#031b2d;margin-top:15px;overflow:hidden;box-shadow:inset 0 2px #0005}.mission .bar i{height:100%;display:block;background:linear-gradient(#b0f983,#42bc65);border-radius:8px}.mission .meta{display:flex;justify-content:space-between;margin-top:10px;font-size:20px;color:#a6ced9}.mission .meta span:last-child{color:#ffd968}.mission.done{border-color:#a7e593;box-shadow:inset 0 0 0 1px #82de82,0 5px #113b2e}.toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 4px;font-size:28px;cursor:pointer}.toggle input{position:absolute;opacity:0;pointer-events:none}.toggle i{position:relative;width:94px;height:50px;border-radius:28px;background:#06263b;border:2px solid #4c8192;box-shadow:inset 0 4px 8px #0006;transition:background .18s}.toggle i:after{content:'';position:absolute;top:4px;left:5px;width:38px;height:38px;border-radius:50%;background:linear-gradient(#f8ffff,#a3c5d0);box-shadow:0 3px #071d2b,0 4px 8px #0007;transition:transform .18s}.toggle input:checked+i{background:linear-gradient(#8bdf63,#35a95c);border-color:#b2e999}.toggle input:checked+i:after{transform:translateX(43px)}.toggle input:focus-visible+i{outline:4px solid #ffdf6b;outline-offset:4px}.fineprint{font-size:20px;color:#a5c9d7;margin:5px 0 11px;text-align:center}.collection-grid{width:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:24px}.collection-card{position:relative;min-height:272px;text-align:center;border:3px solid #5c9aad;border-radius:28px;background:radial-gradient(ellipse at 50% 30%,#3a7280,#123d53 70%);box-shadow:inset 0 3px #c4ffff22,0 7px #041d31;padding:15px 12px 17px;overflow:hidden}.collection-card img,.collection-card canvas{display:block;width:100%;height:175px;object-fit:contain;margin:0 auto 8px;filter:drop-shadow(0 9px 8px #00182688)}.collection-card b{display:block;font-family:Bowlby,Impact,sans-serif;font-size:23px;line-height:1.2;color:#ffe391;text-shadow:0 3px #59441d}.collection-card small,.collection-card span{display:block;font-size:19px;color:#a0c5d3;margin-top:6px}.collection-card.locked img{filter:saturate(.6) brightness(.65) drop-shadow(0 9px 8px #00182688)}.collection-card.locked:after{content:'LOCKED';position:absolute;right:8px;top:9px;background:#032034cc;border:1px solid #83acb65e;padding:5px 9px;border-radius:12px;color:#b1cbd4;font-size:14px;letter-spacing:1px}#coin-fx{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:50}.flying-coin,.coin-particle{position:absolute;width:35px;height:35px;border:3px solid #ffec8d;border-radius:50%;background:radial-gradient(circle at 32% 25%,#fff8a4,#ffd13f 55%,#d98a11);box-shadow:inset 0 0 0 4px #e7a41d,0 4px #9d5b16,0 0 22px #ffd45266}.coin-fx-label{position:absolute;color:#ffde56;font-family:Bowlby,Impact,sans-serif;font-size:34px;text-shadow:0 3px #6c451a,0 6px 10px #0008}.wallet-pop{animation:wallet-pop .35s ease}@keyframes wallet-pop{50%{transform:scale(1.16);filter:brightness(1.4)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:#3b788d;border-radius:8px}
/* Actual rendered 3D model previews, shared with the collection renderer. */
.menu-settings{background-size:314px 84px;background-position:-10px center;border:3px solid #92d9ed;border-radius:25px;box-shadow:inset 0 3px #c9ffff66,0 6px #022034;background-color:#087bcb}
.level-grid{grid-template-columns:repeat(3,1fr);gap:24px 20px}
.level-tile{position:relative;height:220px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;padding:12px 8px 13px;gap:5px;overflow:hidden}
.level-tile>img{position:absolute;top:12px;left:6px;width:calc(100% - 12px);height:135px;object-fit:contain;filter:drop-shadow(0 6px 4px #00162366)}
.level-tile>span:first-of-type{position:absolute;top:9px;left:12px;font-size:23px;line-height:1;color:#fff1ad;z-index:2;text-shadow:0 3px #03263b}
.level-tile .tile-stars{height:23px;gap:3px}
.level-tile .tile-stars i{clip-path:none;background:none;color:#0b293d;font-size:23px;line-height:1;font-family:Arial,sans-serif;font-style:normal;width:24px;height:24px;text-shadow:0 2px #001824}
.level-tile .tile-stars i.on{background:none;color:#ffd95e;text-shadow:0 2px #9c5e1d}
.level-tile small{font-size:16px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}
.level-tile.locked:before{display:none}
.tile-lock{position:absolute!important;left:auto!important;right:10px;top:10px!important;font-size:19px!important;z-index:2;color:#bfd6df!important}
.collectible{position:relative;min-height:282px;text-align:center;border:3px solid #5c9aad;border-radius:28px;background:radial-gradient(ellipse at 50% 30%,#3a7280,#123d53 70%);box-shadow:inset 0 3px #c4ffff22,0 7px #041d31;padding:15px 12px 17px;overflow:hidden}
.collectible img{display:block;width:100%;height:175px;object-fit:contain;margin:0 auto 8px;filter:drop-shadow(0 9px 8px #00182688)}
.collectible h3{margin:0;font-family:Bowlby,Impact,sans-serif;font-size:23px;line-height:1.2;color:#ffe391;text-shadow:0 3px #59441d}
.collectible p{margin:9px 0 0;font-size:19px;color:#a0c5d3;line-height:1.2}
.collectible.locked img{filter:saturate(.6) brightness(.65) drop-shadow(0 9px 8px #00182688)}
.collectible.locked:after{content:'LOCKED';position:absolute;right:8px;top:9px;background:#032034cc;border:1px solid #83acb65e;padding:5px 9px;border-radius:12px;color:#b1cbd4;font-size:14px;letter-spacing:1px}
.skin-swatch{display:grid;place-items:center;font-size:46px;overflow:hidden}.skin-swatch img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 3px #00172588)}
.flying-coin{display:grid;place-items:center;color:#fff6ad;font-family:Arial,sans-serif;font-size:29px;line-height:1;animation:coinFly .8s cubic-bezier(.2,.65,.4,1) forwards;opacity:0;will-change:transform,opacity}
@keyframes coinFly{0%{opacity:0;transform:translate(0,0) scale(.3) rotate(0)}15%{opacity:1;transform:translate(var(--burst-x,0px),-65px) scale(1.2) rotate(80deg)}40%{opacity:1;transform:translate(var(--burst-x,0px),-100px) scale(1) rotate(160deg)}90%{opacity:1}100%{opacity:0;transform:translate(var(--coin-x,0px),var(--coin-y,-600px)) scale(.45) rotate(600deg)}}
.match-pop{position:absolute;color:#fff2a0;font-family:Bowlby,Impact,sans-serif;font-size:34px;text-align:center;text-shadow:0 3px #755217,0 6px 10px #001b28;white-space:nowrap;pointer-events:none;animation:matchPop 1s ease-out forwards;z-index:4}
@keyframes matchPop{0%{opacity:0;transform:translate(-50%,0) scale(.4)}18%{opacity:1;transform:translate(-50%,-24px) scale(1.13)}35%{opacity:1;transform:translate(-50%,-30px) scale(1)}75%{opacity:1}100%{opacity:0;transform:translate(-50%,-95px) scale(.9)}}
.match-pop{left:50%;top:790px}

/* Final portrait composition: isolate illustrated hero and keep tray unobstructed. */
.hero-screen{isolation:isolate;background:#062638}.tutorial{top:185px;left:65px;right:130px;font-size:21px}.tray-caption{top:985px}


/* Approved illustrated wordmark from the publishing banner. */
.logo,.logo.menu-logo{top:20px;transform:none;filter:drop-shadow(0 7px 4px #00111c88)}.game-title-art{display:block;width:580px;height:auto;object-fit:contain}.logo-kicker{margin-top:-3px;font-size:17px;letter-spacing:2px}.menu-settings{z-index:3}.hero-badge{display:none}.menu-stats{top:755px}

/* Final illustrated UI: original raster artwork, painted surfaces and ink contours. */
.backdrop{background:linear-gradient(#042d45b8,#02192be6),url('../assets/art/splash-master.png') center/cover}.workshop-grid{opacity:.15}
.sheet-screen{background:linear-gradient(#042d45ce,#02182beb),url('../assets/art/splash-master.png') center/cover}
.sheet-head{background:url('../assets/ui/hud.png') center/100% 100% no-repeat;min-height:115px;padding:13px 15px 20px;margin-bottom:20px}.sheet-head h2{font-size:32px;color:#ffde71;text-shadow:3px 3px #052236,-2px -1px #052236}.sheet-head .icon-btn{width:76px;height:76px}
.icon-btn{background:transparent url('../assets/ui/undo.png') center/contain no-repeat!important;border:0!important;box-shadow:none!important;border-radius:0!important}.icon-btn svg{visibility:hidden}#btn-pause{width:85px;height:85px;background-image:url('../assets/ui/pause.png')!important}.menu-settings{background:transparent url('../assets/ui/settings-square.png') center/contain no-repeat!important;background-size:contain!important;border:0;box-shadow:none;width:90px;height:90px}
.topbar{top:14px;left:13px;right:13px;gap:8px}.level-pill{height:142px;padding:20px 35px 17px;background:url('../assets/ui/hud.png') center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none}.level-pill strong{font-size:28px;color:#ffdd68}.level-pill span{font-size:18px;margin:5px 0}.level-pill small{color:#bce6e9;font-size:12px;margin-top:5px}.pips{gap:5px}.pips i{width:48px;height:7px;border:1px solid #03304b}.wallet{min-width:130px;gap:2px;margin-top:6px}.wallet .chip{background:transparent url('../assets/ui/wallet-coins.png') center/100% 100% no-repeat;width:136px;height:57px;padding:7px 10px 10px 37px;border:0;border-radius:0;box-shadow:none;font-size:24px}.wallet .chip.gem{background-image:url('../assets/ui/wallet-gems.png')}.wallet .chip i{display:none}
.rail-btn{background:transparent url('../assets/ui/trophies.png') left center/330% 100% no-repeat;border:0;border-radius:0;box-shadow:none;width:91px;height:82px}.rail-btn svg{display:none}.rail-btn>span{position:absolute;bottom:-4px;font:12px Bowlby;letter-spacing:0;text-shadow:2px 2px #05283b,-1px -1px #05283b}.side-rail{right:10px;top:190px;gap:22px}#btn-shop{background-image:url('../assets/ui/garage.png')}.badge{top:-4px;right:-2px}
.boosters{left:30px;right:30px;bottom:31px;height:148px;gap:17px}.booster{background:transparent center/contain no-repeat;border:0;border-radius:0;box-shadow:none;filter:drop-shadow(0 6px 3px #0006)}.booster svg{display:none}.booster span{position:absolute;left:-4px;right:-4px;bottom:-4px;text-align:center;font-size:20px;color:#fff5bd;text-shadow:3px 3px #052a3f,-2px -2px #052a3f,2px -2px #052a3f,-2px 2px #052a3f}.booster .count{top:0;right:-5px;border-color:#082b3c;background:linear-gradient(#ffef9b,#efbc3e);color:#724008;box-shadow:inset 0 0 0 2px #fff6b0,0 3px #031d2b;text-shadow:none}.booster.armed{border:0;box-shadow:none;filter:drop-shadow(0 0 15px #ffcf38) brightness(1.2)}#bst-hint{background-image:url('../assets/ui/hint.png')}#bst-undo{background-image:url('../assets/ui/undo.png')}#bst-magnet{background-image:url('../assets/ui/magnet.png')}#bst-bomb{background-image:url('../assets/ui/drill.png')}
.tutorial,.toast{background:transparent url('../assets/ui/tip.png') center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none;color:#173b4d;text-shadow:none;padding:24px 39px;font-size:21px}.tutorial{top:177px;left:76px;right:116px;min-height:103px}.tutorial:before{color:#a96818;text-shadow:none}.toast{z-index:60;max-width:610px;min-height:95px;padding:25px 43px;top:166px}
.tray-caption{top:991px;background:#052a42df;border:3px solid #cf9d3f;color:#fff0c0;font:18px Bowlby;padding:5px 18px;box-shadow:0 4px #032135;z-index:2}
.level-grid{grid-template-columns:repeat(2,1fr);gap:22px 15px}.level-tile,.level-tile.locked,.level-tile.cleared{position:relative;height:380px;padding:0;display:block;background:transparent url('../assets/ui/level-frame.png') center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none;filter:drop-shadow(0 6px 4px #00111c88);overflow:visible}.level-tile:disabled{filter:drop-shadow(0 6px 4px #00111c88);pointer-events:none}.level-tile:before{display:none!important}.level-tile>img{position:absolute;left:34px;right:34px;top:44px;width:calc(100% - 68px);height:236px;object-fit:contain;margin:0;filter:drop-shadow(0 8px 4px #001c3166)}.level-tile.locked>img{filter:drop-shadow(0 8px 4px #001c3166);opacity:.85}.level-tile>span{position:absolute;top:19px;left:30%;width:40%;text-align:center;font:26px Bowlby;color:#603607;text-shadow:0 1px #fff2ac}.level-tile small{position:absolute;left:25px;right:25px;top:299px;font:17px Bowlby;text-align:center;letter-spacing:0;color:#fff3bb;text-shadow:2px 2px #05263b}.level-tile .tile-stars{position:absolute;left:0;right:0;top:329px;justify-content:center;gap:7px}.level-tile .tile-stars i{width:27px;height:27px;font-size:26px;color:#153b53;filter:drop-shadow(0 2px #001629)}.level-tile .tile-stars i.on{color:#ffd43b}.tile-lock{position:absolute;right:24px;top:30px;font-size:25px;filter:drop-shadow(0 3px #001629)}
.collectible{background:transparent url('../assets/ui/level-frame.png') center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none;height:390px;padding:40px 28px 25px}.collectible img{height:235px;object-fit:contain}.collectible h3{font:17px Bowlby;margin:15px 0 6px;color:#ffedb5}.collectible p{font-size:16px}.collectible.locked img{filter:none;opacity:.85}.collectible.locked:after{top:24px;right:29px;background:#05283ad9;color:#ffecaa;transform:none;left:auto;font-size:12px;border:0}
.card{background:transparent url('../assets/ui/panel-master.png') center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none;min-height:710px;padding:68px 56px 64px;gap:16px;align-content:center;filter:drop-shadow(0 15px 20px #00111bbb)}.card:before,.card:after{display:none}.card h2{font-size:36px;margin:3px 0 14px;color:#ffe382;text-shadow:3px 4px #062840}.big-btn,.big-btn.ghost{background:transparent url('../assets/ui/button-gold.png') center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none;height:74px;min-height:74px;font-size:24px;color:#fff7d5;text-shadow:2px 3px #724511,-2px -1px #724511;width:100%}.big-btn.play{background-image:url('../assets/ui/button-green.png');color:#fffbd9;text-shadow:2px 3px #365809,-2px -1px #365809}.big-btn.reward-btn{background-image:url('../assets/ui/button-gold.png');text-shadow:2px 3px #724511}.big-btn.ghost{filter:hue-rotate(145deg) saturate(.7)}.big-btn svg{width:30px;height:30px}.win-card h2{font-size:31px}.star-row i{width:76px;height:76px}.star-row i:nth-child(2){width:90px;height:90px}.reason{font-size:23px}.fineprint{font-size:19px}.toggle{font-size:25px;padding:7px 0}
.skin-card{background:transparent url('../assets/ui/hud.png') center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none;min-height:150px;padding:20px 34px;gap:15px}.skin-card.active{border:0;box-shadow:none;filter:drop-shadow(0 0 6px #ffcb45)}.skin-swatch{width:110px;height:110px;flex-basis:110px;border:0;box-shadow:none;border-radius:0;background:transparent!important}.skin-info b{font-size:22px;color:#ffe384}.skin-info span{font-size:18px}.skin-card .chip{background:transparent;border:0;box-shadow:none;padding:0}.mission{background:transparent url('../assets/ui/hud.png') center/100% 100% no-repeat;border:0;border-radius:0;box-shadow:none;padding:25px 40px}.mission.done{border:0;box-shadow:none;filter:drop-shadow(0 0 5px #a7d95b)}.mission b{font-size:23px}.section-label{color:#ffe283;font:21px Bowlby;text-shadow:2px 3px #062334}

#level-grid .level-tile>span:first-of-type{left:30%;top:21px;width:40%;font-size:26px;color:#633607;text-shadow:0 1px #fff3ab;text-align:center}


/* V3 target boxes: visible collection goals and limited spare slots. */
.target-collectors{position:absolute;left:68px;right:68px;top:147px;height:115px;display:flex;gap:19px;pointer-events:none}.target-box{position:relative;flex:1;background:url('../assets/ui/hud.png') center/100% 100% no-repeat;text-align:center;padding:12px 28px 13px;filter:drop-shadow(0 5px 3px #00182777)}.target-box strong{display:block;font:17px Bowlby;color:var(--target-color);text-shadow:2px 2px #012335;line-height:1.1}.target-box>b{position:absolute;right:21px;top:14px;font-size:16px;color:#ffedb1}.target-sockets{display:flex;justify-content:center;gap:8px;margin-top:7px}.target-sockets i{width:49px;height:49px;display:grid;place-items:center;border:3px solid var(--target-color);border-radius:50%;box-shadow:inset 0 3px 8px #0009;background:#031d30}.target-sockets img{width:54px;height:54px;max-width:none;filter:drop-shadow(0 2px 1px #001321)}.target-box.finished{opacity:.7}.target-box.finished .target-sockets{visibility:hidden}.target-queue{position:absolute;top:262px;left:100px;right:100px;height:31px;display:flex;align-items:center;justify-content:center;gap:8px;background:#062537db;border-radius:20px;padding:0 12px;pointer-events:none}.target-queue>span{font:13px Bowlby;color:#a2d4df}.target-queue img{width:27px;height:27px}.target-queue>b{font-size:14px;color:#ffe59b;margin-left:15px}.motion-status{position:absolute;top:301px;left:130px;right:130px;padding:8px 12px;border:2px solid #ffdb6e;border-radius:14px;background:#062a3fed;text-align:center;font:16px Bowlby;color:#ffe7a0;pointer-events:none;z-index:4}.side-rail{top:310px}.tutorial{top:304px;left:90px;right:90px;font-size:18px;min-height:75px;padding:17px 31px;z-index:5}.tutorial:before{font-size:16px}.toast{top:291px;font-size:20px}.tray-caption{top:972px;font-size:16px}.level-pill{height:130px}.level-pill strong{font-size:26px}.level-pill span{font-size:17px}.level-pill small{font-size:12px}.pips{margin-top:2px}

/* Keep all spare sockets visible while the player plans the next colour. */
.tray-caption{top:916px}

#ad-wait { position:absolute; inset:0; z-index:900; display:grid; place-items:center; background:rgba(5,19,33,.88); }
#ad-wait[hidden] { display:none; }
#ad-wait span { display:grid; place-items:center; width:500px; height:170px; background:url('../assets/ui/hud.png') center/100% 100% no-repeat; color:#ffe586; font:32px 'Bowlby One SC',sans-serif; }
/* Portal reset confirmation uses the game's illustrated button artwork. */
.reset-confirm{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.reset-confirm[hidden]{display:none}
.reset-confirm p{grid-column:1/-1;text-align:center;color:#ffe59b;font-size:23px;margin:0 0 8px}
.reset-confirm .big-btn{width:100%;min-height:78px;font-size:20px;padding:8px 5px}

/* Illustrated UI: safe illustrated surfaces and complete, readable labels.
 * Set the entire background contract on every variant: earlier, more-specific
 * gradient shorthands otherwise leave the 1874px raster at its natural size.
 * Bowlby's ink is taller than a typical UI font; reserve its full line box.
 */
html,body{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.big-btn,.big-btn.play,.big-btn.reward-btn,.big-btn.ghost{
  background-color:transparent;
  background-image:url('../assets/ui/button-gold.png');
  background-position:center;
  background-size:100% 100%;
  background-repeat:no-repeat;
  border:0;border-radius:0;box-shadow:none;
  width:100%;max-width:100%;min-width:0;
  height:auto;min-height:92px;flex-shrink:0;
  padding:15px 46px;gap:12px;
  font-size:24px;line-height:1.6;
  text-align:center;white-space:normal;word-break:normal;
  justify-self:stretch;align-items:center;
}
.big-btn.play{background-image:url('../assets/ui/button-green.png')}
.big-btn svg{width:26px;height:26px;flex:0 0 26px}
.modal{justify-content:flex-start;padding:36px 28px 44px;overflow-x:hidden;overflow-y:auto;scroll-padding:36px 0 44px}
.card{width:610px;max-width:100%;min-width:0;min-height:680px;flex-shrink:0;margin:auto 0;padding:0;gap:18px;align-content:start;justify-items:stretch;background:none;border:solid transparent;border-width:112px 86px;border-image:url('../assets/ui/panel-master.png') 230 160 fill stretch}
.card>*{min-width:0;max-width:100%}
.card h2,.win-card h2{font-size:32px;line-height:1.6;margin:0 0 6px;text-wrap:balance;overflow-wrap:normal}
.card .reason{font-size:23px;line-height:1.4;margin:0 0 6px}
.card .fineprint{font-size:20px;line-height:1.4;margin:0 0 6px}
.card .reward{justify-self:center}
.star-row{justify-content:center;min-height:105px;padding:7px 0;margin:0}
.reset-confirm{grid-template-columns:minmax(0,1fr);gap:14px}
.reset-confirm p{font-size:22px;line-height:1.4;margin:0 0 4px}
.reset-confirm .big-btn{font-size:22px;line-height:1.6;min-height:88px;padding:14px 44px}
.card .toggle{padding:7px 12px}
#coin-fx{z-index:15}

/* Text and decorative art are separate boxes, including in scrollable sheets. */
.sheet-screen{padding:28px 24px 52px;scroll-padding:28px 0 52px}
.sheet-head{flex-shrink:0;min-height:124px;padding:20px 28px;margin-bottom:22px}
.sheet-head h2{min-width:0;font-size:30px;line-height:1.6;overflow-wrap:normal}
.sheet-head>span{min-width:74px;max-width:170px;flex:0 0 auto}
.section-label{line-height:1.6}
.sheet-intro{line-height:1.4}
.skin-row,.mission-list{min-width:0;grid-template-columns:minmax(0,1fr)}
.skin-card{width:100%;min-width:0;min-height:150px;display:grid;grid-template-columns:96px minmax(0,1fr) max-content;gap:18px;padding:24px 38px}
.skin-swatch{width:96px;height:96px;min-width:0}
.skin-info{min-width:0}
.skin-info b{font-size:21px;line-height:1.6;overflow-wrap:normal}
.skin-info span{font-size:18px;line-height:1.4;margin-top:4px}
.skin-card .price{min-width:64px;font-size:24px;text-align:right;white-space:nowrap}
.skin-card .chip{font-size:22px;line-height:1.4;white-space:nowrap}
.mission{min-width:0;padding:28px 44px}
.mission b{display:block;font-size:22px;line-height:1.6}
.mission .meta{gap:16px;line-height:1.4}

/* Keep the complete captions inside the frame's actual bottom plaque. */
.level-grid,.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
.level-tile,.level-tile.locked,.level-tile.cleared,.collectible{min-width:0;height:390px;overflow:visible}
.level-tile>img{top:50px;left:32px;width:calc(100% - 64px);height:228px}
#level-grid .level-tile>span:first-of-type{top:10px;left:30%;width:40%;height:50px;display:grid;place-items:center;font:26px/1.6 Bowlby}
.level-tile small{left:18%;right:18%;top:74%;height:14%;width:auto;max-width:none;display:flex;align-items:center;justify-content:center;margin:0;padding:0 2px;font:16px/1.6 Bowlby;white-space:normal;overflow:visible;text-overflow:clip;text-align:center}
.level-tile .tile-stars{top:90%;height:27px}
.collectible{padding:0}
.collectible img{position:absolute;left:32px;top:50px;width:calc(100% - 64px);height:228px;margin:0}
.collectible h3{position:absolute;left:18%;right:18%;top:74%;height:14%;display:flex;align-items:center;justify-content:center;margin:0;font:16px/1.6 Bowlby;text-align:center}
.collectible p{position:absolute;left:16%;right:16%;top:89.5%;margin:0;padding:2px 4px;border:1px solid #d3a640;border-radius:9px;background:#05263bf5;color:#e0f3ff;font-size:14px;line-height:1.4;text-align:center}

/* The main action and its level subtitle must never share the same ink area. */
.play-art{height:156px;padding:14px 36px 14px 88px;gap:4px;flex-shrink:0}
.play-art span{font-size:48px;line-height:1.6}
.play-art small{max-width:100%;font-size:17px;line-height:1.4;letter-spacing:1px;text-align:center;white-space:normal}
.menu-grid .art-btn span{line-height:1.6}
.booster span{line-height:1.6;bottom:0}
#ad-wait span{font:30px/1.6 Bowlby,sans-serif;padding:28px 52px;text-align:center}
