/* Torinou's own look: ink, bone, one vermilion. Theme pages carry their own palette instead. */
:root{--ink:#0C0C0E;--card:#151518;--line:#26262B;--bone:#ECE6DA;--dim:#A8A296;--red:#E2452B;color-scheme:dark}
*{box-sizing:border-box}
body.torinou{margin:0;background:var(--ink);color:var(--bone);font:400 16px/1.55 Inter,system-ui,sans-serif}
a{color:inherit;text-decoration:none}
.wrap{max-width:1320px;margin:0 auto;padding:0 32px}
nav.top{display:flex;justify-content:space-between;align-items:center;padding:22px 0;font:500 13px/1 'JetBrains Mono',monospace;
  letter-spacing:.06em;color:var(--dim)}
nav.top span{display:flex;gap:22px}
nav.top a:hover{color:var(--red)}
.mark{display:flex;gap:10px;align-items:center;color:var(--bone)}
.mark i{width:16px;height:16px;background:var(--red);border-radius:2px}
.launch{padding:56px 0 24px}
.launch h1,.album h1{margin:0 0 20px;font:700 clamp(40px,6vw,72px)/1 Inter,sans-serif;letter-spacing:-.02em}
#q{width:100%;padding:22px 26px;background:var(--card);border:1px solid var(--line);border-radius:6px;color:var(--bone);
  font:400 clamp(20px,2.4vw,28px)/1.2 Inter,sans-serif;outline:none}
#q:focus{border-color:var(--red)}
#q::placeholder{color:#6E6A62}
.chips{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:16px}
.chip,.chips select{padding:9px 14px;background:transparent;border:1px solid var(--line);border-radius:999px;color:var(--bone);
  font:500 13px/1 'JetBrains Mono',monospace;cursor:pointer}
.chips select{border-radius:4px;background:var(--ink)}
.chip[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:var(--ink)}
.dots{display:flex;gap:8px;margin-left:auto}
.dot{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);cursor:pointer;padding:0}
.dot[aria-pressed="true"]{border-color:var(--bone);transform:scale(1.15)}
section{padding:40px 0 0}
h2{margin:0 0 18px;font:500 13px/1 'JetBrains Mono',monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));grid-auto-flow:dense;gap:14px;margin:0;padding:0;
  list-style:none}
.grid.themes{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.tile{min-width:0}
.tile.tall{grid-row:span 2}
.tile[hidden]{display:none}
.tile img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:5px;background:var(--card);
  border:1px solid var(--line);transition:transform .18s ease,border-color .18s ease}
.tile.tall img{aspect-ratio:auto;height:calc(100% - 46px);min-height:300px}
.tile.theme img{aspect-ratio:1}
.tile button.open{all:unset;display:block;width:100%;cursor:zoom-in}
.tile:hover img{border-color:var(--red);transform:translateY(-2px)}
.tile p{display:flex;justify-content:space-between;gap:10px;margin:8px 2px 0;font-size:14px}
.tile p span{color:var(--dim);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile p span a{color:var(--bone);text-decoration:underline}
.album{padding:56px 0 8px;display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end}
.album h1{flex-basis:100%;margin:0}
.lede{flex-basis:100%;margin:0 0 8px;color:var(--dim);font-size:18px}
.btn{display:inline-block;padding:13px 22px;background:var(--red);color:var(--ink);font-weight:600;border-radius:3px}
.none{padding:40px 0;color:var(--dim)}
footer{margin-top:64px;padding:32px 0 48px;border-top:1px solid var(--line);font-size:13px;color:var(--dim)}
dialog#view{width:min(1400px,96vw);max-height:94vh;padding:0;background:var(--ink);color:var(--bone);border:1px solid var(--line);
  border-radius:8px}
dialog#view::backdrop{background:rgba(0,0,0,.82)}
.view-img{display:block;max-width:100%;max-height:72vh;margin:0 auto}
.view-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding:16px 20px}
.view-bar b{font-size:18px;margin-right:auto}
.view-rel{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;padding:0 20px 20px;margin:0;list-style:none}
.view-rel img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:4px;border:1px solid var(--line)}
.ghost{padding:12px 18px;border:1px solid var(--line);border-radius:3px;background:none;color:var(--bone);cursor:pointer;font:inherit}
@media (max-width:760px){
  .wrap{padding:0 16px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .grid.themes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dots{margin-left:0}
  .tile p span{display:none}
}
.idle .tile[data-extra]{display:none}
.all{margin:18px 0 0}