:root{color-scheme:dark;--bg: #101827;--panel: rgba(15, 25, 40, .92);--line: rgba(238, 214, 152, .24);--gold: #f5d88e;--muted: #b8c4d6;--text: #fff7df;font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--text);background:radial-gradient(circle at 48% -8%,rgba(77,177,207,.26),transparent 310px),linear-gradient(180deg,#172a46,#0c111d 62%)}button,input,select{font:inherit}button{min-height:36px;border:1px solid rgba(245,216,142,.56);border-radius:8px;padding:0 12px;background:linear-gradient(180deg,#755321,#2d2418);color:#fff4ce;font-weight:800}input,select{min-width:0;min-height:38px;border:1px solid rgba(255,255,255,.13);border-radius:8px;padding:0 11px;background:rgba(255,255,255,.94);color:#182235;font-weight:800;outline:none}.app{width:min(100%,750px);min-height:100vh;margin:0 auto;padding:max(8px,env(safe-area-inset-top)) 10px 18px;background:rgba(7,14,25,.34);box-shadow:0 0 0 1px #f5d88e14,0 28px 80px #00000042}.app-header{position:relative;min-height:38px;display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-bottom:8px;padding:5px 8px;border:1px solid rgba(245,216,142,.24);border-radius:8px;background:linear-gradient(180deg,rgba(28,48,76,.94),rgba(10,20,36,.96)),radial-gradient(circle at 0 0,rgba(245,216,142,.18),transparent 88px)}.app-header strong{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#fff7df;font-size:17px;letter-spacing:0;white-space:nowrap}.auth-menu{position:relative;z-index:2}.auth-entry{min-height:28px;max-width:128px;padding:0 12px;border-radius:999px;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.auth-dropdown{position:absolute;right:0;top:calc(100% + 6px);z-index:60;min-width:92px;overflow:hidden;border:1px solid rgba(245,216,142,.5);border-radius:8px;background:rgba(10,18,31,.98);box-shadow:0 12px 28px #0000005c}.auth-dropdown button{width:100%;min-height:32px;border:0;border-radius:0;background:transparent;color:#fff7df;font-size:12px}.auth-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;place-items:center;padding:18px;background:rgba(3,8,16,.72)}.auth-modal[hidden]{display:none}.auth-dialog{position:relative;width:min(100%,360px);padding:18px;border:1px solid rgba(245,216,142,.36);border-radius:10px;background:linear-gradient(180deg,rgba(20,35,56,.98),rgba(9,18,31,.98));box-shadow:0 18px 60px #00000075}.auth-dialog h2{margin:0 0 12px;color:#fff7df;font-size:20px}.auth-close{position:absolute;right:10px;top:10px;width:30px;min-height:30px;padding:0;border-radius:50%;background:rgba(255,255,255,.08)}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:8px}.auth-tabs button,.auth-form button{min-height:34px}.auth-tabs button{background:rgba(255,255,255,.08);color:#c7d2e4}.auth-tabs button.is-active{background:linear-gradient(180deg,#7e5a23,#3a2a17);color:#fff4ce}.auth-form{display:grid;gap:8px}.auth-form input{width:100%}.auth-message{min-height:18px;color:#ff9f9f;font-size:12px;line-height:1.4}.auth-message.info{color:#bdd7ff}.section-title{display:flex;align-items:center;justify-content:space-between;gap:10px}h1,h2,p{margin:0}h1{font-size:30px;line-height:1.15}h2{font-size:18px}.section-title span{color:var(--muted);font-size:12px;line-height:1.35}.panel{border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--panel)}.history-toolbar{min-height:40px;display:grid;grid-template-columns:minmax(92px,148px) 64px minmax(0,1fr);gap:6px;align-items:center;padding:4px 8px;background:linear-gradient(180deg,rgba(25,44,68,.96),rgba(12,24,40,.98)),radial-gradient(circle at 18px 0,rgba(245,216,142,.16),transparent 42px);box-shadow:inset 0 1px #f5d88e57,inset 0 -1px #4689be52}.history-toolbar:has(.room-profile[hidden]){grid-template-columns:minmax(92px,148px) 64px minmax(0,1fr)}.history-toolbar input,.history-toolbar button{min-height:30px;border-radius:0;border:0}.history-toolbar button{padding-inline:8px;background:transparent;color:#fff3d8;font-weight:800}.history-toolbar input{border-left:1px solid rgba(245,216,142,.18);background:rgba(5,13,25,.42);color:#fff7df;text-align:center;font-weight:650}.history-toolbar input::placeholder{color:#ffffffad}.history-columns{position:relative;min-width:0}.column-toggle{position:relative;width:64px;min-height:28px;border-radius:999px;padding:0 19px 0 9px;background:linear-gradient(180deg,#f6d879,#cf9c34);color:#5c3300;font-size:12px;font-weight:900;line-height:1;box-shadow:inset 0 1px #ffffff73,0 2px 8px #0000002e}.column-toggle:after{content:"";position:absolute;right:9px;top:50%;width:6px;height:6px;border-right:2px solid #5c3300;border-bottom:2px solid #5c3300;pointer-events:none;transform:translateY(-65%) rotate(45deg)}.column-menu{position:absolute;top:calc(100% + 4px);left:0;z-index:40;width:64px;overflow:hidden;border:1px solid rgba(245,216,142,.62);border-radius:8px;background:rgba(23,24,30,.94);box-shadow:0 10px 22px #00000059}.column-menu button{width:100%;min-height:28px;border-radius:0;padding:0;background:transparent;color:#fff7df;font-size:11px;font-weight:800;text-align:center}.column-menu button:hover,.column-menu button.is-active{background:rgba(245,216,142,.22);color:#fff}.room-picker{position:relative;min-width:0}.room-picker input{width:100%;font-size:13px;font-weight:760}.room-dropdown{position:absolute;top:calc(100% + 5px);right:0;left:0;z-index:30;max-height:232px;overflow-y:auto;border:1px solid rgba(245,216,142,.58);background:rgba(11,22,38,.98);box-shadow:0 12px 30px #0000005c}.room-option{width:100%;min-height:42px;border:0;border-radius:0;padding:5px 8px;display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:8px;align-items:center;background:transparent;color:#fff7df;text-align:left}.room-option:hover{background:rgba(245,216,142,.1)}.room-option img{width:28px;height:28px;border-radius:50%;object-fit:cover;background:rgba(255,255,255,.1)}.room-option-avatar{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.12)}.room-option strong,.room-option small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.room-option strong{font-size:13px;line-height:1.2}.room-option small{margin-top:2px;color:#fff7dfa8;font-size:10px;font-weight:650}.room-option em{color:#fff7dfb8;font-size:11px;font-style:normal;white-space:nowrap}.room-empty{padding:10px;color:#fff7dfb8;font-size:13px;font-weight:700}.room-profile{min-width:0;display:flex;align-items:center;gap:6px;padding-left:0;min-height:30px}.room-profile[hidden]{display:none}.room-profile img{width:26px;height:26px;border-radius:50%;border:1px solid rgba(245,216,142,.42);object-fit:cover;background:rgba(255,255,255,.08)}.room-profile span{min-width:0;max-width:112px;overflow:hidden;color:#fff7df;font-size:13px;font-weight:850;text-overflow:ellipsis;white-space:nowrap}section{margin-top:12px}.spell-section{margin-top:12px}input.is-error{border-color:#ff6262;box-shadow:0 0 0 2px #ff62623d}.section-title{margin:0 2px 8px}.spell-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) minmax(0,.92fr);grid-auto-rows:minmax(118px,auto);gap:7px}.spell-card{min-height:118px;border:1px solid color-mix(in srgb,var(--accent) 62%,transparent);border-radius:8px;padding:8px 6px 7px;background:radial-gradient(circle at 50% 25%,color-mix(in srgb,var(--accent) 35%,transparent),transparent 48px),linear-gradient(180deg,rgba(19,31,48,.92),rgba(8,15,26,.94));box-shadow:inset 0 0 18px color-mix(in srgb,var(--accent) 18%,transparent);overflow:hidden}.spell-card.solo-nine{grid-column:5;grid-row:1 / span 2;display:flex;flex-direction:column;justify-content:flex-start;min-height:243px;padding-top:20px}.beast-visual{position:relative;width:76px;height:58px;margin:-4px auto 3px;display:grid;place-items:center}.beast-visual img{display:block;width:58px;height:58px;object-fit:contain;transform:translate(var(--beast-shift-x, -4px),var(--beast-shift-y, 0))}.beast-visual span{position:absolute;left:50%;bottom:-2px;transform:translate(calc(-50% + var(--beast-label-shift-x, 0px)),var(--beast-label-shift-y, 0));max-width:74px;padding:1px 5px 2px;border-radius:999px;background:rgba(3,9,18,.66);color:#fff7e6;font-size:10px;font-weight:850;line-height:1;white-space:nowrap;text-shadow:0 1px 3px rgba(0,0,0,.9)}.spell-card.solo-nine .beast-visual{width:106px;height:92px;margin:-4px auto 2px}.spell-card.solo-nine .beast-visual img{width:88px;height:88px}.spell-card.solo-nine .beast-visual span{bottom:3px;max-width:82px;font-size:11px}.spell-card:nth-child(1){grid-column:1;grid-row:1}.spell-card:nth-child(2){grid-column:2;grid-row:1}.spell-card:nth-child(3){grid-column:3;grid-row:1}.spell-card:nth-child(4){grid-column:4;grid-row:1}.spell-card:nth-child(5){grid-column:1;grid-row:2}.spell-card:nth-child(6){grid-column:2;grid-row:2}.spell-card:nth-child(7){grid-column:3;grid-row:2}.spell-card:nth-child(8){grid-column:4;grid-row:2}.spell-main{display:flex;align-items:center;justify-content:center;gap:4px}.spell-main strong{min-height:28px;display:inline-grid;place-items:center;color:var(--accent);font-size:22px;line-height:1}.spell-main b{min-width:24px;min-height:24px;border-radius:50%;display:inline-grid;place-items:center;border:1px solid var(--num-border, rgba(255, 255, 255, .78));background:var(--num-bg, #fff);color:var(--num-fg, #101827);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:15px;font-weight:900}.spell-card p{margin:4px 0 0;color:#fff7e6;text-align:center;font-size:12px;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.spell-card footer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;margin-top:4px}.spell-card footer span{min-height:22px;border-radius:5px;display:grid;place-items:center;background:rgba(255,255,255,.08);color:#fff;font-size:10px;font-weight:760;white-space:nowrap}.spell-card footer .omission-stat{grid-column:1 / -1;min-height:18px}.recommend-panel{width:100%;margin-top:7px;display:grid;grid-template-columns:minmax(0,1fr);gap:4px;align-items:center;justify-content:center;padding:6px 4px;border:1px solid rgba(245,216,142,.22);border-radius:7px;background:linear-gradient(180deg,rgba(17,30,49,.92),rgba(9,17,30,.96)),radial-gradient(circle at 50% 0,rgba(245,216,142,.14),transparent 120px)}.recommend-label,.recommend-number{display:inline-grid;place-items:center;line-height:1;font-weight:850}.recommend-label{justify-self:center;width:52px;height:18px;border-radius:5px;color:#fff;font-size:12px;box-shadow:inset 0 1px #ffffff61}.recommend-main{background:linear-gradient(90deg,#b71914,#ff6045)}.recommend-guard{background:linear-gradient(90deg,#c8911d,#ffe08a);color:#5b3600}.recommend-number{min-width:22px;height:22px;border:1px solid var(--num-border, rgba(255, 255, 255, .72));background:var(--num-bg, rgba(255, 255, 255, .9));color:var(--num-fg, #162033);font-size:13px}.recommend-picks{min-width:0;display:flex;gap:4px;align-items:center;justify-content:center}.history-grid{display:grid;grid-template-columns:repeat(var(--history-columns, 20),minmax(0,1fr));gap:0;max-height:min(548px,75vw);overflow-y:auto;overscroll-behavior:contain;align-content:start}.history-cell{position:relative;aspect-ratio:1;min-width:0;border:1px solid var(--num-border, #d7dbe4);border-radius:0;display:grid;place-items:center;background:var(--num-bg, #20334e);color:var(--num-fg, #fff);font-family:Helvetica Neue,Arial,PingFang SC,Microsoft YaHei,sans-serif;font-size:16px;font-weight:380;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision;box-shadow:none;overflow:hidden}.history-value{position:relative;z-index:2;line-height:1}.history-cell.num-9{font-size:16px;font-weight:500;background:#ffffff;line-height:1}.pending-countdown{--num-bg: #ffffff;--num-fg: #d51f2a;--num-border: #e4e7ef;color:#d51f2a;background:#ffffff;font-weight:540;animation:pendingTextBlink 1s step-end infinite}.history-panel{--history-columns: 20;margin-top:10px;padding:0}.history-panel[data-columns="24"] .history-cell{font-size:14px}.history-panel[data-columns="36"] .history-cell{font-size:12px}.history-panel[data-columns="24"] .history-cell.num-9{font-size:14px}.history-panel[data-columns="36"] .history-cell.num-9{font-size:12px}.num-1,.num-2,.num-7,.num-8{--num-bg: #ffffff;--num-fg: #2b2f39;--num-border: #d7dbe4}.num-3{--num-bg: #ef2dff;--num-fg: #ffffff;--num-border: #d7dbe4}.num-4{--num-bg: #e9342e;--num-fg: #ffffff;--num-border: #d7dbe4}.num-5{--num-bg: #227bd7;--num-fg: #ffffff;--num-border: #d7dbe4}.num-6{--num-bg: #ffd12f;--num-fg: #684100;--num-border: #d7dbe4}.num-9{--num-bg: linear-gradient(135deg, #ff39f6, #37d8ff, #60ff9b, #ffe45f, #ff6a3d, #ff39f6);--num-fg: #000000;--num-border: #d7dbe4;position:relative;overflow:hidden;isolation:isolate;text-shadow:0 1px 1px rgba(255,255,255,.48)}.history-nine-bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;display:block;width:100%;height:100%;background:linear-gradient(135deg,#ff39f6 0%,#37d8ff 22%,#60ff9b 43%,#ffe45f 62%,#ff6a3d 80%,#ff39f6 100%)}.num-9:after{display:none}.spell-main b.num-9{background:linear-gradient(135deg,#ff39f6,#37d8ff,#60ff9b,#ffe45f,#ff6a3d,#ff39f6);background-size:260% 260%;color:#000;border-color:#fffffff5;text-shadow:0 1px 1px rgba(255,255,255,.7),0 0 6px rgba(255,255,255,.62);box-shadow:0 0 0 2px #ffffff57,0 0 10px #50dcffd1,0 0 18px #ff3ce1a8,0 0 25px #ffe0446b;animation:badgeRainbowShift 1.65s linear infinite,badgeRainbowPop 1.2s ease-in-out infinite alternate}@keyframes badgeRainbowShift{0%{background-position:0% 50%}to{background-position:220% 50%}}@keyframes badgeRainbowPop{0%{filter:saturate(1.08) brightness(1);transform:translateY(0) scale(1)}to{filter:saturate(1.45) brightness(1.15);transform:translateY(-1px) scale(1.08)}}@keyframes pendingTextBlink{0%,49%{color:#d51f2a;text-shadow:0 0 8px rgba(213,31,42,.42)}50%,to{color:#d51f2a94;text-shadow:0 0 4px rgba(213,31,42,.2)}}.trend-board{position:relative;overflow:hidden;width:100%;border:0;border-top:1px solid #d7dbe4;border-radius:0;background:rgba(255,255,255,.92);color:#3d4250}.trend-panel{margin-top:0;padding:0;border:0;background:transparent}.trend-head,.trend-row{display:grid;grid-template-columns:46px repeat(9,minmax(18px,1fr)) 26px 26px 26px 26px}.trend-head{position:relative;z-index:3;min-height:27px;background:#bfe8f7;color:#18283d;font-weight:900}.trend-head span,.trend-cell,.trend-period,.trend-cat{display:grid;place-items:center;min-width:0;min-height:28px;border-right:1px solid rgba(86,91,107,.16);border-bottom:1px solid rgba(86,91,107,.12);font-size:13px}.trend-head span{min-height:27px;border-color:#4185a142}.trend-period,.trend-cell,.trend-cat{color:#76667175;font-family:Arial,Helvetica Neue,PingFang SC,Microsoft YaHei,sans-serif;font-weight:400}.trend-cat.active{color:#fff;font-weight:700}.trend-cat.small,.trend-cat.big{color:#238fc0}.trend-cat.odd,.trend-cat.even{color:#2f9d39}.trend-line{position:absolute;top:27px;right:0;bottom:0;left:0;z-index:3;width:100%;height:calc(100% - 27px);pointer-events:none;overflow:visible}.trend-rows{position:relative;z-index:4}.trend-cell.active-number{color:#fff}.trend-dot{width:20px;height:20px;border-radius:50%;display:inline-grid;place-items:center;color:#fff;font-size:11px;font-weight:800;font-style:normal;line-height:1;box-shadow:inset 0 1px #ffffff38,0 1px 3px #0000002e}.trend-cell.active-number .trend-dot{background:#bf314d}.trend-cat.size-choice.active .trend-dot{background:#61c1e6}.trend-cat.parity-choice.active .trend-dot{background:#58a83c}.mapping-table{display:grid;gap:6px}.map-row{display:grid;grid-template-columns:38px minmax(0,1fr) 34px;gap:8px;align-items:center;min-height:48px;border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:6px}.map-row:last-child{border-bottom:0;padding-bottom:0}.map-row img{width:36px;height:36px;object-fit:contain}.map-row strong,.map-row span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.map-row strong{color:#fff;font-size:14px}.map-row span{margin-top:2px;color:var(--muted);font-size:12px}.map-row b{min-height:30px;border-radius:6px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 68%,rgba(255,255,255,.08));color:#fff}@media (max-width: 360px){.app{padding-inline:8px}.spell-grid{grid-auto-rows:minmax(104px,auto);gap:5px}.spell-card{min-height:104px;padding-inline:4px}.beast-visual{width:68px;height:52px}.beast-visual img{width:52px;height:52px}.beast-visual span{max-width:66px;font-size:9px}.spell-card.solo-nine{min-height:213px}.spell-main strong{font-size:19px}.history-grid{gap:0}.history-cell{border-radius:0;font-size:13px;font-weight:380}.history-cell.num-9{font-size:13px;font-weight:500}}