*{box-sizing:border-box}:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;--ink:#edf3ef;--muted:#98a7a2;--line:#3d4946;--panel:#202826;--panel2:#18201e;--accent:#17766e;--accent-hi:#71c6b5;--warn:#d5a04e;--danger:#c56d5c}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#111715;color:var(--ink)}button,input{font:inherit}.app{height:100dvh;display:grid;grid-template-rows:62px 1fr 28px;background:linear-gradient(rgba(15,21,19,.84),rgba(15,21,19,.96)),url("assets/ashlight-camp-roster.png") center/cover}header{display:flex;align-items:center;gap:16px;padding:0 16px;border-bottom:1px solid var(--line);background:rgba(19,26,24,.94)}header>div:first-child{flex:1}.eyebrow{margin:0 0 3px;color:var(--accent-hi);font-size:9px;font-weight:800;text-transform:uppercase}h1,h2,h3,p{margin:0}h1{font-size:17px}.header-state{display:flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid var(--line);font-size:9px}.header-state span{color:var(--muted)}.header-state strong{font-size:14px}.icon-button{width:34px;height:34px;border:1px solid var(--line);background:#222b29;color:#fff;font-size:18px;cursor:pointer}main{display:grid;grid-template-columns:minmax(430px,1.15fr) minmax(310px,.8fr) 330px;min-height:0}.active-panel,.roster-panel,.detail-panel{min-width:0;overflow:auto;padding:16px;background:rgba(29,38,35,.94)}.roster-panel,.detail-panel{border-left:1px solid var(--line)}.roster-panel{background:rgba(24,32,30,.96)}.detail-panel{background:rgba(21,28,26,.97)}.section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}.section-head h2,.detail-head h2{font-size:19px}.section-head>span{padding:4px 7px;border:1px solid var(--line);color:var(--muted);font-size:9px}.active-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:14px}.slot{position:relative;min-height:128px;padding:11px;border:1px solid var(--line);background:#17201d;cursor:pointer}.slot.protagonist{border-color:#80713d;background:#26261d}.slot.selected{border-color:var(--accent-hi);box-shadow:inset 3px 0 var(--accent)}.slot.empty{display:grid;place-items:center;border-style:dashed;color:var(--muted);font-size:10px}.slot .slot-num{position:absolute;right:8px;top:7px;color:#6f7d78;font-size:8px}.slot h3{font-size:13px}.slot .role{margin-top:4px;color:var(--muted);font-size:9px}.slot .level{display:inline-block;margin-top:10px;padding:3px 5px;background:#26312e;color:#b8c6c0;font-size:8px}.gear-line{margin-top:10px;color:#cbd5d1;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gear-line.warn{color:#e3b66d}.slot button{position:absolute;right:8px;bottom:8px;width:25px;height:25px;border:1px solid var(--line);background:#202b28;color:#fff;cursor:pointer}.guest-section{margin-top:14px;border:1px solid #655d3c;background:rgba(47,43,26,.72)}.guest-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px}.guest-head h3{font-size:11px}.guest-head p{margin-top:3px;color:#c7b887;font-size:8px}.switch{position:relative}.switch input{position:absolute;opacity:0}.switch span{display:block;width:38px;height:20px;border-radius:10px;background:#4d5145;cursor:pointer}.switch span:after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#ddd;transition:.15s}.switch input:checked+span{background:var(--accent)}.switch input:checked+span:after{transform:translateX(18px)}.guest-slot{padding:0 12px 10px;color:#c9c0a2;font-size:9px}.guest-card{display:flex;justify-content:space-between;padding:8px;border-top:1px solid #655d3c}.departure{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}.departure strong,.departure span{display:block}.departure strong{font-size:11px}.departure span{margin-top:3px;color:var(--muted);font-size:8px}.departure .blocked strong{color:var(--warn)}.departure button{height:40px;padding:0 15px;border:0;background:var(--accent);color:#fff;font-size:10px;font-weight:800;cursor:pointer}.departure button:disabled{opacity:.4}.filters{display:grid;grid-template-columns:repeat(3,1fr);margin-top:12px;border:1px solid var(--line)}.filters button{height:31px;border:0;border-right:1px solid var(--line);background:#17201d;color:var(--muted);font-size:9px;cursor:pointer}.filters button:last-child{border:0}.filters button.active{background:var(--accent);color:#fff}.roster-list{display:grid;gap:6px;margin-top:10px}.roster-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:10px;border:1px solid var(--line);background:#1d2724;cursor:pointer}.roster-card.selected{border-color:var(--accent-hi)}.roster-card h3{font-size:11px}.roster-card p{margin-top:4px;color:var(--muted);font-size:8px}.roster-card .badges{display:flex;gap:4px;margin-top:7px}.badge{padding:3px 5px;background:#29332f;color:#b8c4bf;font-size:7px}.badge.away{background:#342d24;color:#d0b17e}.roster-card button{align-self:center;min-width:52px;height:29px;border:1px solid var(--accent);background:transparent;color:var(--accent-hi);font-size:8px;cursor:pointer}.roster-card button:disabled{border-color:var(--line);color:#68736f}.detail-head{display:flex;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}.detail-head p:not(.eyebrow){margin-top:5px;color:var(--muted);font-size:9px}.detail-head>span{color:var(--muted);font-size:10px}.tabs{display:grid;grid-template-columns:1fr 1fr;height:34px;margin-top:12px;border:1px solid var(--line)}.tabs button{border:0;background:#17201d;color:var(--muted);font-size:9px}.tabs button.active{background:var(--accent);color:#fff}.equipment{margin-top:12px}.equip-slot{display:grid;grid-template-columns:66px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:44px;border-bottom:1px solid #313b38;font-size:9px}.equip-slot>span{color:var(--muted)}.equip-slot strong{font-size:9px}.equip-slot button{width:26px;height:26px;border:1px solid var(--line);background:#202a27;color:#fff}.warning{margin-top:10px;padding:9px;border-left:3px solid var(--warn);background:#3a2c20;color:#dec294;font-size:9px;line-height:1.4}.status-list{margin-top:12px}.status-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #313b38;font-size:9px}.status-row span{color:var(--muted)}.audit{margin-top:16px}.audit h3{margin-bottom:8px;color:#c9d4cf;font-size:9px;text-transform:uppercase}.audit-log{max-height:190px;overflow:auto}.audit-entry{padding:7px;border-left:2px solid var(--line);background:#1c2422;font-size:8px;line-height:1.4}.audit-entry+ .audit-entry{margin-top:5px}.audit-entry strong{color:var(--accent-hi)}.modal{position:fixed;inset:0;display:grid;place-items:center;background:rgba(8,11,10,.8);z-index:20}.modal[hidden]{display:none}.modal>div{width:min(430px,90vw);padding:28px;border:1px solid var(--line);background:#1c2623;text-align:center}.modal h2{font-size:24px}.modal p:not(.eyebrow){margin:10px 0 18px;color:var(--muted);font-size:11px;line-height:1.5}.modal button{height:38px;padding:0 16px;border:0;background:var(--accent);color:#fff}footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:0 12px;border-top:1px solid var(--line);background:#131917;color:var(--muted);font-size:8px}footer i{display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:50%;background:var(--accent-hi)}
@media(max-width:1050px){main{grid-template-columns:minmax(410px,1fr) 310px}.detail-panel{display:none}}
@media(max-width:720px){.app{grid-template-rows:54px 1fr 24px}main{display:block;overflow:auto}.active-panel,.roster-panel{overflow:visible;padding:12px}.roster-panel{border-left:0;border-top:1px solid var(--line)}.active-grid{grid-template-columns:repeat(2,1fr)}.slot{min-height:112px}.departure{position:sticky;bottom:0;z-index:5;padding:10px;background:#1d2724}.header-state{display:none}footer span:nth-child(2),footer span:nth-child(3){display:none}}