:root{--bg:#F2F3F5;--card:#fff;--ink:#111418;--mut:#5B6470;--mut2:#8A929C;--line:#F0F1F3;--bd:#E1E4E8;--acc:#1D4ED8;--live:#D92D20;--r:16px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Figtree,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px;line-height:1.4;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
a{color:inherit;text-decoration:none}
img{display:block}
h1,h2,h3,p{margin:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--mut);font-size:14px}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:8px}

/* header */
.top{background:var(--card);position:sticky;top:0;z-index:20}
.top-in,.bar-in{max-width:1240px;margin:0 auto;padding:0 16px}
.top-in{display:flex;align-items:center;justify-content:space-between;height:60px}
.logo{font-weight:800;font-size:26px;letter-spacing:-.04em}
.logo b{color:var(--acc);font-weight:800}
.top-act{display:flex;align-items:center;gap:4px}
.icon-btn{width:44px;height:44px;display:grid;place-items:center;color:var(--ink);border-radius:12px}
.icon-btn:hover{background:var(--bg)}
.btn-dark{height:36px;padding:0 16px;border-radius:999px;background:var(--ink);color:#fff;font-weight:600;font-size:14px;display:inline-flex;align-items:center}

.bar{background:var(--card);border-bottom:1px solid #E6E8EB}
.pills{display:flex;gap:6px;overflow-x:auto;padding:4px 0 12px;scrollbar-width:none}
.pills::-webkit-scrollbar,.days::-webkit-scrollbar,.chips::-webkit-scrollbar,.shorts::-webkit-scrollbar{display:none}
.pill{flex:0 0 auto;height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--bd);display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14px;background:#fff}
.pill.on{background:var(--ink);border-color:var(--ink);color:#fff}
.pill.soon{color:var(--mut2)}
.pill small{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--mut2)}
.days-wrap{display:flex;align-items:stretch;border-top:1px solid #E6E8EB}
.days{flex:1;display:flex;overflow-x:auto}
.day{flex:1;min-width:84px;min-height:54px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--mut);border-bottom:3px solid transparent;font-size:12px}
.day b{font-size:14px;font-weight:600}
.day.on{color:var(--acc);border-bottom-color:var(--acc)}
.cal{color:var(--mut);align-self:center}

/* layout */
.wrap{max-width:1240px;margin:0 auto;padding:12px;display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
.col-l{display:none}
.col-c,.col-r{display:flex;flex-direction:column;gap:12px;min-width:0}
.card{background:var(--card);border-radius:var(--r)}
.pad{padding:16px}
.pad-l{padding:16px 0 16px 16px}
.row-h{display:flex;justify-content:space-between;align-items:center;padding-right:16px;margin-bottom:8px}
.pad .row-h{padding-right:0}
h3{font-size:16px;font-weight:700}
.lnk{font-size:13px;font-weight:600;color:var(--acc);min-height:44px;display:inline-flex;align-items:center}

.chips{display:flex;gap:6px;overflow-x:auto}
.chip{flex:0 0 auto;height:36px;padding:0 14px;border-radius:10px;border:0;background:#fff;font:inherit;font-size:13px;font-weight:700;cursor:pointer;color:var(--ink)}
.chip.live{color:var(--live)}
.chip.on{background:var(--ink);color:#fff}
.chip.live.on{background:var(--live)}

.favs{padding:12px 16px 14px}
.fav-list{display:flex;gap:14px;overflow-x:auto}
.fav{flex:0 0 64px;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--mut)}
.fav-c{width:48px;height:48px;border-radius:50%;border:1.5px dashed #B5BBC3;display:grid;place-items:center;font-size:22px}

/* leagues + matches */
#matches{display:flex;flex-direction:column;gap:12px}
.league{overflow:hidden}
.lg-h{display:flex;align-items:center;gap:10px;padding:12px 16px 6px}
.lg-logo{width:28px;height:28px;object-fit:contain;flex:0 0 28px}
.flag{display:grid;place-items:center;border-radius:8px;background:#C8102E;color:#fff;font-size:11px;font-weight:800}
.flag.sm{width:18px;height:18px;border-radius:5px;font-size:8px}
.lg-t{flex:1;min-width:0}
.lg-t h2{font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lg-t p{font-size:12px;color:var(--mut)}
.m{display:grid;grid-template-columns:48px minmax(0,1fr) 28px;align-items:center;gap:8px;padding:10px 16px;border-top:1px solid var(--line);min-height:64px}
.m:hover{background:#FAFBFC}
.t{font-size:13px;font-weight:500;color:var(--mut);text-align:center}
.t.live{color:var(--live);font-weight:700}
.teams{display:flex;flex-direction:column;gap:6px;min-width:0}
.tm{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:500;min-width:0}
.tm.win{font-weight:700}
.nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crest{width:20px;height:20px;object-fit:contain;flex:0 0 20px}
.crest.ph{border-radius:50%;background:var(--bd);display:grid;place-items:center;font-size:10px;font-weight:700;color:var(--mut)}
.sc{display:flex;flex-direction:column;gap:6px;text-align:right;font-weight:700;font-size:15px}
[data-status="live"] .sc{color:var(--live)}
.m[hidden],.league[hidden]{display:none}
.upd{font-size:12px;color:var(--mut2);padding:0 4px}
.empty{padding:24px 16px;text-align:center;color:var(--mut);display:flex;flex-direction:column;gap:6px}
.empty b{color:var(--ink)}
.empty.big{padding:48px 20px}
.empty.big h1{font-size:24px;color:var(--ink);margin-bottom:6px}

.promo{background:var(--ink);color:#fff;padding:18px;display:flex;align-items:center;gap:14px;justify-content:space-between}
.promo small{display:block;font-size:12px;font-weight:700;color:#FFC94D;letter-spacing:.04em}
.promo b{display:block;margin-top:4px;font-size:17px;line-height:1.3}
.promo-b{flex:0 0 auto;height:44px;padding:0 16px;border-radius:12px;background:#FFC94D;color:var(--ink);font-weight:700;display:inline-flex;align-items:center}

/* shorts + news */
.shorts{display:flex;gap:10px;overflow-x:auto;padding-right:16px}
.short{flex:0 0 132px}
.thumb{position:relative;display:block;width:132px;height:220px;border-radius:12px;overflow:hidden;background:#DCE3F0}
.thumb img{width:100%;height:100%;object-fit:cover}
.playb{position:absolute;inset:0;margin:auto;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.92);display:grid;place-items:center}
.st{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:8px;font-size:13px;font-weight:600;line-height:1.3}
.sch{display:block;margin-top:2px;font-size:12px;color:var(--mut)}
.news-list{display:flex;flex-direction:column}
.news{display:block;padding:12px 0;border-bottom:1px solid var(--line)}
.news:last-child{border-bottom:0}
.nt{display:block;font-size:15px;font-weight:600;line-height:1.35}
.news:hover .nt{color:var(--acc)}
.ns{display:block;margin-top:4px;font-size:12px;color:var(--mut)}

.side{padding:16px}
.lg-nav{display:flex;flex-direction:column;margin-top:8px}
.lg-nav a{display:flex;align-items:center;gap:10px;padding:8px 0;font-size:14px;font-weight:500}
.lg-nav a:hover{color:var(--acc)}
.lg-nav img{width:18px;height:18px;object-fit:contain}

.foot{max-width:1240px;margin:8px auto 0;padding:16px 16px 24px;font-size:12px;color:var(--mut2);display:flex;flex-direction:column;gap:4px}

/* bottom nav */
.bottom{position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;border-top:1px solid #E6E8EB;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding-bottom:env(safe-area-inset-bottom);height:calc(68px + env(safe-area-inset-bottom))}
.nav-i{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:11px;font-weight:500;color:var(--mut)}
.nav-i.on{color:var(--acc);font-weight:700}

@media (min-width:1024px){
  body{padding-bottom:0}
  .bottom{position:sticky;top:60px;bottom:auto;height:auto;padding:0;max-width:1240px;margin:0 auto;display:none}
  .wrap{grid-template-columns:220px minmax(0,1fr) 340px;padding:16px;align-items:start}
  .col-l{display:block;position:sticky;top:76px}
  .col-r{position:sticky;top:76px}
  .one{grid-template-columns:minmax(0,720px);justify-content:center}
}
.lang-btn{height:36px;padding:0 12px;border-radius:999px;border:1px solid var(--bd);display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink);margin-right:4px}
.lang-btn:hover{background:var(--bg)}
@media (max-width:420px){.lang-btn span{display:none}.lang-btn{width:40px;padding:0;justify-content:center}}
/* match hero */
.hero{background:#0E1726;color:#fff}
.hero-in{max-width:760px;margin:0 auto;padding:16px 16px 22px;text-align:center}
.hero-lg{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:#C9D1DC;min-height:44px}
.hero-lg img{width:20px;height:20px;object-fit:contain;background:#fff;border-radius:4px;padding:1px}
.hero-row{display:grid;grid-template-columns:minmax(0,1fr) 128px minmax(0,1fr);align-items:center;margin-top:8px}
.side-t{display:flex;flex-direction:column;align-items:center;gap:10px}
.side-t h2{font-size:15px;font-weight:600;line-height:1.25}
.crest-lg{width:56px;height:56px;object-fit:contain;background:#fff;border-radius:50%;padding:6px}
.crest-lg.ph{display:block;background:#22304A}
.big-score{font-size:40px;font-weight:800;letter-spacing:-.02em}
.big-score.time{font-size:30px}
.st{font-size:13px;color:#A9B4C4;margin-top:4px}
.st-live{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:#FF6B5E;margin-top:4px}
.dot{width:8px;height:8px;border-radius:50%;background:#FF6B5E}
.hero-meta{margin-top:14px;font-size:13px;color:#A9B4C4}
.bc{display:flex;align-items:center;gap:12px}
.bc-ic{width:44px;height:44px;border-radius:12px;background:#EEF2FF;color:var(--acc);display:grid;place-items:center;flex:0 0 44px}
.sm{font-size:12px}.b{font-weight:600}
.prob{margin-top:12px}
.prob-bar{display:flex;height:10px;gap:2px;border-radius:5px;overflow:hidden}
.prob-n{display:flex;justify-content:space-between;margin-top:8px;font-size:13px;color:var(--mut)}
.prob-n b{color:var(--ink);font-size:15px}
.sec-h{padding:4px 4px 0}
/* league */
.lg-head{display:flex;align-items:center;gap:14px}
.lg-head img{width:44px;height:44px;object-fit:contain}
.lg-head h1,.pg-h{font-size:22px;font-weight:800;letter-spacing:-.02em}
.tbl-wrap{overflow-x:auto;margin-top:8px}
.tbl{width:100%;border-collapse:collapse;font-size:14px;min-width:420px}
.tbl th{font-size:11px;font-weight:600;color:var(--mut2);text-align:center;padding:8px 4px;border-bottom:1px solid var(--line)}
.tbl td{text-align:center;padding:10px 4px;border-bottom:1px solid var(--line)}
.tbl .tn{text-align:left}
.tbl td.tn{display:flex;align-items:center;gap:8px;font-weight:500}
.tbl td.tn img{width:18px;height:18px;object-fit:contain}
.tbl .rk{color:var(--mut);width:28px}
.tbl .pt{font-weight:800}
.tbl .grp td{text-align:left;font-weight:700;background:#FAFBFC}
/* video */
.vchips{margin-top:12px}
.vgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.vid{margin:0;background:#fff;border-radius:var(--r);overflow:hidden}
.vid[hidden]{display:none}
.vthumb{position:relative;display:block;width:100%;aspect-ratio:16/9;border:0;padding:0;background:#DCE3F0;cursor:pointer}
.vid.is-short .vthumb{aspect-ratio:9/16}
.vthumb img,.vthumb iframe{width:100%;height:100%;object-fit:cover;border:0;display:block}
.vid figcaption{padding:10px 12px 12px}
.nsum{display:block;margin-top:4px;font-size:14px;color:var(--mut);line-height:1.45}
@media (min-width:720px){.vgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* login */
.login{padding:28px 20px;display:flex;flex-direction:column;gap:14px}
.logo.big{font-size:40px;font-weight:800;letter-spacing:-.04em}
.login h1{font-size:24px;font-weight:700;line-height:1.25;letter-spacing:-.02em}
.sso-list{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.sso{height:54px;border-radius:14px;display:flex;align-items:center;justify-content:center;gap:12px;font-weight:600;font-size:16px}
.sso.g{border:1px solid #DADCE0;background:#fff}
.sso.tk{background:var(--ink);color:#fff}
.sso.off{opacity:.55;cursor:not-allowed;font-size:14px}
.perks{background:var(--bg);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:8px;font-size:14px;color:#3C4249}
.legal{font-size:12px;color:var(--mut);text-align:center;line-height:1.5}
.err{background:#FCE8E6;color:#A50E0E;border-radius:10px;padding:10px 12px;font-size:14px;font-weight:600}
/* profile */
.prof-h{background:#fff;border-bottom:1px solid #E6E8EB}
.prof-in{max-width:720px;margin:0 auto;padding:18px 16px 20px}
.who{display:flex;align-items:center;gap:14px}
.av{width:64px;height:64px;border-radius:50%;background:var(--acc);color:#fff;display:grid;place-items:center;font-size:26px;font-weight:800;object-fit:cover;box-shadow:0 0 0 3px #fff,0 0 0 5px var(--acc);flex:0 0 64px}
.who h1{font-size:20px;font-weight:700}
.who p{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:4px;font-size:13px;color:var(--mut)}
.lv{padding:2px 8px;border-radius:6px;background:#EEF2FF;color:var(--acc);font-weight:700}
.pts{display:flex;justify-content:space-between;align-items:baseline;margin-top:18px;gap:8px}
.pts-n{font-size:28px;font-weight:800;letter-spacing:-.02em}
.pts-n small{font-size:15px;color:var(--mut);font-weight:600}
.bar-p{height:8px;border-radius:4px;background:#E6E8EB;margin-top:8px;overflow:hidden}
.bar-p span{display:block;height:100%;background:var(--acc);border-radius:4px}
.cap{margin-top:8px}
.missions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}
.missions form{display:contents}
.ms{display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 6px;border-radius:12px;background:var(--bg);border:0;font:inherit;color:var(--ink);text-align:center;min-height:72px;justify-content:center}
.ms b{font-size:13px}.ms span{font-size:12px;color:var(--mut)}
.ms.go{background:var(--acc);color:#fff;cursor:pointer}.ms.go span{color:#DCE6FF}
.ms.done{background:#E7F6EC;color:#0F7A45}.ms.done span{color:#0F7A45}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));text-align:center}
.stats div{display:flex;flex-direction:column;gap:2px}.stats div+div{border-left:1px solid var(--line)}
.stats b{font-size:22px}.stats span{font-size:12px;color:var(--mut)}
.bdgs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px}
.bdg{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.bdg span{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:18px;font-weight:800;background:#F0F1F3;color:#B5BBC3}
.bdg small{font-size:11px;font-weight:600;line-height:1.2}
.bdg.off small{color:var(--mut2)}
.ledger{margin-top:6px}
.lg-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.lg-row:last-child{border-bottom:0}
.lg-row b.plus{color:#0F7A45}
.onboard h2{font-size:17px;font-weight:700}
.form{display:flex;flex-direction:column;gap:14px;margin-top:12px}
.form label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600}
.form input{height:48px;border-radius:12px;border:1px solid var(--bd);padding:0 14px;font:inherit;font-size:16px}
.form input:focus{outline:2px solid var(--acc);border-color:transparent}
.form small{font-weight:400;color:var(--mut);font-size:12px}
.btn-acc{height:50px;border-radius:12px;border:0;background:var(--acc);color:#fff;font:inherit;font-size:16px;font-weight:700;cursor:pointer}
.btn-ghost{height:46px;width:100%;border-radius:12px;border:1px solid var(--bd);background:#fff;font:inherit;font-weight:600;cursor:pointer;color:var(--mut)}
.me-pts{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 6px 0 12px;border-radius:999px;background:#FFF4D6;color:#7A5600;font-size:13px;font-weight:700}
.me-pts img,.me-pts .ini{width:28px;height:28px;border-radius:50%;object-fit:cover;background:var(--acc);color:#fff;display:grid;place-items:center;font-size:12px}

.av-wrap{position:relative;flex:0 0 64px}
.av-edit{position:absolute;right:-4px;bottom:-4px;width:30px;height:30px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 0 0 2px #fff}
.av-edit:hover{background:var(--acc)}
.av-msg{margin-top:8px}
.av-del{margin-top:6px}
.lnk-btn{background:none;border:0;padding:0;font:inherit;font-size:13px;color:var(--mut);text-decoration:underline;cursor:pointer;min-height:32px}

.av-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px}
.chip-l{height:34px;padding:0 12px;border-radius:999px;border:1px solid var(--bd);display:inline-flex;align-items:center;font-size:13px;font-weight:600;cursor:pointer;background:#fff}
.chip-l:hover{border-color:var(--acc);color:var(--acc)}
.logo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;margin-top:12px}
.logo-grid form{display:contents}
.logo-pick{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px;border-radius:12px;border:1px solid var(--line);background:#fff;cursor:pointer;font:inherit;font-size:12px;font-weight:600;text-align:center;line-height:1.2;color:var(--ink)}
.logo-pick img{width:44px;height:44px;object-fit:contain}
.logo-pick:hover{border-color:var(--acc)}
.logo-pick.on{border:2px solid var(--acc);background:#EEF2FF}

/* tebak */
.tcard h3{margin-bottom:2px}
.tc-h{display:grid;grid-template-columns:48px minmax(0,1fr);gap:8px;align-items:center;margin-bottom:10px}
.tc-teams{display:flex;flex-direction:column;gap:2px;font-weight:600}
.tebak-f{margin-top:10px}
.picks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.pk{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:60px;padding:8px 6px;border-radius:12px;border:1px solid var(--bd);background:#fff;font:inherit;cursor:pointer;color:var(--ink);text-align:center}
.pk small{font-size:11px;color:var(--mut)}
.pk b{font-size:13px;line-height:1.2;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pk:hover{border-color:var(--acc)}
.pk.on{border:2px solid var(--acc);background:#EEF2FF}
.score{margin-top:10px}
.score summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--acc);min-height:32px;display:flex;align-items:center}
.score-row{display:flex;align-items:center;gap:8px;margin-top:6px}
.score-row input{width:64px;height:44px;border-radius:10px;border:1px solid var(--bd);text-align:center;font:inherit;font-size:18px;font-weight:700}
.btn-acc.sm{height:44px;padding:0 14px;font-size:14px}
.btn-acc.as-link{display:flex;align-items:center;justify-content:center;margin-top:10px;text-decoration:none}
.saved{margin-top:8px;font-size:13px;color:#0F7A45}
.mine{margin-top:8px}
.res{font-size:12px;font-weight:700;padding:2px 8px;border-radius:6px;background:#F0F1F3;margin-left:6px}
.res.ok{background:#E7F6EC;color:#0F7A45}.res.no{background:#FCE8E6;color:#A50E0E}
.cbar{margin-top:14px}
.cbar .prob-bar{margin-top:6px}
.lb{margin-top:8px}
.lb-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.lb-row:last-child{border-bottom:0}
.lb-rk{width:24px;text-align:center;font-weight:700;color:var(--mut)}
.lb-rk.top{color:#B7791F}
.lb-nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.lb-row b small{font-size:11px;color:var(--mut);font-weight:500}
.uav{width:28px;height:28px;border-radius:50%;object-fit:cover;flex:0 0 auto;display:inline-block;vertical-align:middle}
.uav.ini{display:inline-grid;place-items:center;background:var(--acc);color:#fff;font-size:12px;font-weight:700}
/* forum */
.row-h2{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.posts{display:flex;flex-direction:column}
.post-row{display:flex;flex-direction:column;gap:4px;padding:12px 0;border-bottom:1px solid var(--line)}
.post-row:last-child{border-bottom:0}
.pr-b{font-size:11px;font-weight:700;color:var(--acc)}
.pr-t{font-size:15px;font-weight:600}
.pr-t em{font-style:normal;color:var(--live);font-size:13px}
.pr-m{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--mut)}
.post h1{font-size:22px;font-weight:700;margin:6px 0 8px;letter-spacing:-.01em}
.post-body{margin-top:14px;font-size:16px;line-height:1.6;word-break:break-word}
.rep{margin-top:6px}
.cms{display:flex;flex-direction:column;margin:8px 0 12px}
.cm{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.cm-b{flex:1;min-width:0;font-size:15px;line-height:1.5;word-break:break-word}
.cm-h{margin-bottom:2px}
.cm-form{display:flex;gap:8px;align-items:flex-end}
.cm-form textarea,.form textarea,.form select{flex:1;border-radius:12px;border:1px solid var(--bd);padding:10px 12px;font:inherit;font-size:16px;resize:vertical}
.form select{height:48px}
.ok-box{background:#E7F6EC;color:#0F7A45;border-radius:10px;padding:10px 12px;font-size:14px;font-weight:600}
/* chat */
.chat-list{max-height:320px;overflow-y:auto;display:flex;flex-direction:column;gap:2px;margin:8px 0 10px}
.ch{display:flex;gap:8px;align-items:flex-start;padding:6px 0;font-size:14px;line-height:1.4;word-break:break-word}
.ch p{flex:1;min-width:0}
.chat-f{display:flex;gap:8px}
.chat-f input{flex:1;height:46px;border-radius:999px;border:1px solid var(--bd);padding:0 16px;font:inherit;font-size:16px;min-width:0}
.chat-f button{height:46px;padding:0 16px;border-radius:999px;border:0;background:var(--ink);color:#fff;font:inherit;font-weight:600;cursor:pointer}
.chat-err{margin-top:8px}

/* 가입 동의 · 약관 */
.agree{display:flex;gap:10px;align-items:flex-start;margin:4px 0 14px;font-size:13px;line-height:1.5;color:var(--ink);text-align:left;cursor:pointer}
.agree input{width:20px;height:20px;margin-top:1px;flex:0 0 auto;accent-color:var(--acc)}
.agree a{color:var(--acc);text-decoration:underline}
button.sso{width:100%;font:inherit;cursor:pointer}
.legal-doc h1{font-size:24px;font-weight:700;letter-spacing:-.02em;margin-bottom:4px}
.legal-doc h2{font-size:16px;font-weight:700;margin:20px 0 6px}
.legal-doc p{font-size:15px;line-height:1.65;margin:4px 0}
.legal-doc a{color:var(--acc)}
.site-foot{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;padding:20px 16px 96px;font-size:12px;color:var(--mut)}
.site-foot a{color:var(--mut)}
button.sso.tk{border:0}

/* 포인트 상점 */
.prof-h.themed{background:var(--th);border-bottom:0;color:#fff}
.prof-h.themed .muted,.prof-h.themed .pts-n small,.prof-h.themed .tm-name{color:rgba(255,255,255,.82)}
.prof-h.themed .lv{background:rgba(255,255,255,.18);color:#fff}
.prof-h.themed .bar-p{background:rgba(255,255,255,.25)}.prof-h.themed .bar-p span{background:#fff}
.prof-h.themed .chip-l{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.35);color:#fff}
.prof-h.themed .lnk-btn{color:#fff}
.chip-l.shop{border-color:var(--acc);color:var(--acc)}
a.ms{text-decoration:none}
.tk-bal{margin-top:10px;font-size:15px}.tk-bal b{font-size:22px;font-weight:800}
.tk-row{display:flex;gap:14px;align-items:flex-start}
.tk-mark{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-weight:800;font-size:18px;flex:0 0 auto;background:#EEF2FF;color:var(--acc)}
.tk-mark.tk-lencana{background:#111418;color:#FFD166}.tk-mark.tk-undian{background:#FFF4D6;color:#7A5600}.tk-mark.tk-nama{background:#E7F6EC;color:#0F7A45}
.tk-txt{min-width:0}.tk-txt h3{margin:2px 0 4px}
.tk-act{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px}
.tk-act form{display:contents}
.tk-cost{font-size:20px;font-weight:800}.tk-cost small{font-size:13px;color:var(--mut);font-weight:600}
.btn-acc[disabled]{background:#C9CED6;cursor:not-allowed}
.btn-acc.as-btn{display:inline-flex;align-items:center;text-decoration:none}
.tk-own{font-weight:700;color:#0F7A45}
.tk-themes{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;margin-top:14px}
.tk-sw{aspect-ratio:1;border-radius:12px;border:0;cursor:pointer;min-height:36px}
.tk-themes.preview .tk-sw{cursor:default;opacity:.55}
.tk-sw.on{outline:3px solid var(--ink);outline-offset:2px}
.tk-rename{margin-top:14px}
.tk-draw{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.tk-draw div{background:var(--bg);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:2px}
.tk-draw b{font-size:20px;font-weight:800}.tk-draw span{font-size:12px;color:var(--mut)}
@media (max-width:420px){.tk-themes{grid-template-columns:repeat(4,minmax(0,1fr))}}
