/* ══ National Dogs League - Styles ══ */

.ms{font-family:"Material Symbols Outlined";font-size:22px;line-height:1;display:inline-block;vertical-align:middle;user-select:none;-webkit-user-select:none}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
:root{--bg:#faf9fc;--sf:#fff;--s2:#f5f3f6;--s3:#efedf1;--bd:#e3e2e5;--bd2:#c4c7cf;--pri:#1d3557;--pri2:#2b6485;--gold:#e89b10;--grn:#16a34a;--red:#dc2626;--tx:#1b1b1e;--t2:#5c5f6a;--t3:#74777f;--sh:0 1px 6px rgba(27,27,30,.07);--shm:0 4px 20px rgba(27,27,30,.11);--shl:0 8px 32px rgba(27,27,30,.15)}
body{font-family:"Readex Pro",sans-serif;background:var(--bg);color:var(--tx);min-height:100vh;overflow-x:hidden}
.hidden{display:none!important}

/* ══ شاشة الدخول ══ */
#loginScreen{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;transition:opacity .3s ease}
#loginScreen.fade-out{opacity:0;pointer-events:none}
#loginScreen.hidden{display:none!important}
.login-subtitle{font-family:"Readex Pro",sans-serif;font-size:.92rem;color:var(--t2);margin-bottom:24px;font-weight:600}
.login-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:420px;width:100%}
.login-avatar-card{display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--sf);border:2px solid var(--bd);border-radius:16px;padding:12px 6px;cursor:pointer;transition:all .2s cubic-bezier(.34,1.56,.64,1);text-align:center;user-select:none;-webkit-user-select:none}
.login-avatar-card:hover,.login-avatar-card:active{border-color:var(--pri);transform:translateY(-3px);box-shadow:var(--shm)}
.login-avatar-card .la-photo{width:52px;height:52px;border-radius:14px;object-fit:cover;background:var(--s2);display:flex;align-items:center;justify-content:center;font-size:1.2rem;overflow:hidden;border:2px solid var(--bd)}
.login-avatar-card .la-name{font-size:.68rem;font-weight:700;color:var(--t2);width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.login-pw-section{width:100%;max-width:320px;margin-top:18px;animation:fup .28s ease both}
.login-error-msg{color:var(--red);font-size:.78rem;margin-top:10px;text-align:center;font-weight:700}
@keyframes shake{0%,100%{transform:translateX(0)}15%,45%,75%{transform:translateX(-8px)}30%,60%,90%{transform:translateX(8px)}}
.shake-it{animation:shake .4s ease}
.logout-btn{padding:5px 12px;font-size:.68rem;font-weight:700;background:#fee2e2;border:1.5px solid #fca5a5;border-radius:10px;color:#b91c1c;cursor:pointer;font-family:inherit;transition:.15s}
.logout-btn:hover{background:#fca5a5;color:#fff}

/* ══ Top Bar ══ */
#topBar{position:fixed;top:0;left:0;right:0;z-index:90;height:60px;background:var(--bg);border-bottom:1px solid var(--bd);display:flex;align-items:center;justify-content:space-between;padding:0 14px}
.topbar-zone{display:flex;align-items:center;gap:6px}
.topbar-left{min-width:80px;justify-content:flex-start}
.topbar-center{flex:1;display:flex;justify-content:center}
.topbar-right{min-width:80px;justify-content:flex-end}
.topbar-user{font-size:.7rem;font-weight:700;color:var(--t2);white-space:nowrap}
.tbt{font-family:"Lexend",sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--pri)}
#gbadge{font-size:.68rem;font-weight:700;padding:3px 10px;border-radius:20px;background:var(--pri);color:#fff;display:none}

/* ══ App Container ══ */
#app{max-width:520px;margin:0 auto;padding:72px 14px 88px}
.tcon{position:fixed;top:68px;left:50%;transform:translateX(-50%);z-index:9998;display:flex;flex-direction:column;gap:7px;align-items:center;pointer-events:none}

/* ══ Navigation ══ */
#nav{position:fixed;bottom:0;left:0;right:0;z-index:90;display:flex;justify-content:space-around;align-items:center;height:62px;padding-bottom:env(safe-area-inset-bottom,0);background:rgba(250,249,252,.96);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:1px solid var(--bd)}
.nb{display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 14px;border:none;background:transparent;cursor:pointer;color:var(--t3);border-radius:12px;font-family:inherit;min-width:52px;transition:.15s}
.nb .ms{font-size:22px}.nb .nl{font-size:.55rem;font-weight:600;letter-spacing:.3px;text-transform:uppercase}
.nb.on{color:var(--pri)}.nb.on .ms{font-variation-settings:"FILL" 1}

/* ══ Cards ══ */
.card{background:var(--sf);border:1px solid var(--bd);border-radius:20px;padding:18px;margin-bottom:12px;box-shadow:var(--sh);animation:fup .28s ease both;overflow:hidden}
@keyframes fup{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* ══ Typography ══ */
.eyb{font-size:.6rem;font-weight:700;color:var(--t3);letter-spacing:2px;text-transform:uppercase;margin-bottom:4px}
.sht{font-family:"Lexend",sans-serif;font-size:1.4rem;font-weight:800;color:var(--pri);line-height:1.2;margin-bottom:14px}
.sht em{font-style:italic;color:var(--gold)}
.clbl{font-size:.65rem;font-weight:700;color:var(--t3);letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.clbl::after{content:"";flex:1;height:1px;background:var(--bd)}

/* ══ Game Grid ══ */
.gg{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.go{background:var(--sf);border:1px solid var(--bd);border-radius:18px;padding:20px 14px 16px;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;text-align:center;box-shadow:var(--sh);transition:all .2s cubic-bezier(.34,1.56,.64,1)}
.go:hover,.go:active{border-color:var(--pri);box-shadow:var(--shm);transform:translateY(-3px)}
.go .gi{font-size:2.2rem;line-height:1}.go .gn{font-family:"Lexend",sans-serif;font-size:.9rem;font-weight:700;color:var(--pri)}.go .gs{font-size:.58rem;font-weight:600;color:var(--t3);letter-spacing:2px;text-transform:uppercase}
.go.dk{grid-column:1/-1;flex-direction:row;justify-content:center;gap:14px;background:linear-gradient(135deg,#0f1a2e,#1d3557);border-color:transparent}
.go.dk .gn{color:#e0e7f0;font-size:1rem}.go.dk .gs{color:rgba(255,255,255,.4)}
.go.dk:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(15,26,46,.4)}

/* ══ Player Grid ══ */
.pbg{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:10px}
.pb{display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--sf);border:2px solid var(--bd);border-radius:14px;padding:9px 4px;cursor:pointer;font-family:inherit;transition:.18s}
.pb:hover{border-color:var(--pri2);transform:translateY(-2px)}.pb.on{border-color:var(--pri);background:rgba(29,53,87,.04)}
.pb .pa{width:42px;height:42px;border-radius:11px;object-fit:cover;background:var(--s2);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:.95rem;overflow:hidden}
.pb.on .pa{box-shadow:0 0 0 2.5px var(--pri)}.pb .pn{font-size:.6rem;font-weight:600;color:var(--t2);text-align:center;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pb.on .pn{color:var(--pri);font-weight:700}

/* ══ Tags ══ */
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.tag{background:var(--pri);color:#fff;padding:5px 9px 5px 5px;border-radius:30px;display:flex;align-items:center;gap:5px;font-weight:600;font-size:.76rem;animation:pin .2s cubic-bezier(.34,1.56,.64,1)}
@keyframes pin{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}
.tag .tav{width:22px;height:22px;border-radius:50%;object-fit:cover;flex-shrink:0;background:rgba(255,255,255,.15);display:flex;align-items:center;justify-content:center;font-size:.6rem;color:#fff;border:1px solid rgba(255,255,255,.3);overflow:hidden}
.tag .trm{background:rgba(255,255,255,.18);border:none;width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;font-size:9px;color:#fff}
.tag .trm:hover{background:rgba(220,38,38,.5)}

/* ══ Inputs ══ */
.pcnt{font-size:.76rem;color:var(--t2);font-weight:600}
.ir{display:flex;gap:8px;margin-bottom:10px}
.inp{flex:1;padding:11px 14px;border:1.5px solid var(--bd);border-radius:14px;background:var(--sf);color:var(--tx);font-size:.88rem;font-family:inherit;transition:.2s}
.inp:focus{outline:none;border-color:var(--pri);box-shadow:0 0 0 3px rgba(29,53,87,.08)}.inp::placeholder{color:var(--bd2)}
.ta{width:100%;padding:10px 13px;border:1.5px solid var(--bd);border-radius:12px;background:var(--sf);color:var(--tx);font-size:.82rem;font-family:inherit;resize:vertical;min-height:72px;transition:.2s}
.ta:focus{outline:none;border-color:var(--pri)}

/* ══ Buttons ══ */
button{padding:10px 16px;border:none;border-radius:14px;font-family:inherit;font-size:.84rem;font-weight:700;cursor:pointer;transition:all .18s;user-select:none;-webkit-user-select:none}
.bp{background:var(--pri);color:#fff}.bp:hover{transform:translateY(-2px);box-shadow:var(--shm)}
.bcg{background:linear-gradient(135deg,#1d3557,#2b6485);color:#fff;font-family:"Lexend",sans-serif;box-shadow:0 3px 14px rgba(29,53,87,.28)}
.bcg:hover{transform:translateY(-2px);box-shadow:0 6px 22px rgba(29,53,87,.35)}.bcg:disabled{opacity:.4;cursor:not-allowed;transform:none!important;box-shadow:none!important}
.bgold{background:linear-gradient(135deg,#e89b10,#c87900);color:#fff;box-shadow:0 3px 12px rgba(232,155,16,.3)}.bgold:hover{transform:translateY(-2px)}
.bgrn{background:linear-gradient(135deg,#16a34a,#22c55e);color:#fff}.bgrn:hover{transform:translateY(-2px)}
.br{background:linear-gradient(135deg,#dc2626,#991b1b);color:#fff}
.bgh{background:var(--sf);border:1.5px solid var(--bd2);color:var(--t2)}.bgh:hover{border-color:var(--pri);color:var(--pri)}
.bf{width:100%;padding:13px;font-size:.9rem;border-radius:16px}

/* ══ Notes & Boxes ══ */
.rn{font-size:.72rem;color:#059669;font-weight:600;margin-top:6px;padding:5px 10px;background:#dcfce7;border-radius:8px;display:inline-block}
.fbox{background:#fffbf5;border:1px solid #fde68a;border-radius:16px;padding:14px;margin-bottom:12px}
.fi{display:flex;align-items:center;gap:9px;background:var(--sf);border:1.5px solid var(--bd);border-radius:12px;padding:9px 11px;cursor:pointer;transition:.15s;margin-bottom:7px;user-select:none}
.fi:hover{border-color:var(--pri)}.fi.on{border-color:#059669;background:#f0fdf4}.fi.dis{opacity:.38;cursor:not-allowed;pointer-events:none}
.fck{width:19px;height:19px;border:2px solid var(--bd2);border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:.65rem;color:#fff;flex-shrink:0}
.fi.on .fck{background:#059669;border-color:#059669}
.firebox{background:#fff8f0;border:1px solid #fcd9a8;border-radius:16px;padding:14px;margin-bottom:12px}
.firesel{padding:10px 14px;border:1.5px solid #fcd9a8;border-radius:12px;background:var(--sf);font-size:1.2rem;font-weight:800;color:#9a3412;font-family:"Lexend",sans-serif;cursor:pointer;min-width:110px}

/* ══ Progress ══ */
.pp{background:var(--s2);border:1px solid var(--bd);color:var(--t2);padding:3px 11px;border-radius:18px;font-size:.72rem;font-weight:700}
.pbar{background:var(--s3);border-radius:6px;height:5px;margin-bottom:12px;overflow:hidden}
.pfil{height:100%;background:linear-gradient(90deg,var(--pri),var(--pri2));border-radius:6px;transition:width .4s}
.cprog{position:relative;width:68px;height:68px}.cprog svg{transform:rotate(-90deg)}
.cpt{fill:none;stroke:var(--bd);stroke-width:6}.cpf{fill:none;stroke:var(--pri2);stroke-width:6;stroke-linecap:round;transition:stroke-dashoffset .4s}
.cptx{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:.64rem;font-weight:700;color:var(--pri);text-align:center;line-height:1.2}

/* ══ Match Rows ══ */
.mrow{background:var(--s2);border:1px solid var(--bd);border-radius:18px;padding:10px;margin-bottom:8px;position:relative;overflow:hidden;animation:fup .3s ease both;transition:.18s}
.mrow::before{content:"";position:absolute;right:0;top:0;bottom:0;width:4px;background:var(--bd);border-radius:0 16px 16px 0}
.mrow.done{background:#f0fdf4;border-color:#86efac}.mrow.done::before{background:var(--grn)}
.mrow.cur{border-color:rgba(29,53,87,.3)}.mrow.cur::before{background:var(--pri)}
@keyframes gp{0%,100%{box-shadow:0 0 0 2px rgba(29,53,87,.08)}50%{box-shadow:0 0 0 5px rgba(29,53,87,.16)}}
.mrow.cur{animation:gp 2s ease-in-out infinite}.mrow.cur:hover{transform:translateY(-1px);box-shadow:var(--shm)}
.mnum{font-size:.55rem;color:var(--bd2);font-weight:700;min-width:18px;text-align:center;flex-shrink:0}

/* ══ Match Display ══ */
.tw{display:flex;flex-direction:column;width:100%;border-radius:14px;border:1px solid var(--bd);overflow:hidden}
.tare{display:flex;height:200px;background:var(--s3);position:relative}
.tba,.tbb{flex:1;display:flex;flex-direction:column}.tba{border-left:2px solid rgba(255,255,255,.2)}
.tc{flex:1;position:relative;overflow:hidden}.tc+.tc{border-top:2px solid rgba(255,255,255,.15)}
.tba .tc{background:rgba(29,58,138,.1)}.tbb .tc{background:rgba(127,29,29,.1)}
.tface{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:2.8rem;color:rgba(255,255,255,.8);font-weight:900}
.tc::after{content:"";position:absolute;bottom:0;left:0;right:0;height:50%;background:linear-gradient(to bottom,transparent,rgba(0,0,0,.5));pointer-events:none;z-index:1}
.tvs{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--sf);border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:800;color:var(--t3);z-index:30;border:1px solid var(--bd);box-shadow:0 2px 8px rgba(0,0,0,.15)}
.tns{display:flex;background:var(--sf);border-top:1px solid var(--bd)}
.tna{flex:1;padding:8px;text-align:center;font-size:.78rem;font-weight:700;color:#1d4ed8;border-left:1px solid var(--bd);cursor:pointer;transition:.15s;user-select:none}
.tnb{flex:1;padding:8px;text-align:center;font-size:.78rem;font-weight:700;color:#b91c1c;cursor:pointer;transition:.15s;user-select:none}
.tna:hover,.tna.on{background:#dbeafe}.tnb:hover,.tnb.on{background:#fee2e2}
.tna.on{border-bottom:3px solid #1d4ed8}.tnb.on{border-bottom:3px solid #dc2626}
.tnh{display:block;font-size:.56rem;color:var(--t3);font-weight:500;margin-top:2px}
.tds{display:flex;background:var(--sf);border-top:1px solid var(--bd)}
.tda{flex:1;padding:8px;text-align:center;font-size:.78rem;font-weight:700;color:#1d4ed8;border-left:1px solid var(--bd)}
.tdb{flex:1;padding:8px;text-align:center;font-size:.78rem;font-weight:700;color:#b91c1c}

/* ══ Win Picker ══ */
.wp{display:none;flex-direction:column;gap:7px;background:var(--sf);border:1.5px solid var(--bd);border-radius:14px;padding:12px;margin-top:5px;animation:pup .18s ease}
.wp.on{display:flex}@keyframes pup{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
.wpt{font-size:.78rem;color:var(--t2);font-weight:600;text-align:center;margin-bottom:2px}.wpt strong{color:var(--tx)}
.wbb{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.wb{padding:11px 6px;border:none;border-radius:11px;font-family:inherit;font-size:.82rem;font-weight:700;cursor:pointer;transition:.18s;display:flex;flex-direction:column;align-items:center;gap:2px}
.wb small{font-size:.6rem;font-weight:500;opacity:.75}
.wbn{background:#f0f4ff;color:#1d4ed8;border:1.5px solid #bfdbfe}.wbn:hover{background:#1d4ed8;color:#fff;transform:translateY(-2px)}
.wbd{background:#fff5f5;color:#b91c1c;border:1.5px solid #fecaca}.wbd:hover{background:#b91c1c;color:#fff;transform:translateY(-2px)}
.wbdr{background:#fef9c3;color:#92400e;border:1.5px solid #fde68a}.wbdr:hover{background:#d97706;color:#fff}
.wx{grid-column:1/-1;padding:6px;background:var(--s2);color:var(--t3);border:1px solid var(--bd);border-radius:9px;font-size:.73rem;cursor:pointer}
.rb{font-size:.74rem;font-weight:700;padding:4px 12px;border-radius:12px;display:inline-block}
.rba{background:#dbeafe;color:#1d4ed8}.rbb{background:#fee2e2;color:#b91c1c}.rbd{background:#fef9c3;color:#92400e}

/* ══ Wait List ══ */
.wr{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:7px 9px;background:var(--s2);border:1px solid var(--bd);border-radius:11px;margin-bottom:7px}
.wrc{background:var(--sf);border:1px solid var(--bd);color:var(--t2);padding:3px 8px;border-radius:9px;font-size:.7rem;font-weight:600;display:flex;align-items:center;gap:4px}
.qbar{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px}
.qb{padding:2px 8px;border-radius:8px;font-size:.64rem;font-weight:600}
.qbg{background:#dcfce7;color:#15803d;border:1px solid #86efac}
.rlbl{padding:8px 12px;background:rgba(29,53,87,.05);border:1px solid rgba(29,53,87,.1);border-radius:11px;color:var(--pri);font-weight:700;font-size:.82rem;text-align:center;margin-bottom:10px}
.nrb{background:#f0fdf8;border:1px solid #6ee7b7;border-radius:18px;padding:16px;margin-top:12px}

/* ══ Standings Table ══ */
.stbl{width:100%;border-collapse:separate;border-spacing:0 4px}
.stbl th{font-size:.6rem;font-weight:700;color:var(--t3);padding:4px 6px;text-align:center;letter-spacing:1px;text-transform:uppercase}
.stbl th:nth-child(2){text-align:right;padding-right:8px}
.stbl td{padding:9px 6px;text-align:center;background:var(--sf);font-size:.74rem}
.stbl tr:first-child td{background:#fffbf0}
.stbl tr td:first-child{border-radius:12px 0 0 12px}.stbl tr td:last-child{border-radius:0 12px 12px 0}
.stbl tr:hover td{background:var(--s2)}
.tdnm{font-weight:700;color:var(--pri);text-align:right;font-size:.76rem;padding-right:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:0}
.tdp{font-weight:700;color:var(--gold)}.tdw{font-weight:800;color:var(--pri2);font-size:.88rem}

/* ══ History Items ══ */
.hi{background:var(--s2);border:1px solid var(--bd);border-right:3px solid var(--pri);border-radius:13px;padding:8px 11px;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center}
.hi:hover{background:var(--sf);border-right-color:var(--gold)}

/* ══ Score Counter ══ */
.scbtn{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;background:var(--s2);border:1px solid var(--bd);border-radius:18px;font-size:.7rem;font-weight:600;color:var(--t2);cursor:pointer;font-family:inherit;transition:.15s;margin:2px 0 8px}
.scbtn:hover{border-color:var(--pri);color:var(--pri)}
.scbox{background:var(--sf);border:1.5px solid var(--bd);border-radius:14px;padding:12px;margin-bottom:8px}
.scrow{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.scsd{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px}
.scbl{background:#1d4ed8;color:#fff;border:none;border-radius:12px;padding:11px 6px;font-size:.8rem;font-weight:700;cursor:pointer;width:100%;font-family:inherit;user-select:none}
.scbl:active{background:#1e40af;transform:scale(.97)}
.scrd{background:#dc2626;color:#fff;border:none;border-radius:12px;padding:11px 6px;font-size:.8rem;font-weight:700;cursor:pointer;width:100%;font-family:inherit;user-select:none}
.scrd:active{background:#b91c1c;transform:scale(.97)}
.scpt{font-family:"Lexend",sans-serif;font-size:1.5rem;font-weight:900;min-width:42px;text-align:center}
.scst{font-size:.62rem;font-weight:700;color:var(--t3)}.scsep{font-size:.8rem;font-weight:900;color:var(--bd2);flex-shrink:0}
.scctl{display:flex;gap:6px}.scctl button{padding:5px 10px;font-size:.7rem;font-weight:600;border:1px solid var(--bd);background:var(--s2);border-radius:10px;color:var(--t2);cursor:pointer;font-family:inherit}
.scctl button:hover{border-color:var(--pri);color:var(--pri)}
.scsts{font-size:.72rem;font-weight:700;text-align:center;margin-bottom:6px;padding:3px 8px;border-radius:8px}
.scde{background:#fef9c3;color:#92400e}.scab{background:#dbeafe;color:#1d4ed8}.scar{background:#fee2e2;color:#b91c1c}

/* ══ Kashtina ══ */
.kslt{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.ksl{background:var(--s2);border:2px dashed var(--bd2);border-radius:18px;padding:16px 10px;text-align:center;cursor:pointer;transition:.22s;min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px}
.ksl:hover{border-color:var(--pri);background:#f0f4ff;transform:translateY(-3px)}
.ksl.on{border-style:solid;border-color:var(--pri);background:rgba(29,53,87,.04)}.ksl.on:hover{border-color:var(--gold);background:#fffbf0}
.ksl.out{border-color:var(--red);background:#fff5f5;opacity:.55;cursor:default;pointer-events:none}
.ksn{font-size:.56rem;font-weight:700;color:var(--bd2);letter-spacing:2px;text-transform:uppercase}
.ksph{width:54px;height:54px;border-radius:13px;object-fit:cover;border:2px solid var(--bd);background:var(--s2);display:flex;align-items:center;justify-content:center;font-size:1.3rem;overflow:hidden}
.ksnm{font-size:.84rem;font-weight:700;color:var(--pri);line-height:1.2}
.kspt{font-size:.74rem;font-weight:600;color:var(--t2)}.kspt.dng{color:var(--red);font-weight:800}.kspt.out2{color:var(--red)}.kspt.out2::after{content:" 🔥"}
.kadd{font-size:1.8rem;color:var(--bd2)}.kaddh{font-size:.64rem;color:var(--t3);font-weight:600}
.kpov{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:800;display:flex;align-items:flex-end;justify-content:center}
.kpsh{background:var(--sf);border-radius:24px 24px 0 0;padding:20px;max-width:520px;width:100%;max-height:70vh;overflow-y:auto;animation:shUp .22s cubic-bezier(.34,1.56,.64,1)}
@keyframes shUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.kpo{display:flex;align-items:center;gap:10px;background:var(--s2);border:1.5px solid var(--bd);border-radius:13px;padding:10px 12px;margin-bottom:7px;cursor:pointer;font-family:inherit;width:100%;text-align:right;transition:.15s}
.kpo:hover{border-color:var(--pri);background:#f0f4ff}.kpo.dis{opacity:.35;cursor:not-allowed;pointer-events:none}
.ksr{background:var(--s2);border:1px solid var(--bd);border-radius:16px;padding:11px 13px;margin-bottom:8px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.ksph2{width:40px;height:40px;border-radius:11px;object-fit:cover;flex-shrink:0;border:1.5px solid var(--bd);background:var(--s2);display:flex;align-items:center;justify-content:center;font-size:.95rem;overflow:hidden}
.ksi{display:flex;gap:7px;flex:1;justify-content:flex-end}
.ksel{width:70px;padding:7px 5px;border:1.5px solid var(--bd);border-radius:9px;background:var(--sf);font-size:.9rem;font-weight:700;text-align:center;font-family:inherit;cursor:pointer;appearance:none;-webkit-appearance:none;color:var(--tx)}
.ksel:focus{outline:none;border-color:var(--pri)}
.kil{font-size:.58rem;font-weight:700;color:var(--t3);text-align:center;margin-top:2px;letter-spacing:.5px}
.kttbl{width:100%;border-collapse:separate;border-spacing:0 3px;margin-top:8px}
.kttbl th{font-size:.6rem;font-weight:700;color:var(--t3);padding:3px 8px;text-transform:uppercase;letter-spacing:1px}
.kttbl td{padding:7px 10px;background:var(--sf);font-size:.8rem;font-weight:600;text-align:center}
.kttbl tr td:first-child{border-radius:11px 0 0 11px;text-align:right;font-weight:700}.kttbl tr td:last-child{border-radius:0 11px 11px 0}
.kttbl tr.ke td{background:#fff5f5;color:var(--red);text-decoration:line-through;opacity:.5}.kttbl tr.kl td{background:#fffbf0}
.kfbar{display:flex;align-items:center;gap:8px;padding:8px 14px;background:#fff8f0;border:1px solid #fcd9a8;border-radius:13px;margin-bottom:8px}
.kelb{background:#fff5f5;border:1px solid #fca5a5;border-radius:16px;padding:14px;margin:8px 0}
.krb{display:flex;align-items:center;gap:8px;background:var(--sf);border:1.5px solid var(--bd);border-radius:11px;padding:8px 11px;cursor:pointer;font-family:inherit;font-size:.84rem;font-weight:700;width:100%;text-align:right;margin-bottom:6px;transition:.15s}
.krb:hover{border-color:#16a34a;background:#f0fdf4}

/* ══ Settings Rows ══ */
.srow{display:flex;align-items:center;justify-content:space-between;background:var(--sf);border:1px solid var(--bd);border-radius:15px;padding:13px 15px;margin-bottom:9px}
.tog{position:relative;width:46px;height:26px;flex-shrink:0}
.tog input{opacity:0;width:0;height:0;position:absolute}
.tsl{position:absolute;inset:0;background:var(--bd2);border-radius:13px;cursor:pointer;transition:.22s}
.tsl::before{content:"";position:absolute;width:20px;height:20px;bottom:3px;left:3px;background:#fff;border-radius:50%;transition:.22s;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.tog input:checked+.tsl{background:var(--pri)}.tog input:checked+.tsl::before{transform:translateX(20px)}

/* ══ Photos ══ */
.phrow{display:flex;align-items:center;gap:11px;background:var(--sf);border:1px solid var(--bd);border-radius:15px;padding:11px 13px;margin-bottom:7px}
.phav{width:48px;height:48px;border-radius:13px;object-fit:cover;border:1.5px solid var(--bd);background:var(--s2);flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:1.1rem;overflow:hidden}
.phup{padding:7px 13px;background:var(--s2);border:1.5px solid var(--bd);border-radius:11px;font-size:.76rem;font-weight:700;color:var(--t2);cursor:pointer;font-family:inherit;flex-shrink:0}
.phup:hover{border-color:var(--pri);color:var(--pri)}

/* ══ Crop Overlay ══ */
.crov{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:900;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px}
.crwp{position:relative;width:280px;height:280px;border-radius:16px;overflow:hidden;border:3px solid #fff;touch-action:none;cursor:grab;flex-shrink:0}
.crwp:active{cursor:grabbing}
#cropCv{position:absolute;top:0;left:0}
.crring{position:absolute;inset:0;border-radius:14px;border:3px solid rgba(255,255,255,.5);pointer-events:none;z-index:2}
.crctl{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:16px;width:100%;max-width:280px}
.crslid{width:100%;accent-color:#e89b10;height:4px}
.crbtns{display:flex;gap:10px;width:100%}
.crok{flex:1;padding:12px;background:#e89b10;color:#fff;border:none;border-radius:14px;font-size:.9rem;font-weight:700;cursor:pointer;font-family:inherit}
.crcan{flex:1;padding:12px;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.25);border-radius:14px;font-size:.9rem;font-weight:700;cursor:pointer;font-family:inherit}

/* ══ Winners ══ */
.wrow{display:flex;align-items:center;gap:11px;background:var(--sf);border:1px solid var(--bd);border-radius:15px;padding:11px 13px;margin-bottom:7px}
.wrow:hover{background:var(--s2)}
.wbdg{font-size:.58rem;font-weight:700;padding:3px 8px;border-radius:18px;flex-shrink:0;text-transform:uppercase;letter-spacing:1px}
.wp2{background:#dbeafe;color:#1d4ed8}.wf{background:#dcfce7;color:#15803d}.wk{background:#fef3c7;color:#92400e}.wr2{background:#f1f5f9;color:var(--t2)}

/* ══ Empty State ══ */
.nd{text-align:center;padding:36px 16px;color:var(--t3);font-size:.84rem;line-height:1.6}
.fsm{border-radius:50%;object-fit:cover;background:var(--s2);display:inline-flex;align-items:center;justify-content:center;font-size:.7rem;vertical-align:middle;overflow:hidden}

/* ══ Confetti ══ */
@keyframes cfa{0%{opacity:1;transform:translateY(0) rotate(0)}100%{opacity:0;transform:translateY(-100px) rotate(720deg)}}
.cp{position:fixed;width:9px;height:9px;border-radius:2px;pointer-events:none;z-index:9999;animation:cfa .9s ease forwards}

/* ══ Toast ══ */
.toast{background:var(--pri);color:#fff;padding:9px 20px;border-radius:26px;font-weight:700;font-size:.82rem;box-shadow:var(--shl);white-space:nowrap;pointer-events:none;animation:tin .22s ease}
@keyframes tin{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.toast.ok{background:#16a34a}.toast.err{background:#dc2626}

/* ══ Stats Cards ══ */
.wfb{padding:5px 12px;border:1.5px solid var(--bd);border-radius:18px;font-size:.72rem;font-weight:700;color:var(--t2);background:var(--sf);cursor:pointer;font-family:inherit;transition:.15s}
.wfb.on{background:var(--pri);border-color:var(--pri);color:#fff}
.wfb:hover:not(.on){border-color:var(--pri);color:var(--pri)}
.stcard{background:var(--sf);border:1px solid var(--bd);border-radius:18px;padding:14px;margin-bottom:10px;cursor:pointer;transition:all .2s;animation:fup .28s ease both}
.stcard:hover{border-color:var(--pri);transform:translateY(-2px);box-shadow:var(--shm)}
.stcard.open{border-color:var(--pri2)}
.stdet{display:none;margin-top:12px;padding-top:12px;border-top:1px solid var(--bd)}
.stcard.open .stdet{display:block}
.strow2{display:flex;justify-content:space-between;align-items:center;padding:5px 0;border-bottom:1px solid var(--s3);font-size:.8rem}
.strow2:last-child{border-bottom:none}

/* ══ Responsive ══ */
@media(max-width:400px){.gg{gap:8px}.go{padding:16px 10px 14px}}