:root{--bg:#0f1217;--panel:#171b22;--panel-2:#1f252e;--line:#303946;--text:#f3f5f7;--muted:#9ca8b6;--soft:#c6ccd3;--accent:#62c98f;--accent-2:#d6a54d;--danger:#ef6f6c;--blue:#69a7ff}*{box-sizing:border-box}body{color:var(--text);background:radial-gradient(circle at 0 0,#62c98f1f,#0000 32rem),linear-gradient(135deg,#0f1217 0%,#15181e 52%,#10151a 100%);margin:0;font-family:Aptos,Segoe UI,sans-serif}button,input,a{font:inherit}button,a{cursor:pointer}.shell{grid-template-columns:280px 1fr;min-height:100vh;display:grid}.sidebar{border-right:1px solid var(--line);background:#0c0f14b8;padding:24px 18px}.brand{align-items:center;gap:12px;padding:10px 8px 26px;display:flex}.logo-mark{color:#ef4444;background:#ef44441a;border:1px solid #ef44445c;border-radius:7px;place-items:center;width:42px;height:42px;font-size:17px;font-weight:800;display:grid}.brand strong,.preview-head h2,.topbar h1{letter-spacing:0}.brand span,.topbar p,.preview-head p,.storage-note span,.output-row small,.list-head,.meta-grid span{color:var(--muted)}.brand span{margin-top:3px;font-size:13px;display:block}.nav{gap:6px;display:grid}.nav button,.logout-button,.actions button,.actions a{color:var(--soft);background:0 0;border:1px solid #0000;border-radius:7px;text-decoration:none}.nav button{text-align:left;align-items:center;gap:10px;padding:10px;display:flex}.nav button.active,.nav button:hover,.logout-button:hover,.actions button:hover,.actions a:hover{border-color:var(--line);background:var(--panel-2);color:var(--text)}.storage-note{border:1px solid var(--line);background:#1f252eb3;border-radius:7px;margin-top:28px;padding:14px}.storage-note strong,.storage-note span{display:block}.logout-button{align-items:center;gap:10px;width:100%;margin-top:14px;padding:10px;display:inline-flex}.storage-note span{margin-top:8px;font-size:13px;line-height:1.45}.inbox{min-width:0;padding:28px}.topbar{justify-content:space-between;align-items:end;gap:18px;margin-bottom:22px;display:flex}.topbar p,.preview-head p{text-transform:uppercase;margin:0 0 6px;font-size:13px}.topbar h1{margin:0;font-size:28px;line-height:1.18}.search{border:1px solid var(--line);background:var(--panel);border-radius:7px;align-items:center;gap:10px;width:min(440px,100%);padding:0 12px;display:flex}.search input{width:100%;height:44px;color:var(--text);background:0 0;border:0;outline:none}.content-grid{grid-template-columns:minmax(420px,.95fr) minmax(420px,1.05fr);gap:18px;min-height:calc(100vh - 122px);display:grid}.list-panel,.preview-panel{border:1px solid var(--line);background:#171b22db;border-radius:8px;overflow:hidden}.list-head{border-bottom:1px solid var(--line);justify-content:space-between;padding:14px 16px;font-size:13px;display:flex}.output-list{display:grid}.output-row{border:0;border-bottom:1px solid var(--line);color:var(--text);text-align:left;background:0 0;grid-template-columns:34px minmax(0,1fr) auto 74px;align-items:center;gap:12px;padding:14px 16px;display:grid}.output-row:hover,.output-row.selected{background:#202733}.file-badge{width:34px;height:34px;color:var(--accent);background:#10151b;border-radius:7px;place-items:center;display:grid}.row-main{min-width:0}.row-main strong,.row-main small{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.row-main small{margin-top:4px;font-size:12px}.status{border:1px solid var(--line);color:var(--soft);white-space:nowrap;background:#11161d;border-radius:999px;padding:5px 9px;font-size:12px}.status.approved{color:var(--accent);border-color:#62c98f73}.status.needs-review{color:var(--accent-2);border-color:#d6a54d73}.status.rejected{color:var(--danger);border-color:#ef6f6c73}.size{color:var(--muted);text-align:right;font-size:12px}.preview-panel{padding:18px}.preview-head{justify-content:space-between;align-items:start;gap:16px;display:flex}.preview-head h2{margin:0 0 14px;font-size:22px}.preview-box{border:1px solid var(--line);background:#0b0e13;border-radius:8px;place-items:center;min-height:330px;max-height:520px;display:grid;overflow:hidden}.preview-box img,.preview-box video,.preview-box iframe{object-fit:contain;border:0;width:100%;height:100%;max-height:520px}.preview-box iframe{background:#fff;min-height:520px}.preview-box pre{color:#d7dee8;white-space:pre-wrap;place-self:stretch stretch;margin:0;padding:18px;overflow:auto}.meta-grid{border-top:1px solid var(--line);grid-template-columns:120px minmax(0,1fr);gap:10px 14px;margin-top:18px;padding-top:18px;font-size:13px;display:grid}.path-text{overflow-wrap:anywhere}.activity-panel{border-top:1px solid var(--line);margin-top:18px;padding-top:18px}.activity-head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.activity-head span,.activity-item small,.empty-activity{color:var(--muted);font-size:12px}.activity-list{gap:10px;display:grid}.activity-item{grid-template-columns:12px minmax(0,1fr);align-items:start;gap:10px;display:grid}.activity-item strong,.activity-item small,.activity-item p{display:block}.activity-item small{margin-top:3px}.activity-item p{color:var(--soft);margin:5px 0 0;font-size:12px;line-height:1.45}.event-dot{background:var(--blue);border-radius:999px;width:9px;height:9px;margin-top:5px;box-shadow:0 0 0 4px #69a7ff1f}.event-dot.approved{background:var(--accent);box-shadow:0 0 0 4px #62c98f1f}.event-dot.rejected,.event-dot.deleted{background:var(--danger);box-shadow:0 0 0 4px #ef6f6c1f}.event-dot.archived,.event-dot.downloaded{background:var(--accent-2);box-shadow:0 0 0 4px #d6a54d1f}.actions{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.actions button,.actions a{align-items:center;gap:8px;min-height:38px;padding:8px 12px;display:inline-flex}.actions .primary-action{background:var(--accent);color:#07100b}.actions .danger{color:var(--danger)}.empty{min-height:50vh;color:var(--muted);place-items:center;display:grid}.login-shell{place-items:center;min-height:100vh;padding:24px;display:grid}.login-stack{justify-items:center;gap:16px;width:min(100%,380px);display:grid}.login-logo{width:56px;height:56px;font-size:21px}.login-panel{border:1px solid var(--line);background:#171b22eb;border-radius:8px;gap:16px;width:100%;padding:24px;display:grid;box-shadow:0 18px 60px #00000047}.login-panel p{color:var(--muted);text-transform:uppercase;margin:0 0 6px;font-size:13px}.login-panel h1{margin:0;font-size:26px;line-height:1.2}.login-panel label,.login-panel label span{gap:8px;display:grid}.login-panel label span{color:var(--soft);font-size:13px}.login-panel input{border:1px solid var(--line);width:100%;height:44px;color:var(--text);background:#10151b;border-radius:7px;outline:none;padding:0 12px}.login-panel input:focus{border-color:#62c98fb3;box-shadow:0 0 0 3px #62c98f1f}.login-error{color:var(--danger);background:#ef6f6c1a;border:1px solid #ef6f6c73;border-radius:7px;padding:10px 12px;font-size:13px}.login-panel button{background:var(--accent);color:#07100b;border:1px solid #62c98f73;border-radius:7px;height:44px;font-weight:700}@media (max-width:1080px){.shell,.content-grid{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--line)}.nav{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar{flex-direction:column;align-items:stretch}}@media (max-width:640px){.inbox,.sidebar{padding:16px}.nav{grid-template-columns:1fr}.output-row{grid-template-columns:34px minmax(0,1fr)}.output-row .status,.output-row .size{grid-column:2;justify-self:start}.meta-grid{grid-template-columns:1fr}}
