:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#060a1a;--text:#f5f6ff;--muted:#9ba5cb;--line:#a8b7ff2e;--glass:#0f1737ad;--cyan:#20c4ff;--violet:#7257ff;--coral:#ff715f;--pink:#d52cca}*{box-sizing:border-box}html,body{min-height:100%}body{background:var(--bg);color:var(--text);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang HK,PingFang SC,Noto Sans CJK,sans-serif;overflow:hidden}button,a{font:inherit}button{-webkit-tap-highlight-color:transparent}.app-shell{background:radial-gradient(circle at 50% 58%,#3f42b438,#0000 40%),linear-gradient(#07102a 0%,#060a1a 78%);min-height:100svh;position:relative;overflow:hidden}.app-shell:before{content:"";pointer-events:none;background:linear-gradient(90deg,#11a3ff14,#0000 25% 75%,#7735ff14);position:absolute;inset:0}.topbar{z-index:20;justify-content:space-between;align-items:center;width:100%;padding:24px clamp(22px,4vw,64px);display:flex;position:fixed;top:0;left:0}.brand{width:190px;height:62px;text-decoration:none;display:block;overflow:hidden}.brand-logo{object-fit:cover;object-position:center 43%;filter:invert()grayscale()brightness(1.8);mix-blend-mode:screen;width:100%;height:100%;display:block}.locale-switcher{border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#080d2394;border-radius:999px;gap:3px;padding:4px;display:flex;box-shadow:inset 0 1px #ffffff0f,0 14px 34px #0000002e}.locale-switcher button{color:#aeb7d8;cursor:pointer;background:0 0;border:0;border-radius:999px;min-width:52px;min-height:40px;padding:0 14px;font-size:.83rem;font-weight:650;transition:all .18s}.locale-switcher button:hover{color:#fff}.locale-switcher button.active{color:#fff;background:linear-gradient(135deg,#1caaf0,#6549f6);box-shadow:0 0 22px #3499ff7a,inset 0 1px #ffffff61}.locale-switcher button:focus-visible,.segments button:focus-visible,.roll-button:focus-visible,.brand:focus-visible{outline-offset:3px;outline:2px solid #fff}.game{grid-template-rows:auto minmax(280px,1fr) auto;min-height:100svh;padding:104px 24px 28px;display:grid;position:relative}.title-wrap{z-index:4;text-align:center;pointer-events:none;position:relative}.eyebrow{color:#8796ca;letter-spacing:.34em;margin:0 0 8px;font-size:.7rem;font-weight:800}h1{letter-spacing:-.055em;text-transform:uppercase;background:linear-gradient(105deg,#f5fbff 18%,#95cfff 54%,#b07aff 82%);color:#0000;filter:drop-shadow(0 8px 30px #5465ff42);-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(2.1rem,5.4vw,5rem);line-height:.96}.scene-wrap{z-index:1;position:absolute;inset:0}.scene-wrap canvas{touch-action:none}.scene-vignette{pointer-events:none;background:linear-gradient(#060a1a61 0%,#0000 25% 67%,#060a1ae6 92%),radial-gradient(#0000 38%,#02051157 100%);position:absolute;inset:0}.scene-loading{filter:blur(20px);background:radial-gradient(circle,#478aff6b,#0000 68%);border-radius:50%;animation:1.2s ease-in-out infinite alternate pulse;position:absolute;inset:28% 42%}@keyframes pulse{to{opacity:.45;transform:scale(1.18)}}.controls-wrap{z-index:5;place-self:end center;gap:12px;width:min(460px,100vw - 36px);display:grid;position:relative}.result{color:#8792bc;letter-spacing:.09em;text-transform:uppercase;justify-content:center;align-items:baseline;gap:9px;min-height:24px;font-size:.78rem;display:flex}.result strong{color:#fff;font-size:1rem}.result .total{color:#79d8ff}.controls{border:1px solid var(--line);background:var(--glass);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border-radius:19px;grid-template-columns:auto 1fr;align-items:center;gap:16px;padding:8px 9px 8px 20px;display:grid;box-shadow:inset 0 1px #ffffff17,0 18px 50px #00000052}.control-label{color:#dce3ff;letter-spacing:.18em;text-transform:uppercase;font-size:.78rem;font-weight:740}.segments{background:#090f2780;border:1px solid #b3c0ff21;border-radius:13px;grid-template-columns:repeat(3,1fr);display:grid;overflow:hidden}.segments button{color:#aeb8da;cursor:pointer;background:0 0;border:0;border-right:1px solid #b3c0ff1c;min-height:48px;font-size:1rem;font-weight:720;transition:all .18s}.segments button:last-child{border-right:0}.segments button:hover{color:#fff;background:#ffffff0a}.segments button.selected{color:#fff;background:linear-gradient(135deg,#22b9f3,#6449f3);box-shadow:0 0 22px #3992ff6b,inset 0 1px #fff6}.roll-button{color:#fff;background:linear-gradient(112deg, var(--coral), var(--pink));cursor:pointer;letter-spacing:.08em;text-transform:uppercase;border:1px solid #ffdbe65c;border-radius:20px;justify-content:center;align-items:center;gap:11px;min-height:62px;font-size:1rem;font-weight:800;transition:transform .16s,filter .16s,opacity .16s;display:flex;box-shadow:0 12px 38px #e733884d,inset 0 1px #fff6}.roll-button svg{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:20px}.roll-button:hover:not(:disabled){filter:brightness(1.09);transform:translateY(-2px)}.roll-button:active:not(:disabled){transform:translateY(1px)scale(.99)}.roll-button:disabled{cursor:wait;opacity:.72}.helper{color:var(--muted);text-align:center;margin:0;font-size:.75rem}@media (max-width:640px){.topbar{padding:max(16px, env(safe-area-inset-top)) 16px 0}.brand{width:158px;height:52px}.locale-switcher{padding:3px}.locale-switcher button{min-width:44px;min-height:38px;padding:0 9px;font-size:.75rem}.game{padding:105px 14px max(16px, env(safe-area-inset-bottom));grid-template-rows:auto 1fr auto}.eyebrow{margin-bottom:7px;font-size:.62rem}h1{letter-spacing:-.045em;white-space:nowrap;font-size:clamp(1.85rem,8vw,2.4rem)}.controls-wrap{gap:10px;width:min(100%,430px)}.result{font-size:.7rem}.controls{border-radius:17px;padding-left:16px}.segments button{min-height:50px}.roll-button{border-radius:18px;min-height:58px}.helper{font-size:.7rem}}@media (max-height:700px){.topbar{padding-top:14px}.game{padding-top:72px;padding-bottom:12px}.eyebrow{display:none}h1{font-size:clamp(1.8rem,7vh,3.2rem)}.controls-wrap{gap:7px}.result{display:none}.roll-button{min-height:52px}.helper{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
