.mix-workspace{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:16px;align-items:start}
.mix-panel,.brand-card{background:#121314;border:1px solid var(--line);min-width:0}
.mix-panel{padding:24px}
.mix-panel .card-heading{margin-bottom:18px}
.mix-intro{font-size:15px;margin-bottom:20px}
.mix-filters{display:grid;grid-template-columns:minmax(0,1fr) 160px;gap:12px}
.mix-filters label,.mix-form label{display:block;font-size:14px;color:#d5d3ca;font-weight:700}
.mix-filters input,.mix-filters select,.mix-form input,.mix-form select,.mix-form textarea{display:block;width:100%;min-width:0;min-height:44px;margin-top:8px;padding:10px 12px;background:#08090a;border:1px solid #74797c;border-radius:0;color:#e5e2d9;font:15px/1.35 var(--syco-font-ui)}
.mix-form textarea{resize:vertical;min-height:94px}
.mix-form input::placeholder,.mix-form textarea::placeholder{color:#888e91;opacity:1}
.mix-form select,.mix-filters select{appearance:auto}
.mix-count{margin:20px 0 10px;color:var(--amber);font-size:12px}
.mix-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.mix-list li{border-bottom:1px solid var(--line)}
.mix-item{display:grid;grid-template-columns:35px minmax(0,1fr) auto;align-items:center;gap:12px;width:100%;min-height:80px;text-align:left;padding:12px 10px;background:transparent;color:var(--syco-color-stencil);border:0;border-left:3px solid transparent}
.mix-item:hover{background:#1b1d1e}
.mix-item[aria-pressed=true]{background:#211b0d;border-left-color:var(--amber)}
.mix-index,.mix-item-meta,.mix-duration-label{font:12px/1.4 var(--syco-font-terminal);color:#a4a7a8}
.mix-item-main{min-width:0}
.mix-item-title{display:block;font:700 18px/1.2 var(--syco-font-display);overflow-wrap:anywhere}
.mix-item-meta{display:block;margin-top:7px;overflow-wrap:anywhere}
.mix-item-right{text-align:right}
.mix-status{display:inline-block;border:1px solid #676b6d;color:#d6d7d4;padding:4px 6px;font:11px/1 var(--syco-font-terminal);text-transform:uppercase}
.mix-status.published{border-color:#8b6527;color:var(--amber)}
.mix-duration-label{display:block;margin-top:7px}
.mix-empty{padding:30px 10px;color:var(--muted);font-size:15px}
.mix-detail{background:#0d0e0f;border-left:2px solid var(--amber);margin-top:20px;padding:18px;min-height:130px}
.mix-detail .mono{color:var(--amber);font-size:11px;letter-spacing:.06em}
.mix-detail h4{font:700 26px/1.15 var(--syco-font-display);margin:8px 0}
.mix-detail p{font-size:14px;margin-top:6px;overflow-wrap:anywhere}
.mix-detail a{display:inline-block;font-size:14px;margin-top:12px;color:var(--amber);text-decoration:underline;text-underline-offset:3px}
.mix-form{display:grid;gap:18px}
.mix-form .field{min-width:0}
.mix-form .field>small{display:block;color:#9da1a2;font-size:12px;margin-top:5px}
.mix-form label span{color:var(--amber)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mix-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:2px}
.mix-feedback{min-height:20px;color:var(--amber);font-size:14px}
@media(max-width:1100px){.mix-workspace{grid-template-columns:1fr}}
@media(max-width:700px){.mix-panel{padding:18px}}
@media(max-width:500px){.mix-filters,.field-row{grid-template-columns:1fr}.mix-item{grid-template-columns:25px minmax(0,1fr);gap:8px}.mix-item-right{grid-column:2;text-align:left;display:flex;align-items:center;gap:9px}.mix-duration-label{margin-top:0}}

/* Brand specimens: solid type, restrained frames, copper as identity ink. */
@font-face{font-family:SycoAnton;src:url('assets/fonts/anton.woff') format('woff');font-style:normal;font-weight:400;font-display:swap}
.brand-section{--brand-copper:#c04a26;--brand-ash:#e5e2d9;--brand-ink:#0a0b0c}
.brand-section .section-kicker{color:var(--brand-ash);font-size:12px}
.brand-revision{color:#a4a7a8;letter-spacing:.04em}
.brand-heading{align-items:end;margin-bottom:36px;gap:28px}
.brand-heading h2{font:400 clamp(44px,5.7vw,82px)/1.05 SycoAnton,var(--syco-font-display);letter-spacing:-.012em}
.brand-heading h2 span{color:var(--brand-copper)}
.brand-heading p{font-size:16px;max-width:285px;line-height:1.5}
.brand-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 20px}
.brand-card{background:#101112;border:1px solid #363837;min-width:0}
.brand-wide{grid-column:1/-1}
.brand-stage{display:grid;place-items:center;padding:28px;background:var(--brand-ink);border-bottom:1px solid #363837;min-width:0}
.brand-stage img{display:block;width:100%;height:100%;object-fit:contain;min-width:0}
.brand-primary{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(210px,.8fr);border-top:4px solid var(--brand-copper)}
.brand-totem{padding:34px;aspect-ratio:1.2;border-bottom:0;border-right:1px solid #363837}
.brand-primary .brand-caption{flex-direction:column;align-items:start;justify-content:space-between;padding:32px 26px;gap:32px}
.brand-label{display:block;font:400 12px/1.4 var(--syco-font-terminal);letter-spacing:.08em;color:#adb0ad;margin-bottom:10px}
.brand-primary .brand-caption h3{font:400 clamp(32px,3vw,46px)/1.08 SycoAnton,var(--syco-font-display);margin-bottom:22px}
.brand-primary .brand-caption p{font-size:18px;line-height:1.5;color:var(--brand-ash)}
.brand-primary .brand-caption .brand-use{font-size:14px;color:#a8aba8;margin-top:22px}
.brand-caption{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:22px 24px}
.brand-caption>div:first-child{min-width:0}
.brand-caption h3{font:800 28px/1.1 var(--syco-font-display);text-transform:uppercase;overflow-wrap:anywhere}
.brand-caption p{font-size:16px;line-height:1.4;margin-top:7px}
.brand-actions{display:flex;gap:8px;flex-wrap:wrap;flex-shrink:0}
.brand-section .button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:58px;background:transparent;border-color:#666a67;text-align:center;text-decoration:none;flex-shrink:0}
.brand-section .button:hover{background:var(--brand-ash);color:var(--brand-ink);border-color:var(--brand-ash)}
.brand-section .button:focus-visible{outline-color:var(--brand-ash)}
.brand-light{background:var(--brand-ash)}
.brand-horizontal{aspect-ratio:3.2;padding:30px 36px}
.brand-square{aspect-ratio:1.12;padding:28px}
.brand-emblem{background:var(--brand-copper);padding:20px}
.brand-emblem img{max-width:90%}
.brand-mono{aspect-ratio:1.25;padding:30px}
.brand-banner{aspect-ratio:1200/630;padding:0}
.brand-rules{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:32px 0}
.brand-rules>div{border-top:2px solid #535650;padding-top:16px}
.brand-rules strong{font:800 24px/1.2 var(--syco-font-display);text-transform:uppercase}
.brand-rules p{font-size:16px;line-height:1.5;margin-top:10px}
.brand-download-row{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:28px 0;border-top:1px solid #535650}
.brand-download-row h3{font:800 30px/1.15 var(--syco-font-display);text-transform:uppercase}
.brand-download-row p{font-size:16px;margin-top:8px}
.brand-section .brand-download{background:var(--brand-ash);border-color:var(--brand-ash);color:var(--brand-ink);gap:22px;min-height:52px}
.brand-download span{font:12px var(--syco-font-terminal);margin:0;padding-left:16px;border-left:1px solid #777}
@media(max-width:1180px){.brand-primary{grid-template-columns:minmax(0,1.5fr) minmax(185px,.8fr)}.brand-primary .brand-caption{padding:24px 20px}.brand-totem{padding:24px}.brand-caption{align-items:start;flex-wrap:wrap;padding:20px}.brand-heading{align-items:start}.brand-heading p{max-width:440px}}
@media(max-width:700px){.brand-grid{grid-template-columns:minmax(0,1fr);gap:20px}.brand-wide{grid-column:auto}.brand-primary{display:block}.brand-totem{aspect-ratio:1.24;border-right:0;border-bottom:1px solid #363837;padding:24px}.brand-primary .brand-caption{flex-direction:row;flex-wrap:wrap;gap:22px;padding:24px}.brand-primary .brand-caption h3{font-size:36px;margin-bottom:12px}.brand-primary .brand-caption p{font-size:16px}.brand-primary .brand-caption .brand-use{margin-top:12px}.brand-heading h2{font-size:clamp(40px,9vw,62px)}.brand-heading{margin-bottom:26px}.brand-horizontal{aspect-ratio:2.8;padding:20px 14px}.brand-square{aspect-ratio:1.2}.brand-mono{aspect-ratio:1.3}.brand-rules{grid-template-columns:1fr;gap:22px}.brand-download-row{align-items:start;flex-direction:column;gap:22px}.brand-download-row .button{width:100%;justify-content:space-between}.brand-revision{display:none}}
@media(max-width:380px){.brand-totem{padding:18px}.brand-caption,.brand-primary .brand-caption{padding:18px}.brand-heading h2{font-size:40px}.brand-square,.brand-mono{padding:20px}}
