/* Clyde Unit One — night spit board. Prefix c1- (not lot/nob/lst) */
:root{
  --c1-night:#0e0d0b;
  --c1-gold:#d9b354;
  --c1-paper:#f4efe4;
  --c1-ash:#2a2722;
  --c1-mute:#9a9182;
  --c1-heat:#e36a2a;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body.c1-night{
  background:var(--c1-night);
  color:var(--c1-paper);
  font:16px/1.5 "Segoe UI","Helvetica Neue",Arial,sans-serif;
}
.c1-skip{position:absolute;left:-999px}
.c1-skip:focus{left:8px;top:8px;background:#fff;color:#000;padding:8px;z-index:5}
.c1-frame{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
@media(max-width:860px){.c1-frame{grid-template-columns:1fr}}
.c1-rail{
  background:var(--c1-ash);
  padding:22px 16px 40px;
  border-right:1px solid #3b372f;
}
.c1-logo{display:flex;gap:10px;align-items:flex-start;text-decoration:none;color:var(--c1-gold)}
.c1-logo img{width:42px;height:42px}
.c1-logo b{display:block;font:800 1.15rem/1.1 "Arial Narrow",Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.c1-logo span{display:block;color:var(--c1-mute);font-size:.82rem;letter-spacing:.02em;text-transform:none;font-weight:400}
.c1-rail nav{display:flex;flex-direction:column;margin-top:28px;gap:2px}
.c1-rail nav a{
  color:var(--c1-paper);text-decoration:none;padding:9px 8px;
  border-left:3px solid transparent;font:650 .95rem/1.2 Arial,sans-serif
}
.c1-rail nav a.is-on{border-color:var(--c1-gold);color:var(--c1-gold);background:#1a1814}
.c1-rail nav [hidden]{display:none!important}
.c1-meta{margin-top:28px;color:var(--c1-mute);font-size:.86rem}
.c1-meta a{color:var(--c1-gold)}
.c1-stage{padding:32px 28px 64px;max-width:820px}
.c1-num{font:800 .78rem/1 Arial,sans-serif;letter-spacing:.22em;color:var(--c1-gold);text-transform:uppercase;margin:0}
.c1-stage h1{font:800 2.6rem/1.02 "Arial Narrow",Arial,sans-serif;letter-spacing:.01em;text-transform:uppercase;margin:8px 0 14px}
.c1-lede{color:#ddd6c6;max-width:38rem}
.c1-shot{margin:20px 0 28px}
.c1-shot img{width:100%;max-height:360px;object-fit:cover;display:block;filter:saturate(1.05) contrast(1.05)}
.c1-shot figcaption{color:var(--c1-mute);font-size:.82rem;padding-top:6px}
.c1-board{list-style:none;margin:0;padding:0}
.c1-board li{
  display:grid;grid-template-columns:48px 1fr auto auto;gap:12px;align-items:center;
  padding:14px 0;border-bottom:1px solid #2c2923;
}
.c1-board .n{font:800 1.1rem/1 Arial,sans-serif;color:var(--c1-gold)}
.c1-board h2{margin:0;font:700 1.05rem/1.2 Arial,sans-serif}
.c1-board p{margin:4px 0 0;color:var(--c1-mute);font-size:.88rem}
.c1-board .cad{font-weight:800;color:var(--c1-gold)}
.c1-board button{
  background:transparent;color:var(--c1-gold);border:1px solid var(--c1-gold);
  padding:8px 10px;cursor:pointer;font:700 .75rem/1 Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase
}
.c1-board button.just-added{background:var(--c1-gold);color:var(--c1-night)}
.c1-warn{border:1px solid var(--c1-heat);padding:12px 14px;color:#f3c9b0}
.c1-form{display:grid;gap:8px;max-width:34rem}
.c1-form label{font-weight:700;font-size:.88rem;letter-spacing:.04em;text-transform:uppercase;color:var(--c1-gold)}
.c1-form input,.c1-form textarea{
  background:#161410;border:1px solid #3b372f;color:var(--c1-paper);padding:10px;font:inherit
}
.c1-form button{
  background:var(--c1-gold);color:var(--c1-night);border:0;padding:12px;cursor:pointer;
  font:800 .95rem/1 Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase
}
.c1-form .hp{position:absolute;left:-9999px}
.form-err{color:var(--c1-heat)}
.c1-rows .row{display:grid;grid-template-columns:1fr auto auto auto;gap:10px;align-items:center;border-bottom:1px solid #2c2923;padding:10px 0}
.c1-rows button{background:#161410;color:var(--c1-paper);border:1px solid #3b372f;cursor:pointer}
.c1-end{padding:20px 16px 36px;border-top:1px solid #2c2923;color:var(--c1-mute);font-size:.86rem}
.c1-end a{color:var(--c1-gold);margin-right:10px}
span[hidden]{display:none!important}
.c1-404{padding:60px 24px}
@media(max-width:860px){
  .c1-rail nav{flex-direction:row;flex-wrap:wrap;gap:8px}
  .c1-rail nav a{border-left:0;border-bottom:2px solid transparent}
  .c1-rail nav a.is-on{border-bottom-color:var(--c1-gold)}
  .c1-board li{grid-template-columns:40px 1fr;grid-template-rows:auto auto}
  .c1-board .cad,.c1-board button{grid-column:2}
}