html,body,#app{color:#f8fafc;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:#11151d;width:100%;height:100%;margin:0;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow:hidden}canvas{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;display:block}.rotate-lock{z-index:30;color:#f8fafc;text-align:center;background:#11151d;flex-direction:column;justify-content:center;align-items:center;font-size:28px;font-weight:800;display:none;position:fixed;inset:0}.rotate-lock span{color:#b7c1d1;margin-top:8px;font-size:16px;font-weight:600;display:block}.hero-select,.upgrade,.result{z-index:10;background:#080b12b8;justify-content:center;align-items:center;gap:12px;padding:20px;display:none;position:fixed;inset:0}.hero-select.is-open,.upgrade.is-open,.result.is-open{display:flex}.hero-grid{justify-content:center;gap:12px;display:flex}.hero-grid button,.upgrade button,.panel button{color:#f8fafc;min-width:132px;max-width:180px;min-height:112px;font:inherit;background:#1c2430;border:1px solid #ffffff2e;border-radius:8px;position:relative}.hero-grid button:hover,.upgrade button:hover,.panel button:hover,.pause:hover{background:#263142;border-color:#73b7ff}.hero-grid button:focus-visible,.upgrade button:focus-visible,.panel button:focus-visible,.pause:focus-visible{outline-offset:3px;outline:3px solid #ffd166}.hero-grid button:active,.upgrade button:active,.panel button:active,.pause:active{transform:translateY(1px)}.upgrade button.rarity-common{border-color:#d7dde8}.upgrade button.rarity-rare{border-color:#73b7ff}.upgrade button.rarity-epic{border-color:#b784ff}.upgrade button.rarity-unique{border-color:#ffd166}.upgrade kbd{color:#0f172a;background:#73b7ff;border-radius:6px;min-width:22px;padding:3px 0;font:700 12px/1 ui-sans-serif,system-ui;position:absolute;top:8px;left:8px}.hero-panel{text-align:center;background:#1c2430;border:1px solid #ffffff2e;border-radius:8px;width:min(620px,100vw - 40px);padding:20px}.hero-panel h1{margin:0 0 8px;font-size:28px}.hero-subtitle{color:#b7c1d1;margin:0 0 16px;font-size:14px;font-weight:700}.continue-run{width:min(100%,420px);min-height:50px;margin:0 0 14px;background:#263142!important;border-color:#73b7ff!important;font-weight:900!important}.hero-grid button.is-selected{border-color:#73b7ff}.hero-grid img{width:42px;height:42px}.hero-grid strong{margin:6px 0;font-size:18px;display:block}.hero-grid span{color:#b7c1d1;font-size:13px;display:block}.hero-grid small{color:#ffd166;margin-top:6px;font-size:12px;font-weight:800;display:block}.hero-grid em{color:#73b7ff;margin-top:8px;font-size:12px;font-style:normal;font-weight:700;display:block}.panel{text-align:center;background:#1c2430;border:1px solid #ffffff2e;border-radius:8px;width:min(360px,100vw - 40px);padding:20px}.panel h1{margin:0 0 14px;font-size:28px}.panel dl{grid-template-columns:repeat(2,1fr);gap:10px;margin:0;display:grid}.panel div{background:#ffffff0f;border-radius:6px;padding:8px}.panel dt{color:#b7c1d1;font-size:12px}.panel dd{margin:2px 0 0;font-weight:700}.panel p{color:#b7c1d1;margin:14px 0;font-size:13px}.result-reason{font-weight:900;color:#ffd166!important;font-size:15px!important}.panel button{min-height:52px;padding:0 18px;font-weight:900}.pause{z-index:2;color:#f8fafc;background:#1c2430d6;border:1px solid #ffffff2e;border-radius:8px;width:42px;height:42px;font:700 18px/1 ui-sans-serif,system-ui;position:fixed;top:14px;right:14px}.balance-toggle{z-index:2;color:#f8fafc;background:#1c2430d6;border:1px solid #ffffff2e;border-radius:8px;width:42px;height:42px;font:700 16px/1 ui-sans-serif,system-ui;position:fixed;top:62px;right:14px}.balance-panel{background:#1c2430;border:1px solid #ffffff2e;border-radius:8px;width:min(760px,100vw - 32px);max-height:calc(100vh - 32px);padding:16px}.balance-panel h1{margin:0 0 12px;font-size:22px}.balance-fields{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:8px;max-height:calc(100vh - 160px);display:grid;overflow:auto}.balance-fields label{background:#ffffff0f;border-radius:6px;grid-template-columns:1fr 84px;align-items:center;gap:8px;padding:8px;display:grid}.balance-fields span{color:#b7c1d1;text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.balance-fields input{box-sizing:border-box;color:#f8fafc;background:#11151d;border:1px solid #ffffff2e;border-radius:6px;width:100%}.balance-actions{justify-content:flex-end;gap:8px;margin-top:12px;display:flex}.balance-actions button{color:#f8fafc;min-height:38px;font:inherit;background:#263142;border:1px solid #ffffff2e;border-radius:8px}.toast{z-index:12;color:#f8fafc;background:#1c2430eb;border:1px solid #ffffff2e;border-radius:8px;max-width:min(420px,100vw - 32px);padding:10px 14px;font-weight:700;position:fixed;bottom:28px;left:50%;transform:translate(-50%)}.upgrade strong{margin:6px 0;font-size:18px;display:block}.upgrade em{color:#ffd166;background:#ffffff17;border-radius:999px;padding:3px 7px;font-size:12px;font-style:normal;font-weight:900;position:absolute;top:8px;right:8px}.upgrade img{width:38px;height:38px}.upgrade span{color:#b7c1d1;font-size:13px;display:block}@media (width<=560px){.hero-grid,.upgrade{flex-direction:column}.hero-grid button,.upgrade button{width:min(100%,320px)}}@media (orientation:landscape) and (height<=560px){.hero-select,.upgrade,.result{padding:12px max(16px, env(safe-area-inset-right)) 12px max(16px, env(safe-area-inset-left));gap:10px}.hero-panel{width:min(760px,100vw - 32px);padding:14px}.hero-panel h1,.panel h1{margin-bottom:10px;font-size:24px}.hero-grid{gap:10px}.hero-grid button,.upgrade button{min-width:150px;max-width:190px;min-height:118px;padding:10px;font-size:15px}.upgrade button{min-width:180px;min-height:132px}.hero-grid img,.upgrade img{width:44px;height:44px}.hero-grid strong,.upgrade strong{font-size:18px}.hero-grid span,.upgrade span,.hero-subtitle,.panel p{font-size:14px}.panel{width:min(520px,100vw - 32px);padding:16px}.panel dl{grid-template-columns:repeat(3,1fr)}.panel dt{font-size:13px}.panel dd{font-size:18px}.panel button,.continue-run{min-height:52px;font-size:16px}.pause{top:max(10px, env(safe-area-inset-top));right:max(10px, env(safe-area-inset-right));width:48px;height:48px;font-size:20px}.toast{top:max(14px, env(safe-area-inset-top));bottom:auto}}@media (orientation:portrait) and (width<=768px){.rotate-lock{display:flex}}