:root{
    --ink:#181715; --muted:#625d52; --canvas:#f6f2ea; --paper:#fff;
    --border:#d8d0c2; --green:#236443; --green-tint:#e8f3ec;
    --accent:#174f4f; --accent-hover:#103e3e; --accent-tint:#e9f0ec;
    --raised-edge:#548080 #0c3434 #0c3434 #548080; --pressed-edge:#0c3434 #548080 #548080 #0c3434;
    --radius:4px; --max:1120px;
    --heading-copy-gap:10px; --section-copy-size:.875rem;
}
*{box-sizing:border-box}
html{scroll-padding-top:24px}
body{margin:0;color:var(--ink);background:var(--canvas);font:15px/1.6 ui-monospace,'SFMono-Regular',Consolas,'Liberation Mono',monospace}
button,input,textarea,select{font:inherit}
a{color:inherit;text-underline-offset:4px}
h1,h2,h3,p{margin:0}
h1,h2,h3{line-height:1.2}
h1{font-size:clamp(1.8rem,4vw,2.6rem);letter-spacing:-.045em;font-weight:700}
h2{font-size:1.2rem;letter-spacing:-.02em;font-weight:650}
h3{font-size:1.05rem;font-weight:600}
.wrap{width:min(var(--max),calc(100% - 64px));margin-inline:auto}
.skip-link{position:fixed;top:-100px;left:16px;z-index:10;background:white;padding:12px 20px}
.skip-link:focus{top:12px}
:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.admin-header{background:var(--paper);border-bottom:1px solid var(--border)}
.header-inner{min-height:82px;display:flex;align-items:center;gap:20px}
.wordmark{font-size:1.65rem;letter-spacing:-.065em;font-weight:750;text-decoration:none}
.wordmark-dot{color:var(--accent)}
.admin-label{border-left:1px solid var(--border);padding-left:20px;color:var(--muted);font-size:.8rem}
.header-inner nav{margin-left:auto;display:flex;gap:28px;font-size:.85rem}
.header-inner nav a{text-decoration:none;color:var(--muted)}
.header-inner nav a:hover{color:var(--ink)}
.header-inner nav a[aria-current]{color:var(--ink);text-decoration:underline;text-underline-offset:9px;text-decoration-thickness:2px}
.admin-main{padding-block:52px}
.eyebrow{font-size:.7rem;letter-spacing:.12em;font-weight:650;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.page-heading>p:not(.eyebrow){color:var(--muted);margin-top:18px;font-size:1rem}
.draft-label{display:inline-block;font-size:.72rem;border:1px solid var(--border);padding:3px 9px;border-radius:var(--radius);color:var(--muted);margin-top:20px}
.section-nav{display:flex;flex-wrap:wrap;gap:10px 28px;border-bottom:1px solid var(--border);padding-block:34px 20px;margin-bottom:28px}
.section-nav a{font-size:.85rem;color:var(--muted);text-decoration:none}
.section-nav a:hover{text-decoration:underline;color:var(--ink)}
.panel{min-width:0;background:var(--paper);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 2px 0 #18171508;padding:30px;margin-top:20px}
.section-title{display:flex;align-items:center;gap:14px}
.section-number{font:12px/1.4 ui-monospace,SFMono-Regular,monospace;color:var(--muted)}
.description{color:var(--muted);font-size:var(--section-copy-size);margin-top:var(--heading-copy-gap);margin-bottom:24px}
.heading-followup{margin-top:var(--heading-copy-gap)}
.swatches{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
.swatch{height:94px;border-radius:var(--radius);border:1px solid var(--border);margin-bottom:12px}
.swatch-ink{background:var(--ink)}
.swatch-canvas{background:var(--canvas)}
.swatch-paper{background:var(--paper)}
.swatch-green{background:var(--green)}
.swatch-accent{background:var(--accent)}
.swatches strong{display:block;font-size:.85rem;font-weight:600}
.swatches code{font-size:.75rem;color:var(--muted)}
.type-row{display:grid;grid-template-columns:1fr 200px;align-items:center;gap:30px;padding:22px 0;border-top:1px solid var(--border)}
.type-row:last-child{padding-bottom:0}
.title-sample{font-size:1.8rem;letter-spacing:-.035em;line-height:1.2;font-weight:650}
.hint{font-size:.78rem;color:var(--muted)}
.component-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
/* Filename Maker colours with ETL raised edges and a pressed state. */
.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;max-width:100%;padding:10px 16px;border:3px solid;border-color:var(--raised-edge);border-radius:2px;background:var(--accent);color:#fff;text-decoration:none;text-align:center;line-height:1.4;font-size:.8rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.button.secondary{background:#eee7da;color:var(--ink);border-color:#fffaf0 #a89e8c #a89e8c #fffaf0}
.button:hover:not(:disabled){background:var(--accent-hover);color:#fff}
.button.secondary:hover:not(:disabled){background:#e3dacb;color:var(--ink)}
.button:active:not(:disabled){border-color:var(--pressed-edge);transform:translateY(1px)}
.button.secondary:active:not(:disabled){border-color:#a89e8c #fffaf0 #fffaf0 #a89e8c}
.button:disabled{background:#eae5dc;border-color:#faf7f0 #ccc3b4 #ccc3b4 #faf7f0;color:#827b70;cursor:not-allowed}
.status-row{margin-top:24px}
.status{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;border-radius:var(--radius);font-size:.75rem;line-height:1.4;padding:5px 9px;background:#ece7dd;color:#625d52;font-weight:600}
.status>span{width:6px;height:6px;border-radius:50%;background:currentColor}
.status.published{background:var(--green-tint);color:var(--green)}
.notice{margin-top:24px;padding:16px 18px;border-left:3px solid var(--accent);background:var(--accent-tint);font-size:.85rem}
.notice strong{font-weight:600}
.notice p{margin-top:3px;color:var(--muted)}
.form-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.field{display:flex;flex-direction:column;gap:7px;min-width:0}
.field.full{grid-column:1/-1}
label{font-size:.85rem;font-weight:700}
label .hint{font-weight:400;margin-left:5px}
input:not([type=checkbox]),select,textarea{display:block;width:100%;min-width:0;min-height:44px;padding:10px 12px;border:1px solid #b6aa96;border-radius:var(--radius);box-shadow:inset 0 1px 2px #1817150a;background:white;color:var(--ink);font-size:.9rem}
textarea{resize:vertical}
input::placeholder,textarea::placeholder{color:var(--muted)}
input[type=checkbox]{width:18px;height:18px;margin:0;accent-color:var(--accent)}
.checkbox-field{justify-content:center}
.checkbox-field label{display:flex;align-items:center;gap:10px}
.table-panel{padding:0;overflow:hidden}
.table-heading{padding:30px 30px 0}
.table-scroll{overflow-x:auto}
.table-scroll:focus-visible{outline-offset:-4px}
table{width:100%;border-collapse:collapse;text-align:left;font-size:.85rem;white-space:nowrap}
thead{background:#ebe4d7;color:var(--ink);font-size:.75rem}
tbody{background:#fff}
tbody tr:nth-child(even){background:#faf7f0}
/* Admin tables always use one line per row; narrow screens scroll horizontally. */
th,td{padding:10px 16px;border:1px solid var(--border);max-width:480px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
th{font-weight:600}
.cell-note{display:inline;font-weight:400;font-size:.75rem;color:var(--muted);margin-left:12px}
.admin-footer{display:flex;justify-content:space-between;border-top:1px solid var(--border);padding-block:24px 36px;font-size:.75rem;color:var(--muted)}
@media(max-width:700px){
    .wrap{width:calc(100% - 32px)}
    .header-inner{flex-wrap:wrap;gap:12px;min-height:0;padding-block:18px}
    .header-inner nav{width:100%;margin-left:0;padding-top:8px;gap:24px}
    .admin-label{padding-left:12px}
    .admin-main{padding-block:32px}
    .panel{padding:22px}
    .swatches{grid-template-columns:1fr 1fr;gap:20px 16px}
    .swatch{height:84px}
    .type-row{grid-template-columns:1fr;gap:10px}
    .form-grid{grid-template-columns:1fr}
    .table-panel{padding:0}
    .table-heading{padding:22px 22px 0}
    th,td{padding:10px 16px}
    .section-title{gap:10px}
    .section-nav{gap:10px 22px}
}

/* Working admin components; forms use one full-width column at every size. */
[hidden]{display:none!important}
.icon{width:18px;height:18px;vertical-align:middle;flex:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.header-inner nav{align-items:center;flex-wrap:wrap;gap:20px}
.header-inner nav a{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.header-inner nav form{margin:0}
.nav-action{border:0;background:none;padding:0;font-size:.85rem;color:var(--muted);cursor:pointer}
.admin-title{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:28px}
.admin-title h1{font-size:2.2rem}
.admin-title p:not(.eyebrow){margin-top:12px;color:var(--muted)}
.admin-title .eyebrow{margin-bottom:8px}
.button{gap:10px;cursor:pointer}
.button.danger:not(:disabled){background:#9f2929;color:#fff;border-color:#d88b8b #651b1b #651b1b #d88b8b}
.button.danger:hover:not(:disabled){background:#7b2020}
.button.danger:active:not(:disabled){border-color:#651b1b #d88b8b #d88b8b #651b1b}
.panel>.field,.panel>form>.field{margin-top:20px}
.field small,.check-row small{display:block;font-size:.78rem;line-height:1.5;color:var(--muted)}
.field label:not(.check-row) span{font-weight:400;color:var(--muted);font-size:.78rem}
.field-row{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:20px}
.field-label{display:block;margin-block:16px 8px}
.file-input{font-size:.8rem!important}
.check-row{display:flex;align-items:flex-start;gap:10px;font-weight:700;line-height:1.45}
.check-row input{flex:none;margin-top:2px}
.check-row small{margin-top:5px;font-weight:400}
.editor-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.editor-layout .panel:first-child{margin-top:0}
.editor-aside{min-width:0}
.upload-preview,.player{aspect-ratio:16/9;overflow:hidden;background:#eee7da;border-radius:var(--radius);margin-block:18px}
.upload-preview img{display:block;width:100%;height:100%;object-fit:cover}
.player{position:relative}
.player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.code-field{font-family:ui-monospace,SFMono-Regular,monospace;font-size:.8rem}
.form-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:26px}
.form-actions>div,.dialog-actions{display:flex;gap:12px;flex-wrap:wrap}
#session-form>.panel:first-of-type{margin-top:0}
#session-form .upload-preview{max-width:480px}
#session-form .form-actions{justify-content:flex-start}
.settings-layout,.homepage-editor{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:start}
.settings-layout .panel,.homepage-editor .panel{margin-top:0}
.homepage-preview-title{font-size:1.3rem;margin-block:12px}
.homepage-help{margin:8px 0 0;color:var(--muted);font-size:.875rem;line-height:1.6}
.hero-preview{padding:28px;background:var(--canvas);margin-top:20px;border-radius:var(--radius)}
.hero-preview p:last-child{margin-top:15px;color:var(--muted)}
.preview-note{margin-top:20px;padding-top:16px;border-top:1px solid var(--border);color:var(--muted);font-size:.8rem}
.homepage-preview-link{display:inline-block;margin-top:15px;font-size:.85rem}
.table-wrap{overflow-x:auto}
.table-title{display:flex;align-items:center;gap:10px;width:440px;max-width:100%}
.table-title>div:last-child{display:flex;align-items:center;gap:12px;min-width:0}
.table-title a{display:block;min-width:0;max-width:420px;overflow:hidden;text-overflow:ellipsis;font-weight:600;text-decoration:none}
.table-title a:hover{text-decoration:underline}
.table-title small,.table-date small{font-size:.75rem;color:var(--muted)}
.table-title small{max-width:150px;overflow:hidden;text-overflow:ellipsis;flex-shrink:0}
.table-date small{margin-left:10px}
.mini-thumb{width:40px;aspect-ratio:16/9;flex:none;background:var(--canvas);border-radius:var(--radius);overflow:hidden}
.mini-thumb img{width:100%;height:100%;object-fit:cover}
.row-actions{display:flex;gap:16px;font-size:.8rem}
.table-action{margin:0}
.button.compact{min-height:30px;padding:4px 10px;font-size:.7rem;white-space:nowrap}
.featured-marker{display:inline-flex;align-items:center;gap:4px;vertical-align:middle;font-size:.7rem;color:var(--green);margin-left:10px}
.table-bottom{font-size:.8rem;color:var(--muted);padding:16px 24px;border-top:1px solid var(--border)}
.empty-state{text-align:center;padding:44px 24px}
.empty-state p{margin:12px 0 22px;color:var(--muted)}
.back-link{display:inline-block;margin-bottom:24px;font-size:.85rem;color:var(--muted)}
.form-message{margin:0 0 24px}
.notice.error{background:#fff0ef;border-color:#a52c2c;color:#822323}
.notice.error ul{margin-bottom:0}
.notice.error strong{font-weight:650}
.login-main{max-width:580px;padding-block:40px 60px}
.login-card h1{font-size:2rem;margin-bottom:16px}
.login-card>p:not(.eyebrow){color:var(--muted)}
.login-card form>.button{margin-top:26px;width:100%}
.login-card .form-message{margin-top:24px}
.login-card .field{margin-top:18px}
.js-only{display:none}
.js .js-only{display:inline-flex}
#preview-video{margin-top:16px}
.compact-notice{margin-top:15px}
input[type=hidden]{display:none}
input[type=file]{max-width:100%}
input[type=checkbox]{flex:none}
.users-table th,.users-table td{padding:10px 12px}
.admin-footer nav{text-align:right}
img{max-width:100%}
button:disabled{cursor:not-allowed}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
@media(max-width:1000px){.editor-layout,.settings-layout,.homepage-editor{grid-template-columns:1fr}.editor-aside{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}.editor-aside .panel{margin-top:0}.table-title a{max-width:300px}}
@media(max-width:700px){.admin-title{align-items:flex-start;flex-direction:column}.editor-aside,.field-row{grid-template-columns:1fr}.editor-aside .panel{margin-top:0}.form-actions{align-items:flex-start;flex-direction:column}.header-inner nav{font-size:.8rem;gap:16px}.login-main{padding-block:16px 36px}.admin-footer{gap:20px}.admin-title h1{font-size:2rem}.table-title a{max-width:230px}}

/* Main sections with account utilities aligned to the right. */
.view-site{margin-left:auto;gap:6px}
.view-site .icon{width:14px;height:14px}
.primary-nav{display:flex;align-items:stretch;gap:0;overflow-x:auto;background:var(--accent)}
.primary-nav a,.primary-nav .nav-action{display:block;padding:14px 18px;white-space:nowrap;border:0;border-bottom:3px solid transparent;text-decoration:none;font-size:.85rem;line-height:inherit;color:#fff;background:transparent}
.primary-nav a:hover,.primary-nav .nav-action:hover{background:var(--accent-hover)}
.primary-nav a:focus-visible,.primary-nav .nav-action:focus-visible{outline-color:#fff;outline-offset:-5px}
.primary-nav a[aria-current]{background:var(--accent-hover);border-color:#ff9b71;color:#fff;font-weight:700}
.nav-utilities{display:flex;align-items:stretch;margin-left:auto;flex-shrink:0}
.nav-utilities form{display:flex;margin:0}
.admin-section-options{display:grid;gap:16px;border:0;margin:22px 0;padding:0}
.admin-section-options legend{margin-bottom:16px;font-weight:700}
.section-note{margin-top:22px}
.upload-row,.import-selector{display:flex;flex-direction:column;align-items:stretch;gap:20px}
.upload-row .field,.import-selector .field{min-width:0}
.upload-row>.button,.import-selector>.button{align-self:flex-start}
.field-picker{border:0;padding:0;margin:0}
.field-picker legend{padding:0;font-size:var(--section-copy-size);font-weight:400;color:var(--muted);margin-bottom:16px}
.field-options{display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center}
.field-options .check-row{display:inline-flex;gap:8px;font-size:.8rem;overflow-wrap:anywhere;max-width:100%;margin:0}
.ninja-preview td{min-width:150px;max-width:350px;font-size:.8rem}
.primary-nav+.wrap{margin-top:0}
@media(max-width:760px){.primary-nav a{padding-inline:14px}.primary-nav a{font-size:.83rem}}
.ninja-data-heading{margin-top:28px;padding:20px 0 16px;border-top:3px solid var(--accent)}
.ninja-data-heading h2{color:var(--accent)}
.ninja-data-heading .description{margin-bottom:0}

/* Shared admin publication toggle: grey off, red on, with an accessible pressed state. */
.publication-action{display:inline-block;vertical-align:middle}
.button.live-toggle{background:#dedede;color:#333;border-color:#f5f5f5 #999 #999 #f5f5f5}
.button.live-toggle:hover:not(:disabled){background:#c9c9c9;color:#222}
.button.live-toggle[aria-pressed=true]{background:#a62b2b;color:#fff;border-color:#d77d7d #641919 #641919 #d77d7d}
.button.live-toggle[aria-pressed=true]:hover:not(:disabled){background:#852020;color:#fff}
.button.live-toggle:active:not(:disabled){border-color:#999 #f5f5f5 #f5f5f5 #999}
.button.live-toggle[aria-pressed=true]:active:not(:disabled){border-color:#641919 #d77d7d #d77d7d #641919}

/* Keep the row height stable when the selected stream’s button is hidden. */
.homepage-action{display:inline-flex;align-items:center;width:156px;height:30px;vertical-align:middle}
.homepage-action>.button{width:100%;height:30px;min-height:30px}

.streams-table{table-layout:fixed;min-width:780px}
.streams-table tbody tr[data-homepage=true]{background:#26784d;color:#fff}
.streams-table thead th:nth-child(2){width:100px}
.streams-table thead th:nth-child(3){width:190px}
.streams-table thead th:nth-child(4){width:210px}

/* Import comparisons share the admin panel, field and status components. */
.import-difference{margin-top:22px;padding-top:18px;border-top:1px solid var(--border)}
.import-difference>summary{cursor:pointer;font-weight:600;line-height:1.8}
.import-difference>summary .status{margin-left:12px}
.import-values{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin:18px 0}
.import-values dt{font-size:.8rem;color:var(--muted);font-weight:600}
.import-values dd{margin:0 0 12px;white-space:pre-wrap;overflow-wrap:anywhere;max-height:260px;overflow:auto;background:var(--canvas);padding:14px;border:1px solid var(--border);border-radius:var(--radius)}
.import-history{font-size:.85rem}
.import-history>summary{cursor:pointer}

.speaker-entry{border:1px solid var(--border);border-radius:var(--radius);padding:18px;margin:12px 0 18px}
.speaker-entry legend{font-size:.8rem;font-weight:700;padding:0 8px}
.speaker-entry>.button{margin-top:16px}

.speaker-entry>.field+.field{margin-top:18px}

/* One stage at a time; completed stages remain available for updates. */
.ninja-steps{display:flex;overflow-x:auto;border-bottom:1px solid var(--border);gap:0;margin-bottom:24px}
.ninja-steps>a,.ninja-steps>span{padding:14px 20px;white-space:nowrap;text-decoration:none;border-bottom:3px solid transparent;font-size:.85rem;font-weight:700}
.ninja-steps>a[aria-current=step]{border-bottom-color:var(--accent);background:var(--paper);color:var(--accent)}
.ninja-steps>a:hover{background:var(--accent-tint)}
.ninja-steps>span[aria-disabled]{color:var(--muted);font-weight:400}
.ninja-steps span[aria-label=Complete]{color:var(--green);margin-left:6px}
.panel>summary{cursor:pointer;font-weight:700}


.preview-records{display:grid;gap:16px}
.preview-records[hidden]{display:none}
.preview-record{min-width:0;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.preview-record h3{padding:12px 16px;background:var(--canvas);font-size:.85rem}
.preview-record dl{margin:0}
.preview-record-field{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);gap:16px;padding:12px 16px;border-top:1px solid var(--border);font-size:.8rem}
.preview-record-field dt{font-weight:600;color:var(--muted);overflow-wrap:anywhere}
.preview-record-field dd{min-width:0;margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:600px){.preview-record-field{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:12px;padding:10px 12px}.preview-record h3{padding:12px}}

.ninja-download-actions{display:grid;justify-items:start;gap:12px}
.ninja-download-actions form{margin:0;max-width:100%}
.button.ninja-action{gap:8px}
.ninja-action-icon{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;font-size:1rem;line-height:1;flex-shrink:0}
.ninja-action-success{margin-top:6px;overflow-wrap:anywhere}