@font-face{font-family:Outfit;src:url('./assets/Outfit.ttf') format('truetype');font-weight:100 900;font-display:swap}
:root{font-family:Outfit,'Segoe UI',sans-serif;color:#f2f3e9;background:#18221e;font-synthesis:none;--bg:#18221e;--panel:#202c25;--line:#39463c;--muted:#a3afa1;--lime:#d5f478;--pink:#ff9690;--cream:#f2f3e9;--radius:24px;color-scheme:dark}
*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:radial-gradient(ellipse at 70% 10%,#30402a55,transparent 55%),var(--bg)}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button{border:0;background:none}button:disabled{opacity:.45;cursor:wait}button,a{touch-action:manipulation}button,input,select,textarea{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--lime)}[hidden]{display:none!important}.icon{width:22px;height:22px;display:inline-block;vertical-align:middle;flex-shrink:0}.pig{width:60px;height:60px;display:inline-block;vertical-align:middle;flex-shrink:0}h1,h2,h3,p{margin:0}h1{font-size:clamp(38px,5vw,66px);line-height:1.04;letter-spacing:-2.5px;font-weight:650}h2{font-size:26px;letter-spacing:-.7px;font-weight:600}h3{font-size:19px;font-weight:550;letter-spacing:-.3px}small,.muted{color:var(--muted)}.eyebrow{font-size:11px;letter-spacing:2.4px;text-transform:uppercase;color:var(--muted);font-weight:500}.tag{font-size:10px;letter-spacing:1px;border:1px solid var(--line);border-radius:7px;padding:4px 7px;text-transform:uppercase;color:var(--muted)}
.topbar{height:96px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;gap:30px;border-bottom:1px solid #39463c70;max-width:1720px;margin:auto}.brand{display:flex;align-items:center;gap:11px}.brand>span{font-weight:760;font-size:30px;letter-spacing:-1.4px;position:relative}.brand>span>span{color:var(--lime)}.brand i{font-size:11px;font-style:normal;position:absolute;right:-14px;top:3px;color:var(--pink)}.topbar nav{display:flex;gap:8px;align-items:center}.topbar nav a{font-size:13px;border-radius:30px;padding:11px 17px;color:#b6c0b2;transition:.18s}.topbar nav a:hover{color:var(--cream);background:#29362c}.topbar nav a.active{background:var(--cream);color:var(--bg)}.top-actions{display:flex;align-items:center;gap:13px}.connection{font-size:11px;color:var(--muted);white-space:nowrap;display:flex;align-items:center;gap:7px}.connection i,.online-dot{width:6px;height:6px;border-radius:50%;background:var(--lime);display:inline-block;box-shadow:0 0 12px #d5f47830}.connection.offline i{background:#e7b778;box-shadow:none}.icon-button{width:37px;height:37px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;color:#bec8b7;position:relative}.icon-button:hover{background:#344233;color:var(--cream)}.icon-button .count{position:absolute;top:-2px;right:-1px;background:var(--pink);color:#232c23;min-width:15px;height:15px;border-radius:20px;font-size:9px;display:grid;place-items:center}.profile-button{padding:0;width:43px;height:43px;border:1px solid #536148;border-radius:50%;background:#34412d}.profile-button .pig{width:38px;height:38px}
main{max-width:1440px;margin:auto;padding:42px 4vw 28px;min-height:calc(100dvh - 160px)}footer{max-width:1440px;margin:0 auto;padding:20px 4vw 24px;display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#7c8e7e}footer>div{display:flex;gap:25px}footer button{font-size:11px;color:inherit;padding:0}footer a:hover,footer button:hover{color:var(--lime)}.footer-center{font-size:9px;letter-spacing:1.4px;text-transform:uppercase}.page-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:32px}.page-head .eyebrow{margin-bottom:11px}.page-head h1{font-size:44px;letter-spacing:-1.8px}.head-actions{display:flex;gap:10px;align-items:center}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#2c3a2f;border:1px solid #46533e;border-radius:13px;padding:12px 18px;min-height:45px;font-size:12px;font-weight:500;transition:background .18s,transform .15s;white-space:nowrap}.button:hover{background:#3a4837}.button:active{transform:translateY(1px)}.button.primary{color:#21301c;background:var(--lime);border-color:var(--lime);font-weight:600;box-shadow:0 3px 0 #839e4e}.button.primary:hover{background:#e0fa9d}.button.pink{background:var(--pink);color:#452a29;border-color:var(--pink)}.button.ghost{background:none;border-color:var(--line);color:var(--muted)}.button.small{min-height:34px;padding:7px 12px;font-size:11px;border-radius:10px}.button.danger{color:var(--pink);border-color:#794d49;background:#54353040}.button .icon{width:17px;height:17px}.text-button{font-size:12px;color:var(--lime);display:inline-flex;align-items:center;gap:6px;padding:4px 0}.text-button .icon{width:16px;height:16px}.text-button:hover{color:var(--cream)}
.home-grid{display:grid;grid-template-columns:minmax(330px,.92fr) minmax(400px,1.24fr);gap:32px;align-items:stretch}.home-copy{padding-top:12px}.home-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.home-title .eyebrow{margin-bottom:12px}.club-mark{border:1px solid #63734c;border-radius:50%;width:86px;height:86px;display:flex;flex-direction:column;justify-content:center;align-items:center;transform:rotate(13deg);font-size:9px;letter-spacing:1.7px;color:var(--lime);gap:2px}.club-mark .pig{width:41px;height:41px}.mode-card{border:1px solid var(--line);border-radius:20px;background:linear-gradient(120deg,#2b3a2b80,#24312880);padding:22px 24px;display:grid;grid-template-columns:1fr auto;gap:15px;align-items:center;margin-bottom:12px;position:relative;overflow:hidden}.mode-card.solo{padding:26px 24px;border-color:#819c5065;background:linear-gradient(120deg,#3c4d2c,#273628)}.mode-title{display:flex;align-items:center;gap:12px}.mode-title>.icon{width:24px;height:24px;color:var(--lime)}.mode-title h2{font-size:25px}.mode-card p{font-size:11px;color:var(--muted);margin-top:6px}.mode-card .mode-options{grid-column:1/-1;display:flex;gap:8px;align-items:center;justify-content:space-between}.segments{display:inline-flex;gap:3px;border:1px solid #536144;border-radius:10px;padding:3px;background:#15211a40}.segments button{font-size:11px;color:#c8d0ba;border-radius:7px;padding:7px 10px}.segments button.active{background:#eff2dc;color:#223021}.segments button:hover{background:#5e70463f}.segments button.active:hover{background:#eff2dc}.mode-options select{background:#2d3c28;border:1px solid #536144;border-radius:10px;padding:9px;color:#dfe8ce;font-size:11px}.mode-card .primary{width:100%;grid-column:1/-1;justify-content:space-between}.mode-number{font-size:10px;border:1px solid #5e6e51;color:#b6c3a2;width:28px;height:28px;border-radius:50%;display:grid;place-items:center}.mode-card .round-action{background:#3c4d35;width:40px;height:40px;border-radius:50%;border:1px solid #677650;color:var(--lime);display:grid;place-items:center}.mode-card .round-action:hover{background:var(--lime);color:#243021}.mode-card.ranked{background:linear-gradient(120deg,#3e363050,#2b302880)}.mode-card.ranked .mode-title>.icon{color:#efce8d}.preview-card{border-radius:28px;background:#26352b;border:1px solid #4d604040;min-height:650px;position:relative;overflow:hidden;display:flex;flex-direction:column;background-image:radial-gradient(ellipse at 50% 45%,#45603a70,transparent 65%)}.preview-card:after{content:'✦';position:absolute;right:30px;top:78px;color:#d5f4788c;font-size:35px;font-weight:200;transform:rotate(20deg)}.preview-top{display:flex;align-items:center;justify-content:space-between;padding:23px 27px;position:absolute;inset:0 0 auto;z-index:1;font-size:10px;color:#aebfa3;letter-spacing:1px}.live-label{display:flex;gap:7px;align-items:center;font-size:9px;text-transform:uppercase;letter-spacing:1.5px}.live-label i{height:5px;width:5px;border-radius:50%;background:var(--lime)}.preview-canvas{flex:1;min-height:580px;position:relative;margin:45px 8px 35px}.preview-canvas canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;filter:drop-shadow(0 12px 20px #09130e50)}.preview-bottom{position:absolute;bottom:22px;left:28px;right:28px;display:flex;justify-content:space-between;color:#a7b999;font-size:10px}.preview-bottom strong{color:#d3dfc3;font-weight:500}.sticker{position:absolute;right:22px;bottom:80px;z-index:1;background:var(--pink);color:#372927;width:97px;height:97px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-13deg);border:5px solid #efc3ab;box-shadow:0 5px 0 #20302060;font-size:9px;font-weight:650;letter-spacing:1px}.sticker .pig{width:47px;height:47px}.home-bottom{display:grid;grid-template-columns:1.5fr 1fr;gap:24px;margin-top:32px}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.section-head h2{font-size:21px}.section-head>span{font-size:11px;color:var(--muted)}.panel{background:#202c2590;border:1px solid var(--line);border-radius:22px;padding:24px}.panel.slim{padding:20px}.empty{padding:40px 20px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:15px;border:1px dashed #43513d;border-radius:16px;color:#9aaa95;font-size:13px}.empty>.icon{width:30px;height:30px;color:#758c69}.empty .pig{width:75px;height:75px;opacity:.8}.empty.compact{padding:26px 12px;font-size:12px}.mini-clan{display:flex;gap:16px;align-items:center}.mini-clan .pig{height:80px;width:80px}.mini-clan h3{margin-bottom:8px}.mini-clan p{font-size:12px;color:var(--muted);margin:7px 0 14px}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.search-field{display:flex;gap:10px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:10px 13px;background:#222e25;max-width:340px;flex:1}.search-field .icon{color:#8f9e86;width:18px;height:18px}.search-field input{border:0;outline:0;background:none;width:100%;font-size:12px;color:var(--cream)}.room-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.room-card{border:1px solid var(--line);border-radius:22px;background:#26322980;padding:22px;position:relative}.room-card:hover{border-color:#63764d}.room-card-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:20px}.room-card h3{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-card-head>.icon{width:15px;height:15px;color:var(--muted)}.pill{font-size:9px;letter-spacing:.6px;text-transform:uppercase;border-radius:20px;background:#36462c;color:#bfdb9c;padding:5px 8px;white-space:nowrap}.pill.pink{background:#553f3b;color:#ffb0a3}.room-versus{display:flex;align-items:center;justify-content:center;gap:19px;padding:8px 0 19px}.room-versus .pig{width:49px;height:49px}.room-versus>span{font-size:10px;color:#7f9279}.room-card-meta{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted);margin-bottom:19px}.room-card-meta span+span:before{content:'·';margin-right:10px}.room-card>.button{width:100%}.room-card .names{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.room-row{display:flex;gap:15px;align-items:center;padding:14px 0;border-bottom:1px solid #39463c80}.room-row:last-child{border:0}.room-row .pig{width:34px;height:34px}.room-row .row-info{flex:1;min-width:0}.room-row strong{display:block;font-size:12px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-row small{font-size:10px}.room-row .button{min-height:31px;font-size:10px;padding:6px 12px}
.ranked-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:25px}.ranked-card{border-radius:28px;padding:38px;background:radial-gradient(ellipse at 50% 0%,#6b5f3655,transparent 65%),#273026;border:1px solid #6b68433f;text-align:center}.big-rank{width:130px;height:140px;margin:14px auto 24px;position:relative;display:grid;place-items:center}.big-rank:before{content:'';position:absolute;inset:0;background:var(--rank,#b3bda3);clip-path:polygon(50% 0,95% 25%,87% 73%,50% 100%,13% 73%,5% 25%);opacity:.16}.big-rank:after{content:'';position:absolute;inset:8px;border:1px solid #75876a;clip-path:polygon(50% 0,95% 25%,87% 73%,50% 100%,13% 73%,5% 25%)}.big-rank .pig{width:100px;height:100px;z-index:1}.ranked-card h2{font-size:32px;margin-bottom:12px}.rank-points{font-size:42px;font-weight:600;letter-spacing:-1.5px;margin-top:20px}.rank-points small{font-size:12px;letter-spacing:0;font-weight:400}.progress{height:5px;background:#46533b;border-radius:10px;overflow:hidden;margin:15px 0 10px}.progress i{display:block;height:100%;background:var(--lime);border-radius:10px}.ranked-card>.button{width:100%;margin-top:25px}.rank-detail{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:25px}.stat{padding:20px;border-radius:17px;border:1px solid var(--line);background:#202c2580}.stat strong{display:block;font-size:28px;font-weight:600;letter-spacing:-1px}.stat span{display:block;font-size:10px;color:var(--muted);margin-top:6px}.rank-badge{display:inline-flex;align-items:center;gap:6px;font-size:10px;line-height:1.2;color:var(--rank);border:1px solid color-mix(in srgb,var(--rank) 30%,transparent);background:color-mix(in srgb,var(--rank) 7%,transparent);border-radius:7px;padding:5px 7px;white-space:nowrap}.rank-badge .icon{height:12px;width:12px}.history-list{display:flex;flex-direction:column;gap:8px}.history-row{display:flex;align-items:center;gap:12px;background:#2a362b;border-radius:12px;padding:12px 14px;font-size:12px}.history-outcome{font-size:10px;font-weight:650;color:var(--lime);width:34px}.history-outcome.loss{color:var(--pink)}.history-row .opponent{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.history-row small{font-size:10px;display:block;margin-top:3px}.history-row b{font-weight:500;letter-spacing:2px}.history-row .delta{font-size:11px;color:var(--lime);min-width:30px;text-align:right}.history-row .delta.negative{color:var(--pink)}.rank-list{display:grid;gap:10px;margin:20px 0}.rank-list-row{display:flex;gap:12px;align-items:center;font-size:12px;padding:11px;border-radius:10px;background:#28352a}.rank-list-row .rank-badge{min-width:110px}.rank-list-row small{margin-left:auto}
.clan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.clan-card{border:1px solid var(--line);border-radius:22px;padding:25px;background:linear-gradient(130deg,#31402e80,#242e2580);display:flex;flex-direction:column;gap:16px}.clan-card-top{display:flex;align-items:center;gap:14px}.clan-card .pig{width:65px;height:65px}.clan-tag{font-size:10px;font-weight:600;letter-spacing:1px;color:var(--lime);margin-bottom:6px;display:block}.clan-card p{font-size:12px;color:var(--muted);line-height:1.6;min-height:38px}.clan-meta{display:flex;gap:18px;font-size:11px;color:#bdcbb2}.clan-card .button{margin-top:auto}.clan-hero{display:flex;align-items:center;gap:25px;margin-bottom:30px}.clan-hero .pig{width:110px;height:110px}.clan-hero h1{font-size:42px}.clan-hero p{font-size:13px;color:var(--muted);margin-top:10px;max-width:500px;line-height:1.7}.clan-hero .head-actions{margin-left:auto}.two-columns{display:grid;grid-template-columns:1.4fr 1fr;gap:24px}.roster-row{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid #39463c70}.roster-row:last-child{border:0}.roster-row .pig{width:41px;height:41px}.roster-row .player-info{flex:1;min-width:0}.player-info strong{display:block;font-size:13px;font-weight:500}.player-info small{display:block;font-size:10px;margin-top:4px}.roster-row .icon-button{width:25px;height:25px}.roster-row .icon{height:14px;width:14px}.online-dot.offline{background:#697666;box-shadow:none}.profile-layout{display:grid;grid-template-columns:320px 1fr;gap:25px}.profile-card{text-align:center}.profile-card>.pig{width:130px;height:130px;margin:10px 0 12px}.profile-card h2{font-size:29px}.profile-card .handle{font-size:12px;color:var(--muted);margin:8px 0 17px}.profile-card .bio{font-size:12px;line-height:1.7;color:#bbc6b2;margin:16px 0}.profile-card .button{width:100%;margin-top:10px}.profile-level{font-size:10px;letter-spacing:1px;color:var(--lime);margin:20px 0 9px}.profile-editor{margin-top:25px}.avatar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:10px 0 18px}.avatar-option{border-radius:14px;border:1px solid var(--line);background:#2a372c;padding:5px;display:grid;place-items:center}.avatar-option.active{border-color:var(--lime);background:#405130}.avatar-option .pig{width:53px;height:53px}.color-options{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0 20px}.color-option{width:28px;height:28px;border:2px solid transparent;outline:1px solid transparent;outline-offset:3px;border-radius:50%;background:var(--color)}.color-option.active{outline-color:var(--lime);border-color:#273323}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:20px}table{width:100%;border-collapse:collapse;text-align:left}th{font-size:10px;color:var(--muted);font-weight:400;text-transform:uppercase;letter-spacing:1px;padding:17px 20px;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:14px 20px;font-size:12px;border-bottom:1px solid #34413380}tr:last-child td{border:0}.table-player{display:flex;gap:12px;align-items:center}.table-player .pig{width:36px;height:36px}.table-player strong{font-size:13px;font-weight:500}.table-player small{display:block;font-size:10px;margin-top:3px}.table-place{font-size:14px;color:#a8b898}.leaderboard-tabs{margin-bottom:25px}
dialog{color:var(--cream);background:#233026;border:1px solid #61704c;border-radius:25px;width:470px;max-width:calc(100vw - 26px);padding:27px;max-height:calc(100dvh - 38px);box-shadow:0 30px 120px #0008;overflow:auto;color-scheme:dark}dialog::backdrop{background:#0b160fa8;backdrop-filter:blur(8px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;font-size:23px;font-weight:550;letter-spacing:-.5px}.dialog-top .icon-button{font-weight:300}.form{display:flex;flex-direction:column;gap:16px}label.field{display:flex;flex-direction:column;gap:8px;font-size:11px;color:#bcc9b1}.field input,.field select,.field textarea{width:100%;background:#18251c;border:1px solid #4a5b40;border-radius:11px;color:var(--cream);padding:12px 13px;font-size:13px;resize:vertical}.field input::placeholder,.field textarea::placeholder{color:#6f866b}.field input:focus,.field textarea:focus{border-color:var(--lime)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}.check{display:flex;gap:10px;align-items:center;font-size:12px;color:#bdc9b3}.check input{accent-color:var(--lime);width:15px;height:15px}.field-note{font-size:11px;line-height:1.6;color:#92a089}.form-error{font-size:12px;color:#ffaaa3;line-height:1.6}.form-error:empty{display:none}.form .button{width:100%}.auth-tabs{display:flex;gap:5px;margin-bottom:20px}.auth-tabs button{flex:1;border-radius:9px;background:#31412d;color:#b6c7ab;padding:9px;font-size:11px}.auth-tabs button.active{background:var(--cream);color:#233022}.recovery-key{padding:15px;border:1px solid #728654;background:#18241b;border-radius:11px;font-family:monospace;font-size:13px;word-break:break-all;line-height:1.8;margin:16px 0}.social-section{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);margin:24px 0 7px}.invite-row{padding:14px;border:1px solid var(--line);border-radius:13px;margin:9px 0;font-size:12px}.invite-row small{display:block;font-size:11px;margin-top:5px}.invite-actions{display:flex;gap:8px;margin-top:13px}.social-row{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #3b4a3580}.social-row .pig{width:37px;height:37px}.social-row .player-info{flex:1}.social-row .button{font-size:10px;padding:5px 8px;min-height:29px}.chat-log{height:285px;overflow:auto;scrollbar-width:thin;scrollbar-color:#536647 transparent;display:flex;flex-direction:column;gap:12px;padding:3px 0 16px}.chat-line{font-size:12px;line-height:1.5;word-break:break-word}.chat-line strong{font-weight:500;margin-right:7px}.chat-line small{font-size:9px;margin-left:7px}.chat-input{display:flex;gap:8px;margin-top:14px}.chat-input input{min-width:0;flex:1;background:#17241b;border:1px solid #495c3c;border-radius:10px;padding:11px;font-size:12px;color:var(--cream)}.chat-input button{width:38px;border-radius:10px;background:var(--lime);color:#23331d}.control-row{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#b9c7b0;margin:18px 0;gap:20px}.control-row input[type=range]{accent-color:var(--lime);width:160px}.control-row input[type=checkbox]{accent-color:var(--lime)}.table-themes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:15px 0 25px}.table-theme{border:1px solid var(--line);border-radius:12px;padding:7px;font-size:10px;background:#1c291f}.table-theme.active{border-color:var(--lime)}.table-theme i{display:block;height:55px;margin-bottom:8px;border-radius:6px;background:var(--table);position:relative}.table-theme i:after{content:'';position:absolute;inset:5px 13px;border:1px solid #ffffff50;border-radius:8px}.help-list{display:grid;grid-template-columns:auto 1fr;gap:18px 23px;font-size:12px;color:#becab5;line-height:1.7}.help-list strong{color:var(--cream);font-weight:500}kbd{font:11px Outfit;border:1px solid #61754d;border-radius:6px;padding:4px 8px;background:#34432a;color:var(--lime)}.loading-mark{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;min-height:60dvh;color:#aec19d;font-size:12px}.page-loading{padding:80px;text-align:center;font-size:13px;color:var(--muted)}#toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);padding:13px 22px;border:1px solid #718351;border-radius:13px;background:#34432c;z-index:200;font-size:12px;max-width:min(90vw,550px);box-shadow:0 10px 30px #0005;text-align:center}#queue-dock{position:fixed;bottom:24px;right:28px;z-index:20;display:flex;gap:22px;align-items:center;border:1px solid #8da75a;border-radius:18px;background:#304129;padding:16px 20px;box-shadow:0 12px 40px #09130c90;min-width:280px}#queue-dock .queue-icon{color:var(--lime)}#queue-dock strong{display:block;font-size:13px;font-weight:500}#queue-dock small{font-size:11px;display:block;margin-top:5px}#queue-dock .icon-button{margin-left:auto}
.match-page{padding-top:5px}.match-topline{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;font-size:12px}.match-topline>div{display:flex;align-items:center;gap:13px}.match-layout{display:grid;grid-template-columns:minmax(300px,1fr) 270px;gap:28px;max-width:1100px;margin:auto}.match-rink-column{position:relative;min-width:0}.match-board{height:calc(100dvh - 285px);min-height:480px;max-height:850px;position:relative;background:radial-gradient(ellipse at 50% 50%,#34472f70,transparent 65%);overflow:hidden}.match-board canvas{width:100%;height:100%;display:block;touch-action:none;cursor:none}.arena-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}.countdown-label{font-size:70px;font-weight:600;letter-spacing:-3px;color:var(--cream);text-shadow:0 4px 35px #0009}.countdown-label.small{font-size:22px;letter-spacing:-.5px;padding:15px 25px;border-radius:14px;background:#122019c9;border:1px solid #697d4e}.match-scoreboard{display:flex;justify-content:center;align-items:center;gap:26px;padding:10px 20px 5px;position:relative}.score-side{display:flex;align-items:center;gap:12px;min-width:100px;max-width:210px}.score-side:last-child{flex-direction:row-reverse}.score-side .pig{width:35px;height:35px}.score-name{font-size:12px;max-width:115px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.score-side:last-child .score-name{text-align:right}.score-number{font-size:45px;font-weight:600;letter-spacing:-2px;line-height:1.1;min-width:31px;text-align:center;color:var(--lime);font-variant-numeric:tabular-nums}.score-side:last-child .score-number{color:var(--pink)}.score-middle{text-align:center;color:var(--muted);font-size:9px;letter-spacing:1px;white-space:nowrap}.score-middle strong{display:block;font-size:13px;font-weight:400;letter-spacing:1px;color:#bac7af;margin-bottom:3px}.match-tools{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:6px;color:#839879;font-size:10px}.match-tools button{font-size:11px;display:flex;align-items:center;gap:6px;padding:6px}.match-tools .icon{width:15px;height:15px}.match-tools button:hover{color:var(--lime)}.match-side .panel{padding:21px;border-radius:20px;margin-bottom:15px}.match-side h3{font-size:16px;margin-bottom:18px}.match-roster{display:flex;flex-direction:column;gap:17px}.match-player{display:flex;align-items:center;gap:10px}.match-player .pig{width:39px;height:39px}.match-player .player-info{min-width:0}.match-player strong{font-size:12px;overflow:hidden;max-width:145px;white-space:nowrap;text-overflow:ellipsis}.match-player .rank-badge{font-size:8px;padding:4px 5px;margin-top:6px}.match-player .rank-badge .icon{height:10px;width:10px}.ready-state{margin-left:auto;color:var(--lime)}.ready-state .icon{width:15px;height:15px}.match-room-meta{display:flex;flex-direction:column;gap:10px;margin-top:22px;font-size:10px;color:#a5b69b}.match-room-meta>div{display:flex;justify-content:space-between;align-items:center;gap:8px}.match-room-meta b{color:#d0ddbf;font-size:11px;font-weight:450}.match-side .button{width:100%;margin-top:16px}.match-side .chat-log{height:190px}.match-side .chat-line{font-size:11px}.match-side .chat-input{margin-top:7px}.match-side .chat-input input{font-size:10px;padding:9px}.match-side .chat-input button{width:30px}.match-side .chat-input .icon{width:15px;height:15px}.ready-bar{display:flex;align-items:center;gap:16px;padding:14px 20px;margin:10px 0 0;border:1px solid #5c7444;border-radius:17px;background:#2d3e27}.ready-bar>span{font-size:12px;flex:1;color:#becdb0}.ready-bar .button{min-width:130px}.result-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#101c14a8;backdrop-filter:blur(6px);z-index:4;border-radius:25px}.result-card{text-align:center;background:#263724;border:1px solid #708d4d;border-radius:26px;padding:30px;width:320px;max-width:90%}.result-card>.pig{width:85px;height:85px}.result-card h2{font-size:38px;letter-spacing:-1px;margin:8px 0}.result-card .result-score{font-size:32px;letter-spacing:6px;margin:16px 0}.result-rating{font-size:20px;color:var(--lime);margin:15px 0}.result-rating.negative{color:var(--pink)}.result-card .button{width:100%;margin-top:10px}.result-card .field-note{margin-top:12px}.settings-rule{border-top:1px solid var(--line);margin:24px 0 20px}
@media(min-width:1550px){.home-grid{gap:48px}.preview-card{min-height:700px}.preview-canvas{min-height:630px}.home-copy{padding:20px 0}.mode-card{margin-bottom:16px}.match-layout{max-width:1180px}}
@media(max-width:1100px){.topbar{padding:0 25px;gap:20px}.topbar nav{gap:2px}.topbar nav a{padding:9px 12px;font-size:12px}.connection span{display:none}.top-actions{gap:6px}.home-grid{gap:22px;grid-template-columns:1fr 1.05fr}.mode-card{padding:19px}.mode-card.solo{padding:23px 19px}.mode-options{flex-wrap:wrap}.segments button{padding:7px 8px}.preview-card{min-height:660px}.home-title{margin-bottom:25px}.home-title h1{font-size:54px}.club-mark{width:72px;height:72px;font-size:7px}.club-mark .pig{width:36px;height:36px}.room-grid,.clan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.match-layout{gap:15px;grid-template-columns:minmax(300px,1fr) 240px}.match-scoreboard{gap:15px;padding-left:5px;padding-right:5px}.score-side{gap:8px;min-width:90px}.score-name{max-width:85px;font-size:11px}.score-side .pig{display:none}}
@media(max-width:800px){.topbar{height:82px;padding:0 22px;gap:15px}.brand>span{font-size:25px}.brand img{width:34px;height:34px}.brand{gap:8px}.topbar nav a{padding:8px;font-size:11px}.top-actions{gap:3px}.top-actions>.connection{display:none}.icon-button{width:31px;height:31px}.icon-button .icon{width:19px;height:19px}.profile-button{width:36px;height:36px}.profile-button .pig{width:32px;height:32px}main{padding:30px 25px}.home-grid{grid-template-columns:1fr 1fr;gap:20px}.home-title h1{font-size:49px}.club-mark{display:none}.home-title{margin-bottom:24px}.mode-card{padding:17px;gap:13px}.mode-card.solo{padding:19px 17px}.mode-title{gap:9px}.mode-title h2{font-size:22px}.mode-title>.icon{width:20px;height:20px}.mode-card p{font-size:10px}.mode-number{display:none}.mode-options select{width:100%;padding:8px}.mode-options .segments{display:flex;width:100%}.mode-options .segments button{flex:1;padding:7px 5px;font-size:10px}.mode-card>.primary{font-size:11px;padding:11px 14px}.preview-canvas{margin-left:-20px;margin-right:-20px;min-height:580px}.preview-top{padding:20px;font-size:8px}.sticker{width:72px;height:72px;border-width:3px;font-size:7px;right:12px;bottom:75px}.sticker .pig{width:35px;height:35px}.preview-bottom{left:20px;right:20px;font-size:9px}.home-bottom{gap:20px;grid-template-columns:1.2fr 1fr}.panel{padding:20px}.ranked-grid,.profile-layout{grid-template-columns:1fr 1.2fr}.profile-layout .profile-card{padding:18px}.stats-grid{gap:8px}.stat{padding:16px 13px}.stat strong{font-size:25px}.stat span{font-size:9px}.two-columns{grid-template-columns:1fr 1fr}.clan-hero{flex-wrap:wrap}.clan-hero .head-actions{margin:0}.match-layout{grid-template-columns:1fr 220px}.match-side .panel{padding:17px}.match-board{min-height:430px}.match-scoreboard{gap:8px}.score-number{font-size:38px}.score-name{font-size:10px;max-width:65px}.score-side{gap:6px;min-width:auto}.score-middle{font-size:8px}.score-middle strong{font-size:11px}.footer-center{display:none}.clan-hero h1{font-size:33px}.clan-hero>.pig{width:80px;height:80px}}
@media(max-width:650px){body{background:var(--bg)}.topbar{height:112px;flex-wrap:wrap;gap:0;padding:13px 18px 0;position:relative}.brand{align-self:flex-start}.brand>span{font-size:25px}.brand img{width:33px;height:33px}.top-actions{margin-left:auto;align-self:flex-start;gap:6px}.topbar nav{order:3;width:100%;justify-content:space-between;gap:4px;height:48px;align-items:center}.topbar nav a{padding:8px 12px;font-size:11px}.topbar nav a:last-child{font-size:10px}.top-actions>.connection{display:none}main{padding:25px 18px 20px;min-height:calc(100dvh - 170px)}h1{font-size:48px}.home-grid{grid-template-columns:1fr;gap:25px}.home-copy{padding:0}.home-title{margin-bottom:22px}.home-title h1{font-size:54px}.club-mark{display:flex;width:65px;height:65px;font-size:6px}.club-mark .pig{width:33px;height:33px}.mode-card{padding:20px;margin-bottom:11px;border-radius:18px;gap:17px}.mode-card.solo{padding:22px 20px}.mode-title h2{font-size:25px}.mode-title>.icon{width:23px;height:23px}.mode-card p{font-size:11px}.mode-number{display:grid}.mode-card .mode-options{flex-wrap:nowrap}.mode-options .segments{width:auto;flex:1;max-width:260px}.mode-options .segments button{padding:8px 9px;font-size:10px}.mode-options select{width:auto;padding:10px 8px;font-size:10px}.mode-card>.primary{padding:13px 17px;font-size:12px}.preview-card{min-height:420px;height:430px;border-radius:23px}.preview-canvas{min-height:0;margin:36px 10px 33px}.preview-top{padding:18px 20px;font-size:9px}.preview-bottom{bottom:15px;font-size:9px}.sticker{bottom:65px;right:20px;width:80px;height:80px}.sticker .pig{width:39px;height:39px}.home-bottom{grid-template-columns:1fr;gap:20px;margin-top:25px}.panel{padding:20px;border-radius:19px}.section-head h2{font-size:20px}.page-head{margin-bottom:23px;align-items:start;gap:15px;flex-wrap:wrap}.page-head h1{font-size:36px;letter-spacing:-1.3px}.page-head .eyebrow{font-size:9px;margin-bottom:9px}.head-actions{gap:7px}.head-actions .button{padding:9px 12px;font-size:11px;min-height:40px}.toolbar{gap:10px;flex-wrap:wrap}.toolbar .search-field{max-width:none;flex-basis:100%;order:0}.toolbar .segments{order:1}.room-grid,.clan-grid{grid-template-columns:1fr;gap:13px}.room-card{padding:20px}.room-versus{padding:0 0 10px}.room-card h3{font-size:18px}.room-card-meta{margin-bottom:15px}.room-card-head{margin-bottom:15px}.room-grid>.empty,.clan-grid>.empty{grid-column:1/-1}.room-card .button{min-height:40px}.ranked-grid,.profile-layout,.two-columns{grid-template-columns:1fr;gap:20px}.ranked-card{padding:25px}.ranked-card .big-rank{margin-top:10px}.ranked-card h2{font-size:30px}.ranked-card>.button{margin-top:21px}.stats-grid{gap:9px;margin-bottom:20px}.stat{padding:18px 14px}.stat strong{font-size:27px}.stat span{font-size:10px}.clan-hero{gap:17px;margin-bottom:25px}.clan-hero>.pig{width:70px;height:70px}.clan-hero h1{font-size:31px;letter-spacing:-1px}.clan-hero p{font-size:12px;margin-top:8px}.clan-hero .head-actions{width:100%;justify-content:flex-start;flex-wrap:wrap}.clan-hero .clan-tag{font-size:9px;margin-bottom:5px}.profile-layout .profile-card>.pig{width:100px;height:100px}.profile-layout .profile-card h2{font-size:28px}.profile-layout .profile-card .button{max-width:240px}.profile-editor{margin-top:20px}.profile-editor .avatar-grid{grid-template-columns:repeat(8,1fr);gap:5px}.profile-editor .avatar-option{padding:3px;border-radius:10px}.profile-editor .avatar-option .pig{height:32px;width:32px}.avatar-grid .pig{height:47px;width:47px}.color-options{gap:12px}.color-option{width:25px;height:25px}.table-wrap{margin-left:-3px;margin-right:-3px;border-radius:15px}th{padding:15px 12px;font-size:8px}td{padding:13px 12px;font-size:11px}.table-player{gap:8px}.table-player .pig{width:29px;height:29px}.table-player strong{font-size:11px}.table-player small{font-size:9px}.table-player .rank-badge{font-size:8px}.table-place{font-size:12px}td .rank-badge{font-size:8px;padding:4px}.table-col-extra{display:none}.rank-list-row .rank-badge{min-width:100px}.rank-list-row small{font-size:10px}footer{padding:15px 20px 23px;font-size:10px}footer>div{gap:18px}footer button{font-size:10px}dialog{padding:23px 20px;border-radius:22px;max-height:calc(100dvh - 24px)}.dialog-top{font-size:22px;margin-bottom:19px}.form-row{gap:12px}.form{gap:15px}.form input,.form select,.form textarea{font-size:14px}.chat-log{height:240px}#queue-dock{bottom:16px;right:15px;left:15px;min-width:0;border-radius:16px;padding:13px 16px;font-size:12px}.topbar .brand i{font-size:9px;right:-12px}.match-page{padding-top:0}.match-layout{display:flex;flex-direction:column;gap:18px}.match-topline{margin-bottom:7px;font-size:10px;gap:5px}.match-topline .button{font-size:10px;min-height:30px;padding:7px 10px}.match-topline>.match-label{display:none}.match-rink-column{width:100%}.match-board{height:calc(100dvh - 272px);min-height:380px;max-height:780px;margin:0 -5px}.match-scoreboard{gap:12px;justify-content:space-between;padding:8px 7px 4px}.score-side{gap:8px;max-width:43%;min-width:0}.score-number{font-size:37px;min-width:27px}.score-name{font-size:10px;max-width:90px}.score-side .pig{display:block;width:28px;height:28px}.score-middle{font-size:7px}.score-middle strong{font-size:10px}.match-tools{gap:15px;margin-top:3px}.match-tools button{padding:4px;font-size:10px}.match-side{display:grid;grid-template-columns:1fr;gap:15px}.match-side .panel{margin:0;padding:20px}.match-side .panel:first-child{display:none}.match-side .chat-log{height:145px}.match-side h3{font-size:14px;margin-bottom:14px}.match-side .chat-line{font-size:12px}.match-side .chat-input input{font-size:12px;padding:10px}.match-side .chat-input button{width:37px}.match-side .chat-input .icon{width:18px;height:18px}.ready-bar{padding:12px 14px;gap:10px;margin-top:8px}.ready-bar>span{font-size:11px}.ready-bar .button{font-size:11px;min-width:110px;min-height:38px;padding:9px 13px}.result-card{padding:24px;width:285px}.result-card h2{font-size:34px}.result-card>.pig{width:70px;height:70px}.result-card .result-score{font-size:28px;margin:11px 0}.result-rating{font-size:18px}.countdown-label{font-size:58px}.countdown-label.small{font-size:17px}.control-row input[type=range]{width:135px}.table-theme i{height:47px}}
@media(max-width:370px){.topbar nav a{padding:7px 9px;font-size:10px}.topbar nav a:last-child{font-size:9px}.top-actions{gap:2px}.mode-options .segments button{padding:8px 6px}.score-side .pig{display:none}.score-name{max-width:87px}.match-topline{font-size:9px}.form-row{grid-template-columns:1fr}.club-mark{width:60px;height:60px}.profile-editor .avatar-grid{grid-template-columns:repeat(4,1fr)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}