/* Shared styles for generated per-project pages (/matthew/work/<id>/). */
:root{
  --ink:#1B1714; --ink-muted:#7a6e68; --linen:#fff; --linen-warm:#fafaf7;
  --golden:#D0A500; --golden-ink:#8a6e00; --gamma:#F85D00; --rule:#DCCFA8; --white:#fff;
}
/* Night theme (dark palette) — after local sunset / OS dark */
html[data-theme="night"]{
  --ink:#E6E8EB; --ink-muted:#99a2ac; --linen:#0D121A; --linen-warm:#262b36;
  --golden:#47B2C4; --golden-ink:#5cc6d8; --gamma:#F23861; --rule:#2f3542; --white:#161b24;
}
/* Smooth day<->night fade, only during the switch */
@media (prefers-reduced-motion: no-preference){
  html.theme-transition, html.theme-transition *, html.theme-transition *::before, html.theme-transition *::after{
    transition: background-color .45s ease, color .45s ease, border-color .45s ease, fill .45s ease !important;
  }
}
*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--linen);color:var(--ink);
  font-family:'Alata','Sofia Pro',sans-serif;line-height:1.6;}
.wrap{max-width:880px;margin:0 auto;padding:2.5rem 1.5rem 5rem;}
a{color:var(--gamma);}
.crumbs{font-size:.78rem;letter-spacing:.04em;color:var(--ink-muted);margin-bottom:1.5rem;}
.crumbs a{color:var(--ink-muted);text-decoration:none;}
.crumbs a:hover{color:var(--ink);border-bottom:1px solid var(--golden);}
.crumbs .sep{color:#c8bda0;margin:0 .4rem;}
.tag{display:inline-block;background:var(--ink);color:var(--linen);font-size:.62rem;
  letter-spacing:.2em;text-transform:uppercase;padding:.35rem .65rem;margin-bottom:1rem;}
/* Show the full map/image (no crop) — posters and orthos display in full. */
.hero-img{width:100%;height:auto;max-height:82vh;object-fit:contain;display:block;
  border:1px solid var(--rule);border-radius:4px;margin-bottom:1.75rem;background:var(--linen-warm);}
h1{font-size:clamp(1.8rem,4vw,2.4rem);line-height:1.12;margin:0 0 .35rem;font-weight:400;}
.pid{font-family:'IBM Plex Mono',monospace;font-size:.78rem;letter-spacing:.1em;color:var(--golden-ink);margin-bottom:1.1rem;}
.meta{font-family:'IBM Plex Mono',monospace;font-size:.78rem;color:var(--ink-muted);
  margin-bottom:1.75rem;padding-bottom:1.25rem;border-bottom:1px solid var(--rule);}
section{margin-bottom:1.9rem;}
h2{font-size:.72rem;letter-spacing:.25em;text-transform:uppercase;color:var(--golden-ink);
  margin:0 0 .85rem;font-weight:400;}
p{margin:0 0 .8rem;}
.specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1rem;
  background:var(--linen-warm);padding:1.25rem;border-left:3px solid var(--golden);}
.spec{font-family:'IBM Plex Mono',monospace;font-size:.85rem;}
.spec .l{display:block;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:.25rem;}
.spec .v{color:var(--ink);font-weight:500;}
ul.list{margin:0;padding:0;list-style:none;}
ul.list li{padding:.5rem 0;border-bottom:1px dotted var(--rule);display:flex;gap:.75rem;}
ul.list li::before{content:'\2192';color:var(--gamma);flex-shrink:0;}
ul.list li:last-child{border-bottom:none;}
.crs{background:var(--linen-warm);padding:1rem 1.25rem;border-left:3px solid var(--ink);
  font-family:'IBM Plex Mono',monospace;font-size:.85rem;margin:0;}
.crs .row{display:grid;grid-template-columns:110px 1fr;gap:1rem;padding:.45rem 0;border-bottom:1px dotted var(--rule);}
.crs .row:last-child{border-bottom:none;}
.crs dt{color:var(--ink-muted);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;}
.crs dd{margin:0;}
.links{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.5rem;}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1.2rem;background:var(--gamma);
  color:#fff;text-decoration:none;font-size:.85rem;letter-spacing:.04em;text-transform:uppercase;border:1px solid var(--gamma);}
