*{box-sizing:border-box;margin:0;padding:0}
:root{
  --accent:#8b6f47;--accent-d:#6b5435;--accent-l:#f0e9df;
  --green:#22c55e;--red:#ef4444;--orange:#f59e0b;--blue:#4361ee;
  --g50:#fafaf9;--g100:#f5f5f4;--g200:#e7e5e4;--g300:#d6d3d1;
  --g500:#78716c;--g700:#44403c;--g900:#1c1917;
  --r:6px;--r-lg:10px;
}
body{font-family:-apple-system,BlinkMacSystemFont,'Inter','Segoe UI',system-ui,sans-serif;background:var(--g50);color:var(--g900);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-d)}

/* Login */
.login-page{background:linear-gradient(135deg,#1c1917,#292524);display:flex;align-items:center;justify-content:center;min-height:100vh}
.login-box{background:#fff;border-radius:12px;padding:40px;width:100%;max-width:400px;box-shadow:0 24px 80px rgba(0,0,0,.4)}
.login-box h1{text-align:center;font-size:22px;margin-bottom:4px}
.login-box .subtitle{text-align:center;color:var(--g500);font-size:13px;margin-bottom:24px}

/* Topbar */
.topbar{background:#fff;border-bottom:1px solid var(--g200);color:var(--g900);padding:0 24px;height:60px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100}
.topbar .logo{color:var(--accent);font-weight:600;font-size:16px;font-family:'Cormorant Garamond',serif;letter-spacing:.02em}
.topbar .logo:hover{color:var(--accent-d)}
.nav-actions{display:flex;gap:8px;align-items:center}
.page-info{display:flex;align-items:center;gap:16px;flex:1;justify-content:center}
.page-title{font-weight:500;color:var(--g700)}
.preview-link{font-size:12px;color:var(--accent);padding:4px 10px;border:1px solid var(--accent-l);border-radius:var(--r);transition:all .15s}
.preview-link:hover{background:var(--accent-l)}

/* Container */
.container{max-width:1200px;margin:0 auto;padding:24px}
.edit-main{max-width:1400px;margin:0 auto;padding:24px}

/* Toolbar */
.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:12px}
.filters{display:flex;gap:8px}
.filters select{padding:6px 12px;border:1px solid var(--g200);border-radius:var(--r);font-size:13px;background:#fff}

/* Table */
.table{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--r-lg);overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.04);border:1px solid var(--g200)}
.table th{background:var(--g100);padding:12px 16px;text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--g500);font-weight:600}
.table td{padding:14px 16px;border-top:1px solid var(--g100)}
.table tr:hover td{background:var(--g50)}
.table a{font-weight:500;color:var(--g900)}
.table a:hover{color:var(--accent)}
.table code{background:var(--g100);padding:2px 8px;border-radius:4px;font-size:12px;color:var(--g700);font-family:'SF Mono',Monaco,Consolas,monospace}
.table .empty{text-align:center;color:var(--g500);padding:48px}
tr.needs-rebuild{background:#fefce8}
tr.needs-rebuild:hover td{background:#fef9c3}

/* Badges */
.badge{display:inline-block;padding:3px 10px;border-radius:10px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}
.badge-page{background:#dbeafe;color:#1d4ed8}
.badge-article{background:#ffedd5;color:#c2410c}
.badge-painting{background:#f3e8ff;color:#7c3aed}
.badge-artist{background:#dcfce7;color:#15803d}
.badge-draft{background:var(--g100);color:var(--g500)}
.badge-published{background:#dcfce7;color:#15803d}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border:1px solid var(--g300);background:#fff;color:var(--g700);border-radius:var(--r);font-size:13px;font-weight:500;cursor:pointer;text-decoration:none;transition:all .15s;font-family:inherit}
.btn:hover{background:var(--g50);border-color:var(--g500)}
.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-primary:hover{background:var(--accent-d);border-color:var(--accent-d);color:#fff}
.btn-danger{background:var(--red);color:#fff;border-color:var(--red);padding:6px 12px}
.btn-danger:hover{background:#dc2626;border-color:#dc2626;color:#fff}
.btn-outline{background:transparent;border:1px solid var(--g300)}
.btn-outline:hover{background:var(--g100)}
.btn-text{background:none;border:none;color:var(--g500)}
.btn-text:hover{background:var(--g100);color:var(--g900)}
.btn-sm{padding:7px 12px;font-size:12px}
.btn-full{width:100%;justify-content:center}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-xs{padding:4px 10px;font-size:11px;border:1px dashed var(--g300);background:transparent;color:var(--g500);border-radius:var(--r);cursor:pointer}
.btn-xs:hover{background:var(--g100);color:var(--g700);border-style:solid}

/* Forms */
.field{margin-bottom:14px}
.field label{display:block;margin-bottom:6px;font-weight:500;font-size:12px;color:var(--g700);text-transform:uppercase;letter-spacing:.3px}
.field input,.field select,.field textarea{width:100%;padding:10px 12px;border:1px solid var(--g200);border-radius:var(--r);font-size:14px;font-family:inherit;background:#fff;color:var(--g900);transition:all .15s}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(139,111,71,.1)}
textarea.code{font-family:'SF Mono',Monaco,Consolas,monospace;font-size:13px;line-height:1.6;tab-size:2}
.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:8px}
@media(max-width:768px){.form-grid-2,.form-grid-4{grid-template-columns:1fr}}

/* Messages */
.msg{padding:12px 16px;border-radius:var(--r);margin-bottom:16px;font-weight:500;font-size:13px;border:1px solid transparent}
.msg-error{background:#fef2f2;color:#991b1b;border-color:#fecaca}
.msg-success{background:#f0fdf4;color:#166534;border-color:#bbf7d0}
.msg-info{background:#eff6ff;color:#1d4ed8;border-color:#bfdbfe}
.hidden{display:none}
.help{display:block;margin-top:4px;font-size:11px;color:var(--g500)}

/* Save status */
.save-status{font-size:12px;padding:4px 10px;border-radius:var(--r);font-weight:500;min-width:0;opacity:0;transition:opacity .2s}
.save-status.info{background:#eff6ff;color:#1d4ed8;opacity:1}
.save-status.success{background:#f0fdf4;color:#166534;opacity:1}
.save-status.error{background:#fef2f2;color:#991b1b;opacity:1}

/* Build indicator */
.build-indicator{font-size:12px;color:var(--accent);animation:pulse 1.5s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}

/* Accordion */
details{margin-top:16px}
details summary{cursor:pointer;font-weight:600;color:var(--g500);padding:8px 0;font-size:13px}
details[open] summary{margin-bottom:8px}

/* Edit page layout */
.edit-body{background:var(--g50)}
.edit-grid{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start}
@media(max-width:1024px){.edit-grid{grid-template-columns:1fr}}
.edit-sections{background:#fff;border-radius:var(--r-lg);padding:24px;border:1px solid var(--g200)}
.edit-sections-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--g200)}
.edit-sections-header h2{font-size:18px;font-weight:600;color:var(--g900)}
.edit-sidebar{background:#fff;border-radius:var(--r-lg);padding:20px;border:1px solid var(--g200);position:sticky;top:80px}
.edit-sidebar h3{font-size:13px;color:var(--g500);text-transform:uppercase;letter-spacing:.3px;margin-bottom:12px;font-weight:600}

/* Add section menu */
.add-section-wrap{position:relative}
.add-section-menu{position:absolute;top:100%;right:0;margin-top:8px;background:#fff;border:1px solid var(--g200);border-radius:var(--r-lg);box-shadow:0 8px 24px rgba(0,0,0,.12);padding:6px;min-width:240px;display:none;z-index:50}
.add-section-menu.open{display:block}
.add-section-menu button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:none;background:none;text-align:left;font-size:13px;color:var(--g700);cursor:pointer;border-radius:var(--r);font-family:inherit}
.add-section-menu button:hover{background:var(--accent-l);color:var(--accent-d)}
.add-section-menu .icon{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;background:var(--g100);border-radius:50%;font-size:14px;color:var(--accent)}

/* Blocks */
.blocks-container{display:flex;flex-direction:column;gap:12px}
.blocks-empty,.blocks-loading,.blocks-error{padding:48px;text-align:center;color:var(--g500);background:var(--g50);border-radius:var(--r-lg);border:2px dashed var(--g200);font-size:13px}
.blocks-error{color:var(--red);border-color:var(--red)}

.block{background:#fff;border:1px solid var(--g200);border-radius:var(--r-lg);overflow:hidden;transition:border-color .15s}
.block:hover{border-color:var(--g300)}
.block-header{display:flex;align-items:center;gap:12px;padding:14px 16px;background:var(--g50);border-bottom:1px solid var(--g200);cursor:pointer;user-select:none}
.block-header:hover{background:var(--g100)}
.block-icon{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;background:var(--accent-l);color:var(--accent);border-radius:50%;font-size:14px;flex-shrink:0;font-family:'Cormorant Garamond',serif;font-weight:600}
.block-label{font-weight:600;color:var(--g900);font-size:14px}
.block-summary{color:var(--g500);font-size:13px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.block-actions{display:flex;gap:4px;flex-shrink:0}
.block-actions button{border:1px solid var(--g300);background:#fff;color:var(--g500);width:28px;height:28px;border-radius:var(--r);font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:all .15s;padding:0}
.block-actions button:hover{background:var(--g100);color:var(--g900);border-color:var(--g500)}
.block-actions button[data-act="remove"]:hover{background:#fef2f2;color:var(--red);border-color:var(--red)}

.block-body{padding:20px 20px 12px;transition:all .2s}
.block-body.collapsed{display:none}

/* Fields inside blocks */
.f{margin-bottom:14px}
.f > label{display:block;font-size:11px;font-weight:600;color:var(--g500);text-transform:uppercase;letter-spacing:.4px;margin-bottom:6px}
.f > input,.f > textarea,.f > select{width:100%;padding:10px 12px;border:1px solid var(--g200);border-radius:var(--r);font-size:14px;font-family:inherit;background:#fff;color:var(--g900);transition:all .15s}
.f > textarea{resize:vertical;min-height:70px;line-height:1.5}
.f > input:focus,.f > textarea:focus,.f > select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(139,111,71,.1)}

/* List fields (repeating items) */
.f-list > .list-items{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}
.list-item{border:1px solid var(--g200);border-radius:var(--r);background:var(--g50)}
.list-item-header{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;background:var(--g100);border-bottom:1px solid var(--g200);border-radius:var(--r) var(--r) 0 0;font-size:12px;font-weight:600;color:var(--g700)}
.list-item-actions{display:flex;gap:4px}
.list-item-actions button{width:24px;height:24px;border:1px solid var(--g300);background:#fff;color:var(--g500);border-radius:4px;font-size:10px;cursor:pointer;padding:0;display:inline-flex;align-items:center;justify-content:center}
.list-item-actions button:hover{background:var(--g200);color:var(--g900)}
.list-item-actions button[data-act="item-remove"]:hover{background:#fef2f2;color:var(--red);border-color:var(--red)}
.list-item-fields{padding:12px;background:#fff}

/* Nested list indentation */
.list-item-fields .f-list{padding:8px;background:var(--g50);border-radius:var(--r);margin-top:4px}

/* Media */
.media-section{margin-top:32px;padding-top:24px;border-top:1px solid var(--g200)}
.media-section h3{margin-bottom:12px;font-size:15px}
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;margin-top:12px}
.media-item{position:relative;aspect-ratio:1;border-radius:var(--r);overflow:hidden;cursor:pointer;border:2px solid transparent;transition:border-color .15s}
.media-item img{width:100%;height:100%;object-fit:cover}
.media-item:hover{border-color:var(--accent)}
.media-item .name{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.7);color:#fff;padding:4px 8px;font-size:10px;word-break:break-all}
.media-item.copied{border-color:var(--green)}
