#app-nav{display:flex;align-items:center;justify-content:center;gap:4px;margin:0 auto;border:0;padding:0;background:none;height:auto}#app-nav button{display:flex;align-items:center;gap:6px;padding:8px 12px;border:0;background:transparent;color:#8a9c90;font-size:11px}#app-nav button span{font-size:16px;line-height:1}#app-nav button.active{background:#edf3ee;color:#3a7650;border-radius:20px}#home-menu{display:none}
#discover-view[hidden],#profile-view[hidden],.simple-main[hidden]{display:none!important}.social-view{background:#080c0a;color:#e7f0e9;color-scheme:dark}.social-view .site-header{max-width:1160px;height:70px;padding:16px 26px;border-bottom:1px solid #18241c}.social-view .brand{color:#ecf7ee;font-size:24px}.social-view .brand span{display:none}.social-view .local-badge{color:#6f8878;font-size:9px}.social-view #app-nav button{color:#7a9384}.social-view #app-nav button.active,.builder-mode #app-nav button.active{color:#c1fb6c;background:#21311c}.social-view button.primary{background:#c2fb71;border-color:#c2fb71;color:#1f3514}.discovery-heading{height:57px;max-width:520px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:9px 3px}.discovery-heading h1{font-size:16px;letter-spacing:-.3px;margin:0;font-weight:600}.discovery-heading p{font-size:9px;color:#5e7b67;margin:2px 0 0}.discovery-heading>button{font-size:21px;padding:2px 10px;background:none;border:0;color:#6c9479}#reel-feed{height:calc(100dvh - 138px);max-width:520px;margin:0 auto;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior-y:contain;scrollbar-width:none;outline:none;border-radius:16px}#reel-feed::-webkit-scrollbar{display:none}.reel-card{height:100%;min-height:100%;padding-bottom:10px;scroll-snap-align:start;scroll-snap-stop:always;position:relative}.reel-visual{position:relative;overflow:hidden;width:100%;height:100%;background:#111b15;border:1px solid #203128;border-radius:17px}.reel-video,.reel-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.reel-poster{opacity:.75}.reel-shade{position:absolute;inset:0;background:linear-gradient(180deg,#020a0430 0,transparent 40%,#03100842 65%,#020a05ed 100%);pointer-events:none}.reel-local{position:absolute;left:17px;top:16px;font-size:8px;font-weight:650;letter-spacing:1.6px;background:#0b2110aa;border:1px solid #56803a55;border-radius:20px;padding:5px 8px;color:#b6d4ad}.reel-sound{position:absolute;top:16px;right:14px;z-index:2;font-size:9px;padding:6px 9px;color:#cfdfd1;background:#0c1c14a8;border-color:#6f92793d;border-radius:20px}.reel-details{position:absolute;left:20px;bottom:24px;right:80px;z-index:2}.reel-creator{display:flex;align-items:center;gap:8px;font-size:11px;color:#cadfd0}.reel-creator>span{display:grid;place-items:center;height:28px;width:28px;border-radius:50%;background:#294532;border:1px solid #bfe5bf3b;font-size:9px;font-weight:600;color:#cde4cc}.reel-creator strong{font-size:11px;font-weight:500}.reel-details h2{font-size:26px;font-weight:650;line-height:1.13;letter-spacing:-.7px;margin:12px 0 18px;overflow-wrap:anywhere;color:#f1faf2}.reel-play{background:#c0ff67;color:#20310b;border:0;border-radius:12px;font-size:13px;font-weight:650;padding:12px 22px;box-shadow:0 4px 24px #93dc2630}.reel-play:hover{background:#d1ff96;border:0}.reel-actions{position:absolute;right:14px;bottom:28px;display:flex;flex-direction:column;gap:16px;z-index:2}.reel-actions button{display:flex;flex-direction:column;align-items:center;gap:5px;background:none;border:0;padding:2px 4px;color:#ebf5ee;min-width:36px}.reel-actions button svg{height:25px;width:25px;filter:drop-shadow(0 2px 4px #0009)}.reel-actions button>span{font-size:9px;text-shadow:0 1px 5px #000}.reel-actions button.selected{color:#baff60}.reel-actions button.selected svg{fill:#baff6030}.reel-no-video{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse at 50% 35%,#284a32,#101e17 70%);color:#84aa87}.reel-no-video>span{display:grid;place-items:center;width:93px;height:93px;border:1px solid #8bb77a4f;border-radius:26px;font-size:49px;color:#b6d6a6;transform:rotate(-8deg)}.reel-no-video p{font-size:17px;color:#bbd3b9;margin:27px 0 4px;letter-spacing:-.2px}.reel-no-video small{font-size:10px;color:#77947c}.reel-media-note{position:absolute;left:15px;right:15px;top:45%;text-align:center;color:#bdd2c0;font-size:11px;z-index:2}.social-empty{display:flex;align-items:center;justify-content:center;flex-direction:column;height:100%;padding:40px;text-align:center;background:#0c130f;border:1px solid #1b3020;border-radius:17px}.empty-orbit{height:80px;width:80px;border:1px solid #3a5b31;border-radius:23px;display:grid;place-items:center;font-size:41px;color:#b2ed6e;transform:rotate(-8deg)}.social-empty h2{font-size:25px;line-height:1.2;letter-spacing:-.8px;color:#d9ebdc;margin-top:30px}.social-empty p{font-size:12px;color:#6e9278;line-height:1.8;max-width:300px;margin:0 0 24px}.social-empty button{font-size:12px;background:#bdf875;color:#253a15;border:0;padding:10px 20px}.profile-mode #profile-view{max-width:650px;margin:35px auto;padding:25px}.profile-hero{text-align:center}.profile-avatar{display:grid;place-items:center;width:90px;height:90px;border-radius:50%;margin:0 auto 25px;background:#183820;border:1px solid #4c7839;font-size:50px;color:#b9f56b}.profile-hero .eyebrow{color:#648870}.profile-hero h1{font-size:32px;color:#ddecdf;letter-spacing:-.8px;margin:10px 0}.profile-hero>p:last-child{font-size:12px;color:#73957c}.profile-mode #profile-form{display:flex;gap:12px;align-items:end;justify-content:center;margin:35px 0}.profile-mode #profile-form label{font-size:10px;color:#75947c;flex:1;max-width:330px}.profile-mode #profile-form input{display:block;width:100%;font-size:13px;background:#142119;border:1px solid #2c4933;color:#c1d9c6;border-radius:8px;margin-top:7px;padding:11px}.profile-mode #profile-form button{font-size:12px;padding:11px 17px}.profile-mode #profile-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #243c2b;border-bottom:1px solid #243c2b;padding:25px 0;margin:20px 0 30px}.profile-mode #profile-stats>div{display:flex;flex-direction:column;text-align:center;gap:8px}.profile-mode #profile-stats strong{font-size:25px;color:#cee8cd}.profile-mode #profile-stats span{font-size:10px;color:#668e70}.profile-mode #profile-create{display:block;margin:0 auto;background:#1b3522;color:#b6d5b7;border:1px solid #3c6242;font-size:12px}.profile-mode #profile-status{color:#96c29c;font-size:11px;text-align:center}#comments-dialog{width:460px;background:#121d16;color:#d5e9da;border-color:#36543b;padding:22px;max-height:80dvh}#comments-dialog::backdrop{background:#0009;backdrop-filter:blur(4px)}.comments-header{display:flex;align-items:center;justify-content:space-between}.comments-header h2{font-size:20px;margin:0}.comments-header button{border:0;background:none;color:#8ead96;font-size:25px;padding:0 5px}#comments-game-title{font-size:11px;color:#729b7d;margin:9px 0 20px}#comments-list{max-height:44dvh;min-height:130px;overflow:auto;padding-right:7px}#comments-list article{margin:15px 0;padding-bottom:12px;border-bottom:1px solid #253c2c}#comments-list strong{font-size:11px;font-weight:550;color:#bfdbc6}#comments-list article p{font-size:12px;color:#90b19a;line-height:1.7;margin:5px 0;white-space:pre-wrap;overflow-wrap:anywhere}.comments-empty{color:#587b62;font-size:12px!important;text-align:center;padding-top:35px}#comment-form{display:flex;gap:8px;margin-top:20px}#comment-form input{min-width:0;flex:1;background:#1b2c20;color:#c9e3d1;border:1px solid #32563b;font-size:12px;border-radius:8px;padding:10px}#comment-form button{font-size:12px;background:#b9f26f;color:#283e17;border:0}#comments-status{font-size:10px;color:#86bc8f;margin-bottom:0}#mobile-workspace-switch{display:none}.builder-mode #app-nav button{font-size:10px;color:#668672}.builder-mode #app-nav button.active{color:#c0f17e;background:#23351d}
@media(max-width:800px){#app-nav{position:fixed;bottom:0;left:0;right:0;z-index:30;display:grid;grid-template-columns:repeat(4,1fr);height:calc(61px + env(safe-area-inset-bottom,0px));padding:5px 8px calc(6px + env(safe-area-inset-bottom,0px));border-top:1px solid #233829;background:#0a140ed9;backdrop-filter:blur(18px);margin:0;border-radius:0}#app-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:9px;padding:4px 10px;color:#6b8b75;font-size:9px;height:48px}#app-nav button span{font-size:21px}#app-nav button.active,.social-view #app-nav button.active{color:#bdf96b;background:#28431e40}.site-header #app-nav+.local-badge{margin-left:auto}.simple-main{padding-bottom:100px}.social-view .site-header{height:56px;padding:13px 20px;border-bottom:1px solid #182a1d}.social-view .brand{font-size:23px}.social-view .local-badge{font-size:8px}.discovery-heading{height:46px;padding:6px 16px}.discovery-heading h1{font-size:14px}.discovery-heading p{font-size:8px;max-width:260px}#reel-feed{height:calc(100dvh - 166px - env(safe-area-inset-bottom,0px));max-width:100%;border-radius:0}.reel-card{padding:0 6px 7px}.reel-visual{border-radius:13px}.reel-details{left:16px;bottom:23px;right:66px}.reel-details h2{font-size:24px;margin:12px 0 15px}.reel-play{font-size:12px;padding:11px 20px;border-radius:10px}.reel-actions{right:10px;bottom:28px;gap:18px}.reel-actions button svg{height:24px;width:24px}.reel-actions button>span{font-size:8px}.reel-local{font-size:7px;top:13px;left:13px}.reel-sound{top:12px;right:11px;font-size:8px;padding:5px 7px}.reel-creator strong{font-size:10px}.reel-creator>span{height:25px;width:25px;font-size:8px}.reel-no-video>span{height:80px;width:80px;font-size:40px}.profile-mode #profile-view{margin:15px auto;padding:20px 25px 110px}.profile-mode #profile-form{gap:8px}.profile-mode #profile-form button{font-size:10px;padding:12px}.profile-mode .profile-hero h1{font-size:28px}.profile-mode #profile-stats{padding:22px 0}.social-empty{border-radius:12px;padding:27px}.social-empty h2{font-size:24px}.social-empty p{font-size:11px}#comments-dialog{width:94vw;padding:19px;margin:auto auto calc(75px + env(safe-area-inset-bottom,0px));max-height:74dvh}#comments-list{max-height:40dvh}#mobile-workspace-switch{display:flex;background:#111c16;border-bottom:1px solid #29402f;padding:6px 12px;gap:6px;height:42px;flex-shrink:0}#mobile-workspace-switch button{flex:1;font-size:11px;background:transparent;color:#739782;border:0;padding:4px 10px;border-radius:6px}#mobile-workspace-switch button.active{background:#233e2a;color:#ccedc7}.builder-mode .builder-split{height:calc(100dvh - 245px - env(safe-area-inset-bottom,0px));min-height:320px;display:block;padding:6px}.builder-mode #workspace-chat,.builder-mode .workspace-right{height:100%;width:100%;min-height:0;margin:0}.builder-mode[data-mobile-pane=chat] .workspace-right{display:none}.builder-mode[data-mobile-pane=play] #workspace-chat{display:none}.builder-mode #workspace-chat #chat{padding:8px 10px}.builder-mode .idea-composer{margin:7px}.builder-mode .idea-composer textarea{min-height:78px}.builder-mode .connection-line{margin-bottom:6px}.builder-mode #simple-status{font-size:8px;margin-bottom:6px}.builder-mode #advanced{position:fixed;bottom:calc(61px + env(safe-area-inset-bottom,0px));left:0;right:0;padding:9px 13px;max-height:60dvh}.builder-mode #advanced>summary{font-size:9px}.builder-mode .workspace-tabs{height:39px;gap:0;padding:6px}.builder-mode .workspace-tabs button{font-size:9px;padding:4px 8px}.builder-mode .play-header{padding:6px 8px;gap:5px}.builder-mode #play-mode{font-size:8px}.builder-mode .play-header button{font-size:8px;padding:4px 6px}.builder-mode .builder-top{min-height:49px;height:49px;overflow:hidden;padding:8px 10px;flex-wrap:nowrap;gap:8px}.builder-mode .builder-top strong{max-width:130px;font-size:10px}.builder-mode .breadcrumb{font-size:8px;white-space:nowrap}.builder-mode #workspace-build-state{font-size:8px;max-width:70px}.builder-mode #workspace-actions button{font-size:9px;padding:6px 9px}.builder-mode #play-info{font-size:8px}.builder-mode #play-error{font-size:9px;min-height:18px}.builder-mode .workspace-panel{padding:14px}.builder-mode #workspace-play{padding:0}.builder-mode .site-header{height:48px}.builder-mode.target-phone #game-frame{width:100%;max-width:390px}.builder-mode .concept-card img{aspect-ratio:1.85}}

.device-preview-link{font-size:10px;margin:14px 0 3px}.device-preview-link a{color:#87a18c;text-decoration:none}.builder-mode .device-preview-link{font-size:9px}.device-preview-link a:hover{text-decoration:underline}
/* Leaderboards, leagues and streaks: practice-only, Soft Arcade charcoal + mint. */
#board-dialog{width:460px;background:#121d16;color:#d5e9da;border:1px solid #36543b;border-radius:18px;padding:22px;max-height:82dvh;overflow:auto}
#board-dialog::backdrop{background:#0009;backdrop-filter:blur(4px)}
#board-game-title{margin:2px 0 14px;color:#8ead96;font-size:12px}
#board-tabs{display:flex;gap:4px;padding:3px;border-radius:12px;background:#0c140f;border:1px solid #243c2b}
#board-tabs button{flex:1;border:0;border-radius:9px;background:none;color:#8ead96;font-size:11px;padding:8px 6px}
#board-tabs button.active{background:#c0ff67;color:#20310b;font-weight:650}
.board-label{font-size:10px;color:#668e70;margin:12px 0 6px;letter-spacing:.02em}
#board-list,.board-nearby,.league-table{list-style:none;margin:0;padding:0}
.board-row,.league-table li{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:8px;padding:10px 4px;border-bottom:1px solid #1f3326;font-size:12px}
.board-row span,.league-table li span{color:#668e70;font-variant-numeric:tabular-nums}
.board-row strong,.league-table li strong{font-weight:550;color:#cee8cd;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board-row em,.league-table li em{font-style:normal;color:#baff60;font-variant-numeric:tabular-nums}
.board-row:nth-child(-n+3) span{color:#c0ff67;font-weight:650}
.board-row.is-you,.league-table li.is-you{background:#1b2d20;border-radius:10px}
.board-empty{padding:28px 0;text-align:center;color:#668e70;font-size:12px}
#board-you>p{margin:16px 0 4px;font-size:10px;color:#668e70;text-transform:uppercase;letter-spacing:.08em}
.board-reset{font-size:10px;color:#557a5e;margin:14px 0 0}
#profile-engagement{display:grid;gap:12px;margin:22px 0 0}
.engage-card{background:#121d16;border:1px solid #243c2b;border-radius:16px;padding:16px 18px;display:flex;flex-direction:column;gap:4px}
.engage-card>span{font-size:9px;letter-spacing:.12em;color:#668e70}
.engage-card>strong{font-size:20px;color:#cee8cd}
.engage-card>p{font-size:11px;color:#8ead96;margin:4px 0 0}
.engage-card.streak.done>strong{color:#c0ff67}
.engage-meter{height:6px;border-radius:6px;background:#0c140f;overflow:hidden;margin-top:8px}
.engage-meter i{display:block;height:100%;background:#c0ff67;border-radius:6px}
.league-table{margin-top:10px}
.league-table li.zone-promoted span{color:#c0ff67}
.league-table li.zone-relegated span{color:#e38b7a}
.engage-note{font-size:10px;color:#557a5e;margin:0}
@media(max-width:800px){#board-dialog{width:94vw;padding:19px;margin:auto auto calc(75px + env(safe-area-inset-bottom,0px));max-height:76dvh}}
#creator-view[hidden],#search-results[hidden],#discover-search[hidden],#reel-feed[hidden],#profile-following[hidden],#creator-arrange-bar[hidden],#creator-follow[hidden],#creator-arrange[hidden]{display:none!important}
button.reel-creator{background:none;border:0;padding:0;border-radius:20px;cursor:pointer;text-align:left}
#discover-search{max-width:520px;margin:0 auto 10px;padding:0 3px}
#search-input{width:100%;box-sizing:border-box;font-size:13px;background:#111b15 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236c9479' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") 13px 50%/16px no-repeat;border:1px solid #243c2b;color:#d5e9da;border-radius:12px;padding:11px 14px 11px 38px;outline:none}
#search-input:focus{border-color:#7fb85a}
#search-input::placeholder{color:#58745f}
.searching #discover-view,.creator-mode #creator-view{max-width:960px;margin:0 auto}
#search-results{height:calc(100dvh - 190px);overflow-y:auto;padding:4px 3px 30px;max-width:960px;margin:0 auto;scrollbar-width:thin}
.searching .discovery-heading,.searching #discover-search{max-width:960px}
.search-section{margin:6px 0 22px}
.search-section>h2,#profile-following h2{font-size:10px;font-weight:650;letter-spacing:1.4px;text-transform:uppercase;color:#6c9479;margin:0 0 10px}
.search-empty{font-size:12px;color:#6e9278;text-align:center;padding:50px 20px;line-height:1.7}
.user-row{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
.user-row::-webkit-scrollbar{display:none}
.user-chip{flex:0 0 auto;width:104px;display:flex;flex-direction:column;align-items:center;gap:6px;background:#111b15;border:1px solid #203128;border-radius:14px;padding:12px 8px;color:#d5e9da;cursor:pointer}
.user-chip:hover{border-color:#3c6242;background:#142119}
.user-chip>span{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#294532;border:1px solid #bfe5bf3b;font-size:13px;font-weight:600;color:#cde4cc}
.user-chip strong{font-size:11px;font-weight:550;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-chip small{font-size:8px;color:#668e70;text-align:center}
.game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:14px}
.game-tile{min-width:0}
.tile-frame{position:relative}
.tile-media{position:relative;display:block;width:100%;aspect-ratio:3/4;padding:0;overflow:hidden;background:radial-gradient(ellipse at 50% 35%,#284a32,#101e17 70%);border:1px solid #203128;border-radius:14px;cursor:pointer}
.tile-media:hover{border-color:#4c7839}
.tile-media img,.tile-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tile-media img{opacity:.8}
.tile-cover{position:absolute;inset:0;display:grid;place-items:center;font-size:38px;color:#b6d6a6}
.has-trailer .tile-media::after{content:'';position:absolute;inset:auto 0 0;height:40%;background:linear-gradient(transparent,#020a05aa);pointer-events:none}
.tile-meta{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 8px;padding:8px 2px 0}
.tile-meta h3{grid-column:1/-1;font-size:13px;font-weight:600;color:#e3f0e5;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tile-creator{justify-self:start;background:none;border:0;padding:0;font-size:10px;color:#7fa588;cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tile-creator:hover{color:#c2fb71}
.tile-meta small{font-size:9px;color:#5e7b67}
.tile-moves{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:12px;z-index:2}
.tile-moves button{width:44px;height:44px;border-radius:50%;font-size:18px;background:#c2fb71;color:#1f3514;border:0;padding:0;box-shadow:0 4px 16px #0008}
.tile-moves button:disabled{background:#1b2c20;color:#4a6650;box-shadow:none}
.arranging .tile-media{cursor:default;border-style:dashed;border-color:#7fb85a}
.creator-mode #creator-view{padding:18px 26px 60px}
.creator-top{display:flex;justify-content:space-between;align-items:center}
#creator-back{font-size:28px;line-height:1;background:none;border:0;color:#8ead96;padding:2px 12px}
#creator-menu{position:relative}
#creator-menu summary{list-style:none;cursor:pointer;font-size:22px;color:#8ead96;padding:2px 12px;border-radius:10px}
#creator-menu summary::-webkit-details-marker{display:none}
#creator-menu>div{position:absolute;right:0;top:36px;z-index:5;display:flex;flex-direction:column;min-width:160px;background:#121d16;border:1px solid #36543b;border-radius:12px;padding:6px;box-shadow:0 12px 30px #000a}
#creator-menu>div button{background:none;border:0;text-align:left;font-size:12px;color:#cfe3d4;padding:10px 12px;border-radius:8px}
#creator-menu>div button:hover{background:#1b3522}
.creator-hero{text-align:center;margin:4px 0 28px}
.creator-hero .profile-avatar{font-size:30px;font-weight:600;width:84px;height:84px;margin-bottom:16px}
.creator-hero h1{font-size:30px;letter-spacing:-.8px;color:#ddecdf;margin:0}
#creator-handle{font-size:11px;color:#6c9479;margin:4px 0 10px}
#creator-stats{font-size:12px;color:#9dbfa5;margin:0 0 18px}
#creator-follow{min-width:150px;font-size:13px;font-weight:650;padding:11px 22px;border-radius:12px;background:#1b3522;color:#c4e3c9;border:1px solid #3c6242}
#creator-follow.primary{background:#c2fb71;border-color:#c2fb71;color:#1f3514}
#creator-arrange-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 16px;padding:10px 14px;border:1px dashed #7fb85a;border-radius:12px;font-size:11px;color:#b6d5b7}
#creator-arrange-bar button{font-size:12px;font-weight:650;background:#c2fb71;color:#1f3514;border:0;border-radius:10px;padding:8px 18px}
.profile-mode #profile-following{margin:0 0 28px}
/* Keep the light-theme generic button hover from bleaching dark social controls. */
.tile-media:hover{background:radial-gradient(ellipse at 50% 35%,#2e5539,#101e17 70%)}
.tile-creator:hover,button.reel-creator:hover,#creator-back:hover{background:none}
.tile-moves button:hover:not(:disabled),#creator-arrange-bar button:hover,#creator-follow.primary:hover{background:#d1ff96;border-color:#d1ff96}
#creator-follow:not(.primary):hover{background:#22422b}
@media(max-width:800px){
#discover-search{padding:0 12px;margin-bottom:8px}
#reel-feed{height:calc(100dvh - 210px - env(safe-area-inset-bottom,0px))}
#search-results{height:calc(100dvh - 210px - env(safe-area-inset-bottom,0px));padding:4px 12px 30px}
.game-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.user-chip{width:92px}
.creator-mode #creator-view{padding:10px 12px 110px}
.creator-hero h1{font-size:26px}
}
/* Phone-first studio (iOS app "Create" presenter and any narrow screen).
   Kept at the end of discover.css (the last stylesheet, served by every
   studio build) so it overrides the rules above; desktop layouts are untouched. The app draws a native close
   button in the top-right corner, so the top 56px keep their right 64px clear. */
@media (max-width:800px){
  :root{--ph-bg:#0e1411;--ph-panel:#141c18;--ph-line:#223029;--ph-text:#eef7f1;--ph-muted:#8fae9b;--ph-mint:#a3f0cb;--ph-ink:#0e2218}
  /* Header: brand left, one menu button that stays clear of the close button.
     The menu replaces the bottom tab bar (the app has its own chrome). */
  .site-header{height:56px!important;padding:0 64px 0 16px!important;border-bottom:0!important}
  .local-badge,.brand span,#app-nav{display:none!important}
  #home-menu{display:grid;place-items:center;width:40px;height:40px;margin-left:auto;padding:0;border:0;border-radius:20px;background:none;color:var(--ph-text);font-size:16px;letter-spacing:1px}
  body:not(.builder-mode),body.social-view{background:var(--ph-bg)}
  #reel-feed,#search-results{height:calc(100dvh - 160px - env(safe-area-inset-bottom,0px))!important}

  /* Create home: one line of title, one prompt, one primary button. */
  .simple-main:has(.idea-stage:not([hidden])) .creation-steps,.idea-stage .spark,.idea-stage .eyebrow,.idea-stage .intro-copy,#idea-targets,.suggestions,#connect-agent,.connection-line{display:none!important}
  body:not(.builder-mode) .simple-main{padding:8px 16px 24px!important}
  .idea-stage{margin:28px 0 18px!important;padding:0!important}
  .idea-stage h1{font-size:30px!important;line-height:1.1!important;letter-spacing:-.8px;margin:0!important;text-align:left}
  .idea-stage h1 br{display:none}
  body:not(.builder-mode) .idea-composer{margin:0!important;border-radius:22px!important;padding:12px 10px 10px 16px!important}
  body:not(.builder-mode) .idea-composer textarea{font-size:17px!important;min-height:120px}
  .composer-actions .primary{min-height:44px;padding:0 20px!important;border-radius:22px!important;background:var(--ph-mint)!important;color:var(--ph-ink)!important;font-weight:700;border:0!important}
  .voice-button{display:grid;place-items:center;width:44px;height:44px;padding:0!important;border-radius:22px!important}
  .voice-button[hidden]{display:none}
  /* Style and build steps: drop the explanatory copy, keep the choices. */
  .creation-steps{margin:4px auto 12px!important;transform:scale(.9)}
  .guided-step>.eyebrow,.guided-step>p,.betting-setup>p,#betting-model-note{display:none!important}
  .guided-step h2{font-size:26px!important;margin:6px 0 14px!important}

  /* Workspace: one row of chrome, then the game or the chat, edge to edge. */
  /* builder-mode stays on while Discover/Profile show, so scope to the workspace. */
  body.builder-mode:not(.social-view){background:var(--ph-bg);overflow:hidden;overscroll-behavior:none}
  body.builder-mode:not(.social-view) .site-header,body.builder-mode:not(.social-view) #app-nav{display:none!important}
  body.builder-mode .simple-main{padding:0!important}
  body.builder-mode #builder-workspace{display:flex;flex-direction:column;height:100dvh}
  body.builder-mode .builder-top{flex:0 0 56px;height:56px;min-height:56px;display:flex!important;flex-wrap:nowrap;align-items:center;gap:6px;padding:0 64px 0 4px;overflow:visible;background:var(--ph-bg);border-bottom:1px solid var(--ph-line)}
  body.builder-mode .builder-top .breadcrumb{flex:0 0 40px;width:40px;height:40px;padding:0;font-size:0;border:0;background:none;color:var(--ph-text);display:grid;place-items:center}
  body.builder-mode .builder-top .breadcrumb::before{content:'‹';font-size:32px;line-height:1;margin-top:-3px}
  body.builder-mode .builder-top strong#workspace-title{flex:1 1 auto;min-width:0;max-width:none;font-size:16px;font-weight:650;letter-spacing:-.2px;color:var(--ph-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  body.builder-mode .builder-top>.spacer,body.builder-mode #workspace-build-state,body.builder-mode #workspace-actions{display:none!important}
  body.builder-mode #mobile-workspace-switch{flex:0 0 auto;display:flex;height:34px;padding:3px;gap:0;border:0;border-radius:18px;background:var(--ph-panel)}
  body.builder-mode #mobile-workspace-switch button{flex:0 0 auto;min-height:28px;padding:0 14px;font-size:13px;font-weight:600;border:0;border-radius:15px;background:none;color:var(--ph-muted)}
  body.builder-mode #mobile-workspace-switch button.active{background:var(--ph-mint);color:var(--ph-ink)}
  body.builder-mode #game-menu{display:grid!important;place-items:center;flex:0 0 40px;width:40px;height:40px;min-width:0;padding:0;font-size:16px;letter-spacing:1px;border:0;background:none;color:var(--ph-text)}
  body.builder-mode .builder-split{flex:1 1 auto;display:block;height:auto!important;min-height:0!important;padding:0!important;gap:0}
  body.builder-mode #workspace-chat,body.builder-mode .workspace-right{width:100%;height:100%!important;min-height:0!important;margin:0;border:0;border-radius:0;background:var(--ph-bg)}
  body.builder-mode .workspace-right{display:flex;flex-direction:column}
  body.builder-mode .workspace-tabs,body.builder-mode .workspace-chat-title{display:none!important}
  body.builder-mode .workspace-panel{flex:1 1 auto;min-height:0;overflow:auto;padding:16px!important}
  body.builder-mode #workspace-play.active{display:flex;flex-direction:column;padding:0!important;overflow:hidden}

  /* Play: the game fills the pane; only wager actions stay beside it. */
  body.builder-mode .play-preview{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;margin:0;border:0;border-radius:0;background:#080e0b}
  body.builder-mode .play-header{flex:0 0 auto;min-height:0;gap:8px;padding:6px 12px;background:none;flex-wrap:nowrap}
  body.builder-mode #play-title,body.builder-mode #replay,body.builder-mode #play-board,body.builder-mode #close-play{display:none!important}
  body.builder-mode #play-mode{font-size:11px;color:var(--ph-muted)}
  body.builder-mode .play-header:not(:has(#demo-entry:not([hidden]):not(:disabled),#cashout:not([hidden]))){display:none}
  body.builder-mode .play-header #demo-entry,body.builder-mode .play-header #cashout{min-height:36px;padding:0 16px;font-size:13px;font-weight:700;border:0;border-radius:18px;background:var(--ph-mint);color:var(--ph-ink)}
  body.builder-mode #play-info{flex:0 0 auto;padding:0 12px 6px;font-size:11px;color:var(--ph-muted);background:none}
  body.builder-mode #play-info:empty{display:none}
  body.builder-mode #game-frame{flex:1 1 auto;width:100%!important;max-width:none!important;height:auto;min-height:0;border:0;border-radius:0;align-self:stretch}
  body.builder-mode #play-error:empty{display:none}
  body.builder-mode #workspace-play>#betting-play-panel{display:none}

  /* Chat: the conversation scrolls, the composer stays at the bottom. */
  body.builder-mode #chat-dock,body.builder-mode .conversation{height:100%;min-height:0}
  body.builder-mode #chat{padding:12px 14px!important}
  body.builder-mode .chat-message{font-size:14px!important;line-height:1.55!important}
  body.builder-mode .idea-composer{margin:8px 10px calc(10px + env(safe-area-inset-bottom,0px))!important;border-radius:22px!important;padding:8px 8px 8px 14px!important}
  body.builder-mode .idea-composer textarea{font-size:16px!important;min-height:44px!important;max-height:30dvh}
  body.builder-mode .composer-actions .primary{min-height:36px;padding:0 16px!important;font-size:14px!important;border-radius:18px!important;background:var(--ph-mint)!important;color:var(--ph-ink)!important}
  body.builder-mode .connection-line{font-size:11px!important;margin:0 14px 6px!important}
  body.builder-mode .connection-line button,body.builder-mode #agent-status{font-size:11px!important}

  /* Advanced tools only open from a menu, as a full-screen layer. */
  #advanced{display:none!important}
  body.show-advanced #advanced{display:block!important;position:fixed!important;inset:0;z-index:60;max-height:none;padding:14px 16px 40px;overflow:auto;background:var(--ph-bg)}
  body.show-advanced #advanced>summary{font-size:15px;padding:10px 64px 14px 0}

  /* Bottom sheets: the game menu and moved panels such as Betting. */
  .mobile-game-menu,.phone-sheet{width:100%!important;max-width:100%!important;margin:auto 0 0!important;padding:8px 16px calc(18px + env(safe-area-inset-bottom,0px))!important;border:1px solid var(--ph-line);border-bottom:0;border-radius:22px 22px 0 0;background:var(--ph-panel);color:var(--ph-text);max-height:82dvh;overflow:auto}
  .mobile-game-menu::backdrop,.phone-sheet::backdrop{background:#000a;backdrop-filter:blur(3px)}
  .mobile-game-menu::before,.phone-sheet::before{content:'';display:block;width:38px;height:5px;border-radius:3px;background:#3a4b42;margin:0 auto 12px}
  .mobile-game-menu h2{font-size:18px!important;margin:0 4px 2px;outline:none}
  .mobile-game-menu .menu-state{font-size:12px;color:var(--ph-muted);margin:0 4px 10px}
  .mobile-game-menu button{display:block;width:100%;min-height:46px!important;margin:5px 0!important;padding:0 16px;text-align:left;font-size:15px;font-weight:550;border:0;border-radius:14px;background:#1b2621;color:var(--ph-text)}
  .mobile-game-menu button.primary{background:var(--ph-mint);color:var(--ph-ink);font-weight:700;text-align:center}
  .mobile-game-menu .menu-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:4px;margin:6px 0 10px;border-radius:16px;background:var(--ph-bg)}
  .mobile-game-menu .menu-tabs button{min-height:40px!important;margin:0!important;padding:0 4px;text-align:center;font-size:13px;background:none;color:var(--ph-muted)}
  .mobile-game-menu .menu-tabs button[aria-current=page]{background:var(--ph-mint);color:var(--ph-ink);font-weight:700}
  .mobile-game-menu .menu-chips{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 10px}
  .mobile-game-menu .menu-chips button{display:inline-block;width:auto;min-height:38px!important;margin:0!important;padding:0 14px;border-radius:19px;font-size:14px;border:1px solid var(--ph-line);background:none}
  .guided-step .primary{width:100%;min-height:50px;border:0;border-radius:16px;background:var(--ph-mint)!important;color:var(--ph-ink)!important;font-weight:700}
  .mobile-game-menu button.menu-close{background:none;color:var(--ph-muted);text-align:center}
  .phone-sheet-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
  .phone-sheet-bar h2{font-size:18px;margin:0}
  .phone-sheet-bar button{min-height:36px;padding:0 16px;border:0;border-radius:18px;background:var(--ph-mint);color:var(--ph-ink);font-weight:700}
  .phone-sheet #betting-play-panel{display:block;margin:0;border:0;padding:0 4px;background:none;color:var(--ph-text);font-size:14px;overflow:visible}
  .phone-sheet #betting-play-panel>h3{display:none}
}
/* One token set (mates-core#26): Discover's names alias the Soft Arcade tokens in /theme.css. */
:root{--ph-bg:var(--sa-bg,#0e1411);--ph-panel:var(--sa-bg-2,#141c18);--ph-line:var(--sa-line,#223029);--ph-text:var(--sa-text,#eef7f1);--ph-muted:var(--sa-text-2,#8fae9b);--ph-mint:var(--sa-mint,#a3f0cb);--ph-ink:var(--sa-mint-ink,#0e2218)}