.btn.sec{background:transparent;color:var(--ink);border-color:var(--rule);}
.btn:hover{background:var(--ink);border-color:var(--ink);color:#fff;}
.back{display:inline-block;margin-top:2.5rem;font-size:.8rem;letter-spacing:.05em;text-transform:uppercase;
  color:var(--ink-muted);text-decoration:none;}
.back:hover{color:var(--ink);}

/* ---- DeskMate theme (opt-in retro) ---- */
html[data-theme="deskmate"]{ --ink:#0a0a0a; --ink-muted:#1e2630; --linen:#00a8a8; --linen-warm:#bfc4c7; --golden:#000; --golden-ink:#0000aa; --gamma:#0000aa; --rule:#000; --white:#e7eaec; }
html[data-theme="deskmate"] body{ background:#00a8a8; }
html[data-theme="deskmate"] .wrap, html[data-theme="deskmate"] .wrap *{ font-family:'VT323',monospace !important; }
html[data-theme="deskmate"] h1{ color:#000; }
html[data-theme="deskmate"] h2{ background:#0000aa; color:#fff; padding:3px 10px; font-family:'Silkscreen',monospace !important; font-size:.95rem; }
html[data-theme="deskmate"] .tag{ background:#0000aa; color:#fff; }
html[data-theme="deskmate"] .specs, html[data-theme="deskmate"] .crs{ background:#bfc4c7; border:2px solid #000; box-shadow:4px 4px 0 #000; }
html[data-theme="deskmate"] .hero-img{ border:2px solid #000; }
html[data-theme="deskmate"] .btn{ background:#cfd3d5; color:#000; border:2px solid #000; border-radius:0; box-shadow:2px 2px 0 #000; }
html[data-theme="deskmate"] .btn.sec{ background:#cfd3d5; color:#000; }
html[data-theme="deskmate"] .btn:hover{ background:#0000aa; color:#fff; }
html[data-theme="deskmate"] a{ color:#0000aa; }
html[data-theme="deskmate"] .crumbs a:hover{ border-bottom-color:#0000aa; }

/* ---- DeskMate power button (Tandy-style hardware switch) ---- */
#mg-theme-toggle{ position:fixed; right:16px; bottom:16px; z-index:9999; display:inline-flex; align-items:center; gap:9px; padding:8px 12px 8px 9px; cursor:pointer; font-size:0; line-height:0; border:1px solid #b3a87f; border-top-color:#f3ebd2; border-left-color:#ece2c4; border-radius:8px; background:linear-gradient(#e7dcbb,#d4c8a2); box-shadow:0 3px 7px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.6); backdrop-filter:none; -webkit-backdrop-filter:none; }
#mg-theme-toggle::before{ content:''; width:26px; height:26px; border-radius:50%; border:1px solid #a99d77; border-top-color:#f1e9d0; box-shadow:inset 0 1px 1px rgba(255,255,255,.7), 0 1px 2px rgba(0,0,0,.35); background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%233a3327'%20stroke-width='2.4'%20stroke-linecap='round'%3E%3Cpath%20d='M12%203.5v8'/%3E%3Cpath%20d='M7%206.6a7%207%200%201%200%2010%200'/%3E%3C/svg%3E"), radial-gradient(circle at 38% 32%, #efe8d2, #c8bd98 70%, #b3a87f); background-repeat:no-repeat,no-repeat; background-position:center,center; background-size:15px 15px,cover; }
#mg-theme-toggle::after{ content:''; width:8px; height:8px; border-radius:50%; background:#6b5f3a; box-shadow:inset 0 0 2px rgba(0,0,0,.7); }
#mg-theme-toggle[data-on="1"]::after{ background:#3ef07a; box-shadow:0 0 7px #3ef07a,0 0 2px #d6ffe6; }
#mg-theme-toggle:hover{ filter:brightness(1.05); }
#mg-theme-toggle:active{ transform:translateY(1px); box-shadow:0 1px 3px rgba(0,0,0,.4), inset 0 1px 2px rgba(0,0,0,.25); }
#mg-theme-toggle:active::before{ box-shadow:inset 0 1px 3px rgba(0,0,0,.45); }
html[data-theme="deskmate"] #mg-theme-toggle{ bottom:40px; }
/* CRT power-on overlay */
.dm-boot{ position:fixed; inset:0; z-index:99999; pointer-events:none; transform-origin:center; background:#dafcff; animation:dm-crt .66s ease-out forwards; }
@keyframes dm-crt{ 0%{transform:scaleY(.004);opacity:1;filter:brightness(2.4)} 16%{transform:scaleY(.012);opacity:1} 34%{transform:scaleY(1);opacity:1;filter:brightness(1.9)} 46%{opacity:.85;background:#fff} 58%{opacity:.25} 66%{opacity:.55} 100%{transform:scaleY(1);opacity:0} }
@media (prefers-reduced-motion: reduce){ .dm-boot{ display:none } }