:root{--bg:#f2f0ea;--paper:#fffdf8;--ink:#1d1d1b;--muted:#6b685f;--line:#d6d1c5;--accent:#7f5a3a;--accent2:#405d49}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:linear-gradient(180deg,#f5f3ed 0,#ece7db 100%);color:var(--ink)}
header{padding:24px 28px;border-bottom:1px solid var(--line);background:rgba(255,253,248,.92);position:sticky;top:0;backdrop-filter:blur(8px);z-index:10}
h1{margin:0 0 8px;font-size:28px}header p{margin:0;color:var(--muted)}nav{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.tabbtn{border:1px solid var(--line);background:#fff;padding:10px 14px;cursor:pointer}.tabbtn.active{background:var(--ink);color:#fff;border-color:var(--ink)}
main{padding:24px;max-width:1440px;margin:0 auto}.tab{display:none}.tab.active{display:block}.grid{display:grid;grid-template-columns:280px 1fr;gap:20px}.side{background:var(--paper);border:1px solid var(--line);padding:14px;align-self:start;position:sticky;top:120px}.side button{width:100%;text-align:left;padding:10px 12px;margin:0 0 8px;border:1px solid var(--line);background:#fff;cursor:pointer}.side button.active{background:#f3ebe2;border-color:var(--accent)}
.panel{background:var(--paper);border:1px solid var(--line);padding:18px}.viewer{background:#fbfaf6;border:1px solid var(--line);padding:12px;margin-bottom:16px}.viewer-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:10px}.viewer-actions{display:flex;gap:8px;flex-wrap:wrap}.viewer-actions button{padding:8px 10px;border:1px solid var(--line);background:#fff;cursor:pointer}.viewer canvas{width:100%;height:480px;display:block;background:linear-gradient(180deg,#fcfbf7 0,#f0ece3 100%);border:1px solid var(--line)}.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}.shot{background:#fff;border:1px solid var(--line);padding:10px}.shot img{width:100%;display:block}.meta{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.chip{padding:5px 9px;background:#efe8dd;border:1px solid var(--line);font-size:12px}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px}.toolbar input,.toolbar select{padding:10px 12px;border:1px solid var(--line);background:#fff}.tablewrap{overflow:auto;border:1px solid var(--line);background:#fff}table{width:100%;border-collapse:collapse;font-size:14px}th,td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}th{position:sticky;top:0;background:#f8f4ec}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-bottom:18px}.card{background:var(--paper);border:1px solid var(--line);padding:14px}.layout{background:var(--paper);border:1px solid var(--line);padding:18px;margin-bottom:18px}.layout img{width:100%;display:block;border:1px solid var(--line);background:#fff}.small{font-size:12px;color:var(--muted)}a{color:var(--accent2)}
@media (max-width:980px){.grid{grid-template-columns:1fr}.side{position:static}}