#nav{display:flex;gap:1rem;align-items:center;justify-content:space-between;z-index:9}#nav .nav-menu-btn{display:flex;align-items:center;justify-content:center;background-color:var(--text);border:3px solid var(--accent);border-radius:var(--radius);color:#161616;width:44px;height:44px;padding:0;flex-shrink:0;z-index:10}#nav .nav-menu-btn:hover{cursor:pointer}#nav .nav-menu{background-color:var(--bg2);position:fixed;inset:0;display:flex;flex-direction:column;height:100dvh;padding:6rem 2rem 2rem;width:100vw;gap:1.75rem;z-index:9;transform:translate(-16px);opacity:0;visibility:hidden;pointer-events:none;box-shadow:var(--shadow);transition:transform .22s ease,opacity .22s ease,visibility 0ms linear .22s}#nav .nav-menu.open{transform:translate(0);opacity:1;visibility:visible;pointer-events:auto;transition:transform .22s ease,opacity .22s ease,visibility 0ms}#nav .nav-menu a{font-size:1.4rem;font-weight:700;text-decoration:none;color:var(--text);transition:color .2s ease,transform .2s ease}@media(hover:hover)and (pointer:fine){#nav .nav-menu a:hover{cursor:pointer;color:var(--accent);transform:translate(4px)}}#nav img{flex-shrink:1;height:auto;width:100%;min-width:0;max-width:160px;z-index:10}@media(min-width:900px){#nav .nav-menu{width:min(345px,85vw)}}.nav-logo{z-index:10;transition:transform .3s ease;line-height:0}@media(hover:hover)and (pointer:fine){.nav-logo:hover{transform:scale(1.05)}}#game-left{gap:1.5rem}#game-left h3{font-size:1.1rem;font-weight:700}@media(min-width:900px){#game-left{justify-content:space-between}}#game-right{display:flex;flex-direction:column;width:100%;justify-content:flex-start;align-items:center;gap:1.5rem;padding:1.5rem 1rem 2.5rem}@media(min-width:900px){#game-right{padding:2rem;justify-content:center}}.game-info-card{border-radius:var(--radius);display:flex;flex-direction:column;padding:1.25rem;background-color:var(--bg3);border:1px solid var(--accent-dim);gap:.75rem}.game-info-card h3{font-size:1.2rem;font-weight:700;color:var(--accent)}.game-card-top{display:flex;justify-content:space-between;gap:2rem}.game-info{display:flex;flex-direction:column;gap:.35rem}.game-info p{font-size:.9rem;text-transform:capitalize}.game-info p strong{font-weight:700}.team-parent-container{display:flex;gap:1.5rem;flex-wrap:wrap}.team-container{display:flex;flex-direction:column;gap:.25rem}.team-container h4{font-weight:700;color:var(--accent);font-size:.9rem}.player-card-container{display:flex;flex-direction:column;gap:.75rem}.player-card{border-radius:var(--radius);display:flex;flex-direction:column;padding:1rem 1.25rem;background-color:var(--bg3);border-left:4px solid var(--accent);gap:.2rem}.player-card h3{font-size:1rem;font-weight:700}.player-card p{font-size:.85rem;color:var(--text-dim)}.game-reset-btns{display:flex;flex-direction:column;align-items:stretch;gap:.75rem}.game-main{display:flex;width:100%;justify-content:center}.char-card-container{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;justify-content:center;width:100%}.team-cards{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;justify-content:center}@media(min-width:640px){.char-card-container,.team-cards{gap:1.25rem}}.matchup-row{display:flex;flex-direction:column;align-items:center;gap:1.25rem;width:100%}@media(min-width:640px){.matchup-row{flex-direction:row;width:auto}}.matchup-row.duel-row{flex-direction:row;width:auto;gap:.375rem}.matchup-row.duel-row .vs-badge{width:30px;height:30px;font-size:.65rem}@media(min-width:640px){.matchup-row.duel-row{gap:1.25rem}.matchup-row.duel-row .vs-badge{width:44px;height:44px;font-size:.85rem}}.ffa-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;align-items:center;justify-items:center;width:100%;max-width:320px}.ffa-vs-badge{grid-column:1/-1;justify-self:center}.ffa-card-centered{grid-column:1/-1}.ffa-row{display:none}@media(min-width:640px){.ffa-grid{display:none}.ffa-row{display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:1.25rem;width:100%}.ffa-row .character-card{flex:1 1 220px;width:auto;height:auto;min-width:0;max-width:220px;aspect-ratio:5/7}}.vs-chip{flex-shrink:0;color:var(--text-dim);font-weight:700;font-size:.75rem;letter-spacing:.05em;padding:0 .25rem}.character-card{position:relative;width:140px;height:196px;border-radius:14px;overflow:hidden;background-color:var(--bg3);background-size:cover;background-position:center;background-repeat:no-repeat;display:flex;flex-direction:column;justify-content:flex-end;gap:.5rem;box-shadow:var(--shadow);border:1px solid #2a2a2a;transition:transform .2s ease}@media(hover:hover)and (pointer:fine){.character-card:hover{transform:translateY(-4px)}}.char-card-badges{position:absolute;z-index:2;top:.6rem;left:.6rem;display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;max-width:calc(100% - 1.2rem)}.char-card-player,.char-card-space{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:#000000a6;color:#fff;font-weight:700;font-size:.7rem;line-height:1;padding:.35rem .6rem;border-radius:999px;border:1px solid var(--accent-dim)}.char-card-info{display:flex;flex-direction:column;gap:.2rem;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.75) 60%,transparent 100%);padding:1.75rem .75rem .75rem}.char-card-info h4{font-size:1.1rem;font-weight:700;color:#fff}.char-card-info h5{font-size:.7rem;text-transform:uppercase;letter-spacing:.04em;color:var(--accent);font-weight:600}@media(min-width:640px){.character-card{width:220px;height:300px}}.board-card{position:relative;width:100%;max-width:720px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--accent-dim);box-shadow:var(--shadow)}.board-card img{display:block;width:100%;height:auto}.board-card-info{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:.2rem;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.6) 55%,transparent 100%);padding:2.5rem 1rem 1rem}.board-card-info h4{font-size:1.2rem;font-weight:700;color:#fff}.board-card-info h5{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;color:var(--accent);font-weight:600}.matchup{display:flex;flex-direction:column;align-items:center;gap:1.75rem;width:100%}.matchup-divider{display:flex;align-items:center;gap:.75rem;width:100%;max-width:260px}.divider-line{flex:1;height:1px;background-color:#2a2a2a}.vs-badge{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:2px solid var(--accent);background-color:var(--bg3);color:var(--text);font-weight:700;font-size:.85rem;letter-spacing:.05em}.villain-cluster{display:flex;align-items:center;justify-content:center;gap:.75rem;flex-wrap:wrap}.minion-col{display:flex;flex-direction:column;gap:1rem}.minion-hex{clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);padding:3px;display:flex;flex-shrink:0;width:102px;height:117px;background-color:var(--minion-color)}.villain-hex{position:relative;border-radius:22px;padding:3px;display:flex;flex-shrink:0;width:130px;height:156px;background-color:var(--accent);box-shadow:var(--shadow)}.villain-hex .char-card-badges{left:50%;transform:translate(-50%);align-items:center}.minion-hex .hex-inner{clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%)}.hex-inner{position:relative;width:100%;height:100%;border-radius:19px;overflow:hidden;background-color:var(--bg3);background-size:cover;background-position:center;background-repeat:no-repeat;display:flex;align-items:flex-end;justify-content:center}.minion-hex .hex-name{position:absolute;top:54%;left:0;right:0;width:100%;text-align:center;font-weight:700;color:#fff;font-size:.65rem;line-height:1.2;padding:.3rem .5rem;background-color:#000000a6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.villain-hex .hex-name{width:100%;text-align:center;font-weight:700;color:#fff;background:linear-gradient(to top,rgba(0,0,0,.92) 15%,rgba(0,0,0,.6) 70%,transparent 100%);padding:1.75rem .6rem .65rem;font-size:.85rem}@media(min-width:640px){.minion-hex{width:123px;height:141px}.villain-hex{width:156px;height:186px}.minion-hex .hex-name{font-size:.7rem}.villain-hex .hex-name{font-size:.95rem}}.setup-container{display:flex;flex-direction:column;gap:1.25rem;height:100%}.setup-container h1{font-size:1.35rem;font-weight:700}.setup-container h3{font-weight:700}.setup-container p{color:var(--text-dim);font-size:.9rem;line-height:1.4}.side-container{display:flex;flex-direction:column;gap:.5rem}.set-selection{display:flex;flex-wrap:wrap;align-content:flex-start;align-items:flex-start;justify-content:flex-start;width:100%;padding:1.5rem 1rem;gap:1.25rem}.set-card{position:relative;flex:0 0 auto;width:150px;height:150px;background-color:var(--bg2);padding:0;border:3px solid transparent;border-radius:var(--radius);overflow:hidden;display:flex;align-items:center;justify-content:center;transition:transform .2s ease,border-color .2s ease}@media(hover:hover)and (pointer:fine){.set-card:hover{cursor:pointer;transform:scale(1.04);border-color:var(--accent-dim)}}.set-card:active{transform:scale(.98)}.set-card .img-wrapper{width:100%;height:100%;padding:.5rem;display:flex;align-items:center;justify-content:center}.set-card .img-wrapper img{max-width:100%;max-height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:none}.set-card-info{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:flex-end;justify-content:center;padding:1.5rem .5rem .5rem;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.6) 55%,transparent 100%);pointer-events:none}.set-card-title{width:100%;color:#fff;font-weight:700;font-size:.7rem;line-height:1.2;text-align:center}.set-card.selected{border:var(--selected);background-color:#241012}@media(min-width:480px){.set-selection{padding:1.5rem 2rem;gap:1.5rem}.set-card{width:190px;height:190px}.set-card-title{font-size:.78rem}}@media(min-width:640px){.set-selection{padding:2rem;gap:1.75rem}.set-card{width:220px;height:220px}.set-card-title{font-size:.85rem}}@media(min-width:900px){.set-selection{padding:2.5rem;gap:2rem}.set-card{width:250px;height:250px}.set-card-title{font-size:.95rem}}.ban-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.5rem 0}.ban-top h3{font-size:.95rem}.ban-btn{flex-shrink:0;padding:.5rem 1rem;min-width:64px}.setup-ban-container{display:flex;flex-direction:column;gap:1.5rem}.setup-ban-section{display:flex;flex-direction:column;gap:.5rem;border-top:1px solid #2a2a2a;padding-top:1rem}.ban-btns{display:flex;gap:.5rem;flex-wrap:wrap}.ban-btns button{border:3px solid var(--text);border-radius:var(--radius-sm);background-color:var(--text);color:#161616;font-weight:600;font-size:.85rem;padding:.5rem .85rem;min-height:44px;transition:border-color .2s ease,background-color .2s ease,transform .15s ease}@media(hover:hover)and (pointer:fine){.ban-btns button:hover{cursor:pointer;border-color:var(--accent)}}.ban-btns button:active{transform:scale(.97)}.ban-btns button.selected-btn{background-color:var(--accent-dim);color:#fff}.setup-warning{border:2px solid var(--accent);background-color:var(--accent-dim);color:#fff;border-radius:var(--radius-sm);padding:.75rem 1rem;font-size:.85rem;line-height:1.4;font-weight:600}.setup-submit-container{display:flex;flex-direction:column;align-items:stretch;width:100%;margin-top:auto;gap:.75rem;padding-top:1.5rem}.home-logo{width:min(300px,70vw)}.game-setup{display:flex;flex-direction:column;align-items:stretch;height:100%}.game-setup h1{font-size:1.25rem;font-weight:700}.game-setup h3{font-weight:700}.mode-selection{padding:1.5rem 0 0;display:flex;flex-direction:column;gap:.75rem}.mode-btns{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem;width:100%}@media(min-width:900px){.mode-btns{grid-template-columns:repeat(3,1fr)}.mode-btns button:last-child{grid-column:1/-1}}.player-btns{display:flex;align-items:center;flex-wrap:wrap;gap:.75rem}.player-count{display:flex;flex-direction:column;gap:.75rem;padding:1.5rem 0 0}.player-count button{display:flex;align-items:center;justify-content:center;padding:.5rem;border-radius:50%;height:44px;width:44px}.player-names{display:flex;flex-direction:column;gap:.75rem;padding:1.5rem 0 0}.player-names .name-inputs{display:flex;flex-direction:column;gap:.75rem}.player-names .name-inputs input{width:100%;padding:.75rem 3.25rem .75rem 1rem;border-radius:var(--radius);background-color:var(--text);color:#161616;border:3px solid transparent;min-height:44px}.player-names .name-inputs input:focus{outline:none;border-color:var(--accent)}.player-names .name-inputs input::placeholder{color:#5c5c5c}.name-warning{border:2px solid var(--accent);background-color:var(--accent-dim);color:#fff;border-radius:var(--radius-sm);padding:.75rem 1rem;font-size:.85rem;line-height:1.4;font-weight:600;margin-top:.75rem}.name-input-row{position:relative;display:flex;align-items:center}.name-clear-btn{position:absolute;right:.25rem;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:none;background-color:#00000026;color:#161616;transition:background-color .15s ease,transform .15s ease}@media(hover:hover)and (pointer:fine){.name-clear-btn:hover{cursor:pointer;background-color:#0000004d}}.name-clear-btn:active{transform:translateY(-50%) scale(.9)}.submit-container{margin-top:auto;flex-direction:column;gap:.75rem;display:flex;justify-content:center;padding-top:1.5rem}.submit-container .submit-btn{width:100%}:root{--bg: #1f1f1f;--bg2: #181818;--bg3: #141414;--accent: #e0263e;--accent-dim: #7a1522;--border: #e0263e;--text: #cccccc;--text-dim: #8a8a8a;--radius: .625rem;--radius-sm: .375rem;--selected: 3px solid var(--accent);--shadow: 0 10px 30px rgba(0, 0, 0, .45);--font-ui: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"}html,body{background-color:var(--bg);color:var(--text);user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}input,textarea{user-select:text;-webkit-user-select:text;-webkit-touch-callout:default}#root{min-height:100vh}a{color:inherit}button{font:inherit;color:inherit}.page{display:flex;flex-direction:column;min-height:100vh;width:100%;max-width:100%}.left{background-color:var(--bg2);display:flex;flex-direction:column;align-items:stretch;border-bottom:1px solid #2a2a2a;padding:1.25rem 1.25rem 1.5rem;gap:1rem}.right{display:flex;justify-content:center;align-items:center;flex:1;padding:1.5rem 1rem;min-width:0}@media(min-width:900px){.page{flex-direction:row}.left{width:350px;flex-shrink:0;max-height:100vh;min-height:100vh;border-right:1px solid #2a2a2a;border-bottom:none;padding:2rem;position:sticky;top:0;z-index:1;overflow-y:auto}.right{padding:2rem 1rem}}.submit-btn,.game-btn,.ban-btn,.setup{border:3px solid var(--text);border-radius:var(--radius);background-color:var(--text);color:#161616;font-weight:600;padding:.65rem 1rem;min-height:44px;transition:border-color .2s ease,transform .15s ease,background-color .2s ease}@media(hover:hover)and (pointer:fine){.submit-btn:hover,.game-btn:hover,.ban-btn:hover,.setup:hover{cursor:pointer;border-color:var(--accent)}}.submit-btn:active,.game-btn:active,.ban-btn:active,.setup:active{transform:scale(.97)}.submit-btn:disabled,.game-btn:disabled,.ban-btn:disabled,.setup:disabled{opacity:.4;cursor:not-allowed;transform:none}.selected,.selected-btn{border:var(--selected)!important}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}*,*:before,*:after{box-sizing:border-box!important}body{font-family:var(--font-ui)}