:root{--bg:#1a1109;--bg2:#2a1c0e;--panel:#2e2114;--panel2:#3b2c1a;--border:#5a4426;--text:#f5ecdb;--muted:#c2a988;--accent:#e0a955;--accent2:#b5701f;--danger:#ef4444;--good:#22c55e;--moon:#ffcf6e}*{box-sizing:border-box}body,html{margin:0;padding:0;background:radial-gradient(1200px 600px at 50% -10%,#4a3418 0,var(--bg) 60%);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;min-height:100vh}.wrap{max-width:760px;margin:0 auto;padding:24px 16px 60px}.center{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:24px}h1{font-size:2.2rem;margin:0;letter-spacing:.5px}.moon{font-size:3rem;filter:drop-shadow(0 0 18px var(--moon))}.card{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:20px;width:100%;max-width:420px}.card.wide{max-width:100%}label{display:block;font-size:.85rem;color:var(--muted);margin-bottom:6px}input{width:100%;padding:12px 14px;border-radius:10px;border:1px solid var(--border);background:var(--bg2);color:var(--text);font-size:1rem;margin-bottom:14px}input:focus{outline:none;border-color:var(--accent)}button{cursor:pointer;border:none;border-radius:10px;padding:12px 16px;font-size:1rem;font-weight:600;background:var(--accent2);color:#fff;transition:transform .05s ease,background .15s ease;width:100%}button:hover:not(:disabled){background:var(--accent)}button:active:not(:disabled){transform:scale(.98)}button:disabled{opacity:.5;cursor:not-allowed}button.ghost{background:transparent;border:1px solid var(--border);color:var(--text)}button.ghost:hover:not(:disabled){background:var(--panel2)}.row{display:flex;gap:10px}.muted{color:var(--muted)}.err,.muted{font-size:.9rem}.err{color:var(--danger);margin-top:6px;min-height:1.2em}.badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:.8rem;background:var(--panel2);border:1px solid var(--border)}.code-pill{font-family:monospace;font-size:1.6rem;letter-spacing:6px;background:var(--bg2);border:1px dashed var(--accent);padding:8px 18px;border-radius:12px;color:var(--moon)}.players{list-style:none;padding:0;margin:14px 0;display:flex;flex-direction:column;gap:8px}.players li{display:flex;align-items:center;justify-content:space-between;background:var(--bg2);padding:10px 14px;border-radius:10px;border:1px solid var(--border)}.dot{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:8px}.dot.on{background:var(--good)}.dot.off{background:var(--muted)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));grid-gap:10px;gap:10px}.selectable{background:var(--bg2);border:2px solid var(--border);border-radius:12px;padding:14px;text-align:center;cursor:pointer;transition:border-color .1s}.selectable.picked,.selectable:hover{border-color:var(--accent)}.selectable.picked{background:var(--panel2)}.section-title{font-size:1.4rem;margin:0 0 4px}.modal-overlay{position:fixed;inset:0;background:rgba(5,6,16,.75);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:1000;animation:fadeIn .15s ease}@keyframes drawIn{0%{transform:translateY(-150px) scale(.7) rotate(-7deg);opacity:0}60%{opacity:1}to{transform:translateY(0) scale(1) rotate(0);opacity:1}}.marquee-wrap{position:fixed;top:0;left:0;right:0;z-index:1000;overflow:hidden;pointer-events:none;background:rgba(20,18,16,.55)}.marquee-track{display:inline-block;white-space:nowrap;padding:7px 0;font-family:system-ui,sans-serif;font-weight:800;font-size:1.05rem;color:#ffe6b0;text-shadow:0 1px 3px #000;animation:marqueeRun 7s linear 3}@keyframes marqueeRun{0%{transform:translateX(100vw)}to{transform:translateX(-100%)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-card{position:relative;background:linear-gradient(160deg,var(--panel2),var(--panel));border:1px solid var(--border);border-top:5px solid;border-radius:18px;padding:28px 24px 24px;width:100%;max-width:360px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.5);animation:popIn .18s ease}@keyframes popIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.modal-emoji{font-size:4.5rem;line-height:1;margin-bottom:8px;filter:drop-shadow(0 0 14px rgba(255,255,255,.15))}.modal-ability{color:var(--text);font-size:1rem;line-height:1.5;margin:14px 0 6px}.hp{display:inline-flex;gap:3px;margin-top:6px;flex-wrap:wrap}.hp .pip{width:12px;height:12px;border-radius:50%;background:var(--danger);box-shadow:inset 0 0 0 1px rgba(0,0,0,.3)}.hp .pip.empty{background:transparent;border:1px solid var(--border)}.role-badge{display:inline-block;font-size:.75rem;padding:2px 8px;border-radius:999px;border:1px solid var(--border);background:var(--panel);margin-top:6px}.role-badge.hidden{color:var(--muted);font-style:italic}.hand{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;min-height:40px}.pcard{position:relative;color:#2a2114;border-radius:10px;background-image:radial-gradient(circle,#e8d6ae 0 1.1px,#3a2410 1.4px 2.3px,transparent 2.5px),radial-gradient(circle,#e8d6ae 0 1.1px,#3a2410 1.4px 2.3px,transparent 2.5px),radial-gradient(circle,#e8d6ae 0 1.1px,#3a2410 1.4px 2.3px,transparent 2.5px),radial-gradient(circle,#e8d6ae 0 1.1px,#3a2410 1.4px 2.3px,transparent 2.5px),repeating-linear-gradient(96deg,hsla(0,0%,100%,.045) 0 2px,rgba(0,0,0,.05) 2px 5px),linear-gradient(155deg,#8a5c2c,#55381a 55%,#6b471f);background-repeat:no-repeat;background-position:left 2px top 2px,right 2px top 2px,left 2px bottom 2px,right 2px bottom 2px,0 0,0 0;background-size:7px 7px,7px 7px,7px 7px,7px 7px,auto,auto;border:1px solid #33200e;box-shadow:0 2px 7px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,226,178,.28);display:flex;overflow:hidden;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex:0 0 auto}.pcard-md{width:104px;height:150px;padding:7px}.pcard-sm{width:72px;height:104px;padding:5px}.pc-brown{--pc-accent:#a06a2c}.pc-blue{--pc-accent:#3b82f6}.pc-gun{--pc-accent:#8a8f98}.pc-character{--pc-accent:#a855f7}.pc-red .pc-corner{color:#c0392b}.pc-black .pc-corner{color:#241a10}.pc-frame{position:relative;flex:1 1;min-width:0;display:flex;flex-direction:column;align-items:stretch;border-radius:3px;background:radial-gradient(120% 80% at 50% 0,#fdf5e0,hsla(43,88%,94%,0) 70%),linear-gradient(165deg,#f7ebcf,#ecdcb4 65%,#dfcb9f);box-shadow:inset 0 0 0 1px var(--pc-accent,#a0672f),inset 0 0 0 2px hsla(0,0%,100%,.35),inset 0 0 12px rgba(139,96,42,.3);overflow:hidden}.pcard-md .pc-frame{padding:3px}.pcard-sm .pc-frame{padding:2px}.pc-name{font-family:Georgia,Times New Roman,serif;font-weight:700;text-transform:uppercase;letter-spacing:.4px;text-align:center;line-height:1.02;padding:1px 1px 2px;color:#46290d;text-shadow:0 1px 0 hsla(0,0%,100%,.65);border-bottom:1px solid rgba(112,76,32,.35);margin-bottom:2px;overflow:hidden;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.pcard-md .pc-name{font-size:.66rem}.pcard-sm .pc-name{font-size:.55rem}.pcard-md .pc-name-long{font-size:.55rem;letter-spacing:0}.pcard-sm .pc-name-long{font-size:.4rem;letter-spacing:0}.pcard-sm .pc-name-mid{font-size:.45rem;letter-spacing:0}.pc-center{position:relative;flex:1 1;width:100%;min-height:0;display:flex;align-items:center;justify-content:center;border-radius:2px;background:linear-gradient(180deg,#efe2c2,#e4d3ad);box-shadow:inset 0 0 0 1px rgba(74,48,22,.45);overflow:hidden}.pc-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-drag:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.pc-art-full{object-fit:cover}.pc-lives{position:absolute;top:3px;right:4px;display:flex;flex-direction:column;gap:1px;pointer-events:none}.pc-life{font-size:11px;line-height:1.05;color:#e0342f;text-shadow:0 0 2px #fff,0 1px 2px rgba(0,0,0,.7)}.pc-range{position:absolute;right:2px;bottom:2px;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fffdf6,#e9d8b0);color:#2f1c08;font-family:Georgia,Times New Roman,serif;font-weight:700;line-height:1;border:1.5px solid #3a2410;box-shadow:0 1px 3px rgba(0,0,0,.5);pointer-events:none}.pcard-md .pc-range{width:17px;height:17px;font-size:.66rem}.pcard-sm .pc-range{width:14px;height:14px;font-size:.55rem;border-width:1px}.pc-icon{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;font-size:2.1rem;filter:drop-shadow(0 1px 1px rgba(0,0,0,.2))}.pcard-sm .pc-icon{font-size:1.5rem}.pc-desc{text-align:center;line-height:1.14;padding:3px 1px 1px;color:#5b4123;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical}.pcard-md .pc-desc{font-size:.5rem;-webkit-line-clamp:4}.pcard-sm .pc-desc{display:none}.pc-corner{align-self:flex-start;font-family:Georgia,Times New Roman,serif;font-weight:700;line-height:1;padding:1px 2px 0}.pcard-md .pc-corner{font-size:.82rem}.pcard-sm .pc-corner{font-size:.72rem}.pc-click{cursor:pointer;transition:transform .1s ease,box-shadow .1s ease}.pc-click:hover{transform:translateY(-6px) scale(1.04);box-shadow:0 8px 18px rgba(0,0,0,.45);z-index:5}.pc-selected{outline:3px solid var(--accent);outline-offset:1px;transform:translateY(-6px)}.pc-dimmed{opacity:.5}.card-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;min-height:40px}@keyframes eventPop{0%{opacity:0;transform:translateX(-50%) translateY(-18px) scale(.9)}to{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}}.card.draft-card{width:min(96vw,1280px);max-width:none;margin-left:calc(50% - min(48vw, 640px));margin-right:calc(50% - min(48vw, 640px));min-height:calc(100dvh - 120px);display:flex;flex-direction:column;justify-content:center;gap:8px;position:relative;overflow:hidden}.draft-foot,.draft-head,.draft-stage{position:relative;z-index:1}.draft-dust{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}.draft-dust span{position:absolute;bottom:-12px;border-radius:50%;background:radial-gradient(circle,rgba(255,220,150,.9),rgba(224,169,85,0) 70%);animation-name:draftFloat;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes draftFloat{0%{transform:translateY(0) translateX(0);opacity:0}12%{opacity:1}88%{opacity:1}to{transform:translateY(-86vh) translateX(16px);opacity:0}}.draft-head{text-align:center}.draft-title{font-size:2.3rem;letter-spacing:.5px;background:linear-gradient(100deg,#ffe6ad 0,var(--accent) 28%,#fff5db 50%,var(--accent) 72%,#ffe6ad 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45));animation:draftShimmer 4.5s linear infinite}@keyframes draftShimmer{0%{background-position:220% 0}to{background-position:-20% 0}}.draft-sub{max-width:46ch;margin:6px auto 0}.draft-role{display:inline-flex;align-items:center;gap:10px;margin-top:14px;padding:6px 16px 6px 12px;border-radius:999px;background:rgba(224,169,85,.12);border:1px solid rgba(224,169,85,.4)}.draft-role-emoji{font-size:1.5rem;line-height:1}.draft-role-text{display:flex;flex-direction:column;text-align:left;line-height:1.15}.draft-role-label{font-size:.6rem;text-transform:uppercase;letter-spacing:1.5px;opacity:.65}.draft-role strong{color:var(--moon);font-size:1rem}.draft-stage{position:relative;display:flex;align-items:center;justify-content:space-evenly;gap:28px;flex-wrap:wrap;margin:30px 0 10px}.draft-face{width:252px;height:340px;display:flex;justify-content:center;align-items:flex-start}.draft-face .pcard{transform:scale(1.5);transform-origin:top center}.draft-stage:before{content:"";position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:min(560px,94%);height:300px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(224,169,85,.22),rgba(224,169,85,.06) 45%,transparent 70%);filter:blur(14px);pointer-events:none;z-index:0;animation:draftAura 5s ease-in-out infinite}.draft-pick,.draft-vs{position:relative;z-index:1}@keyframes draftAura{0%,to{opacity:.5;transform:translate(-50%,-50%) scale(1)}50%{opacity:.9;transform:translate(-50%,-50%) scale(1.06)}}.draft-vs{display:flex;flex-direction:column;align-items:center;gap:10px;font-weight:800;font-size:.9rem;text-transform:uppercase;letter-spacing:2px;color:var(--accent);opacity:.8;padding:0 6px}.draft-vs:after,.draft-vs:before{content:"";width:1px;height:40px}.draft-vs:before{background:linear-gradient(var(--accent),transparent)}.draft-vs:after{background:linear-gradient(transparent,var(--accent))}.draft-pick{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;padding:18px 20px 16px;border-radius:18px;cursor:pointer;-webkit-tap-highlight-color:transparent;background:radial-gradient(120% 80% at 50% 0,rgba(224,169,85,.07),transparent 70%);transition:transform .2s cubic-bezier(.2,.85,.25,1),background .2s ease;animation:draftRise .5s cubic-bezier(.2,.85,.25,1) backwards}.draft-pick .pcard{transition:box-shadow .2s ease;will-change:box-shadow}.draft-pick:not(.draft-locked):hover{transform:translateY(-10px);background:radial-gradient(120% 80% at 50% 0,rgba(224,169,85,.2),transparent 72%)}.draft-pick:not(.draft-locked):hover .pcard{box-shadow:0 16px 44px rgba(0,0,0,.55),0 0 30px rgba(224,169,85,.5)}.draft-pick:not(.draft-locked):active{transform:translateY(-4px) scale(.99)}.draft-cta{padding:7px 22px;border-radius:999px;font-weight:700;font-size:.85rem;letter-spacing:.5px;color:#2a1c0c;background:linear-gradient(180deg,var(--moon),var(--accent));box-shadow:0 4px 14px rgba(224,169,85,.35);opacity:.88;transition:opacity .2s ease,transform .2s ease}.draft-pick:not(.draft-locked):hover .draft-cta{opacity:1;transform:translateY(-1px)}.draft-chosen{transform:translateY(-10px)}.draft-chosen .pcard{animation:draftGlow 1.8s ease-in-out infinite}.draft-badge{background:linear-gradient(180deg,var(--moon),var(--accent));color:#2a1c0c;font-weight:800;border:none;box-shadow:0 4px 14px rgba(224,169,85,.4)}.draft-dimmed{opacity:.35;filter:grayscale(.7)}.draft-foot{display:flex;flex-direction:column;align-items:center;gap:9px;margin-top:10px}.draft-progress{display:flex;gap:7px}.draft-dot{width:9px;height:9px;border-radius:50%;background:rgba(224,169,85,.16);border:1px solid rgba(224,169,85,.35);transition:background .3s ease,box-shadow .3s ease}.draft-dot.on{background:var(--accent);box-shadow:0 0 8px rgba(224,169,85,.6)}@keyframes draftRise{0%{opacity:0;transform:translateY(22px) scale(.94)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes draftGlow{0%,to{box-shadow:0 0 0 3px var(--accent),0 16px 48px rgba(0,0,0,.6),0 0 28px rgba(224,169,85,.45)}50%{box-shadow:0 0 0 3px var(--moon),0 16px 48px rgba(0,0,0,.6),0 0 46px rgba(224,169,85,.78)}}.draft-pick .pcard:after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 32%,rgba(255,245,220,.55) 47%,hsla(0,0%,100%,.18) 53%,transparent 68%);transform:translateX(-120%);pointer-events:none;transition:transform .7s cubic-bezier(.2,.7,.3,1)}.draft-pick:not(.draft-locked):hover .pcard:after{transform:translateX(120%)}.draft-chosen:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:262px;height:350px;border-radius:22px;border:2px solid var(--moon);pointer-events:none;animation:draftBurst .7s ease-out forwards}@keyframes draftBurst{0%{opacity:.85;transform:translate(-50%,-50%) scale(.82)}to{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}@keyframes tcDeal{0%{opacity:0;transform:translateY(54px) scale(.7) rotateY(90deg)}60%{opacity:1}to{opacity:1;transform:none}}.tc-deal{animation:tcDeal .42s cubic-bezier(.22,.9,.3,1) backwards;transform-style:preserve-3d}