/* Page-wide mission accent and creator-first workspace. */
:root{--accent-on:#15200f;--paper:color-mix(in srgb,var(--accent) 4%,#101312);--surface:color-mix(in srgb,var(--accent) 5%,#171b18);--line:color-mix(in srgb,var(--accent) 16%,#252b25);--accent-text:color-mix(in srgb,var(--accent) 70%,#fff);--accent-soft:color-mix(in srgb,var(--accent) 13%,#182018);--ink:#e5e9e3;--muted:#a4ada0}
.app-header{background:color-mix(in srgb,var(--accent) 5%,#121815);border-color:var(--line)}
.brand b>span,.brief-label,.back-link,.text-link,.auth-switch button{color:var(--accent-text)}
.nav a.active,.btn.primary,.btn.lime{background:var(--accent);border-color:var(--accent);color:var(--accent-on)}
.nav a.active:hover,.btn.primary:hover,.btn.lime:hover{background:color-mix(in srgb,var(--accent) 90%,white);border-color:var(--accent);color:var(--accent-on)}
.nav a:hover,.btn:hover,.arrow-btn:hover{background:color-mix(in srgb,var(--accent) 22%,#1b251a)}
.nav a.active:hover{background:var(--accent)}
.avatar,.btn,.search,.arrow-btn,.view-toggle .active,.filter.active,.date-tile,.strip-icon{background:var(--accent-soft);border-color:var(--line);color:var(--accent-text)}
.btn.ghost{background:transparent}.btn.danger{background:#392521;color:#efa397;border-color:#74463e}
.profile-btn,.field input,.field textarea,.field select,.info-list dd,.objective-list li{color:var(--ink)}
.profile-btn .icon,.avatar .icon,.card-kicker,.card-meta,.roster-count,.tabs button,.field small,.squad-foot,.squad-head small{color:var(--muted)}
.studio-label{color:var(--muted);letter-spacing:1.5px;font-size:8px}
.page-heading p,.card-body>p,.panel p,.editor-intro,.modal>p{color:#a8b0a1}
.page-heading .eyebrow,.card-bottom b,.tabs button.active{color:var(--accent-text)}
.filter.active,.filter:hover{border-color:var(--line);color:var(--accent-text);background:var(--accent-soft)}
.badge.open{background:var(--accent-soft);color:var(--accent-text)}
.card-picture>.badge.open{background:color-mix(in srgb,var(--accent) 14%,#172018);border-color:var(--line)}
.detail-hero .badge.open{background:var(--accent);color:var(--accent-on)}
.tabs small,.section-heading h2 small{background:var(--accent-soft);color:var(--accent-text)}
.notice,.editor-hint,.role.mine,.reserve-chip,.equipment-item{background:var(--accent-soft);border-color:var(--line);color:#b6c0ac}
.notice b,.notice>.icon,.objective-list span,.reserve-chip{color:var(--accent-text)}
.panel,.squad,.mission-card,.next-panel{background:var(--surface);border-color:var(--line)}
.role,.squad-head,.info-list>div,.card-meta,.footer,.tabs{border-color:var(--line)}
.squad-head,.squad-number,.role .btn{background:var(--accent-soft);border-color:var(--line)}
.squad-number,.role .btn,.role .player,.role-gear-link{color:var(--accent-text)}
.role-gear-link{display:flex;align-items:center;gap:4px;font-size:8px;margin-top:6px;padding:0}
.role-gear-link .icon{width:11px;height:11px}
.progress{background:var(--line)}.progress i{background:var(--accent)}
.modal{background:var(--surface);border-color:var(--line)}
.editor-header,.editor-footer{background:color-mix(in srgb,var(--accent) 7%,#192019);border-color:var(--line)}
.editor-nav{background:color-mix(in srgb,var(--accent) 4%,#121913);border-color:var(--line)}
.editor-nav button.active,.layout-options button.selected{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-text)}
.field input,.field textarea,.field select{background:color-mix(in srgb,var(--accent) 3%,#101611);border-color:var(--line)}
.field input:focus,.field textarea:focus,.field select:focus{outline-color:var(--accent);border-color:var(--accent)}
label.field{color:#b9c4b0}.field input::placeholder,.field textarea::placeholder{color:#76816e}
.field input[type=file]{background:var(--accent-soft);color:#c1cab8}
.field input[type=file]::file-selector-button{background:var(--accent-soft);border-color:var(--line);color:var(--accent-text)}
.layout-options button,.cover-option,.cover-option span{background:var(--surface);color:#b3c0a7;border-color:var(--line)}
.cover-option.selected{border-color:var(--accent)}
.file-status{color:var(--accent-text)}
.map-controls .btn{background:var(--surface);color:var(--accent-text);border-color:var(--line)}
.studio-hero{margin-bottom:32px;min-height:310px}.studio-hero .hero-content{padding:36px;max-width:72%}.studio-hero h2{font-size:40px;margin-bottom:18px}.studio-hero p{font-size:12px;margin-bottom:25px;max-width:460px}
.studio-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:30px}
.studio-stats>div{display:flex;align-items:center;justify-content:space-between;padding:22px;background:var(--surface);border:1px solid var(--line);border-radius:10px;gap:10px}
.studio-stats span{font-size:9px;letter-spacing:1px;color:#97a38c}.studio-stats b{font-size:26px;font-weight:550;color:var(--accent-text)}
.card-actions{display:flex;gap:6px}.card-actions .btn,.card-bottom>.btn{padding:7px 9px;font-size:9px}.card-actions .icon{width:12px;height:12px}
.card-body>p{min-height:36px}.mission-topline{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:17px}.mission-topline .back-link{margin-bottom:0}
.formation-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;align-items:start}
.formation-grid.compact{grid-template-columns:1fr}.formation-grid.compact>.squad{grid-column:1!important;grid-row:auto!important}
.formation-grid .squad-head{padding:17px 15px;gap:8px}.formation-grid .squad-head h3{font-size:14px}.formation-grid .squad-head>.mono{font-size:9px}.formation-grid .role{padding:12px 14px;gap:6px}.formation-grid .role-name{font-size:10px}.formation-grid .role .btn{font-size:8px;padding:6px 7px}.formation-grid .role .btn .icon{width:12px;height:12px}.formation-grid .role .player{font-size:9px;max-width:100px;overflow-wrap:anywhere}.formation-grid .squad-foot{padding:12px 14px;flex-wrap:wrap;font-size:8px;gap:6px}.formation-grid .squad-foot>span{display:flex;gap:5px;align-items:center;margin-left:auto}.reserves .section-heading{margin-bottom:0}.reserves .section-heading h2{margin-bottom:8px}.reserves p{font-size:11px}
.role-equipment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start}
.role-equipment{border:1px solid var(--line);border-radius:7px;margin-bottom:10px;overflow:hidden}.role-equipment:last-child{margin-bottom:0}
.role-equipment summary{cursor:pointer;padding:15px;font-size:12px;color:var(--ink);line-height:1.5}.role-equipment summary>span{float:right;color:var(--muted);font-size:9px;margin-left:10px}.role-equipment p{padding:0 15px 15px;font-size:11px;white-space:pre-line}
.profile-heading{display:flex;gap:14px;align-items:center;margin-bottom:25px}.profile-heading>.avatar{width:45px;height:45px;font-size:14px}.profile-heading h2{font-size:21px;margin-bottom:6px}.profile-heading p{font-size:11px;color:var(--muted)}
.profile-divider{border-top:1px solid var(--line);padding-top:20px;margin-top:4px;font-size:11px;color:var(--accent-text)}
.profile-logout{display:flex;justify-content:flex-end;margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}
.calendar-options{display:flex;flex-direction:column;gap:12px;margin:25px 0}
.modal.large{width:min(1380px,100%)}
.editor-layout{grid-template-columns:190px minmax(0,1fr)}
.editor-nav{gap:8px}.editor-nav-hint{font-size:8px;letter-spacing:1px;color:#7b8a6f;padding:0 5px 10px;display:flex;justify-content:space-between}.editor-nav-hint>span{font-size:7px}
.editor-nav-item{display:flex;align-items:center;gap:3px}.editor-nav-item>button{flex:1;min-width:0;padding:11px 8px;gap:7px;font-size:10px}.editor-nav-item .icon{width:14px;height:14px}
.section-switch{padding:6px 2px;display:grid;place-items:center;cursor:pointer}.section-switch input{accent-color:var(--accent);width:14px;height:14px;cursor:pointer}
.editor-nav-explain{padding:14px 6px 0;color:#839475;font-size:9px;line-height:1.8;border-top:1px solid var(--line);margin-top:10px}
.editor-intro{font-size:11px;line-height:1.8;margin-bottom:24px;max-width:750px}.editor-content{min-width:0;padding:25px}.editor-section>.form-grid{max-width:850px;margin:auto}.editor-section>h3{font-size:18px;margin-bottom:20px}
.builder-toolbar{display:flex;flex-direction:column;gap:15px;margin-bottom:20px}.builder-toolbar h3{margin:0 0 9px;font-size:18px}.builder-toolbar p{font-size:10px;color:var(--muted)}.builder-add{display:flex;gap:7px;flex-wrap:wrap}.builder-add .btn{font-size:9px;padding:8px 10px}
.builder-canvas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;grid-auto-rows:minmax(180px,auto);align-items:stretch;padding:12px;background:color-mix(in srgb,var(--accent) 2%,#101511);border:1px solid var(--line);border-radius:10px;min-width:0}
.grid-drop{border:1px dashed color-mix(in srgb,var(--accent) 19%,#20291e);border-radius:8px;display:flex;align-items:center;justify-content:center;gap:10px;flex-direction:column;min-height:180px;color:#718165;padding:12px;overflow:hidden}
.grid-drop>span{font-family:Consolas,monospace;font-size:12px;color:var(--accent-text);opacity:.45}.grid-drop>small{font-size:8px;line-height:1.6;text-align:center}.grid-drop:hover{background:var(--accent-soft);border-color:var(--accent)}
.builder-squad{position:relative;z-index:1;min-width:0;align-self:start;border:1px solid color-mix(in srgb,var(--accent) 40%,#273024);border-radius:8px;background:var(--surface);overflow:hidden;box-shadow:0 4px 15px #0002}
.builder-squad-head{display:flex;justify-content:space-between;align-items:center;gap:5px;padding:9px;background:var(--accent-soft);border-bottom:1px solid var(--line);cursor:grab;user-select:none}
.builder-squad-head:active{cursor:grabbing}.builder-squad-head>span{display:flex;align-items:center;gap:5px;font-size:8px;letter-spacing:1px;color:var(--accent-text)}.builder-squad-head>span>.icon{width:12px;height:12px}.builder-squad-head>div{display:flex;gap:2px}
.icon-button{padding:4px;background:transparent;border:0;line-height:1;min-width:20px;min-height:23px;color:#9faf91;border-radius:3px}.icon-button:hover{color:var(--accent-text);background:var(--accent-soft)}.icon-button .icon{width:12px;height:12px}
.builder-squad-body{padding:11px;display:flex;flex-direction:column;gap:12px}.builder-squad-body label.field{font-size:8px;gap:5px}.builder-squad-body input,.builder-squad-body select{font-size:10px;padding:8px;min-width:0}
.builder-position{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.builder-role-list{display:flex;flex-direction:column;gap:5px}
.builder-role{display:flex;align-items:center;gap:4px;flex-wrap:wrap;padding:5px;background:#0001;border:1px solid var(--line);border-radius:4px}.builder-role>input{flex:1;width:65px;min-width:0;background:transparent;border:0;color:var(--ink);padding:4px 1px;font-size:9px;outline-color:var(--accent)}.builder-role>div{display:flex;gap:0;margin-left:auto}.builder-role .role-order{font-size:8px;color:#77876a;min-width:10px}.builder-role .icon-button{padding:2px;min-width:18px}.builder-role .icon{width:10px;height:10px}.builder-role .occupied-label{width:100%;font-size:7px;color:var(--accent-text);margin-left:13px}
.add-role{display:flex;gap:5px}.add-role>select{flex:1;min-width:0;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:4px;font-size:9px;padding:7px 4px}.add-role>.btn{font-size:8px;padding:6px;gap:4px}.add-role .icon{width:11px;height:11px}
.equipment-editor-group{margin-bottom:25px;border:1px solid var(--line);border-radius:9px;padding:18px}.equipment-editor-group>h3{font-size:14px;color:var(--accent-text);margin-bottom:15px}.equipment-editor-role{border-top:1px solid var(--line);padding:12px 0}.equipment-editor-role>summary{cursor:pointer;display:flex;align-items:center;gap:12px;list-style:none;font-size:12px}.equipment-editor-role>summary>small{color:var(--muted);font-size:9px;margin-left:auto}.equipment-editor-role>summary .icon{width:13px;height:13px;color:var(--accent-text)}.equipment-editor-role>label{margin:17px 0 10px}.equipment-editor-role>.text-link{font-size:10px}.equipment-editor-role textarea{width:100%}
.theme-preview{border:1px solid var(--line);border-radius:10px;margin-bottom:25px;overflow:hidden;max-width:850px}.theme-preview-nav{background:var(--accent-soft);display:flex;align-items:center;gap:20px;padding:14px 20px;font-weight:700;font-size:11px;color:var(--accent-text)}.theme-preview-nav>span{font-size:9px;font-weight:500;color:var(--muted)}.theme-preview-nav>span:first-child{background:var(--accent);color:var(--accent-on);padding:5px 10px;border-radius:4px}.theme-preview .appearance-preview{margin:0;border:0;border-radius:0;height:100px;padding:25px}.theme-preview-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:17px 20px;background:var(--surface)}.theme-preview-bottom>div{border-left:3px solid var(--accent);padding:8px 15px;color:var(--ink);font-size:13px;min-width:180px;background:var(--accent-soft);border-radius:4px}.theme-preview-bottom>div>span{margin-left:30px;font-size:9px;color:var(--accent-text)}.theme-preview-bottom .btn{font-size:9px;opacity:1}
.preview-overlay{position:fixed;inset:0;background:var(--paper);z-index:150;overflow:auto;overscroll-behavior:contain}.preview-toolbar{position:sticky;top:0;z-index:5;background:var(--surface);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px;padding:16px 30px;box-shadow:0 4px 20px #0002}.preview-toolbar>div{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:1px;color:var(--accent-text)}.preview-toolbar>div>span{font-size:10px;letter-spacing:0;color:var(--muted);margin-left:10px}.preview-content{max-width:1440px}.preview-toolbar .btn{font-size:10px}
@media(max-width:1200px){.studio-label{display:none}.builder-canvas{grid-template-columns:repeat(4,minmax(160px,1fr));min-width:700px}.builder-section{overflow:auto}.editor-content{padding:22px}.formation-grid{gap:14px}}
@media(max-width:1000px){.formation-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.formation-grid>.squad{grid-column:auto!important;grid-row:auto!important}.formation-grid.compact{grid-template-columns:1fr}.editor-layout{grid-template-columns:170px minmax(0,1fr)}.editor-nav-item>button{font-size:9px;padding:10px 6px;gap:5px}.section-switch input{width:13px;height:13px}.studio-stats>div{padding:18px}.studio-stats span{font-size:8px}.studio-hero .hero-content{max-width:85%}.studio-hero h2{font-size:36px}.role-equipment-grid{grid-template-columns:1fr}}
@media(max-width:760px){.editor-layout{display:block}.editor-nav{display:flex;flex-direction:row;gap:8px;overflow:auto;padding:12px;position:sticky;top:89px}.editor-nav-hint,.editor-nav-explain{display:none}.editor-nav-item{flex-shrink:0;gap:4px}.editor-nav-item>button{padding:10px 8px;font-size:9px;flex:none}.editor-nav-item>button>.icon{display:inline-block}.editor-content{padding:20px}.builder-canvas{grid-template-columns:repeat(4,190px);min-width:820px}.builder-toolbar{position:sticky;left:0;max-width:calc(100vw - 85px)}.editor-footer{gap:5px;padding:14px}.editor-footer .btn{font-size:10px;padding:10px 11px}.editor-footer>div{gap:6px}.builder-position{gap:5px}.preview-toolbar{padding:12px 17px;gap:10px}.preview-toolbar>div>span{display:none}.preview-toolbar>div{font-size:8px;gap:6px}.preview-toolbar .btn{font-size:9px;padding:9px}.studio-stats{gap:10px}.studio-stats>div{align-items:flex-start;gap:10px;flex-direction:column;padding:16px}.studio-stats span{font-size:7px;line-height:1.7}.studio-stats b{font-size:24px}.studio-hero .hero-content{max-width:100%;padding:27px}.studio-hero h2{font-size:32px}.studio-hero p{font-size:11px}.nav a{flex:1}.card-actions .btn{padding:7px 8px}.card-actions .btn .icon{display:none}.formation-grid{gap:14px}.role-equipment summary>span{float:none;display:block;margin:7px 0 0}.theme-preview-bottom{padding:15px;gap:10px}.theme-preview-bottom>div{min-width:130px;padding:8px 10px}.theme-preview-bottom>div>span{margin-left:15px}.equipment-editor-group{padding:15px}.equipment-editor-role>summary{font-size:11px;gap:6px}.equipment-editor-role>summary>small{font-size:8px}}
@media(max-width:480px){.formation-grid{grid-template-columns:1fr}.studio-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.studio-stats>div{padding:12px}.studio-stats span{letter-spacing:.5px}.studio-hero h2{font-size:28px}.studio-hero .hero-content{padding:25px 22px}.studio-hero p{line-height:1.8}.mission-topline{align-items:flex-start}.mission-topline .badge{font-size:7px}.theme-preview-bottom{flex-wrap:wrap}.builder-add .btn{font-size:8px;padding:8px}.editor-nav{top:89px}.editor-nav-item>button>.icon{display:none}.equipment-editor-role>summary{flex-wrap:wrap}.equipment-editor-role>summary>small{margin-left:0}.theme-preview-nav{gap:12px}.profile-heading h2{font-size:20px}}
