.colour-lab{max-width:1440px;margin:0 auto;padding:40px 42px 60px}.lab-colour-heading{position:relative;padding-bottom:30px}.lab-colour-heading h1{font-size:35px;color:#ded7bf}.lab-colour-heading>p{font-size:12px;color:#89977e;line-height:1.8}.lab-colour-heading>a{position:absolute;bottom:38px;right:0;font-size:12px;color:#b5a783;border-bottom:1px solid #797653;padding:8px 0}.lab-colour-heading .folio{color:#859378}.palette-workbench{display:grid;grid-template-columns:345px minmax(0,1fr);border:1px solid #414d35;min-height:750px}.palette-controls{background:#10180f;padding:25px 27px;border-right:1px solid #414d35}.lab-control-index{font-size:10px;letter-spacing:1px;color:#c1b089;margin:8px 0 20px}.palette-controls label{font-size:11px;color:#a6b196;line-height:1.9}.palette-controls select{width:100%;padding:10px;background:#0a100a;color:#c9d1ba;border:1px solid #505c41;margin-top:8px;font-size:12px;min-width:0}.palette-controls .palette-help{font-size:10px;color:#829176;line-height:1.9;margin:14px 0}.palette-help+div{margin-bottom:26px}#palette-object-preview{display:flex;align-items:center;gap:18px;padding:19px 0}#palette-object-preview img{width:85px;height:100px;object-fit:contain}#palette-object-preview p{font-size:10px;color:#89947c;line-height:1.9}#palette-object-preview a{color:#c3b38c}#source-swatches{display:flex;gap:8px;flex-wrap:wrap}#source-swatches button{width:calc(25% - 6px);min-height:53px;background:var(--swatch);color:var(--text);border:1px solid #a3a38c;font:8px monospace;padding:22px 2px 5px;position:relative}#source-swatches button:before{content:'＋';position:absolute;top:5px;right:5px;font-size:14px}.palette-layer{display:grid;grid-template-columns:30px minmax(0,1fr) 23px 23px;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid #3a4730}.palette-layer>i{width:26px;height:34px;background:var(--swatch);border:1px solid #9a9d8444}.palette-layer div{min-width:0}.palette-layer code{font:10px monospace;color:#c6ccb3}.palette-layer output{float:right;font-size:10px;color:#9d9e83}.palette-layer input{display:block;width:100%;accent-color:#b5a278;margin-top:10px;height:10px}.palette-layer button{color:#a1ac8d;border:0;background:none;padding:4px;font-size:15px}.palette-layer small{font-size:8px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#7b8a70;margin-top:5px}.palette-layer button:disabled{opacity:.3;cursor:default}#palette-status{font-size:10px;line-height:1.7;color:#b9a982;min-height:17px}.palette-layout-buttons{display:flex;gap:8px;margin:12px 0 20px}.palette-layout-buttons button{background:transparent;border:1px solid #606b50;color:#a9b698;font-size:11px;padding:10px 13px;flex:1}.palette-layout-buttons button[aria-pressed=true]{background:#c1b18b;color:#1b2416;border-color:#c1b18b}.palette-ground{display:flex;align-items:center;gap:13px}.palette-ground select{flex:1;width:auto;margin:0}.palette-export{display:flex;gap:7px;margin-top:20px}.palette-export button{border:1px solid #7f8565;background:none;color:#b6be9e;padding:12px;font-size:11px}.palette-export #palette-save{flex:1;background:#c1b18b;color:#15200f;border-color:#c1b18b}.palette-preview{background:radial-gradient(ellipse at 60% 45%,#293024,#11190e);display:flex;align-items:center;justify-content:center;flex-direction:column;padding:38px 35px;min-width:0;gap:22px}.palette-preview canvas{width:min(100%,510px);height:auto;box-shadow:0 25px 65px #0006}.palette-preview>span{font-size:9px;letter-spacing:2px;color:#8f997a}.reference-reading{display:grid;grid-template-columns:285px minmax(0,1fr);gap:35px;margin-top:62px;padding-top:35px;border-top:1px solid #424c35}.reference-reading h2{font-size:25px;letter-spacing:2px;color:#d1c8ad}.reference-reading p{font-size:12px;line-height:2;color:#8c9a80}.reference-reading small{font-size:10px;color:#79886c;line-height:1.9}#reference-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px;align-items:start}#reference-gallery button{border:0;background:none;color:#b9bd9f;padding:0;text-align:left}#reference-gallery img{width:100%;height:190px;object-fit:cover;object-position:center;border:1px solid #6c7355}#reference-gallery strong{display:block;font:15px var(--serif);margin:12px 0 8px;line-height:1.7}#reference-gallery small{font-size:9px;color:#849273}#reference-dialog{padding:0;border:1px solid #727958;background:#0d130c;width:min(1300px,96vw);max-height:94dvh;color:#ddd4b7}#reference-dialog::backdrop{background:#000d}#reference-dialog>header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 17px;border-bottom:1px solid #667452;font-size:13px}#reference-dialog header div{display:flex;gap:10px;align-items:center}#reference-dialog button{border:1px solid #596446;background:none;color:#c5c9aa;padding:8px 13px;font-size:11px}#reference-dialog #reference-close{font-size:23px;line-height:1;padding:5px 10px}.reference-scroll{height:calc(90dvh - 55px);overflow:auto;text-align:center;overscroll-behavior:contain}.reference-scroll img{height:100%;max-width:100%;object-fit:contain;display:block;margin:auto}.reference-scroll.zoomed img{height:auto;max-width:none;width:1700px;margin:0}.reference-scroll.zoomed{text-align:left}
@media(max-width:1000px){.colour-lab{padding:30px 25px}.palette-workbench{grid-template-columns:310px minmax(0,1fr)}.palette-controls{padding:20px}.palette-preview{padding:25px 20px}.reference-reading{grid-template-columns:1fr;gap:20px}#reference-gallery img{height:220px}}
@media(max-width:700px){.colour-lab{padding:25px 17px 40px}.lab-colour-heading h1{font-size:29px;letter-spacing:2px}.lab-colour-heading>a{position:static;font-size:11px;display:inline-block;margin-top:10px}.palette-workbench{display:flex;flex-direction:column}.palette-preview{order:-1;padding:25px 30px;border-bottom:1px solid #414d35}.palette-preview canvas{max-width:350px}.palette-controls{border-right:0;padding:24px}.reference-reading{margin-top:38px;padding-top:26px}#reference-gallery{gap:12px;grid-template-columns:1fr}#reference-gallery button{display:grid;grid-template-columns:110px 1fr;gap:8px 15px;align-items:center}#reference-gallery img{width:110px;height:95px;grid-row:span 2}#reference-gallery strong{margin:0;align-self:end}#reference-gallery small{align-self:start}#reference-dialog header{font-size:10px}#reference-dialog button{padding:7px;font-size:10px}}

/* The composition sits on a neutral black board, with lacquer-red controls. */
.lab-colour-heading h1{color:#f3eee8}.lab-colour-heading>p,.palette-controls .palette-help,#palette-object-preview p,.palette-layer small,.palette-preview>span{color:#b9a9ac}.lab-colour-heading>a,.lab-colour-heading .folio,.lab-control-index,#palette-object-preview a,#palette-status{color:var(--ornament,#c9a063)}.palette-workbench,.palette-controls,.palette-layer{border-color:var(--rule,#45392d)}.palette-controls{background:#161215}.palette-controls label,.palette-layer output,.palette-layer button{color:#c9b6ba}.palette-controls select{background:#100d10;color:#f3eee8;border-color:var(--edge,#786349)}.palette-layer code{color:#f3eee8}.palette-layer input{accent-color:var(--ornament,#c9a063)}.palette-layout-buttons button,.palette-export button{color:#efdad5;border-color:var(--edge,#786349)}.palette-layout-buttons button[aria-pressed=true]{background:#30201b;color:var(--interaction,#c9a063);border-color:var(--gold,#c9a063)}.palette-export #palette-save{background:var(--brand-red,#b43a2e);color:#fff4ee;border-color:var(--brand-red,#b43a2e)}.palette-preview{background:#09090b}.palette-preview canvas{box-shadow:0 25px 65px #0008}


.lab-colour-heading>a:hover,#palette-object-preview a:hover,.palette-layer button:hover{color:var(--interaction,#c9a063)}
.palette-layout-buttons button:hover,.palette-export button:hover{color:var(--interaction,#c9a063);border-color:var(--interaction,#c9a063)}
.palette-export #palette-save:hover{color:#fff4ee;border-color:var(--interaction,#c9a063);box-shadow:inset 0 0 0 1px var(--interaction,#c9a063)}
.palette-layer input:is(:hover,:focus-visible){accent-color:var(--interaction,#c9a063)}
