/* =====================================================================
   Dreadsound Admin — minimal, functional, consistent with the public theme
   ===================================================================== */

:root{
    --void: #07050a;
    --ember: #120a08;
    --paper: #1a1410;
    --panel: #0f0a08;
    --bone: #e8dcc0;
    --bone-dim: #b8a887;
    --bone-faded: #6b5f4a;
    --blood-glow: #a82318;
    --ember-glow: #d14822;
    --brass: #9a7521;
    --brass-bright: #c9972c;
    --dub-green: #1a4a2f;
    --natty: #2e6b3e;
    --border: rgba(154,117,33,0.18);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{
    background:var(--void);
    color:var(--bone);
    font-family:'Outfit',sans-serif;
    font-weight:300;
    min-height:100vh;
    line-height:1.6;
}
a{color:var(--brass-bright);text-decoration:none}
a:hover{color:var(--ember-glow)}

/* ---- LOGIN ------------------------------------------------------- */
.login-wrap{
    min-height:100vh;
    display:flex;align-items:center;justify-content:center;
    padding:2rem;
    background:
        radial-gradient(ellipse at 30% 40%, rgba(26,74,47,0.25), transparent 60%),
        radial-gradient(ellipse at 70% 60%, rgba(168,35,24,0.2), transparent 55%),
        var(--void);
}
.login-card{
    width:100%;max-width:420px;
    background:var(--panel);
    border:1px solid var(--border);
    padding:3rem 2.5rem;
    border-radius:2px;
    box-shadow:0 30px 80px rgba(0,0,0,0.6);
}
.login-mark{
    width:48px;height:48px;border-radius:50%;
    background:conic-gradient(from 0deg, var(--dub-green) 0deg 120deg, var(--brass) 120deg 240deg, var(--ember-glow) 240deg 360deg);
    margin-bottom:2rem;
    box-shadow:0 0 30px rgba(209,72,34,0.4);
}
.login-card h1{
    font-family:'Gloock',serif;
    font-size:1.8rem;line-height:1.1;
    margin-bottom:0.4rem;
}
.login-card h1 em{font-family:'Fraunces',serif;font-style:italic;color:var(--ember-glow);font-weight:300}
.login-card p{color:var(--bone-dim);margin-bottom:2rem;font-size:0.9rem}

.flash{
    padding:0.8rem 1rem;margin-bottom:1.5rem;
    border-radius:2px;font-size:0.85rem;
    background:rgba(168,35,24,0.15);border:1px solid rgba(168,35,24,0.4);
    color:#f0a090;
}
.flash.ok{background:rgba(46,107,62,0.15);border-color:rgba(46,107,62,0.4);color:#a0dcb0}
.flash.warn{background:rgba(201,151,44,0.15);border-color:rgba(201,151,44,0.4);color:#f0d080}

.form-row{margin-bottom:1.2rem}
.form-row label{
    display:block;
    font-size:0.72rem;letter-spacing:0.2em;text-transform:uppercase;
    color:var(--bone-dim);margin-bottom:0.5rem;
}
.form-row input,.form-row select,.form-row textarea{
    width:100%;padding:0.8rem 1rem;
    background:var(--ember);
    border:1px solid var(--border);
    color:var(--bone);
    font-family:inherit;font-size:0.95rem;
    border-radius:2px;
    transition:border-color 0.2s, background 0.2s;
}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{
    outline:none;
    border-color:var(--ember-glow);
    background:var(--paper);
}
.form-row textarea{min-height:90px;resize:vertical;font-family:inherit}

.btn-submit{
    width:100%;padding:0.95rem;
    background:var(--ember-glow);color:var(--void);
    font-weight:600;letter-spacing:0.12em;text-transform:uppercase;
    font-size:0.8rem;border-radius:2px;
    transition:all 0.3s;cursor:pointer;border:none;
    font-family:inherit;
}
.btn-submit:hover{background:var(--brass-bright);transform:translateY(-2px);box-shadow:0 8px 24px rgba(209,72,34,0.35)}
.btn-submit:disabled{opacity:0.5;cursor:not-allowed;transform:none}

.login-footer{margin-top:2rem;text-align:center;font-size:0.8rem;color:var(--bone-faded)}

/* ---- DASHBOARD --------------------------------------------------- */
.admin-shell{display:flex;min-height:100vh}

.admin-side{
    width:240px;flex-shrink:0;
    background:var(--panel);
    border-right:1px solid var(--border);
    padding:1.5rem 0;
    position:sticky;top:0;height:100vh;
}
.admin-brand{
    padding:0 1.5rem 1.5rem;margin-bottom:1rem;
    border-bottom:1px solid var(--border);
    display:flex;align-items:center;gap:0.6rem;
    font-family:'Gloock',serif;font-size:1.15rem;
}
.admin-brand-mark{
    width:12px;height:12px;border-radius:50%;
    background:conic-gradient(from 0deg, var(--dub-green) 0deg 120deg, var(--brass) 120deg 240deg, var(--ember-glow) 240deg 360deg);
}
.admin-nav{list-style:none;margin-top:1rem}
.admin-nav li{}
.admin-nav a{
    display:flex;align-items:center;gap:0.7rem;
    padding:0.8rem 1.5rem;color:var(--bone-dim);
    font-size:0.9rem;transition:all 0.2s;
    border-left:2px solid transparent;
}
.admin-nav a:hover{background:rgba(154,117,33,0.06);color:var(--bone)}
.admin-nav a.active{
    background:rgba(209,72,34,0.08);
    color:var(--brass-bright);
    border-left-color:var(--ember-glow);
}
.admin-nav svg{width:16px;height:16px;flex-shrink:0;opacity:0.8}

.admin-user{
    position:absolute;bottom:1.5rem;left:1.5rem;right:1.5rem;
    padding-top:1rem;border-top:1px solid var(--border);
    font-size:0.78rem;color:var(--bone-faded);
}
.admin-user strong{display:block;color:var(--bone);margin-bottom:0.2rem}
.admin-user a{color:var(--blood-glow);font-size:0.75rem}

.admin-main{flex:1;padding:2.5rem 3rem;min-width:0}
.admin-header{
    display:flex;justify-content:space-between;align-items:flex-end;
    margin-bottom:2.5rem;gap:2rem;flex-wrap:wrap;
}
.admin-header h1{
    font-family:'Gloock',serif;font-size:2.2rem;line-height:1;
    letter-spacing:-0.02em;
}
.admin-header h1 em{font-family:'Fraunces',serif;font-style:italic;color:var(--ember-glow);font-weight:300}
.admin-header p{color:var(--bone-dim);font-size:0.9rem;margin-top:0.5rem;max-width:520px}

/* Stat cards */
.stats{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:1rem;margin-bottom:3rem;
}
.stat{
    padding:1.2rem 1.5rem;
    background:var(--panel);
    border:1px solid var(--border);border-radius:2px;
}
.stat-label{
    font-size:0.7rem;letter-spacing:0.22em;text-transform:uppercase;
    color:var(--bone-dim);margin-bottom:0.6rem;
}
.stat-value{
    font-family:'Gloock',serif;
    font-size:2rem;line-height:1;color:var(--brass-bright);
}
.stat-hint{font-size:0.78rem;color:var(--bone-faded);margin-top:0.3rem}

/* Section blocks */
.admin-block{
    background:var(--panel);
    border:1px solid var(--border);
    border-radius:2px;
    padding:2rem;margin-bottom:2rem;
}
.admin-block h2{
    font-family:'Fraunces',serif;font-weight:500;
    font-size:1.4rem;margin-bottom:1.5rem;
    padding-bottom:0.8rem;border-bottom:1px solid var(--border);
    display:flex;justify-content:space-between;align-items:center;
}
.admin-block h2 .count{
    font-family:'Outfit',sans-serif;font-size:0.75rem;
    letter-spacing:0.2em;text-transform:uppercase;
    color:var(--bone-dim);font-weight:400;
}

/* Upload dropzones */
.dropzone-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.dropzone{
    position:relative;
    border:2px dashed rgba(154,117,33,0.3);
    background:rgba(154,117,33,0.02);
    padding:2rem 1.5rem;text-align:center;
    min-height:220px;
    display:flex;flex-direction:column;justify-content:center;align-items:center;
    border-radius:3px;cursor:pointer;
    transition:all 0.25s;
}
.dropzone:hover{
    border-color:var(--ember-glow);
    background:rgba(209,72,34,0.04);
    transform:translateY(-3px);
}
.dropzone.drag{
    border-color:var(--ember-glow);
    background:rgba(209,72,34,0.08);
    border-style:solid;
}
.dropzone input[type=file]{display:none}
.dz-icon{
    width:54px;height:54px;border-radius:50%;
    background:rgba(154,117,33,0.1);
    border:1px solid var(--brass);
    display:flex;align-items:center;justify-content:center;
    margin-bottom:1.2rem;transition:all 0.25s;
}
.dropzone:hover .dz-icon{background:var(--ember-glow);border-color:var(--ember-glow);transform:scale(1.08)}
.dropzone:hover .dz-icon svg path,
.dropzone:hover .dz-icon svg circle{stroke:var(--void)}
.dz-icon svg{width:22px;height:22px}
.dz-icon svg path,.dz-icon svg circle{stroke:var(--brass-bright);stroke-width:1.5;fill:none;transition:stroke 0.25s}
.dz-title{font-family:'Fraunces',serif;font-size:1.25rem;font-weight:500;margin-bottom:0.4rem}
.dz-hint{font-size:0.8rem;color:var(--bone-dim);margin-bottom:1rem}
.dz-format{
    display:inline-flex;gap:0.5rem;align-items:center;
    padding:0.35rem 0.8rem;
    background:rgba(154,117,33,0.1);
    border-radius:2px;
    font-family:'Fraunces',serif;font-style:italic;
    font-size:0.75rem;color:var(--brass-bright);
}

/* Progress area */
.progress-list{margin-top:1rem}
.progress-list:empty{display:none}
.progress-list:not(:empty){
    margin-top:2rem;padding:1.5rem;
    background:rgba(232,220,192,0.02);
    border:1px solid var(--border);
    border-radius:2px;
}
.progress-heading{
    font-size:0.72rem;letter-spacing:0.25em;text-transform:uppercase;
    color:var(--ember-glow);margin-bottom:1rem;
    display:flex;align-items:center;gap:0.6rem;
}
.progress-heading::before{
    content:'';width:6px;height:6px;border-radius:50%;
    background:var(--ember-glow);animation:blink 1.4s infinite;
}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0.3}}

.progress-item{margin-bottom:1rem}
.progress-item:last-child{margin-bottom:0}
.progress-head{
    display:flex;justify-content:space-between;
    margin-bottom:0.4rem;font-size:0.85rem;gap:1rem;
}
.progress-name{
    font-family:'Fraunces',serif;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    flex:1;min-width:0;
}
.progress-name small{color:var(--bone-faded);font-family:inherit;font-style:italic;margin-left:0.5rem;font-size:0.75rem}
.progress-pct{
    font-variant-numeric:tabular-nums;
    color:var(--brass-bright);font-size:0.85rem;flex-shrink:0;
}
.progress-item.done .progress-pct{color:var(--natty)}
.progress-item.failed .progress-pct{color:var(--blood-glow)}
.progress-bar{
    height:3px;background:rgba(232,220,192,0.1);
    border-radius:2px;overflow:hidden;
}
.progress-fill{
    height:100%;
    background:linear-gradient(90deg, var(--dub-green), var(--brass-bright), var(--ember-glow));
    background-size:200% 100%;
    animation:shimmer 2s linear infinite;
    transition:width 0.3s;
}
@keyframes shimmer{0%{background-position:100% 0}100%{background-position:-100% 0}}
.progress-item.done .progress-fill{animation:none;background:var(--natty)}
.progress-item.failed .progress-fill{animation:none;background:var(--blood-glow)}

/* Tables for listing content */
.admin-table{width:100%;border-collapse:collapse;font-size:0.9rem}
.admin-table th,.admin-table td{
    padding:0.8rem 1rem;text-align:left;
    border-bottom:1px solid var(--border);
}
.admin-table th{
    font-size:0.7rem;letter-spacing:0.2em;text-transform:uppercase;
    color:var(--bone-dim);font-weight:500;
}
.admin-table tr:hover td{background:rgba(154,117,33,0.04)}
.admin-table .actions{text-align:right}
.admin-table .actions a{
    margin-left:0.8rem;font-size:0.82rem;
    color:var(--bone-dim);
}
.admin-table .actions a.delete{color:var(--blood-glow)}
.admin-table .actions a:hover{color:var(--bone)}
.admin-table .actions a.delete:hover{color:#ff6b4a}
.empty{padding:2rem 0;text-align:center;color:var(--bone-faded);font-style:italic}

.tag{
    display:inline-block;padding:0.15rem 0.6rem;
    font-size:0.7rem;letter-spacing:0.1em;text-transform:uppercase;
    border-radius:2px;font-weight:500;
}
.tag.ok{background:rgba(46,107,62,0.2);color:#a0dcb0}
.tag.warn{background:rgba(201,151,44,0.2);color:var(--brass-bright)}
.tag.bad{background:rgba(168,35,24,0.2);color:#f0a090}

/* ---- Responsive -------------------------------------------------- */
@media(max-width:960px){
    .admin-shell{flex-direction:column}
    .admin-side{
        width:100%;height:auto;position:relative;
        border-right:none;border-bottom:1px solid var(--border);
        padding:1rem 1.5rem;
    }
    .admin-brand{border-bottom:none;padding:0 0 0.8rem}
    .admin-nav{display:flex;overflow-x:auto;margin-top:0.5rem}
    .admin-nav a{padding:0.6rem 1rem;white-space:nowrap;border-left:none;border-bottom:2px solid transparent}
    .admin-nav a.active{border-left:none;border-bottom-color:var(--ember-glow)}
    .admin-user{position:static;margin-top:1rem;padding-top:1rem}
    .admin-main{padding:1.5rem}
    .dropzone-grid{grid-template-columns:1fr}
    .admin-table{font-size:0.85rem}
    .admin-table th:nth-child(3),.admin-table td:nth-child(3){display:none}
}

/* =====================================================================
   EDIT PAGES — preview, form grids, danger zone
   ===================================================================== */

.admin-breadcrumb{
    margin-bottom:1.5rem;
    font-size:0.75rem;letter-spacing:0.2em;text-transform:uppercase;
    color:var(--bone-faded);
}
.admin-breadcrumb a{color:var(--brass-bright);transition:color 0.2s}
.admin-breadcrumb a:hover{color:var(--ember-glow)}
.admin-breadcrumb span{margin:0 0.6rem;color:var(--bone-faded);opacity:0.5}

.admin-preview{
    background:var(--panel);
    border:1px solid var(--border);
    padding:2rem;
    margin-bottom:2rem;
    border-radius:2px;
}
.admin-preview-head{
    display:flex;justify-content:space-between;align-items:baseline;
    margin-bottom:1.5rem;padding-bottom:1rem;
    border-bottom:1px solid var(--border);
}
.admin-preview h3{
    font-family:'Fraunces',serif;font-weight:500;font-size:1.25rem;
}
.admin-preview-meta{
    font-size:0.75rem;letter-spacing:0.15em;text-transform:uppercase;
    color:var(--bone-dim);
}
.admin-preview audio,
.admin-preview video{
    width:100%;max-width:720px;display:block;
    border-radius:2px;background:var(--void);
}
.admin-preview audio{height:44px}
.admin-preview video{max-height:420px;background:#000}
.admin-preview .preview-image{
    max-width:720px;max-height:480px;
    object-fit:contain;display:block;
    background:var(--void);border:1px solid var(--border);
}
.admin-preview .no-preview{
    padding:2rem;text-align:center;
    color:var(--bone-faded);font-style:italic;
    background:rgba(154,117,33,0.05);
    border:1px dashed var(--border);border-radius:2px;
}

.form-row-grid{
    display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;
}
.form-row-grid .full{grid-column:1 / -1}

.checkbox-row{
    display:flex;align-items:center;gap:0.7rem;
    padding:0.3rem 0;
}
.checkbox-row input[type=checkbox]{
    width:18px;height:18px;
    accent-color:var(--ember-glow);
    cursor:pointer;margin:0;
}
.checkbox-row label{
    margin:0;font-size:0.9rem;letter-spacing:0;text-transform:none;
    color:var(--bone);cursor:pointer;
}

.form-toolbar{
    display:flex;gap:1rem;align-items:center;margin-top:2rem;
    padding-top:1.5rem;border-top:1px solid var(--border);
}
.btn-secondary{
    padding:0.9rem 1.5rem;
    background:transparent;color:var(--bone-dim);
    border:1px solid var(--border);
    font-size:0.78rem;letter-spacing:0.18em;text-transform:uppercase;
    font-weight:500;cursor:pointer;border-radius:2px;
    text-decoration:none;display:inline-block;
    transition:all 0.2s;font-family:inherit;
}
.btn-secondary:hover{color:var(--bone);border-color:var(--brass)}

.danger-zone{
    margin-top:3rem;padding:2rem;
    background:rgba(168,35,24,0.04);
    border:1px solid rgba(168,35,24,0.25);
    border-radius:2px;
}
.danger-zone h3{
    font-family:'Fraunces',serif;font-weight:500;font-size:1.2rem;
    margin-bottom:0.5rem;color:var(--blood-glow);
}
.danger-zone p{color:var(--bone-dim);margin-bottom:1.2rem;font-size:0.9rem}
.danger-zone button{
    padding:0.75rem 1.5rem;
    background:transparent;color:var(--blood-glow);
    border:1px solid var(--blood-glow);
    font-size:0.78rem;letter-spacing:0.18em;text-transform:uppercase;
    font-weight:600;cursor:pointer;border-radius:2px;
    transition:all 0.2s;font-family:inherit;
}
.danger-zone button:hover{background:var(--blood-glow);color:var(--bone)}

.admin-header-btn{
    padding:0.8rem 1.5rem;
    background:var(--ember-glow);color:var(--void);
    border:none;border-radius:2px;cursor:pointer;
    font-size:0.78rem;letter-spacing:0.15em;text-transform:uppercase;
    font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:0.5rem;
    transition:all 0.2s;font-family:inherit;
}
.admin-header-btn:hover{background:var(--brass-bright);transform:translateY(-2px)}

/* Table preview thumbs */
.thumb-mini{
    width:48px;height:48px;object-fit:cover;border-radius:2px;
    border:1px solid var(--border);
}

/* Status pills (re-used from tag class but with specific states) */
.pill-published{background:rgba(46,107,62,0.2);color:#a0dcb0;padding:0.15rem 0.6rem;border-radius:2px;font-size:0.7rem;letter-spacing:0.1em;text-transform:uppercase}
.pill-draft{background:rgba(154,117,33,0.2);color:var(--brass-bright);padding:0.15rem 0.6rem;border-radius:2px;font-size:0.7rem;letter-spacing:0.1em;text-transform:uppercase}
.pill-featured{background:rgba(209,72,34,0.2);color:var(--ember-glow);padding:0.15rem 0.6rem;border-radius:2px;font-size:0.7rem;letter-spacing:0.1em;text-transform:uppercase}

@media(max-width:960px){
    .form-row-grid{grid-template-columns:1fr}
    .admin-preview video,.admin-preview audio,.admin-preview .preview-image{max-width:100%}
}

/* =====================================================================
   FORMS v2 — rich, editorial, no more plain
   ===================================================================== */

.admin-block h2{
    display:flex;align-items:baseline;gap:0.8rem;
}

/* Section dividers inside forms */
.form-section{
    padding-bottom:1.6rem;
    margin-bottom:1.6rem;
    border-bottom:1px solid rgba(154,117,33,0.12);
}
.form-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}
.form-section-title{
    display:flex;align-items:center;gap:0.7rem;
    font-family:'Fraunces',serif;font-style:italic;font-weight:400;
    font-size:1.05rem;color:var(--brass-bright);
    margin-bottom:1.2rem;
    letter-spacing:0.01em;
}
.form-section-title .num{
    width:26px;height:26px;border-radius:50%;
    background:rgba(154,117,33,0.15);
    border:1px solid rgba(154,117,33,0.4);
    display:inline-flex;align-items:center;justify-content:center;
    font-family:'Gloock',serif;font-size:0.8rem;color:var(--brass-bright);font-style:normal;
}

/* Overriding the old .form-row — richer inputs */
.admin-main .form-row{margin-bottom:1.3rem}
.admin-main .form-row label{
    display:flex;align-items:center;gap:0.5rem;
    font-family:'Outfit',sans-serif;
    font-size:0.72rem;letter-spacing:0.22em;text-transform:uppercase;
    font-weight:600;
    color:var(--bone);
    margin-bottom:0.55rem;
}
.admin-main .form-row label .req{color:var(--ember-glow);font-weight:400}
.admin-main .form-row label small{
    font-family:'Fraunces',serif;font-style:italic;font-weight:400;
    text-transform:none;letter-spacing:0;
    color:var(--bone-faded);font-size:0.8rem;margin-left:auto;
}
.admin-main .form-row input[type=text],
.admin-main .form-row input[type=email],
.admin-main .form-row input[type=url],
.admin-main .form-row input[type=tel],
.admin-main .form-row input[type=number],
.admin-main .form-row input[type=date],
.admin-main .form-row input[type=time],
.admin-main .form-row select,
.admin-main .form-row textarea{
    width:100%;
    padding:0.95rem 1.1rem;
    background:linear-gradient(180deg, rgba(7,5,10,0.6), rgba(7,5,10,0.3));
    border:1px solid rgba(154,117,33,0.2);
    border-top-color:rgba(154,117,33,0.08);
    color:var(--bone);
    font-family:'Outfit',sans-serif;
    font-size:1rem;
    border-radius:2px;
    box-shadow:inset 0 1px 0 rgba(0,0,0,0.3);
    transition:border-color 0.2s, box-shadow 0.25s, background 0.2s;
}
.admin-main .form-row input::placeholder,
.admin-main .form-row textarea::placeholder{
    color:var(--bone-faded);font-style:italic;opacity:0.7;
}
.admin-main .form-row input:hover,
.admin-main .form-row select:hover,
.admin-main .form-row textarea:hover{
    border-color:rgba(154,117,33,0.4);
}
.admin-main .form-row input:focus,
.admin-main .form-row select:focus,
.admin-main .form-row textarea:focus{
    outline:none;
    border-color:var(--ember-glow);
    box-shadow:
        inset 0 1px 0 rgba(0,0,0,0.3),
        0 0 0 3px rgba(209,72,34,0.15),
        0 0 20px rgba(209,72,34,0.12);
    background:linear-gradient(180deg, rgba(18,10,8,0.8), rgba(7,5,10,0.5));
}

/* Select with custom arrow */
.admin-main .form-row select{
    appearance:none;-webkit-appearance:none;
    background-image:
        linear-gradient(180deg, rgba(7,5,10,0.6), rgba(7,5,10,0.3)),
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'><path d='M1 1l5 5 5-5' stroke='%23c9972c' stroke-width='1.5' stroke-linecap='round'/></svg>");
    background-repeat:no-repeat;
    background-position:right 1.2rem center, 0 0;
    background-size:12px 8px, 100% 100%;
    padding-right:2.8rem;
    cursor:pointer;
}

/* Checkbox with label — visual upgrade */
.admin-main .checkbox-row{
    display:flex;align-items:center;gap:0.8rem;
    padding:0.85rem 1rem;
    background:rgba(154,117,33,0.04);
    border:1px solid rgba(154,117,33,0.15);
    border-radius:2px;
    cursor:pointer;
    transition:all 0.2s;
}
.admin-main .checkbox-row:hover{
    background:rgba(154,117,33,0.08);
    border-color:rgba(154,117,33,0.3);
}
.admin-main .checkbox-row input[type=checkbox]{
    width:20px;height:20px;
    accent-color:var(--ember-glow);
    cursor:pointer;margin:0;flex-shrink:0;
}
.admin-main .checkbox-row label{
    margin:0;
    font-family:'Outfit',sans-serif;
    font-size:0.95rem;letter-spacing:0;text-transform:none;font-weight:400;
    color:var(--bone);cursor:pointer;flex:1;
}
.admin-main .checkbox-row label small{
    display:block;
    color:var(--bone-faded);font-size:0.82rem;
    margin-top:0.2rem;font-style:italic;
    font-family:'Fraunces',serif;
    letter-spacing:0;
}

/* Hint row */
.admin-main .form-row .hint{
    display:block;
    margin-top:0.45rem;
    font-family:'Fraunces',serif;font-style:italic;
    font-size:0.82rem;color:var(--bone-faded);
    letter-spacing:0;text-transform:none;font-weight:400;
}
.admin-main .form-row .err{
    display:block;
    margin-top:0.45rem;
    font-family:'Fraunces',serif;font-style:italic;
    color:#f0a090;font-size:0.82rem;
    letter-spacing:0;text-transform:none;font-weight:400;
}

/* Bigger, more present primary button */
.admin-main .btn-submit{
    display:inline-flex;align-items:center;gap:0.6rem;
    padding:1.05rem 2.2rem;
    background:linear-gradient(180deg, var(--ember-glow), #b83818);
    color:var(--void);
    border:none;
    border-radius:2px;
    box-shadow:
        0 4px 18px rgba(209,72,34,0.3),
        inset 0 1px 0 rgba(255,255,255,0.15);
    font-family:'Outfit',sans-serif;
    font-size:0.78rem;letter-spacing:0.22em;text-transform:uppercase;font-weight:700;
    cursor:pointer;transition:all 0.25s;
    width:auto;
}
.admin-main .btn-submit:hover{
    transform:translateY(-1px);
    box-shadow:
        0 6px 24px rgba(209,72,34,0.45),
        inset 0 1px 0 rgba(255,255,255,0.2);
}
.admin-main .btn-submit:active{transform:translateY(0)}

/* Replace-file panel — integrated into preview block */
.replace-panel{
    margin-top:1.5rem;
    padding:1.5rem;
    background:rgba(154,117,33,0.04);
    border:1px dashed rgba(154,117,33,0.3);
    border-radius:2px;
}
.replace-panel-head{
    display:flex;align-items:center;gap:0.7rem;
    margin-bottom:1rem;
    font-family:'Fraunces',serif;font-style:italic;
    color:var(--brass-bright);font-size:1rem;
}
.replace-panel-head svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.5}
.replace-panel p{
    color:var(--bone-dim);font-size:0.88rem;
    margin-bottom:1rem;line-height:1.55;
}
.replace-panel p strong{color:var(--brass-bright);font-weight:500}
.replace-panel-form{
    display:flex;gap:0.8rem;align-items:center;flex-wrap:wrap;
}
.replace-file-input{
    flex:1;min-width:200px;
    padding:0.75rem 0.9rem;
    background:var(--void);
    border:1px solid var(--border);
    color:var(--bone);
    font-family:'Outfit',sans-serif;font-size:0.9rem;
    border-radius:2px;cursor:pointer;
}
.replace-file-input::file-selector-button{
    padding:0.4rem 1rem;
    background:rgba(154,117,33,0.15);
    border:1px solid rgba(154,117,33,0.4);
    color:var(--brass-bright);
    font-family:'Outfit',sans-serif;font-size:0.72rem;
    letter-spacing:0.15em;text-transform:uppercase;font-weight:600;
    border-radius:2px;cursor:pointer;margin-right:1rem;
    transition:all 0.2s;
}
.replace-file-input::file-selector-button:hover{
    background:var(--ember-glow);color:var(--void);border-color:var(--ember-glow);
}
.replace-btn{
    padding:0.8rem 1.4rem;
    background:transparent;
    border:1px solid var(--brass);
    color:var(--brass-bright);
    font-family:'Outfit',sans-serif;
    font-size:0.72rem;letter-spacing:0.2em;text-transform:uppercase;
    font-weight:600;border-radius:2px;cursor:pointer;
    transition:all 0.2s;
}
.replace-btn:hover{
    background:var(--brass);color:var(--void);border-color:var(--brass);
}
.replace-btn:disabled{opacity:0.5;cursor:not-allowed}

/* Admin-preview-head: give it a stronger typographic hierarchy */
.admin-preview h3{
    font-family:'Gloock',serif;font-weight:400;
    font-size:1.3rem;letter-spacing:-0.01em;
    color:var(--bone);
    display:flex;align-items:center;gap:0.6rem;
}
.admin-preview h3 svg{
    width:20px;height:20px;
    stroke:var(--brass-bright);fill:none;stroke-width:1.3;
}

/* File-meta chip inside preview */
.file-meta{
    display:inline-flex;gap:0.5rem;align-items:center;
    margin-top:0.8rem;padding:0.35rem 0.7rem;
    background:rgba(7,5,10,0.5);
    border:1px solid var(--border);
    border-radius:2px;
    font-family:'Fraunces',serif;font-style:italic;
    font-size:0.8rem;color:var(--bone-faded);
    letter-spacing:0;
}
.file-meta code{
    font-family:'Fraunces',serif;font-style:italic;
    color:var(--brass-bright);
    background:transparent;padding:0;
}

/* =====================================================================
   SETTINGS PAGE
   ===================================================================== */

.settings-nav{
    display:flex;flex-wrap:wrap;gap:0.4rem;
    margin-bottom:2rem;padding:0.5rem;
    background:var(--panel);
    border:1px solid var(--border);
    border-radius:2px;
    position:sticky;top:0;z-index:10;
    backdrop-filter:blur(8px);
}
.settings-nav a{
    padding:0.55rem 1rem;
    font-family:'Outfit',sans-serif;
    font-size:0.72rem;letter-spacing:0.18em;text-transform:uppercase;
    font-weight:600;
    color:var(--bone-dim);
    border-radius:2px;
    transition:all 0.2s;
    text-decoration:none;
}
.settings-nav a:hover{
    color:var(--ember-glow);
    background:rgba(209,72,34,0.08);
}

/* Image cards — side by side on wide screens */
.settings-images-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(420px, 1fr));
    gap:1.5rem;
}
.settings-image-card{
    background:rgba(7,5,10,0.4);
    border:1px solid var(--border);
    border-radius:2px;
    padding:1.5rem;
}
.settings-image-card .form-section-title{
    margin-bottom:1rem;
}
.settings-image-preview{
    margin-bottom:1.2rem;
    padding:1rem;
    background:var(--void);
    border:1px solid var(--border);
    border-radius:2px;
    text-align:center;
    min-height:200px;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.settings-image-preview img{
    max-width:100%;
    max-height:340px;
    object-fit:contain;
    border-radius:2px;
}
.settings-image-preview .file-meta{margin-top:0.8rem}
.settings-image-preview .no-preview{
    padding:3rem 1rem;
    color:var(--bone-faded);
    font-family:'Fraunces',serif;font-style:italic;font-size:0.95rem;
    background:transparent;
    border:1px dashed var(--border);
    width:100%;
}

@media(max-width:860px){
    .settings-images-grid{grid-template-columns:1fr}
    .settings-nav{position:relative;top:auto}
}

/* =====================================================================
   MOBILE RESPONSIVE — sidebar collapses to hamburger
   ===================================================================== */

.admin-menu-toggle{
    display:none;
    position:fixed;top:1rem;left:1rem;z-index:60;
    width:44px;height:44px;border-radius:2px;
    background:rgba(7,5,10,0.85);
    border:1px solid var(--brass);
    color:var(--brass-bright);
    cursor:pointer;
    backdrop-filter:blur(8px);
    align-items:center;justify-content:center;
    transition:background 0.2s;
}
.admin-menu-toggle:hover{background:var(--ember-glow);color:var(--void)}
.admin-menu-toggle svg{width:22px;height:22px;pointer-events:none}

.admin-sidebar-backdrop{
    display:none;
    position:fixed;inset:0;z-index:40;
    background:rgba(7,5,10,0.7);
    backdrop-filter:blur(4px);
    opacity:0;transition:opacity 0.3s;
}

@media (max-width: 960px) {
    .admin-shell {
        grid-template-columns: 1fr !important;
    }
    .admin-side {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        width: 280px;
        z-index: 50;
        transform: translateX(-100%);
        transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
        box-shadow: 8px 0 30px rgba(0,0,0,0.5);
        overflow-y: auto;
    }
    .admin-shell.sidebar-open .admin-side {
        transform: translateX(0);
    }
    .admin-shell.sidebar-open .admin-sidebar-backdrop,
    .admin-shell.sidebar-open ~ .admin-sidebar-backdrop {
        display: block;
        opacity: 1;
    }
    .admin-menu-toggle {
        display: inline-flex;
    }
    .admin-main {
        padding: 4.5rem 1.2rem 2rem !important;
    }
    .admin-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    .admin-header h1 {
        font-size: 2rem !important;
    }
    .admin-header-btn {
        font-size: 0.72rem;
    }
    .stats {
        grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
        gap: 0.7rem;
    }
    .stat-value {
        font-size: 2rem !important;
    }
    .admin-block {
        padding: 1.5rem 1rem !important;
    }
    /* Tables horizontally scrollable on small screens */
    .admin-table {
        font-size: 0.85rem;
    }
    .admin-block {
        overflow-x: auto;
    }
    .admin-table thead th,
    .admin-table tbody td {
        padding: 0.7rem 0.5rem;
    }
    .admin-table .actions {
        white-space: nowrap;
    }
    /* Form grids become single column */
    .form-row-grid {
        grid-template-columns: 1fr !important;
        gap: 1rem;
    }
    .dropzone-grid {
        grid-template-columns: 1fr;
    }
    .settings-images-grid {
        grid-template-columns: 1fr;
    }
    /* Sticky save bar — keep bottom but allow content scroll */
    .form-toolbar {
        flex-direction: column;
        align-items: stretch;
    }
    .form-toolbar button, .form-toolbar a {
        text-align: center;
    }
    .admin-breadcrumb {
        font-size: 0.65rem;
    }
}

/* Empty thumbnail visuals — icons instead of flat gradient */
.thumb-mini.thumb-empty{
    display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg, rgba(26,74,47,0.4), rgba(107,20,16,0.4));
    color:var(--bone-faded);
    opacity:0.6;
}
.thumb-mini.thumb-empty svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.3}

/* =====================================================================
   UPLOAD PROGRESS OVERLAY — replace-panel submissions
   ===================================================================== */

.upload-overlay{
    position:fixed;inset:0;z-index:500;
    background:rgba(7,5,10,0.88);
    backdrop-filter:blur(12px);
    display:none;align-items:center;justify-content:center;
    padding:2rem;
    opacity:0;transition:opacity 0.25s;
}
.upload-overlay.active{display:flex;opacity:1}

.upload-overlay-box{
    width:100%;max-width:520px;
    background:linear-gradient(180deg, rgba(26,20,16,0.95), rgba(18,10,8,0.95));
    border:1px solid var(--brass);
    box-shadow:0 30px 80px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.04);
    padding:2.2rem;border-radius:2px;
}

.upload-overlay-head{
    border-bottom:1px solid rgba(154,117,33,0.2);
    padding-bottom:1rem;margin-bottom:1.5rem;
}
.upload-overlay-title{
    font-family:'Gloock',serif;font-weight:400;
    font-size:1.4rem;color:var(--bone);
    margin-bottom:0.3rem;
}
.upload-overlay-file{
    font-family:'Fraunces',serif;font-style:italic;
    font-size:0.95rem;color:var(--bone-dim);
    word-break:break-all;
}

.upload-progress-bar{
    height:10px;background:rgba(7,5,10,0.7);
    border:1px solid var(--border);
    border-radius:6px;overflow:hidden;
    box-shadow:inset 0 1px 0 rgba(0,0,0,0.4);
    margin-bottom:1rem;
}
.upload-progress-fill{
    height:100%;width:0%;
    background:linear-gradient(90deg, var(--brass-bright), var(--ember-glow));
    transition:width 0.2s ease-out;
    border-radius:5px;
    box-shadow:0 0 12px rgba(209,72,34,0.6);
    position:relative;
}

/* Subtle moving stripes when processing */
.upload-overlay-box.processing .upload-progress-fill{
    background:
        repeating-linear-gradient(
            45deg,
            var(--ember-glow) 0 10px,
            var(--brass) 10px 20px
        );
    animation:upload-stripes 1.2s linear infinite;
}
@keyframes upload-stripes{
    from { background-position: 0 0; }
    to   { background-position: 28px 0; }
}

.upload-overlay-status{
    display:flex;justify-content:space-between;align-items:baseline;
    margin-bottom:1.2rem;
}
.upload-pct{
    font-family:'Outfit',sans-serif;font-weight:600;
    font-size:1.6rem;color:var(--brass-bright);
    font-variant-numeric:tabular-nums;letter-spacing:0.02em;
}
.upload-phase{
    font-family:'Fraunces',serif;font-style:italic;
    font-size:0.95rem;color:var(--bone-dim);
    text-align:right;
}
.upload-overlay-box.processing .upload-phase::before{
    content:'';display:inline-block;
    width:12px;height:12px;border-radius:50%;
    border:2px solid rgba(201,151,44,0.25);
    border-top-color:var(--brass-bright);
    margin-right:0.5rem;vertical-align:middle;
    animation:upload-spin 0.8s linear infinite;
}
@keyframes upload-spin{to{transform:rotate(360deg)}}

.upload-overlay-box.error{
    border-color:var(--blood-glow);
}
.upload-overlay-box.error .upload-progress-fill{
    background:var(--blood-glow);
    animation:none;
}
.upload-overlay-box.error .upload-phase{
    color:#f0a090;
}
.upload-overlay-box.error .upload-phase::before{display:none}

.upload-overlay-hint{
    font-family:'Fraunces',serif;font-style:italic;
    font-size:0.82rem;color:var(--bone-faded);
    line-height:1.5;
    padding-top:1rem;border-top:1px solid rgba(154,117,33,0.1);
}