/* PATIO 6: the match is the backdrop, not a screenshot. Native, accessible UI. */
:root{--hub-line:#e4edce24;--hub-muted:#a9bbac;--hub-paper:#f6f1e3;--hub-coral:#f39a7c}
.custom-crest-host{clip-path:none!important;border:0!important;padding:0!important;display:block!important;background:transparent!important}.crest-art{display:block;width:42px;height:48px;flex-shrink:0}.crest-art svg,.custom-crest-host svg{width:100%;height:100%;stroke:none}.crest-svg{width:100%;height:100%;display:block;overflow:visible}
.hub-nav{display:none;gap:35px;margin-left:65px;align-self:stretch;align-items:center}.hub-nav button{background:none;color:#a7b8ab;font-size:13px;font-weight:650;padding:25px 0;position:relative;white-space:nowrap}.hub-nav button.selected{color:#fff2de}.hub-nav button.selected:after{content:'';height:3px;border-radius:4px;background:var(--hub-coral);position:absolute;bottom:0;left:0;right:0}.hub-nav button:hover{color:white}.is-home .hub-nav{display:flex}.is-home .topbar{background:#112d26d9;backdrop-filter:blur(18px);border-bottom:1px solid #deead41a;justify-content:flex-start}.is-home .header-right{margin-left:auto}.is-home .topbar .scoreboard,.is-home .footer,.is-home #pauseBtn,.is-home .local-tag,.is-home .stage-top,.is-home .stage-right{display:none}.is-home #app{grid-template-rows:76px minmax(0,1fr) 0px}.is-home .stage{background:#17392e}.is-home #game{cursor:default}.is-home #menuShade{background:linear-gradient(90deg,#09251fea 0%,#09251fda 21%,#0a292194 40%,#0a282112 67%,#0a282100 88%),linear-gradient(0deg,#09251ff0 0%,#09251f15 40%,#09251f10 80%,#09251f88);z-index:11}
#home.hub-home{position:absolute;inset:0;z-index:12;display:block;overflow:auto;padding:clamp(25px,5vh,60px) clamp(24px,5.6vw,110px) 23px;pointer-events:none;scrollbar-width:thin;scrollbar-color:#78937e transparent;touch-action:pan-y}.hub-home>*{pointer-events:auto}.hero-copy{width:min(425px,41%);margin:0}.hero-copy h1{font-size:clamp(55px,5.4vw,91px);line-height:.98;letter-spacing:-.065em;font-weight:900;color:#f4efdf;margin:0 0 23px}.hero-copy h1 em{font-style:normal;color:var(--hub-coral)}.hero-description{font-size:14px;line-height:1.7;color:#bbc8b9;margin:0 0 26px;font-weight:400}.hero-actions{display:flex;gap:12px;align-items:center}.hero-primary{width:auto;min-width:205px;background:var(--hub-coral);border-color:#ffb292;border-radius:8px;padding:18px 18px;font-size:13px;box-shadow:0 4px 0 #b6634c,0 9px 35px #060f121f;gap:13px}.hero-primary:hover{background:#ffb193;transform:translateY(-1px)}.hero-secondary{border:1px solid #aec6af68;background:#163a3099;border-radius:8px;color:#f1eddb;font-size:12px;display:flex;align-items:center;gap:9px;padding:18px 14px;white-space:nowrap}.hero-secondary svg{width:14px;height:14px}.hero-secondary:hover{background:#285141}.hero-configuration{display:flex;justify-content:space-between;gap:15px;background:transparent;color:#abc0ad;width:100%;font:10px var(--mono);padding:18px 0;margin-bottom:12px;border-bottom:1px solid var(--hub-line)}.hero-configuration>span:last-child{display:flex;gap:8px;align-items:center;font-family:var(--font);font-size:11px;color:#d2ddc9}.hero-configuration svg{width:13px;height:13px}.home-club-link{display:flex;gap:15px;text-align:left;background:#183b304d;width:100%;color:#f1eedb;border:1px solid #bdc9ad25;border-radius:9px;padding:16px}.home-club-link:hover{background:#2e584166;border-color:#bccdb266}.home-club-link>span:nth-child(2){flex:1;min-width:0}.home-club-link small{font:8px var(--mono);color:#8eac98;letter-spacing:1px;display:block}.home-club-link strong{font-size:18px;display:block;margin:4px 0 3px;overflow-wrap:anywhere;letter-spacing:-.35px}.home-club-link em{font-size:10px;color:#b2c3ad;font-style:normal}.home-club-link>svg{width:15px;align-self:center}.hero-utility{display:flex;gap:19px;margin-top:22px}.hero-utility button{background:none;padding:0;color:#c2d0ba;font-size:10px}.hero-utility button:hover{text-decoration:underline;text-underline-offset:5px}
.demo-broadcast{position:absolute;right:clamp(25px,5.6vw,110px);top:clamp(25px,5vh,60px);width:350px;background:#122f2794;backdrop-filter:blur(12px);border:1px solid #e0ebc838;border-radius:9px;box-shadow:0 8px 35px #071f261a}.demo-caption{display:flex;align-items:center;gap:8px;padding:12px 17px;font:8px var(--mono);letter-spacing:1px;color:#c5d2b8;border-bottom:1px solid #d5e5bb17}.demo-caption>span:last-child{margin-left:auto;color:#fff0c7;font-size:11px}.status-dot{width:5px;height:5px;border-radius:50%;background:#d8e7b7;box-shadow:0 0 0 4px #b5d49412}.demo-fixture{display:flex;align-items:center;justify-content:center;gap:13px;padding:11px 14px}.demo-fixture strong{font-size:11px;max-width:88px;overflow-wrap:anywhere;text-align:center}.demo-fixture .crest-art{width:24px;height:29px}.demo-fixture b{font-size:28px;letter-spacing:2px;white-space:nowrap}.demo-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #d5e5bb17;font-size:9px;padding:11px 15px;color:#b5c7ae}.demo-bottom button{background:none;display:flex;align-items:center;gap:5px;color:#e7e9ce;font-size:9px;white-space:nowrap;padding:0}.demo-bottom button svg{width:11px;height:11px}.demo-goal{margin:0;padding:12px 15px;background:#f29b7edc;color:#17372e;font-size:11px;font-weight:700;border-radius:0 0 8px 8px}
#homeVenueMount{margin-top:36px;width:min(425px,41%)}
#venuePicker.hub-venues{position:static;transform:none;background:none;padding:0;border:0;border-radius:0;width:100%;max-width:none;box-shadow:none}.hub-venues .venue-head{font-size:8px;letter-spacing:1px;margin-bottom:9px}.hub-venues .venue-title{margin:0 0 10px}.hub-venues .venue-title h2{font-size:16px;letter-spacing:-.3px}.hub-venues .venue-title p{font-size:9px}.hub-venues .venue-title button{width:22px;height:25px;font-size:20px;background:transparent}.hub-venues .venue-thumbs{gap:6px}.hub-venues .venue-thumbs button{border-radius:6px;padding:2px;background:#e1e9cf0d;border:1px solid #bdcdaa32;overflow:hidden;opacity:.64}.hub-venues .venue-thumbs button.active{opacity:1;border-color:#f6ae89}.hub-venues .venue-thumbs canvas{width:100%;aspect-ratio:1.67;height:auto;border-radius:3px}.hub-venues .venue-thumbs span{font-size:8px;padding:6px 1px}.hub-venues .venue-bottom{margin-top:10px;padding:0;font-size:7px}.hub-venues .venue-bottom button{font-size:9px}.hub-home-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--hub-line);margin-top:24px;padding-top:16px;color:#819e8b;font:8px var(--mono)}.hub-home-bottom #homeFootnote{font-size:8px;margin:0}.hub-home-bottom #homeForm{display:flex;gap:5px;align-items:center}.hub-home-bottom #homeForm small{font:9px var(--font)}.hub-home-bottom .form-result{font:9px var(--font);padding:4px}
.watch-back{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:15px;border-radius:30px;background:#143c30ed;border:1px solid #c4d7b066;color:#f4eedb;padding:15px 22px;font-size:12px}.watch-back svg{width:16px;height:16px}.is-watching #menuShade{opacity:.12}.is-watching .hero-copy,.is-watching #homeVenueMount,.is-watching .hub-home-bottom{display:none}.is-watching .demo-broadcast{right:50%;transform:translateX(50%)}
/* Match setup retains the existing controls, without covering the home by default. */
#matchSetupModal{z-index:24}.setup-panel{width:min(480px,100%);padding:29px;display:block!important;overflow-y:auto!important}.setup-panel .setup-heading h2{font-size:32px;margin:0 0 8px}.setup-panel .setup-heading p{font-size:12px;color:#7b876e;margin:0 0 18px}.setup-panel .home-play-dock{position:static;padding:0;background:transparent}.setup-panel .primary{margin-top:14px}.setup-panel .format-line{font-size:9px}.setup-panel .home-options{display:flex!important;border:0!important;margin-top:16px}.setup-panel .club-edit{font-size:8px}.setup-panel .home-extra{margin-top:9px}.setup-panel .home-secondary .secondary{margin-top:0}.setup-panel>.close-button{z-index:3}.setup-panel .format-options{margin:0 0 12px}#clubModal{z-index:27}#helpModal,#settingsModal,#profileModal{z-index:28}
/* The social space: open rooms on the left, live text chat on the right. */
.hub-view{position:absolute;inset:0;overflow-y:auto;z-index:13;background:#0b2a24ed;backdrop-filter:blur(10px);padding:32px clamp(22px,4vw,70px) 28px;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:#4b765b transparent;color:#f2efde}.hub-view-heading{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:27px}.hub-view h1{font-size:clamp(30px,3vw,45px);letter-spacing:-1.7px;font-weight:850;margin:0 0 10px;line-height:1.1}.hub-view h1 em{color:#f49b7c;font-style:normal}.hub-view-heading p{font-size:12px;margin:0;color:#a9bbab}.hub-view h2{font-size:18px;letter-spacing:-.6px;margin:0}.connection-status{display:flex;align-items:center;gap:8px;color:#a7bba7;font:10px var(--mono);white-space:nowrap}.connection-status i,.chat-live-dot{width:6px;height:6px;border-radius:50%;background:#718878}.connection-status.online i,.chat-live-dot.online{background:#b8d48f;box-shadow:0 0 0 5px #b8d48f10}.hub-notice{border-left:2px solid #ef997c;background:#f39a7c0a;padding:12px 16px;margin-bottom:18px;color:#e7c5ad;font-size:12px;line-height:1.6}.lobby-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;min-height:520px;max-width:1550px;margin:auto}.room-browser{min-width:0;display:flex;flex-direction:column}.room-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid var(--hub-line);padding-bottom:20px}.room-toolbar h2 span{display:inline-block;margin-left:7px;font:11px var(--mono);color:#b3c8a8;border:1px solid #c7d4b630;padding:4px 6px;border-radius:4px}.room-toolbar p{font-size:10px;color:#98b29c;margin:8px 0 0}.room-toolbar .primary{width:auto;padding:12px 17px;font-size:11px;background:#f29d7d;box-shadow:none;gap:24px;white-space:nowrap}.room-toolbar .primary span{font-size:18px;font-weight:400}.room-filters{display:flex;gap:12px;padding:18px 0}.hub-view input,.hub-view select{border:1px solid #c6d4b632;background-color:#173d32;color:#edf0d7;border-radius:6px;font-size:11px;padding:12px 14px;min-width:0}.hub-view select{padding-right:30px}.hub-view input::placeholder{color:#819b89}.room-filters input{flex:1}.room-filters select{width:162px}.small-icon{color:#d2dfc1;background:#214436;border:1px solid #c6d4b632;border-radius:6px;width:38px;display:grid;place-items:center;flex-shrink:0}.small-icon svg{width:16px;height:16px}.room-list{min-height:290px;max-height:440px;overflow-y:auto;scrollbar-width:thin;flex:1}.room-empty{min-height:275px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px dashed #c1d7b024;border-radius:8px;padding:20px;background:radial-gradient(ellipse at 50% 65%,#2b52411c,transparent 70%)}.room-empty:before{content:'';width:60px;height:40px;border:1px solid #779a7655;border-radius:4px;background:linear-gradient(90deg,transparent 49%,#779a7655 49%,#779a7655 51%,transparent 51%);margin-bottom:23px}.room-empty strong{font-size:17px;letter-spacing:-.5px;color:#dee4cd}.room-empty p{font-size:11px;line-height:1.7;max-width:285px;color:#8fab94}.room-row{display:flex;align-items:center;gap:15px;padding:19px 10px;border-bottom:1px solid #bdd3b323;min-height:88px}.room-row .crest-art{width:34px;height:40px}.room-info{flex:1;min-width:0}.room-info strong{display:block;font-size:14px;overflow-wrap:anywhere;letter-spacing:-.3px}.room-info small{display:block;font-size:10px;color:#90ad95;margin-top:7px;line-height:1.5}.room-occupancy{font:12px var(--mono);color:#d7dfc5;white-space:nowrap}.room-occupancy small{font:8px var(--font);display:block;color:#8fa78e;margin-top:5px}.room-row>button{background:#b6d1a6;color:#123b2c;border:1px solid #c0d8b0;padding:10px 16px;border-radius:5px;font-size:10px;font-weight:700;min-width:69px;white-space:nowrap}.room-row>button:hover{background:#d3e4bd}.room-row>button:disabled{background:#345442;color:#b2c5a9;border-color:#567055}.room-format{font:9px var(--mono);color:#b4c7a6;background:#d4e4c211;padding:5px;border-radius:3px}
.quick-match-strip{display:flex;align-items:center;gap:16px;margin-top:23px;background:#bdc9a709;border:1px solid var(--hub-line);padding:20px;border-radius:8px}.quick-match-strip>div{display:flex;gap:16px;align-items:center;flex:1}.quick-match-strip strong{font-size:13px}.quick-match-strip p{font-size:10px;line-height:1.6;color:#9bb399;margin:6px 0 0}.quick-symbol{font-size:32px;color:#f39c7e}.quick-match-strip .primary{width:auto;font-size:11px;padding:13px;box-shadow:none;white-space:nowrap}.quick-match-strip select{width:79px;padding:10px}.lobby-alt{display:flex;gap:20px;align-items:center;justify-content:space-between;padding-top:19px}.lobby-alt button{padding:0;background:none;color:#b4c8aa;font-size:10px;text-decoration:underline;text-underline-offset:4px}.lobby-alt>span{font-size:9px;color:#7c9b84}.lobby-chat{display:flex;flex-direction:column;border:1px solid var(--hub-line);border-radius:9px;background:#173b307d;overflow:hidden;min-height:510px;max-height:650px}.chat-heading{display:flex;align-items:center;justify-content:space-between;padding:22px;border-bottom:1px solid var(--hub-line)}.chat-heading h2{font-size:19px}.chat-heading span:not(.chat-live-dot){font:9px var(--mono);color:#9fb89f;display:block;margin-top:7px}.chat-identity{font-size:9px;display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid #d2e1c118;color:#9bb69d}.chat-identity input{width:92px;padding:6px 5px;border:0;background:transparent;color:#e4e9d2;font-size:11px}.chat-identity button{margin-left:auto;font-size:9px;padding:4px 0;color:#bbcea9;background:none}.chat-log{overflow-y:auto;min-height:180px;flex:1;padding:17px 19px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#6e916e transparent}.chat-empty{font-size:11px;line-height:1.7;color:#88a38d;text-align:center;margin:44px 10px}.chat-message{margin-bottom:17px;overflow-wrap:anywhere;line-height:1.55;position:relative}.chat-message header{display:flex;align-items:center;gap:7px;font-size:10px;margin-bottom:4px;color:#c0d5ad}.chat-message header strong{font-weight:650}.chat-message time{font:8px var(--mono);color:#73947e;margin-left:auto}.chat-message p{font-size:11px;line-height:1.65;margin:0;color:#d9e1ca;white-space:pre-wrap;user-select:text}.chat-message.own strong{color:#f5b290}.chat-message .mute-author{background:none;color:#6f8f79;font-size:9px;padding:0 3px;opacity:.5}.chat-message:hover .mute-author{opacity:1}.chat-form{display:flex;gap:8px;background:#0e3027;border:1px solid #aec5a638;border-radius:6px;margin:10px 15px 0;padding:5px}.chat-form input{border:0!important;background:transparent!important;flex:1;padding:9px!important;color:inherit;min-width:0;font-size:11px;outline-offset:0}.chat-form button{background:#284d3b;color:#d0e1b9;border-radius:4px;display:grid;place-items:center;width:35px;flex-shrink:0}.chat-form button svg{width:15px;height:15px}.chat-status{font-size:9px;line-height:1.6;margin:11px 19px 16px;color:#7d9b87}.active-room-banner{padding:13px 17px;border:1px solid #9fbd8070;border-radius:7px;display:flex;gap:20px;align-items:center;background:#7693501a;margin-bottom:20px;font-size:12px}.active-room-banner span{flex:1}.active-room-banner button{padding:9px 12px;background:#d5dfb8;color:#254432;border-radius:4px;font-size:10px}.active-room-banner button:last-child{background:none;color:#cad7bc;text-decoration:underline}.room-chat-area{border-top:1px solid #c1d0b5;padding-top:12px;margin-top:20px}.room-chat-title{display:flex;align-items:center;justify-content:space-between}.room-chat-title h3{font-size:13px;margin:0}.room-chat-title button{background:none;color:#4a7851;text-decoration:underline;font-size:10px}.room-chat-area .chat-log{height:140px;max-height:180px;min-height:80px;background:#e6eadd;border:1px solid #c9d3bc;border-radius:6px;margin:10px 0;padding:12px}.room-chat-area .chat-message p{color:#31533c}.room-chat-area .chat-message strong{color:#688248}.room-chat-area .chat-message.own strong{color:#ab573c}.room-chat-area .chat-message{margin-bottom:10px}.room-chat-area .chat-empty{margin:17px 10px;color:#6f8265}.room-chat-area .chat-form{margin:0;background:#eff1e4;border-color:#bccbab}.room-chat-area .chat-form input{color:#193a2c}.room-chat-area .chat-form button{color:#eff1d9}#roomChatStatus{font-size:9px;color:#758b6a;line-height:1.5}.create-panel .studio-field input,.create-panel .studio-field select{background:#e9eedf;border-color:#c2cfb5;color:#244631}.create-panel .studio-field{color:#6c8062}.create-panel .field-pair{gap:13px}.create-club-info{background:#e3ead5;border-radius:7px;padding:13px;font-size:12px;line-height:1.6}#createRoomError{font-size:11px;color:#a4573c;line-height:1.5}
/* Club studio. The crest is generated from editable, validated geometry. */
.studio-library{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.studio-library label{font-size:10px;color:#9fbaa0}.studio-library select{max-width:180px}.outline-button{color:#e5ebd5;background:transparent;border:1px solid #9ebc9355;border-radius:6px;font-size:11px;padding:12px 16px}.outline-button:hover{background:#234b37}.studio-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.92fr);gap:55px;max-width:1380px;margin:auto;align-items:start}.studio-editor{min-width:0}.studio-tabs{display:flex;border-bottom:1px solid var(--hub-line);gap:25px}.studio-tabs button{background:none;padding:0 0 17px;color:#71917a;font:10px var(--mono);border-bottom:2px solid transparent;display:flex;align-items:center;gap:9px}.studio-tabs button span{font:650 12px var(--font);color:#a6bda5}.studio-tabs button[aria-selected=true]{border-color:#f19d7e;color:#f0ad8c}.studio-tabs button[aria-selected=true] span{color:#f5edda}.studio-tab-body{padding-top:28px;min-height:355px}.studio-tab-body h2{font-size:22px;letter-spacing:-.5px;margin-bottom:27px}.studio-field{display:flex;flex-direction:column;gap:9px;font-size:10px;color:#aac0a8;margin-bottom:21px;flex:1;min-width:0}.studio-field input,.studio-field select{width:100%;padding:13px 14px;font-size:13px;border:1px solid #baceaf40;border-radius:6px;min-width:0}.field-pair{display:flex;gap:22px}.field-pair>.studio-field:first-child:has(#clubAbbr){flex:0 0 100px}.studio-note{font-size:11px;color:#8fa98f;line-height:1.75;margin:18px 0}.studio-transfer{display:flex;gap:22px;margin:25px 0}.studio-transfer button,.text-button{font-size:11px;background:none;color:#c7d3b4;text-decoration:underline;text-underline-offset:5px;padding:0}.studio-colors{display:flex;gap:17px;justify-content:space-between;border-top:1px solid var(--hub-line);padding-top:20px;margin-top:21px}.studio-colors label{display:flex;align-items:center;gap:12px;font-size:10px;color:#b5c7aa}.studio-colors input[type=color]{width:35px;height:35px;padding:2px;border-radius:50%;border:1px solid #c4d7b142;background:transparent;cursor:pointer}.studio-colors input[type=color]::-webkit-color-swatch-wrapper{padding:3px}.studio-colors input[type=color]::-webkit-color-swatch{border:0;border-radius:50%}.kit-pattern-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.kit-pattern-grid button{background:#264b3a55;border:1px solid #b8cead36;border-radius:7px;padding:10px 6px;color:#a5bfa5;display:flex;flex-direction:column;align-items:center;gap:9px;font-size:10px}.kit-pattern-grid button.selected{background:#cfdfb00b;border-color:#f6ad84;color:#f6e8c7}.kit-pattern-grid button svg{width:54px;height:55px;stroke:none}.studio-save{display:flex;align-items:center;gap:15px;border-top:1px solid var(--hub-line);padding-top:20px;margin-top:25px}.studio-save>span{font-size:10px;color:#a6bba1;line-height:1.6;flex:1}.studio-save .primary{width:auto;white-space:nowrap;padding:15px 19px;font-size:11px;box-shadow:0 3px 0 #b7664c}.drawing-tools{display:flex;gap:10px;flex-wrap:wrap;border-top:1px solid var(--hub-line);padding-top:18px;margin-top:20px}.drawing-tools button{background:#244936;border:1px solid #93b38c55;color:#cfdcc0;padding:8px 10px;border-radius:5px;font-size:10px}.drawing-tools button[aria-pressed=true]{color:#14362b;background:#f2a786;border-color:#f2a786}.drawing-tools label{display:flex;align-items:center;gap:6px;font-size:9px;color:#adc0a4}.drawing-tools input[type=color]{padding:0;border:0;width:25px;height:25px}.drawing-tools input[type=range]{width:57px;padding:0;accent-color:#f1aa85}.club-showcase{position:relative;background:radial-gradient(ellipse at 50% 25%,#2b5744,#153c30 60%,#0d2c25);border:1px solid #c5d1b72e;border-radius:12px;overflow:hidden;padding:25px 28px 23px;min-height:500px;text-align:center;box-shadow:0 20px 70px #061d222e}.club-showcase:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.13;background:repeating-linear-gradient(125deg,transparent,transparent 58px,#cae5b620 59px,transparent 60px)}.showcase-top{display:flex;justify-content:space-between;font:8px var(--mono);letter-spacing:1.3px;color:#aac19d;position:relative}.showcase-mark{position:relative;width:165px;height:182px;margin:20px auto 15px;filter:drop-shadow(0 12px 15px #051b2060);touch-action:pan-y}.showcase-mark.drawing{touch-action:none;cursor:crosshair;outline:1px dashed #ffe0ab88;outline-offset:6px;border-radius:8px}.showcase-mark #studioCrestArt,.showcase-mark>svg{position:absolute;inset:0;width:100%;height:100%;stroke:none}.showcase-mark>svg{pointer-events:none}.club-showcase>h2{font-size:29px;font-weight:850;letter-spacing:-1px;position:relative;overflow-wrap:anywhere}.club-showcase>p#draftClubMotto{font-size:11px;color:#9cb99c;margin:8px 0 16px;min-height:15px;position:relative;overflow-wrap:anywhere}.showcase-kit{display:flex;align-items:center;justify-content:center;gap:20px;position:relative;margin-top:7px}.showcase-kit #jerseyPreview{width:145px}.showcase-kit #jerseyPreview svg{width:100%;height:160px;stroke:none;filter:drop-shadow(0 7px 4px #061e2033)}.showcase-player{width:145px;align-self:center}.showcase-player canvas{width:100%;height:auto;display:block}.showcase-player span{font:7px var(--mono);letter-spacing:.7px;color:#89a789}.showcase-colors{display:flex;gap:6px;justify-content:center;margin-top:20px}.showcase-colors span{width:33px;height:4px;border-radius:3px}.club-showcase>p:last-child{font:7px var(--mono);letter-spacing:1.8px;color:#739676;margin:15px 0 0}
@media(min-height:960px){#homeVenueMount{margin-top:43px}.hero-copy h1{font-size:clamp(70px,5.8vw,100px)}.hero-description{margin-bottom:29px}.hero-utility{margin-top:27px}.hub-home-bottom{margin-top:30px}}
@media(max-width:1150px){.hub-nav{margin-left:40px;gap:26px}.hero-copy{width:400px;max-width:48%}#homeVenueMount{width:400px;max-width:48%}.demo-broadcast{width:310px}.hero-primary{min-width:170px;padding:16px 13px}.hero-secondary{padding:16px 10px}.studio-layout{gap:28px;grid-template-columns:minmax(0,1fr) 360px}.studio-colors{gap:10px}.studio-colors label{gap:6px;font-size:9px}.studio-tabs{gap:17px}.lobby-layout{grid-template-columns:minmax(0,1fr) 285px;gap:20px}.quick-match-strip{padding:15px;flex-wrap:wrap;gap:12px}.quick-match-strip>div{flex-basis:100%}.quick-match-strip .primary{flex:1}.lobby-alt{align-items:flex-start;line-height:1.6;flex-direction:column;gap:10px}.room-format{display:none}}
@media(max-height:820px) and (min-width:761px){#home.hub-home{padding-top:27px;padding-bottom:15px}.hero-copy h1{font-size:clamp(52px,5.1vw,73px);margin-bottom:16px}.hero-description{font-size:12px;line-height:1.6;margin-bottom:19px}.hero-primary,.hero-secondary{padding-top:14px;padding-bottom:14px}.hero-configuration{padding:13px 0;margin-bottom:10px}.home-club-link{padding:11px 13px}.home-club-link .crest-art{width:31px;height:39px}.home-club-link strong{font-size:15px}.home-club-link em{font-size:9px}.hero-utility{margin-top:17px}#homeVenueMount{margin-top:23px}.hub-venues .venue-title p{display:none}.hub-venues .venue-bottom{display:none}.hub-venues .venue-head{display:none}.hub-venues .venue-thumbs canvas{aspect-ratio:2;height:auto}.hub-home-bottom{margin-top:16px;padding-top:11px}.hub-view{padding-top:25px}.hub-view-heading{margin-bottom:22px}.club-showcase{min-height:465px;padding-top:22px}.showcase-mark{width:135px;height:149px;margin:18px auto 12px}.studio-tab-body{min-height:320px}}
@media(max-width:900px){.hero-actions{flex-direction:column;align-items:stretch;gap:10px}.hero-primary{width:100%}.hero-secondary{justify-content:center}.demo-broadcast{width:280px;right:30px}.demo-fixture{gap:8px}.demo-fixture strong{font-size:10px}.hero-copy{width:320px}.hero-copy h1{font-size:60px}.hero-description{font-size:12px}.hero-configuration{font-size:9px}.hero-configuration>span:last-child{font-size:10px}#homeVenueMount{width:320px}.studio-layout{grid-template-columns:minmax(0,1fr) 300px;gap:20px}.club-showcase{padding:20px 14px}.showcase-kit{gap:5px}.showcase-kit #jerseyPreview{width:115px}.showcase-player{width:125px}.studio-colors{flex-wrap:wrap}.studio-tabs{gap:12px}.studio-tabs button{font-size:8px;gap:5px}.studio-tabs button span{font-size:11px}.kit-pattern-grid{gap:7px}.lobby-layout{grid-template-columns:minmax(0,1fr) 265px;gap:16px}.room-row{gap:10px;padding:16px 3px}.room-row .crest-art{display:none}.room-filters select{width:125px}.room-toolbar .primary{padding:11px;gap:9px}.room-toolbar p{max-width:200px;line-height:1.5}}
@media(max-width:760px){.is-home #app{grid-template-rows:63px minmax(0,1fr) 0px}.is-home .topbar{padding:0 16px;gap:0}.hub-nav{margin-left:auto;gap:19px}.hub-nav button{font-size:11px;padding:24px 0 21px}.is-home .header-right{margin-left:17px;gap:4px}.is-home .brand-mark{display:none}.is-home .wordmark{font-size:24px}.is-home #fullscreenBtn{display:none}.is-home .header-right .icon-button{width:27px;height:27px}.is-home .header-right .icon-button svg{width:14px;height:14px}#home.hub-home{padding:30px 22px 20px;overflow-y:auto}.hero-copy{width:100%;max-width:none;position:relative;padding-top:178px}.hero-copy h1{font-size:clamp(54px,13vw,74px);line-height:1;letter-spacing:-3px;margin-bottom:18px}.hero-copy h1 br:nth-of-type(1){display:none}.hero-copy h1 br:nth-of-type(1):after{content:' '}.hero-copy h1{max-width:460px}.hero-description{font-size:12px;line-height:1.6;margin:0 0 22px}.hero-actions{flex-direction:row;gap:10px;position:relative;z-index:2}.hero-primary{flex:1;padding:16px 10px;min-width:0;font-size:12px}.hero-secondary{font-size:11px;padding:16px 10px;flex:1}.hero-secondary svg{width:12px}.hero-configuration{padding:16px 0;font-size:9px}.home-club-link{padding:13px 15px}.home-club-link .crest-art{width:34px;height:43px}.home-club-link strong{font-size:17px}.home-club-link em{font-size:10px}.hero-utility{justify-content:space-between;gap:15px;margin-top:22px}.demo-broadcast{top:19px;left:22px;right:22px;width:auto;background:#12372d88}.demo-fixture strong{font-size:12px;max-width:110px}.demo-fixture b{font-size:24px}.demo-caption{padding:10px 14px}.demo-fixture{padding:8px 12px;gap:15px}.demo-bottom{padding:9px 14px}.is-home #menuShade{background:linear-gradient(0deg,#092820f0 0%,#092820ed 58%,#09282010 100%)}#homeVenueMount{margin-top:29px;width:100%;max-width:none}.hub-venues .venue-head{display:flex}.hub-venues .venue-title p{display:block}.hub-venues .venue-bottom{display:flex}.hub-home-bottom{flex-wrap:wrap;gap:15px;font-size:7px;padding-top:16px;margin-top:22px}.hub-home-bottom>span:last-child{display:none}.is-watching .demo-broadcast{left:22px;right:22px;transform:none}.is-watching .hero-copy{display:none}.is-watching #menuShade{opacity:0}.watch-back{white-space:nowrap;font-size:11px;padding:13px 20px;bottom:22px}.hub-view{padding:25px 19px 25px;backdrop-filter:blur(5px)}.hub-view-heading{display:block;margin-bottom:23px}.hub-view h1{font-size:32px;letter-spacing:-1.3px;line-height:1.15}.hub-view-heading p{font-size:11px;line-height:1.6}.connection-status{margin-top:16px;font-size:9px}.lobby-layout{display:flex;flex-direction:column;gap:25px;min-height:0}.room-toolbar{gap:12px;padding-bottom:16px}.room-toolbar h2{font-size:17px}.room-toolbar p{font-size:9px;max-width:200px}.room-toolbar .primary{font-size:10px;padding:10px 12px;gap:12px}.room-filters{gap:8px;padding:13px 0}.room-filters input{padding:10px;font-size:10px}.room-filters select{width:119px;font-size:10px;padding:10px 20px 10px 9px}.small-icon{width:32px}.room-list{max-height:400px;min-height:220px}.room-empty{min-height:210px}.room-empty strong{font-size:16px}.room-empty p{font-size:10px}.room-row{padding:17px 0;gap:12px}.room-info strong{font-size:13px}.room-info small{font-size:9px}.room-occupancy{font-size:11px}.room-row>button{padding:10px 12px;font-size:10px}.quick-match-strip{margin-top:18px;padding:16px;gap:12px;flex-wrap:wrap}.quick-match-strip>div{flex-basis:100%}.quick-match-strip .primary{flex:1}.lobby-alt{gap:13px;padding-top:20px}.lobby-chat{min-height:460px;height:460px;max-height:580px}.chat-heading{padding:18px}.chat-log{min-height:170px}.chat-identity input{flex:1}.hub-notice{font-size:11px;padding:11px 13px}.active-room-banner{gap:10px;flex-wrap:wrap;padding:13px;font-size:11px}.active-room-banner span{flex-basis:100%}.studio-library{justify-content:flex-start;margin-top:20px;gap:9px}.studio-library label{font-size:9px}.studio-library select{max-width:165px;padding:10px;font-size:10px}.outline-button{padding:10px;font-size:10px}.studio-layout{display:flex;flex-direction:column;gap:26px}.studio-editor{width:100%;display:contents}.studio-tabs{order:0;gap:26px;width:100%}.studio-tabs button{font-size:10px;gap:7px;padding-bottom:14px}.studio-tabs button span{font-size:12px}.studio-tab-body{order:1;width:100%;padding-top:0;min-height:0}.studio-tab-body h2{font-size:21px;margin:0 0 22px}.field-pair{gap:15px}.studio-field{margin-bottom:18px}.studio-field input,.studio-field select{padding:12px;font-size:12px}.studio-colors{flex-wrap:nowrap;gap:7px;padding-top:18px}.studio-colors label{font-size:9px;gap:7px}.studio-colors input[type=color]{width:32px;height:32px}.club-showcase{order:2;width:100%;padding:22px;min-height:460px}.showcase-mark{width:140px;height:154px}.showcase-kit #jerseyPreview{width:125px}.showcase-player{width:135px}.showcase-kit{gap:16px}.club-showcase>h2{font-size:29px}.studio-save{order:3;position:sticky;bottom:-26px;background:#103229f5;z-index:3;margin:0 -19px -25px;padding:17px 19px;width:calc(100% + 38px);box-shadow:0 -5px 20px #071e251a}.studio-save .primary{font-size:11px;padding:14px}.studio-save>span{font-size:9px}.drawing-tools{gap:8px}.studio-note{font-size:10px}.kit-pattern-grid{gap:8px}.kit-pattern-grid button{font-size:10px;padding:11px 5px}.setup-panel{padding:27px 24px!important}.setup-panel .home-options{justify-content:space-between}.setup-panel .home-secondary,.setup-panel .home-extra{display:flex;gap:10px}.setup-panel .home-extra button{flex:1}.setup-panel .home-extra small{font-size:7px}.setup-panel .setup-heading h2{font-size:29px}.room-chat-area .chat-log{height:140px}}
@media(max-width:370px){.hub-nav{gap:13px}.is-home .header-right{margin-left:10px}.is-home .topbar{padding:0 12px}.hub-nav button{font-size:10px}.hero-actions{gap:8px}.hero-primary,.hero-secondary{font-size:10px}.hero-copy h1{font-size:49px}.studio-tabs{gap:20px}.studio-colors label{font-size:8px;gap:5px}}
@media(max-height:500px) and (orientation:landscape){.is-home #app{grid-template-rows:50px minmax(0,1fr) 0px}.hub-nav button{padding:17px 0;font-size:11px}.is-home .topbar{padding:0 22px}.hub-nav{margin-left:45px}.is-home #home.hub-home{padding:22px 30px}.hero-copy{padding-top:0;max-width:45%;width:340px}.hero-copy h1{font-size:48px;margin-bottom:14px;letter-spacing:-2px}.hero-copy h1 br:nth-of-type(1){display:none}.hero-description{font-size:10px;line-height:1.5;margin-bottom:16px}.hero-actions{flex-direction:row}.hero-primary{font-size:10px;padding:12px 10px;min-width:0}.hero-secondary{padding:12px 10px;font-size:10px}.demo-broadcast{left:auto;right:30px;top:22px;width:290px}.demo-caption{font-size:7px}.demo-fixture strong{font-size:10px}.hero-configuration{font-size:8px;padding:13px 0}.home-club-link{margin-top:15px}.hero-utility{margin-top:17px}#homeVenueMount{max-width:45%;margin-top:24px}.is-home #menuShade{background:linear-gradient(90deg,#0b2c24f0,#0b2c24db 30%,#0b2c2420 65%),linear-gradient(0deg,#0b2c24f0,transparent 60%)}.is-home #homeVenueMount{max-width:45%;width:340px}.hub-home-bottom>span:last-child{display:none}.studio-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:23px}.studio-editor{display:block}.studio-save{position:static;box-shadow:none;width:auto;padding:16px 0;margin:22px 0 0}.club-showcase{min-height:475px}.hub-view-heading{display:flex}.hub-view-heading h1{font-size:27px}.hub-view-heading p{font-size:10px}.lobby-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px}.lobby-chat{height:510px}.room-browser{min-height:510px}.studio-library{margin:0}.studio-tabs{gap:17px}.studio-tabs button span{font-size:10px}}
@media(prefers-reduced-motion:reduce){.hero-primary:hover{transform:none}.watch-back{transition:none}.hub-view{backdrop-filter:none}}
/* Explicitly supersede PATIO 5's static-home typography and background blur. */
.is-home .topbar .brand{order:0}.is-home .hub-nav{order:1}.is-home .topbar .header-right{order:2}
.is-home #menuShade{backdrop-filter:none!important}
#home #homeTitle{font-size:clamp(62px,5.25vw,84px);line-height:.99;letter-spacing:-.061em;font-weight:900;margin:0 0 22px}
#home #homeTitle br{display:block}
#home .hub-venues .venue-title h2{font-size:17px;letter-spacing:-.4px}
#home .hub-venues .venue-head{font-size:8px}
.crest-svg{stroke:none}
@media(max-height:820px) and (min-width:761px){#home #homeTitle{font-size:clamp(55px,4.9vw,73px);margin-bottom:18px}#homeVenueMount{margin-top:22px}#home .hub-venues .venue-title h2{font-size:16px}.hub-home-bottom{margin-top:16px}}
@media(max-width:760px){#home #homeTitle{font-size:clamp(52px,12.9vw,70px);line-height:1;letter-spacing:-.06em;margin-bottom:18px}#home #homeTitle br{display:block}#home .hub-venues .venue-title h2{font-size:17px}}
@media(max-height:500px) and (orientation:landscape){#home #homeTitle{font-size:48px;line-height:.98;letter-spacing:-2.6px}#home #homeTitle br{display:block}}
#navOnlineDot.online{display:inline-block;margin-left:5px;vertical-align:middle;width:5px;height:5px;background:#b9d69b;border-radius:50%}