:root{--ink:#25162f;--ink-soft:#66526d;--paper:#fff9e9;--paper-deep:#f0dab0;--plum:#24162f;--plum-2:#392145;--coral:#ff6b6b;--mint:#35d6a4;--gold:#ffc857;--cream:#fff5d6;--line:#3e254821;--shadow:0 24px 70px #0e061657}*{box-sizing:border-box}html{background:var(--plum);min-width:0}body{color:var(--cream);background:var(--plum);-webkit-font-smoothing:antialiased;margin:0;font-family:Avenir Next,PingFang SC,Microsoft YaHei,system-ui,sans-serif}button{color:inherit;font:inherit;border:0}button:not(:disabled){cursor:pointer}button:focus-visible,canvas:focus-visible{outline:3px solid var(--gold);outline-offset:4px}.game-page{isolation:isolate;background:radial-gradient(circle at 15% 5%,#a65bb538,#0000 28%),radial-gradient(circle at 86% 35%,#24c6aa1f,#0000 26%),linear-gradient(145deg,#21132c 0%,#2f193a 52%,#1b1224 100%);min-height:100svh;padding:24px clamp(18px,3vw,48px) 42px;position:relative;overflow:hidden}.game-page:before{z-index:-2;content:"";opacity:.7;background-image:radial-gradient(circle at 10% 20%,#ffffff0e 0 2px,#0000 2.5px),radial-gradient(circle at 70% 70%,#ffffff0a 0 1px,#0000 1.5px);background-size:42px 42px,31px 31px;position:fixed;inset:0}.game-page:after{z-index:-1;aspect-ratio:1;content:"";border:44px solid #ffc8570e;border-radius:50%;width:470px;position:fixed;bottom:-180px;right:-120px;box-shadow:0 0 0 42px #ff6b6b06}.ambient-thread{z-index:-1;pointer-events:none;border:5px solid #ffc85717;border-right-color:#0000;border-radius:60% 30% 55% 35%;width:220px;height:360px;position:fixed}.ambient-thread-one{top:18%;left:-85px;transform:rotate(18deg)}.ambient-thread-two{border-color:#35d6a414 #35d6a414 #0000;top:-160px;right:19%;transform:rotate(76deg)scale(.7)}.game-header{z-index:5;justify-content:space-between;align-items:center;width:min(1280px,100%);margin:0 auto 12px;display:flex;position:relative}.brand-lockup,.header-status,.level-chip,.score-chip,.life-pips{align-items:center;display:flex}.brand-lockup{gap:14px}.brand-lockup h1{letter-spacing:-.06em;margin:0;font-size:clamp(24px,2.4vw,36px);font-weight:900;line-height:1}.brand-lockup p{color:#fff5d694;letter-spacing:.11em;margin:7px 0 0;font-size:12px}.brand-spool{background:#ffffff12;border:1px solid #ffffff1f;border-radius:18px;place-items:center;width:54px;height:54px;display:grid;position:relative;transform:rotate(-5deg);box-shadow:inset 0 1px #ffffff1a,0 12px 30px #00000029}.brand-spool:before,.brand-spool:after{background:var(--gold);content:"";border-radius:5px;width:30px;height:7px;position:absolute;left:12px}.brand-spool:before{top:9px;transform:rotate(4deg)}.brand-spool:after{bottom:9px;transform:rotate(-3deg)}.brand-spool span{background:repeating-linear-gradient(0deg,#ff6b6b 0 4px,#e65366 4px 7px);border-radius:5px;width:24px;height:29px;box-shadow:inset 0 0 0 3px #fff3}.header-status{gap:10px}.level-chip,.score-chip,.life-pips,.round-button{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffff13;border:1px solid #ffffff1a;min-height:50px;box-shadow:inset 0 1px #ffffff1c,0 10px 28px #07020c21}.level-chip{border-radius:18px;gap:11px;padding:8px 17px;transition:transform .2s,background .2s}.level-chip:hover,.round-button:hover{background:#ffffff1f;transform:translateY(-2px)}.level-chip span{color:var(--mint);letter-spacing:.12em;font-size:9px;font-weight:900}.level-chip strong{font-size:16px}.score-chip{border-radius:18px;gap:8px;padding:0 16px}.score-star{color:var(--gold);text-shadow:0 0 16px #ffc85799;font-size:21px}.life-pips{border-radius:18px;gap:7px;padding:0 16px}.life-pip{opacity:.2;width:18px;height:22px;transition:opacity .25s,transform .25s;position:relative}.life-pip:before{content:"";background:repeating-linear-gradient(0deg,#ff6b6b 0 3px,#de4d62 3px 5px);border:2px solid #ff7d83;border-radius:4px;position:absolute;inset:2px 3px;box-shadow:-4px -3px 0 -2px #ffcc8d,4px 3px 0 -2px #ffcc8d}.life-pip.active{opacity:1;transform:rotate(-2deg)}.round-button{border-radius:17px;width:50px;min-width:50px;padding:0;font-size:22px;font-weight:800;transition:transform .2s,background .2s}.sound-button{color:var(--gold)}.game-layout{z-index:1;grid-template-columns:minmax(540px,830px) 278px;justify-content:center;align-items:center;gap:clamp(20px,2.8vw,38px);width:min(1210px,100%);margin:0 auto;display:grid;position:relative}.play-zone{min-width:0}.level-heading{justify-content:space-between;align-items:flex-end;width:min(680px,91%);margin:0 auto 9px;display:flex}.eyebrow,.card-kicker{color:var(--gold);letter-spacing:.17em;text-transform:uppercase;margin-bottom:6px;font-size:10px;font-weight:900;display:block}.level-heading h2{letter-spacing:-.055em;margin:0;font-size:clamp(26px,3vw,40px);font-weight:900;line-height:1.05}.level-heading p{color:#fff5d694;margin:7px 0 0;font-size:13px}.remaining-badge{background:#ffffff0f;border:1px solid #ffffff1a;border-radius:16px;grid-template-columns:auto auto;align-items:center;gap:2px 8px;min-width:88px;padding:9px 13px;display:grid}.remaining-badge strong{color:var(--mint);grid-row:1/3;font-size:27px;line-height:1}.remaining-badge span{color:#fff5d68c;font-size:10px}.hoop-shell{aspect-ratio:9/11;background:linear-gradient(120deg,#ffffff3b,#0000 28%),repeating-linear-gradient(98deg,#a96531 0 8px,#c98643 8px 18px,#8b4e29 18px 23px);border-radius:34px;width:min(610px,91%,60.5455svh);margin:0 auto;padding:clamp(12px,1.8vw,19px);position:relative;box-shadow:0 34px 65px #05010961,inset 0 0 0 3px #fff4bc66,inset 0 0 0 8px #461f1740,0 0 0 1px #ffffff1f}.hoop-shell:before,.hoop-shell:after{z-index:2;content:"";pointer-events:none;border:2px solid #4a2d1973;border-radius:25px;position:absolute;inset:15px}.hoop-shell:after{border-color:#ffffff38;inset:21px}.hoop-screw{z-index:3;background:linear-gradient(90deg,#8f8295,#e2dfe5 46%,#716577);border:3px solid #5a475e;border-radius:11px;width:58px;height:40px;position:absolute;top:-18px;right:10%;box-shadow:0 8px 15px #00000040}.hoop-screw span{border:4px solid #96899b;border-bottom:0;border-radius:6px 6px 0 0;width:24px;height:18px;position:absolute;top:-14px;left:17px}.game-canvas{touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-radius:21px;width:100%;height:100%;display:block}.thread-access-list{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.board-caption{color:#fff5d6ad;letter-spacing:.03em;justify-content:center;align-items:center;gap:9px;min-height:30px;font-size:12px;display:flex}.caption-dot{background:var(--mint);border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 5px #35d6a41a,0 0 14px #35d6a4a6}.caption-dot.danger{background:var(--coral);box-shadow:0 0 0 5px #ff6b6b1a,0 0 14px #ff6b6ba6}.tool-dock{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#fff1;border:1px solid #ffffff1a;border-radius:22px;grid-template-columns:repeat(4,minmax(92px,1fr));gap:9px;width:min(560px,90%);margin:2px auto 0;padding:7px;display:grid;box-shadow:inset 0 1px #ffffff17,0 18px 45px #0401082e}.tool-dock button{color:#fff5d6c2;background:0 0;border-radius:16px;justify-content:center;align-items:center;gap:7px;min-height:48px;padding:0 12px;font-size:12px;font-weight:700;transition:color .2s,background .2s,transform .2s;display:flex}.tool-dock button:hover:not(:disabled){color:#fff;background:#ffffff1a;transform:translateY(-2px)}.tool-dock button:disabled{opacity:.27}.tool-icon{color:var(--gold);font-size:20px;line-height:1}.side-rail{flex-direction:column;gap:10px;display:flex}.workshop-card{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#fff1;border:1px solid #ffffff1a;border-radius:25px;padding:18px;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff1a,0 24px 50px #04010829}.workshop-card h3{letter-spacing:-.035em;margin:0;font-size:20px}.tip-card:after{content:"";border:15px solid #ffc8570f;border-radius:50%;width:150px;height:150px;position:absolute;bottom:-65px;right:-30px}.tip-card ol{gap:13px;margin:16px 0 14px;padding:0;list-style:none;display:grid}.tip-card li{color:#fff5d6ad;align-items:center;gap:10px;font-size:12px;display:flex}.tip-card li span{width:25px;height:25px;color:var(--mint);background:#ffffff0f;border:1px solid #ffffff1f;border-radius:9px;place-items:center;font-size:10px;font-weight:900;display:grid}.mini-needle{width:100%;height:28px;position:relative;transform:rotate(-4deg)}.mini-needle i{background:linear-gradient(90deg, var(--coral), #ee718e);border-radius:5px;width:67%;height:6px;position:absolute;top:12px;left:0;box-shadow:0 3px #00000026}.mini-needle b{background:linear-gradient(#f7f7fb,#77727f);border-radius:6px 100% 100% 6px;width:38%;height:10px;position:absolute;top:9px;right:0}.progress-title{justify-content:space-between;align-items:flex-end;display:flex}.progress-title>strong{color:var(--mint);font-size:24px}.progress-track{background:#ffffff14;border-radius:8px;height:8px;margin:20px 0;overflow:hidden}.progress-track span{border-radius:inherit;background:linear-gradient(90deg, var(--mint), #71e7b8);height:100%;transition:width .45s cubic-bezier(.2,.8,.2,1);display:block;box-shadow:0 0 14px #35d6a473}.progress-card dl{grid-template-columns:1fr 1fr;gap:10px;margin:0;display:grid}.progress-card dl div{background:#ffffff0a;border:1px solid #ffffff14;border-radius:13px;padding:11px}.progress-card dt{color:#fff5d67a;font-size:9px}.progress-card dd{margin:4px 0 0;font-size:15px;font-weight:800}.made-note{color:#fff5d661;gap:10px;margin:1px 4px;font-size:10px;line-height:1.6;display:flex}.made-note span{color:var(--gold)}.overlay{z-index:50;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0c0611ad;place-items:center;padding:24px;animation:.22s ease-out both fade-in;display:grid;position:fixed;inset:0}.level-drawer,.result-card{width:min(620px,100%);color:var(--cream);background:radial-gradient(circle at 90% 0,#35d6a41f,#0000 30%),#33203d;border:1px solid #ffffff21;border-radius:30px;animation:.28s cubic-bezier(.2,.8,.2,1) both lift-in;box-shadow:0 35px 100px #0000007a,inset 0 1px #ffffff1f}.level-drawer{padding:26px}.drawer-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.drawer-header h2{margin:0;font-size:28px}.level-grid{grid-template-columns:repeat(2,1fr);gap:11px;display:grid}.level-card{text-align:left;background:#ffffff0e;border:1px solid #ffffff17;border-radius:17px;grid-template-rows:1fr 1fr;grid-template-columns:44px 1fr 30px;gap:1px 12px;min-height:76px;padding:14px;transition:transform .2s,border-color .2s,background .2s;display:grid;position:relative}.level-card:hover:not(:disabled),.level-card.current{background:#35d6a417;border-color:#35d6a46b;transform:translateY(-2px)}.level-card:disabled{opacity:.34}.level-number{color:var(--gold);background:#ffffff12;border-radius:13px;grid-row:1/3;place-items:center;font-size:15px;font-weight:900;display:grid}.level-card strong{align-self:end;font-size:13px}.level-card small{color:#fff5d66e;align-self:start;font-size:9px}.level-card i{color:var(--mint);grid-area:1/3/3;align-self:center;font-size:18px;font-style:normal}.result-card{text-align:center;max-width:470px;padding:38px}.result-seal{border-radius:26px;place-items:center;width:75px;height:75px;margin:0 auto 23px;font-size:37px;font-weight:900;display:grid;transform:rotate(-4deg)}.result-seal.won{color:#163f35;background:var(--mint);box-shadow:0 14px 35px #35d6a447}.result-seal.lost{color:#572029;background:var(--coral);box-shadow:0 14px 35px #ff6b6b3d}.result-card h2{letter-spacing:-.05em;margin:2px 0 10px;font-size:34px}.result-card p{color:#fff5d68c;margin:0;font-size:13px}.result-actions{grid-template-columns:1fr 1.3fr;gap:10px;margin-top:28px;display:grid}.result-actions button{border-radius:16px;min-height:51px;font-size:13px;font-weight:800}.secondary-action{background:#ffffff0f;border:1px solid #ffffff1c}.primary-action{color:#263329;background:var(--gold);box-shadow:0 12px 25px #ffc8572e}@keyframes fade-in{0%{opacity:0}}@keyframes lift-in{0%{opacity:0;transform:translateY(18px)scale(.98)}}@media (width<=1040px){.game-layout{grid-template-columns:minmax(500px,720px) 240px;gap:22px}.workshop-card{padding:18px}.side-rail{gap:11px}}@media (width<=880px){.game-page{padding-bottom:30px}.game-header{width:min(720px,100%)}.game-layout{width:min(720px,100%);display:block}.side-rail{grid-template-columns:1fr 1fr;width:min(620px,91%);margin:24px auto 0;display:grid}.made-note{display:none}}@media (width<=640px){.game-page{padding:14px 10px 24px}.game-header{margin-bottom:17px}.brand-lockup{gap:9px}.brand-spool{border-radius:14px;width:44px;height:44px}.brand-spool:before,.brand-spool:after{width:24px;left:10px}.brand-spool span{width:20px;height:24px}.brand-lockup h1{font-size:23px}.brand-lockup p,.score-chip,.life-pips{display:none}.header-status{gap:6px}.level-chip{border-radius:14px;min-height:44px;padding:6px 11px}.level-chip span{display:none}.level-chip strong{font-size:13px}.round-button{border-radius:14px;width:44px;min-width:44px;min-height:44px}.level-heading{align-items:center;width:92%;margin-bottom:12px}.level-heading h2{font-size:25px}.level-heading p{max-width:240px;font-size:11px}.remaining-badge{min-width:73px;padding:7px 9px}.remaining-badge strong{font-size:23px}.hoop-shell{width:96%;padding:12px}.hoop-shell:before{inset:10px}.hoop-shell:after{inset:15px}.hoop-screw{width:48px;height:32px;top:-13px}.board-caption{width:94%;margin:0 auto;font-size:10px}.tool-dock{border-radius:19px;gap:3px;width:96%}.tool-dock button{gap:4px;min-width:0;min-height:46px;padding:0 5px;font-size:10px}.tool-icon{font-size:17px}.side-rail{width:96%;margin-top:16px;display:block}.tip-card{display:none}.progress-card{border-radius:20px;padding:15px 17px}.progress-card .card-kicker{margin-bottom:2px}.progress-card h3{font-size:16px}.progress-track{margin:13px 0}.progress-card dl{display:none}.overlay{align-items:end;padding:12px}.level-drawer{border-radius:27px 27px 22px 22px;padding:21px 16px 24px}.level-grid{grid-template-columns:1fr;max-height:60svh;overflow-y:auto}.result-card{margin-bottom:max(0px, env(safe-area-inset-bottom));padding:30px 22px}.result-actions{grid-template-columns:1fr 1.25fr}}@media (height<=760px) and (width>=881px){.game-page{padding-top:14px}.game-header{margin-bottom:8px}.hoop-shell{width:min(560px,54vh)}.level-heading{margin-bottom:9px}.board-caption{min-height:29px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
