:root{
  --bg:#F4EFFA; --ink:#33294A; --card:#FFFFFF; --line:#33294A;
  --p1:#FF8FB2; --p1-deep:#E85D8A; --p2:#8ED0A0; --p2-deep:#4FA36B;
  --lav:#C9B6F0; --gold:#FFD37A; --sky:#9BD4F5; --muted:#7A6F96;
  --shadow:4px 4px 0 var(--ink);
}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:'Sora',sans-serif;padding-bottom:80px}
.wrap{max-width:900px;margin:0 auto;padding:0 24px}
header{display:flex;justify-content:space-between;align-items:center;padding:26px 0;flex-wrap:wrap;gap:12px}
.logo{font-weight:800;font-size:30px;letter-spacing:-1px;transform:rotate(-2deg);display:inline-block}
.logo a{color:inherit;text-decoration:none}
.logo .badge{background:var(--gold);border:2.5px solid var(--ink);box-shadow:var(--shadow);padding:4px 14px;border-radius:14px;display:inline-block;transition:transform .15s}
.logo .badge:hover{transform:rotate(2deg) scale(1.04)}
.logo .pre{color:var(--p2-deep)} .logo .ry{color:var(--p1-deep)}
nav{display:flex;gap:10px;align-items:center}
nav a{font-weight:700;font-size:14px;color:var(--ink);text-decoration:none;padding:9px 18px;border-radius:12px;border:2.5px solid transparent;transition:all .12s}
nav a.active{background:var(--card);border-color:var(--ink);box-shadow:var(--shadow)}
nav a:hover:not(.active){border-color:var(--ink)}
.streak-pill{display:inline-flex;align-items:center;line-height:1;white-space:nowrap;font-weight:800;font-size:14px;background:var(--gold);border:2.5px solid var(--ink);border-radius:12px;padding:8px 12px;box-shadow:var(--shadow);cursor:default;animation:streak-pop .4s cubic-bezier(.2,1.6,.4,1)}
@keyframes streak-pop{from{transform:scale(.5)}to{transform:scale(1)}}
.vs-banner{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:18px;margin-top:8px}
.fighter{background:var(--card);border:2.5px solid var(--ink);border-radius:20px;box-shadow:var(--shadow);padding:20px;text-align:center;transition:transform .15s}
.fighter:hover{transform:translateY(-3px) rotate(-1deg)}
.fighter.g:hover{transform:translateY(-3px) rotate(1deg)}
.fighter .avatar{width:64px;height:64px;border-radius:50%;border:2.5px solid var(--ink);margin:0 auto 10px;display:grid;place-items:center;font-size:30px}
.fighter.r .avatar{background:var(--p1)} .fighter.g .avatar{background:var(--p2)}
.fighter .nm{font-weight:800;font-size:16px}
.fighter.r .nm{color:var(--p1-deep)} .fighter.g .nm{color:var(--p2-deep)}
.fighter .big{font-size:56px;font-weight:800;line-height:1.1}
.fighter.r .big{color:var(--p1-deep)} .fighter.g .big{color:var(--p2-deep)}
.fighter .sub{font-family:'Gochi Hand',cursive;font-size:16px;color:var(--muted);min-height:20px}
.vs{font-weight:800;font-size:26px;background:var(--ink);color:var(--bg);width:64px;height:64px;border-radius:50%;display:grid;place-items:center;transform:rotate(-6deg)}
.tiebar{text-align:center;margin-top:14px;font-family:'Gochi Hand',cursive;font-size:19px}
.tiebar b{background:var(--gold);padding:2px 10px;border-radius:8px;border:2px solid var(--ink)}
.flavor{text-align:center;margin-top:8px;font-family:'Gochi Hand',cursive;font-size:17px;color:var(--muted)}
.grid{display:grid;grid-template-columns:1.45fr 1fr;gap:22px;margin-top:26px;align-items:start}
@media (max-width:760px){.grid{grid-template-columns:1fr}.vs-banner{gap:10px}}
@media (max-width:480px){
  .logo{font-size:24px}
}
.card{background:var(--card);border:2.5px solid var(--ink);border-radius:20px;box-shadow:var(--shadow);padding:22px}
.card+.card{margin-top:22px}
.card h2{font-size:17px;font-weight:800;margin-bottom:14px}
.scribble{font-family:'Gochi Hand',cursive;font-weight:400;color:var(--muted);font-size:15px}
.game{display:flex;align-items:center;gap:12px;padding:10px;border-radius:14px;border:2px solid transparent;transition:all .12s}
.game:hover{border-color:var(--ink);background:var(--bg)}
.game .chip{width:36px;height:36px;border-radius:12px;border:2px solid var(--ink);display:grid;place-items:center;font-size:17px}
.chip.lav{background:var(--lav)} .chip.p1{background:var(--p1)} .chip.p2{background:var(--p2)}
.chip.sky{background:var(--sky)} .chip.gold{background:var(--gold)}
.game .name{font-weight:700;flex:1;font-size:15px}
.game-link{color:var(--ink);text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}
.game-link:hover{text-decoration-style:solid}
.stamp{font-family:'Gochi Hand',cursive;font-size:15px;padding:2px 12px;border-radius:10px;border:2px solid var(--ink);transform:rotate(2deg)}
.stamp.r{background:var(--p1)} .stamp.g{background:var(--p2)} .stamp.t{background:var(--gold)}
.stamp.none{border-style:dashed;color:var(--muted);transform:none}
.wildrow{border:2.5px dashed var(--ink);border-radius:14px;background:#FFF6E3;margin-top:8px}
.paste{margin-top:18px}
.paste textarea{width:100%;height:88px;border:2.5px solid var(--ink);border-radius:14px;padding:13px;font-family:'Sora',sans-serif;font-size:16px;resize:none;background:var(--bg);box-shadow:inset 3px 3px 0 rgba(51,41,74,.08)}
.paste textarea:focus{outline:none;background:#fff}
.paste .hint{font-family:'Gochi Hand',cursive;font-size:15px;color:var(--muted);margin-top:7px}
.btn{font-family:'Sora',sans-serif;font-weight:800;font-size:15px;background:var(--gold);color:var(--ink);border:2.5px solid var(--ink);box-shadow:var(--shadow);padding:12px 34px;border-radius:14px;cursor:pointer;transition:all .1s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}
.btn.small{font-size:13px;padding:8px 18px}
.paste .btn{margin-top:10px}
.parse-preview{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.parse-preview .row{display:flex;align-items:center;gap:10px;background:var(--bg);border:2px solid var(--ink);border-radius:12px;padding:8px 12px;font-size:14px;font-weight:700}
.parse-preview .row .detail{font-family:'Gochi Hand',cursive;font-weight:400;font-size:16px;color:var(--muted);flex:1}
.wheel-card{text-align:center}
.pointer{width:0;height:0;border-left:11px solid transparent;border-right:11px solid transparent;border-top:17px solid var(--ink);margin:0 auto -7px;position:relative;z-index:2}
.wheel-wrap{width:195px;height:195px;margin:0 auto;border-radius:50%;position:relative;box-shadow:var(--shadow)}
.wheel{width:100%;height:100%;border-radius:50%;
  background:conic-gradient(var(--p1) 0 60deg,var(--sky) 60deg 120deg,var(--gold) 120deg 180deg,var(--p2) 180deg 240deg,var(--lav) 240deg 300deg,#FFD9C9 300deg 360deg);
  border:3px solid var(--ink);transition:transform 3s cubic-bezier(.12,.9,.25,1)}
.wheel-wrap .hub{position:absolute;inset:0;margin:auto;width:56px;height:56px;border-radius:50%;background:var(--card);border:3px solid var(--ink);display:grid;place-items:center;font-size:24px}
.wheel-result{margin-top:12px;font-family:'Gochi Hand',cursive;font-size:18px;min-height:24px}
.own-row{display:flex;align-items:center;gap:10px;padding:7px 0;font-size:14px;font-weight:700}
.own-row .who{font-family:'Gochi Hand',cursive;font-size:16px;margin-left:auto;padding:1px 10px;border-radius:8px;border:2px solid var(--ink)}
.own-row .who.r{background:var(--p1)} .own-row .who.g{background:var(--p2)} .own-row .who.t{background:var(--gold)}
table{width:100%;border-collapse:collapse;font-size:14px}
th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);padding:6px 8px;border-bottom:2px solid var(--ink)}
td{padding:9px 8px;border-bottom:1.5px dashed #D8CFEA;font-weight:600}
tr:last-child td{border-bottom:none}
.bar{height:12px;border-radius:6px;border:2px solid var(--ink);background:var(--bg);overflow:hidden;display:flex}
.bar .r{background:var(--p1)} .bar .g{background:var(--p2)}
.pill{display:inline-block;font-family:'Gochi Hand',cursive;font-size:15px;padding:1px 10px;border-radius:8px;border:2px solid var(--ink)}
.pill.r{background:var(--p1)} .pill.g{background:var(--p2)} .pill.t{background:var(--gold)}
.pill.none{border-style:dashed;color:var(--muted)}
.heatmap{display:grid;grid-template-columns:repeat(auto-fill,22px);gap:5px}
.heatmap .cell{width:22px;height:22px;border-radius:6px;border:2px solid var(--ink);background:var(--bg)}
.heatmap .cell.r{background:var(--p1)} .heatmap .cell.g{background:var(--p2)} .heatmap .cell.t{background:var(--gold)}
.overlay{position:fixed;inset:0;background:rgba(51,41,74,.4);display:grid;place-items:center;z-index:10}
.overlay .card{max-width:340px;text-align:center}
.overlay input{width:100%;border:2.5px solid var(--ink);border-radius:12px;padding:11px;font-family:'Sora',sans-serif;font-size:16px;margin:12px 0;background:var(--bg)}
.overlay input:focus{outline:none;background:#fff}
.overlay .err{font-family:'Gochi Hand',cursive;color:var(--p1-deep);font-size:16px;min-height:20px}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);font-weight:700;font-size:14px;padding:12px 24px;border-radius:14px;opacity:0;transition:opacity .25s;pointer-events:none;z-index:20}
.toast.show{opacity:1}
.del{background:none;border:none;cursor:pointer;font-size:14px;color:var(--muted)}
.del:hover{color:var(--p1-deep)}
.signout{font-family:'Gochi Hand',cursive;font-size:15px;color:var(--muted);background:none;border:none;cursor:pointer}
.signout:hover{text-decoration:underline}
footer{text-align:center;margin-top:36px;font-family:'Gochi Hand',cursive;font-size:18px;color:var(--muted)}
.confetti{position:fixed;top:-12px;font-size:18px;z-index:30;pointer-events:none;animation:fall 2.4s linear forwards}
@keyframes fall{to{transform:translateY(110vh) rotate(540deg);opacity:.6}}
.cabinet-card{background:linear-gradient(#9c6a45,#8a5a3b)}
.cabinet-card h2{color:#ffe9c9;text-shadow:2px 2px 0 rgba(0,0,0,.35);text-align:center}
.cabinet .shelf{display:flex;justify-content:center;gap:16px;align-items:flex-end;padding:18px 4px 0;flex-wrap:wrap}
.cabinet .plank{height:14px;background:linear-gradient(#d59a63,#a96e40);border:3px solid var(--ink);border-radius:4px;margin:0 2px;box-shadow:0 6px 0 rgba(0,0,0,.28)}
.cabinet .labels{display:flex;justify-content:center;gap:16px;padding:8px 4px 14px;flex-wrap:wrap}
.cabinet .trophy,.cabinet .label{width:124px;text-align:center;position:relative}
.cabinet .trophy{transition:transform .15s}
.cabinet .trophy:hover{transform:translateY(-5px) rotate(-1deg)}
.cabinet .art{width:112px;height:112px;margin:0 auto -2px;background:center/contain no-repeat;filter:drop-shadow(4px 5px 0 rgba(0,0,0,.3))}
.cabinet .trophy.even .art{filter:grayscale(1) opacity(.75) drop-shadow(4px 5px 0 rgba(0,0,0,.3))}
.cabinet .tname{font-family:'Gochi Hand',cursive;font-size:16px;color:#fff3dd;text-shadow:1px 1px 0 rgba(0,0,0,.45);line-height:1.1;min-height:32px}
.cabinet .plaque{display:inline-block;margin-top:2px;border:2px solid var(--ink);border-radius:9px;padding:2px 9px;font-family:'Gochi Hand',cursive;font-size:13px;background:var(--gold)}
.cabinet .plaque.r{background:var(--p1)}.cabinet .plaque.g{background:var(--p2)}
.cabinet .newowner{position:absolute;top:-4px;right:6px;background:#ff5d73;color:#fff;border:2px solid var(--ink);border-radius:8px;font-size:9px;font-weight:800;padding:2px 5px;transform:rotate(10deg);z-index:2}
@media (max-width:600px){.cabinet .shelf,.cabinet .labels{gap:10px}.cabinet .trophy,.cabinet .label{width:118px}.cabinet .art{width:104px;height:104px}.cabinet .tname{font-size:15px}}
.day-splash{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;cursor:pointer;animation:splash-in .5s cubic-bezier(.2,1.4,.4,1)}
.day-splash.r{background:color-mix(in srgb,var(--p1) 70%,white)}
.day-splash.g{background:color-mix(in srgb,var(--p2) 70%,white)}
.day-splash.t{background:color-mix(in srgb,var(--gold) 70%,white)}
.day-splash .splash-emoji{font-size:96px;animation:splash-bounce 1s ease infinite}
.day-splash .splash-text{font-family:'Gochi Hand',cursive;font-size:44px;background:var(--card);border:3px solid var(--ink);box-shadow:var(--shadow);padding:8px 30px;border-radius:20px;transform:rotate(-2deg)}
.day-splash .splash-sub{font-weight:700;font-size:16px;color:var(--ink)}
@keyframes splash-in{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes splash-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-18px)}}
@media (max-width:480px){.day-splash .splash-emoji{font-size:72px}.day-splash .splash-text{font-size:30px}}
.reaction{position:fixed;top:38%;left:50%;z-index:40;pointer-events:none;white-space:nowrap;max-width:94vw;font-family:'Gochi Hand',cursive;font-size:clamp(20px,7vw,34px);background:var(--card);border:3px solid var(--ink);box-shadow:var(--shadow);padding:10px 26px;border-radius:18px;animation:react 1.7s ease forwards}
@keyframes react{0%{transform:translate(-50%,-50%) scale(.3) rotate(-8deg);opacity:0}18%{transform:translate(-50%,-50%) scale(1.12) rotate(2deg);opacity:1}30%{transform:translate(-50%,-50%) scale(1) rotate(-1deg)}75%{opacity:1}100%{transform:translate(-50%,-70%) scale(.95);opacity:0}}
@media (max-width:600px){
  .wrap{padding:0 18px 0 14px}
  .card{padding:16px 12px}
  table{font-size:12px}
  th{padding:5px 3px;font-size:10px}
  td{padding:7px 3px}
  header{flex-direction:column;align-items:center;padding:20px 0 14px;gap:10px}
  nav{width:100%;justify-content:center;gap:6px}
  nav a{padding:8px 12px;font-size:13px}
  .streak-pill{padding:7px 10px;font-size:13px}
  .vs-banner{gap:8px;align-items:stretch}
  .vs{width:42px;height:42px;font-size:17px;align-self:center;flex-shrink:0}
  .fighter{padding:14px 8px;display:flex;flex-direction:column;justify-content:center}
  .fighter .avatar{width:48px;height:48px;font-size:24px;margin-bottom:6px}
  .fighter .big{font-size:40px}
  .fighter .nm{font-size:14px}
  .fighter .sub{font-size:14px}
  #per-game tr>*:nth-child(3),#per-game tr>*:nth-child(6){display:none}
  .pill{font-size:13px;padding:1px 7px}
  .del{font-size:12px}
}
@keyframes pop-in{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
.card,.fighter,.vs{animation:pop-in .4s cubic-bezier(.2,1.2,.4,1) backwards}
.card:nth-of-type(2){animation-delay:.07s}
.card:nth-of-type(3){animation-delay:.14s}
.game{animation:pop-in .35s ease backwards}
.game:nth-child(2){animation-delay:.03s}.game:nth-child(3){animation-delay:.06s}.game:nth-child(4){animation-delay:.09s}
.game:nth-child(5){animation-delay:.12s}.game:nth-child(6){animation-delay:.15s}.game:nth-child(7){animation-delay:.18s}.game:nth-child(8){animation-delay:.21s}
@keyframes stamp-in{0%{transform:scale(1.7) rotate(-9deg);opacity:0}60%{transform:scale(.94) rotate(3deg);opacity:1}100%{transform:scale(1) rotate(2deg)}}
.stamp.r,.stamp.g,.stamp.t{animation:stamp-in .35s cubic-bezier(.2,1.2,.4,1) backwards}
@keyframes breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
.fighter .avatar{animation:breathe 4.5s ease-in-out infinite}
.fighter.g .avatar{animation-delay:2.2s}
@keyframes hub-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-3px) rotate(6deg)}}
.wheel-wrap .hub{animation:hub-bob 3.5s ease-in-out infinite}
@keyframes pill-wiggle{0%,90%,100%{transform:rotate(0)}93%{transform:rotate(4deg)}96%{transform:rotate(-4deg)}}
.streak-pill{animation:streak-pop .4s cubic-bezier(.2,1.6,.4,1),pill-wiggle 7s ease-in-out 3s infinite}
@keyframes trophy-drop{from{opacity:0;transform:translateY(-16px)}60%{transform:translateY(3px)}to{opacity:1;transform:none}}
.cabinet .trophy{animation:trophy-drop .5s cubic-bezier(.2,1.2,.4,1) backwards}
.cabinet .trophy:nth-child(2){animation-delay:.08s}.cabinet .trophy:nth-child(3){animation-delay:.16s}.cabinet .trophy:nth-child(4){animation-delay:.24s}
@keyframes cell-in{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
.heatmap .cell{animation:cell-in .3s ease backwards}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}