:root{--accent:#4a6fb0;--bg:#eceff4;--card:#fff;--ink:#1d2330;--mute:#5d6676;--line:#e1e5ec;--dark:#333;--ok:#3f9d4d;--bad:#c94b3b;--r:28px;--sb:260px;
--soft:color-mix(in srgb,var(--accent) 12%,var(--card));--shadow:0 6px 24px rgba(30,40,70,.07);
--font:"Barlow","Inter",system-ui,-apple-system,"Segoe UI",sans-serif;--head:"Barlow Condensed","Arial Narrow","Roboto Condensed",system-ui,sans-serif}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#1b1e24;--card:#262a32;--ink:#eef1f6;--mute:#9aa3b2;--line:#363b45;--dark:#0f1115;--shadow:0 6px 24px rgba(0,0,0,.35)}}
:root[data-theme=dark]{--bg:#1b1e24;--card:#262a32;--ink:#eef1f6;--mute:#9aa3b2;--line:#363b45;--dark:#0f1115;--shadow:0 6px 24px rgba(0,0,0,.35)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--ink);font:500 16px/1.4 var(--font)}
h1,h2,h3{font-family:var(--head);font-weight:800;letter-spacing:-.01em;margin:0}
h1{font-size:clamp(30px,6vw,52px);line-height:1.05}h2{font-size:24px}h3{font-size:20px}
.mute{color:var(--mute)}.sm{font-size:14px}
button,input,select{font:inherit;color:inherit}
.btn{min-height:48px;padding:0 20px;border-radius:16px;border:1.5px solid var(--line);background:var(--card);font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.btn.pri{background:var(--accent);border-color:var(--accent);color:#fff}.btn.dng{color:var(--bad)}.btn.sm{min-height:40px;padding:0 14px;border-radius:12px}
.btn:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 55%,transparent);outline-offset:2px}
.btn:disabled{opacity:.5}
input,select{width:100%;min-height:48px;padding:0 14px;border-radius:14px;border:1.5px solid var(--line);background:var(--bg)}
input[type=color]{padding:4px;min-width:64px;width:64px}input[type=checkbox]{width:22px;min-height:22px;accent-color:var(--accent)}
label.f{display:block;font-weight:700;font-size:14px;margin:0 0 14px}label.f>*:first-child{margin-bottom:6px}label.f span{display:block;color:var(--mute);font-weight:600}
svg.i{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.shell{display:grid;grid-template-columns:var(--sb) 1fr;min-height:100dvh}
.side{position:sticky;top:0;height:100dvh;display:flex;flex-direction:column;background:var(--card);padding:28px 16px 16px;gap:4px;border-right:1px solid var(--line)}
.brand{padding:0 12px 20px;display:flex;flex-direction:column;gap:6px}.brand img{max-height:64px;max-width:100%;object-fit:contain;object-position:left}
.brand b{font:800 28px/1 var(--head)}
.nav{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;font-weight:700;color:var(--ink);text-decoration:none;border:2px solid transparent;cursor:pointer;background:none;width:100%;text-align:left}
.nav.on{background:var(--soft);color:var(--accent);border-color:var(--accent)}
.side .sp{flex:1}.side .foot{display:flex;flex-direction:column;gap:8px}
.main{min-width:0;display:flex;flex-direction:column}
.top{display:flex;align-items:center;justify-content:space-between;padding:calc(14px + env(safe-area-inset-top)) 32px 14px;background:var(--card);box-shadow:var(--shadow)}
.top .t{font:800 26px/1 var(--head)}.top .d{font-size:13px;color:var(--mute)}
.top .mlogo{display:none;max-height:36px}
.content{padding:32px;max-width:1280px;width:100%}
.head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px;flex-wrap:wrap}
.pill{background:var(--card);padding:10px 18px;border-radius:99px;font-weight:700;box-shadow:var(--shadow);font-size:14px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:20px}.grid>*,.card{min-width:0}
.card{background:var(--card);border-radius:var(--r);padding:24px;box-shadow:var(--shadow)}
.card.dark{background:var(--dark);color:#fff}.card.dark .mute{color:#b9bfca}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--accent);margin-right:8px}.dark .dot{background:var(--ok)}
.big{font:800 clamp(40px,7vw,64px)/1 var(--head);margin:16px 0 8px}
.row{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--line)}.row:first-child{border-top:0}
.row .g{flex:1;min-width:0}.row .g b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.av{width:44px;height:44px;border-radius:50%;background:var(--soft);color:var(--accent);display:grid;place-items:center;font:800 17px var(--head);flex:none}
.tag{display:inline-block;font-size:12px;font-weight:700;padding:3px 10px;border-radius:99px;background:var(--soft);color:var(--accent);margin-right:6px}.tag.off{background:var(--line);color:var(--mute)}
.perm{display:flex;align-items:center;gap:12px;padding:10px 0;font-weight:600}.perm label{flex:1;cursor:pointer}
dialog{border:0;border-radius:var(--r);padding:24px;width:min(560px,calc(100vw - 24px));max-height:90dvh;background:var(--card);color:var(--ink);box-shadow:0 20px 60px rgba(0,0,0,.35)}
dialog::backdrop{background:rgba(10,14,25,.5)}dialog .acts{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:18px}
.login{min-height:100dvh;display:grid;place-items:center;padding:20px}.login .card{width:min(420px,100%);padding:32px}.login img{max-height:72px;max-width:100%;margin-bottom:12px}
.err{color:var(--bad);font-weight:700;min-height:22px;margin:0 0 8px}
.pwbox{font:700 22px ui-monospace,Menlo,monospace;background:var(--bg);padding:14px;border-radius:14px;text-align:center;user-select:all;word-break:break-all}
#toast{position:fixed;left:50%;bottom:calc(90px + env(safe-area-inset-bottom));transform:translateX(-50%);background:var(--dark);color:#fff;padding:12px 20px;border-radius:99px;font-weight:700;opacity:0;pointer-events:none;transition:opacity .2s;z-index:99}#toast.on{opacity:1}
.tabbar{display:none}.logoprev{max-height:64px;max-width:200px;display:block;margin:0 0 10px}
@media(max-width:899px){
 .shell{grid-template-columns:1fr}.side{display:none}
 .top{padding:calc(10px + env(safe-area-inset-top)) 16px 10px}.top .mlogo{display:block}.top .t{font-size:22px}
 .content{padding:20px 16px calc(100px + env(safe-area-inset-bottom))}
 .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;background:var(--card);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom));z-index:50}
 .tabbar button{flex:1;min-height:56px;border:0;background:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:12px;font-weight:700;color:var(--mute);border-radius:14px}
 .tabbar button.on{color:var(--accent)}
 .grid{grid-template-columns:minmax(0,1fr)}.card{padding:20px}
 dialog{margin:auto auto 0;border-radius:var(--r) var(--r) 0 0;width:100%;max-height:92dvh;padding-bottom:calc(24px + env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
textarea{width:100%;min-height:90px;padding:12px 14px;border-radius:14px;border:1.5px solid var(--line);background:var(--bg);font:inherit;color:inherit}
input[type=datetime-local],input[type=date]{min-width:0}
.btn.yes.on{background:var(--ok);border-color:var(--ok);color:#fff}.btn.no.on{background:var(--bad);border-color:var(--bad);color:#fff}
.seg{display:inline-flex;background:var(--card);border-radius:14px;padding:4px;gap:4px;box-shadow:var(--shadow);margin:0 10px 14px 0}
.seg button{min-height:40px;padding:0 14px;border:0;background:none;border-radius:10px;font-weight:700;color:var(--mute);cursor:pointer}.seg button.on{background:var(--soft);color:var(--accent)}
.acts2{display:flex;gap:10px;flex-wrap:wrap}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ev{display:flex;gap:16px;align-items:center;flex-wrap:wrap;background:var(--card);border-radius:22px;padding:16px 18px;box-shadow:var(--shadow);margin-bottom:12px;cursor:pointer}
.ev.x{opacity:.55}.ev .dt{width:52px;text-align:center;flex:none}.ev .dt b{display:block;font:800 30px/1 var(--head)}.ev .dt span{font-size:13px;color:var(--mute);font-weight:700}
.ev .g{flex:1;min-width:180px}.ev .ttl{font:800 22px/1.15 var(--head)}.rs{display:flex;gap:8px}.rs .btn{min-width:120px}
.mon{margin:22px 0 10px;font:800 20px var(--head);text-transform:capitalize}
.banner{background:color-mix(in srgb,var(--bad) 15%,var(--card));color:var(--bad);padding:10px 14px;border-radius:14px;font-weight:700;margin-bottom:12px}
.mh{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.mh h2{text-transform:capitalize}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:20px}.cal .h{text-align:center;font-size:12px;font-weight:700;color:var(--mute);padding:4px 0}
.cd{aspect-ratio:1/1;border:0;border-radius:14px;background:var(--card);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-weight:700;cursor:pointer;padding:0}
.cd.o{opacity:.4}.cd.t{outline:2px solid var(--accent)}.cd.s{background:var(--accent);color:#fff}
.cd i{display:flex;gap:3px;min-height:7px}.cd em{width:7px;height:7px;border-radius:50%;background:var(--accent)}.cd em.training,.cd em.other{background:var(--mute)}.cd.s em{background:#fff}
.sub{margin:6px 0 0;font-size:14px}
@media(max-width:899px){.ev .rs{width:100%}.rs .btn{flex:1;min-width:0}.two{grid-template-columns:1fr}}
.amt{font:800 22px/1.1 var(--head)}
@media(max-width:899px){.tabbar button{font-size:11px}}
.chip{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;color:#fff;font-weight:800;font-size:14px;margin-right:4px}
.pg{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}.pg img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;cursor:pointer;background:var(--bg)}
.lvh{position:sticky;top:0;margin:-24px -24px 8px;padding:20px 24px 12px;background:var(--card);z-index:3;border-bottom:1px solid var(--line)}
.sc{display:flex;align-items:center;justify-content:center;gap:14px;font:800 44px/1 var(--head)}.sc small{font:700 14px var(--font);color:var(--mute);max-width:90px;text-align:center}
.lp{display:flex;align-items:center;gap:8px;padding:10px 0;border-top:1px solid var(--line);flex-wrap:wrap}.lp .g{flex:1;min-width:140px}.lp .btn{min-height:52px;min-width:64px}
.lx{display:flex;gap:8px;flex-wrap:wrap;width:100%;padding-bottom:6px}.lx .btn{flex:1;min-width:84px;min-height:48px}
.tbl{overflow-x:auto}.tbl table{border-collapse:collapse;width:100%;min-width:560px}.tbl th,.tbl td{padding:10px 8px;text-align:right;white-space:nowrap;border-top:1px solid var(--line)}
.tbl th{font-size:13px;color:var(--mute);cursor:pointer;border-top:0}.tbl th:first-child,.tbl td:first-child{text-align:left}.tbl th.on{color:var(--accent)}
@media(max-width:899px){.sc{font-size:38px}}
.osl{font-size:12px;color:var(--mute);padding:8px 12px 0;margin:0}.osl b{color:var(--ink)}.login .osl{text-align:center;margin-top:18px}
.rl{display:grid;grid-template-columns:58px 1fr auto;gap:8px;align-items:center;font-size:13px;margin-top:5px}.rl .lb{font-weight:700}.rl .rt{color:var(--mute);white-space:nowrap}.rl .rt b{color:var(--ink)}
.rb{display:flex;height:8px;border-radius:99px;overflow:hidden;background:var(--line)}.rb i{display:block;min-width:0}.rb .y{background:var(--ok)}.rb .n{background:var(--bad)}.rb .o{background:var(--line)}
.mine{background:var(--soft);border-radius:20px;padding:16px;margin:14px 0}.mine .rs .btn{min-height:52px}
.ov{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ovc{background:var(--bg);border-radius:18px;padding:14px}.ovt{font-weight:700;font-size:14px;color:var(--mute)}
.ovn{display:flex;align-items:baseline;gap:6px;margin:2px 0 8px}.ovn b{font:800 40px/1 var(--head)}.ovn span{font-size:13px;color:var(--mute)}.ovs{font-size:13px;color:var(--mute);margin-top:6px}
.seg button{flex:1}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{overflow-x:clip;max-width:100%}
body,button,a,input,select,textarea,.btn,.nav,.cd,.ev,.row{touch-action:manipulation}
input,select,textarea{font-size:16px}
.row .g b,.ev .g,.ttl{overflow-wrap:anywhere}
.seg{max-width:100%;overflow-x:auto;scrollbar-width:none}.seg::-webkit-scrollbar{display:none}.seg button{white-space:nowrap}
.perm{flex-wrap:wrap}
@media(max-width:899px){.big{font-size:clamp(34px,10vw,52px);overflow-wrap:anywhere}}
.btn{color:var(--ink)}
.btn.yes:not(.on){color:var(--ok);border-color:color-mix(in srgb,var(--ok) 50%,transparent)}
.btn.no:not(.on){color:var(--bad);border-color:color-mix(in srgb,var(--bad) 50%,transparent)}
.btn.pri,.btn.yes.on,.btn.no.on{color:#fff}.btn.dng{color:var(--bad)}
.card.dark .btn:not(.on):not(.pri){background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.28)}
.card.dark .btn.yes:not(.on){color:#8fe09b}.card.dark .btn.no:not(.on){color:#ffa89b}
.alg{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.alc{background:var(--card);border-radius:20px;overflow:hidden;box-shadow:var(--shadow);cursor:pointer}.alc img,.alc .ph{width:100%;aspect-ratio:4/3;object-fit:cover;display:grid;place-items:center;background:var(--bg);color:var(--mute);font-size:13px}
.alc .alt{padding:10px 12px}.alc .alt b{display:block;overflow-wrap:anywhere}.alc .alt span{font-size:13px;color:var(--mute)}
.pgx{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:6px}.pgx .pi{position:relative;cursor:pointer}.pgx .pi img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:12px;display:block;background:var(--card)}
.lb img{width:100%;max-height:68dvh;object-fit:contain;border-radius:14px;background:var(--bg)}
a.btn{text-decoration:none}
dialog .seg button{padding:0 8px;font-size:14px}
.sec{font:800 22px/1.1 var(--head);margin:24px 0 10px}.sech{display:flex;justify-content:space-between;align-items:center;margin-top:26px;margin-bottom:10px}
.pi .ck{display:none;position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:50%;border:2px solid #fff;background:rgba(0,0,0,.35);box-shadow:0 1px 4px rgba(0,0,0,.3)}
.selmode .pi .ck{display:block}.pi.sel .ck{background:var(--accent)}.pi.sel .ck::after{content:'✓';color:#fff;font:700 15px/20px var(--font);display:block;text-align:center}.pi.sel img{opacity:.65}
#selbar{position:fixed;left:0;right:0;bottom:calc(64px + env(safe-area-inset-bottom));z-index:60;background:var(--card);box-shadow:0 -6px 24px rgba(0,0,0,.18);padding:10px 12px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
#selbar b{margin-right:auto;font-size:14px}body.selmode .content{padding-bottom:210px}
@media(min-width:900px){#selbar{left:var(--sb);bottom:0}body.selmode .content{padding-bottom:110px}}
input[type=radio]{width:22px;min-height:22px;accent-color:var(--accent)}
.celeb{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:20px;background:rgba(10,14,25,.78);animation:cfade .3s ease}
.celeb.loss{background:rgba(22,28,45,.88)}.celeb canvas{position:absolute;inset:0;pointer-events:none}
.cbox{position:relative;background:var(--card);border-radius:32px;padding:28px 24px;width:min(380px,100%);text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.4);animation:cpop .45s cubic-bezier(.2,1.4,.4,1)}
.cemo{font-size:64px;line-height:1}.cbox h1{margin:8px 0 4px}.cscore{font:800 54px/1.1 var(--head);margin:6px 0}
.celeb.win .cbox h1,.celeb.win .cscore{color:var(--ok)}.celeb.loss .cbox h1{color:var(--mute)}.cbox p{margin:6px 0}.cbox .btn{width:100%;margin-top:14px}
@keyframes cfade{from{opacity:0}to{opacity:1}}@keyframes cpop{from{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.celeb,.cbox{animation:none}}
.qro{font:800 22px var(--head);text-align:center;padding:10px;border-radius:14px;background:var(--bg);margin:4px 0 10px}
.fbi{background:var(--bg);border-radius:16px;padding:12px 14px;margin:0 0 10px;white-space:pre-wrap;overflow-wrap:anywhere}.fbi small{display:block;color:var(--mute);margin-top:6px}