/* Site V6 (2026-11-05): flexible editorial home grid, grouped Work index, review notes, master review board. V1 tokens. */
/* home: 24-column grid; each tile's placement is computed from the real number of visible projects (app.js gridPlan) */
@media (min-width:761px){
  .grid.flex{grid-template-columns:repeat(24,minmax(0,1fr))}
  .grid.flex .tile{grid-column:var(--gc)}
}
@media (max-width:760px){
  .grid.flex{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid.flex .tile{grid-column:auto}
  .grid.flex.odd .tile:first-child{grid-column:1/-1}
}
.tile.empty{display:flex;align-items:center;justify-content:center;background:var(--pill);border:1px dashed #c9c9c9}
.tile-empty{text-align:center;padding:16px}
.tile-empty b{display:block;font-weight:400;font-size:14px}
.tile-empty i{display:block;font-style:normal;color:var(--mute);font-size:12px;margin-top:4px}
/* Work index groups */
.panel .idx tr.grp th{padding:16px 0 6px;text-align:left;font-weight:400;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:#8a8a8a;border-bottom:1px solid var(--sheet-rule)}
.panel .idx tbody:first-of-type tr.grp th{padding-top:6px}
.panel .board-link{margin:16px 0 0;font-size:12.5px}
/* review note on unfinished pages */
.pub-note{position:relative;z-index:3;margin:calc(var(--m) * 2) 0 0;padding:10px 14px;border-left:3px solid #c0392b;background:#faf6f5;font-size:12.5px;line-height:18px}
.pub-note b{display:block;font-weight:500}
.pub-note span{color:var(--mute)}
/* master review board */
.rb{padding-top:clamp(64px,12vh,140px)}
.rb-head h1{font:500 clamp(40px,6vw,88px)/.95 var(--font);letter-spacing:-.02em;margin:0 0 12px}
.rb-head p{max-width:60ch;color:var(--mute);margin:0 0 14px}
.rb-count{display:flex;gap:24px;list-style:none;padding:0;margin:0 0 14px;flex-wrap:wrap}
.rb-count li{font-size:12px;color:var(--mute)}
.rb-count b{display:block;font:500 34px/1 var(--font);color:var(--ink)}
.rb-links a{color:var(--ink)}
.rb-group{font:400 11px/1 var(--font);letter-spacing:.09em;text-transform:uppercase;color:var(--mute);margin:44px 0 12px;padding-bottom:8px;border-bottom:1px solid var(--line, #e3e3e3)}
.rb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--m)}
.rb-card{display:block;text-decoration:none;color:var(--ink)}
.rb-card img,.rb-empty{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;background:var(--pill);display:flex;align-items:center;justify-content:center;color:var(--mute);font-size:12px}
.rb-meta{display:block;padding:8px 2px 0;font-size:12.5px;line-height:17px}
.rb-meta b{display:block;font-weight:500}
.rb-meta i,.rb-meta small{display:block;font-style:normal;color:var(--mute)}
.rb-meta em{display:inline-block;font-style:normal;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;margin:4px 0 2px;padding:1px 6px;border:1px solid currentColor}
.rb-card.c-READY em{color:#1f6f3a}.rb-card.c-APPROVAL em{color:#8a6d1d}.rb-card.c-HOLD em,.rb-card.c-RIGHTS em{color:#b3261e}
.rb-count .c-READY b{color:#1f6f3a}.rb-count .c-HOLD b,.rb-count .c-RIGHTS b{color:#b3261e}

/* REVIEW INDEX (review mode only, 2026-11-05) */
.review-flag{cursor:pointer;text-decoration:none}
.review-flag:hover{background:#b3261e}
.ri{padding-top:clamp(64px,12vh,140px);padding-bottom:80px}
.ri-back{margin:0 0 28px;font-size:12.5px}
.ri-back a,.ri-next a,.ri-foot a,.ri-head a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.ri-head h1{font:500 clamp(40px,6vw,88px)/.95 var(--font);letter-spacing:-.02em;margin:0 0 12px}
.ri-head p{max-width:60ch;color:var(--mute);margin:0 0 14px;font-size:12.5px;line-height:18px}
.ri-list{list-style:none;padding:0;margin:28px 0 0;border-top:1px solid var(--ink)}
.ri-item{border-bottom:1px solid var(--line,#e3e3e3)}
.ri-row{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) auto;gap:8px 24px;align-items:baseline;padding:18px 2px;color:var(--ink)}
.ri-t{font:500 clamp(20px,2.4vw,32px)/1.05 var(--font);letter-spacing:-.01em}
.ri-d{color:var(--mute);font-size:12.5px;line-height:18px}
.ri-go{font-size:12.5px}
a.ri-row:hover .ri-t,a.ri-row:focus-visible .ri-t{color:#b3261e}
.ri-multi{display:flex;gap:18px;font-size:12.5px}
.ri-multi a{text-decoration:underline;text-underline-offset:3px}
.ri-foot{margin-top:28px;font-size:12.5px;line-height:18px}
.ri-stamp{color:var(--mute);font-variant-numeric:tabular-nums}
.ri-table{width:100%;border-collapse:collapse;font-size:12.5px;line-height:18px;margin-top:20px}
.ri-table th{text-align:left;font-weight:400;color:var(--mute);padding:6px 8px 6px 0;border-bottom:1px solid var(--ink)}
.ri-table td{padding:10px 8px 10px 0;border-bottom:1px solid var(--line,#e3e3e3);vertical-align:top}
.ri-table td:first-child{font-variant-numeric:tabular-nums;width:3ch}
.ri-table a{text-decoration:underline;text-underline-offset:3px}
.ri-table em{font-style:normal}
.ri-table .c-READY em{color:#1f6f3a}.ri-table .c-APPROVAL em{color:#8a6d1d}.ri-table .c-HOLD em,.ri-table .c-RIGHTS em{color:#b3261e}
.ri-player{margin:20px 0 0;background:#000;border-radius:12px;overflow:hidden}
.ri-player video{width:100%;aspect-ratio:16/9;background:#000}
.ri-ctl{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px}
.ri-ctl .pill{padding:0 14px;height:var(--pill-h);display:inline-flex;align-items:center}
.ri-ctl .ri-play{background:var(--ink);color:#fff}
.ri-time{margin-left:auto;color:var(--mute);font-variant-numeric:tabular-nums}
.ri-note{max-width:60ch;color:var(--mute);font-size:12.5px;line-height:18px;margin:16px 0 8px}
.ri-next{font-size:12.5px}
.ri .rb-grid{margin-top:20px}
/* compact strip on the review home */
.ri-bar{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 calc(var(--m) * 3);font-size:12px}
.ri-bar a{padding:6px 11px;border-radius:15px;background:var(--pill,#f0f0f0);color:var(--ink)}
.ri-bar a:hover{background:var(--ink);color:#fff}
.ri-bar .ri-bar-home{background:var(--ink);color:#fff}
.home:has(.ri-bar){padding-top:clamp(64px,11vh,120px)}
@media (max-width:760px){
  .ri-row{grid-template-columns:1fr auto;padding:14px 2px}
  .ri-d{grid-column:1/-1;grid-row:2}
  .ri-multi{grid-column:1/-1}
  .ri-table th:nth-child(3),.ri-table td:nth-child(3){display:none}
  .ri-bar{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .ri-bar a{white-space:nowrap;flex:none}
  .ri-time{margin-left:0;width:100%}
}
/* FULL PORTFOLIO PREVIEW (?preview=full, local only, 2026-11-05) */
.review-flag.pv-flag{background:rgba(255,255,255,.9);color:var(--ink);border:1px solid var(--ink);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.review-flag.pv-flag:hover{background:var(--ink);color:#fff}
/* featured band: Creative Systems hero film across the grid */
.grid.flex .tile.feature{grid-column:1/-1;aspect-ratio:auto;display:flex;flex-direction:column;background:#000;color:#fff}
.feat-media{position:relative;display:block;aspect-ratio:16/9;overflow:hidden}
.tile.feature video{opacity:1}
.tile.feature:hover img,.tile.feature:focus-visible img{transform:none}
.feat-cap{display:flex;align-items:center;gap:8px 24px;flex-wrap:wrap;padding:16px clamp(16px,2vw,28px) 20px}
.feat-cap b{font:500 clamp(20px,2.2vw,32px)/1 var(--font);letter-spacing:-.015em}
.feat-cap span{flex:1 1 30ch;font-size:12.5px;line-height:18px;color:rgba(255,255,255,.7)}
.feat-cap i{font-style:normal;font-size:12px;padding:6px 14px;border-radius:15px;background:#fff;color:var(--ink)}
.tile.feature:hover .feat-cap i,.tile.feature:focus-visible .feat-cap i{background:#b3261e;color:#fff}
@media (max-width:760px){ .feat-cap{padding:12px 14px 16px} .feat-cap span{flex-basis:100%;order:3} }
/* Moving Image: screening room */
.mi-films{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--m);grid-column:1/-1}
.mi-film{margin:0}
.mi-frame{aspect-ratio:9/16;background:#000;border-radius:calc(var(--r-tile) * .6);overflow:hidden}
.mi-frame video{width:100%;height:100%;object-fit:contain;background:#000}
.mi-film figcaption{display:flex;justify-content:space-between;gap:12px;padding:8px 2px 0;font-size:12.5px;line-height:17px}
.mi-film figcaption b{font-weight:500}
.mi-film figcaption span{color:var(--mute)}
.mi-note{grid-column:1/-1;margin:14px 2px 0;color:var(--mute);font-size:12px}
@media (max-width:760px){ .mi-films{grid-template-columns:1fr} .mi-frame{max-width:420px;margin:0 auto} }
/* CARRY motion study */
.fig.carry-film{aspect-ratio:16/9;background:#000}
.fig.carry-film video{object-fit:cover}
.carry-cap{position:absolute;left:50%;transform:translateX(-50%);white-space:nowrap;top:14px;z-index:2;font-size:11.5px;color:#fff;background:rgba(0,0,0,.45);padding:3px 9px;border-radius:11px}
/* In progress: home strip, page, note */
.wip-strip{margin:calc(var(--m) * 8) 0 calc(var(--m) * 2);padding-top:18px;border-top:1px solid var(--ink)}
.wip-strip h2{font:500 22px/1 var(--font);letter-spacing:-.01em;margin:0 0 6px}
.wip-strip p{margin:0 0 16px;color:var(--mute);font-size:12.5px}
.wip-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,220px));gap:var(--m)}
.wip-grid.big{grid-template-columns:repeat(auto-fill,minmax(220px,300px));margin-top:24px}
.wip-card{display:flex;flex-direction:column;gap:4px;color:var(--ink);font-size:12.5px;line-height:17px}
.wip-card img,.wip-empty{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:12px;background:var(--pill,#f0f0f0);filter:grayscale(.35);opacity:.9}
.wip-empty{display:flex;align-items:center;justify-content:center;color:var(--mute);border:1px dashed #c9c9c9;filter:none}
.wip-card b{font-weight:500;margin-top:6px}
.wip-card span{color:var(--mute)}
.wip-card:hover img{filter:none;opacity:1}
.wip-page{padding-top:clamp(64px,14vh,150px)}
.wip-page h1{font:500 clamp(40px,6vw,88px)/.95 var(--font);letter-spacing:-.02em;margin:24px 0 12px}
.wip-lead{max-width:60ch;color:var(--mute);font-size:12.5px;line-height:18px}
.wip-note{position:relative;z-index:3;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;margin:calc(var(--m) * 2) 0 0;padding:10px 14px;border-left:3px solid var(--ink);background:var(--pill,#f3f3f3);font-size:12.5px;line-height:18px}
.wip-note span{color:var(--mute);flex:1 1 40ch}
.wip-note a{text-decoration:underline;text-underline-offset:3px}
.panel .idx tbody.wip-rows tr.grp th a{color:inherit;text-decoration:underline;text-underline-offset:3px}
/* review index: whole table row is clickable on narrow screens */
@media (max-width:760px){ .ri-table td:nth-child(2) a{display:block;padding:4px 0} }
@media (max-width:760px){ .wip-grid,.wip-grid.big{grid-template-columns:repeat(2,minmax(0,1fr))} }
.mi-film figcaption{flex-direction:column;gap:2px}

/* EDITORIAL PASS (2026-11-05): preview sequence, More work row, CARRY whole heroes, screening room */
.more-h{margin:calc(var(--m) * 7) 0 calc(var(--m) * 1.5);padding-top:14px;border-top:1px solid var(--ink);font:500 22px/1 var(--font);letter-spacing:-.01em}
.grid.more{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:var(--m)} /* 2026-11-08: no heading; continues the Featured grid as rows of one 12-tile grid */
@media (max-width:760px){ .grid.more{grid-template-columns:repeat(2,minmax(0,1fr))} .grid.more.odd .tile:first-child{grid-column:1/-1} }
/* v3 (2026-11-07): in the 08 study More Work has five cards; 08 stays a normal card (HYO 2026-11-06: no feature tile), so on
   phones the odd card is the last one, centred at the same size as the rest */
@media (max-width:760px){ .grid.more.odd-end .tile:last-child{grid-column:1/-1;justify-self:center;width:calc((100% - var(--m)) / 2)} }
.fig.L.whole{aspect-ratio:var(--ar,3/4)}
.mi-films{background:#000;padding:clamp(12px,1.6vw,22px);border-radius:var(--r-tile);gap:clamp(10px,1.2vw,16px)}
.mi-frame{border-radius:calc(var(--r-tile) * .45)}
.mi-film figcaption b{color:#fff}
.mi-film figcaption span{color:rgba(255,255,255,.6)}
.mi-films .mi-note{margin:6px 2px 0;color:rgba(255,255,255,.6)}@media (max-width:760px){ .grid.more.odd .tile:first-child{aspect-ratio:16/10} }
/* HOME GRID (HYO, 2026-11-06, final): Featured Work and More Work share ONE rule: four equal columns from 761 px up,
   two columns on phones (760 px and below). No three-column step, no feature tile; More Work cards are the same size as
   Featured Work cards and wrap to a new row of four. */
@media (min-width:761px){ .grid.more{grid-template-columns:repeat(4,minmax(0,1fr))} }
/* C36 tile loop (2026-11-06): at the end of its loop range the film fades to its first-frame poster, then returns */
.tile.loop-fade video{opacity:0!important;transition:opacity .25s ease}
/* More Work cards for projects not yet decided (HYO, 2026-11-06): a quiet paper card at tile size, not a link */
.tile.soon{display:flex;align-items:flex-end;background:#f2efe9;box-shadow:inset 0 0 0 1px rgba(30,29,27,.08)}
.tile.soon .soon-in{display:flex;flex-direction:column;gap:4px;padding:0 0 clamp(14px,8%,26px) clamp(14px,9%,28px)}
.tile.soon b{font:500 clamp(18px,1.9vw,30px)/.95 'Anybody',var(--font);font-stretch:76%;letter-spacing:-.02em;color:#1e1d1b}
.tile.soon i{font-style:normal;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8b8780}
