/* THE ROOM, LIT (2026-11-09). Every surface is the folio's black book cloth under a real lamp. The lamp's light is
   MULTIPLIED into the cloth map, so the weave shows exactly where light falls and the far field lands on the room's
   own black. The overlay lamps this replaces could not lift a 3% base past 5%, which is why the cloth read flat.
   Pool: a point lamp over a plane, E(r) = (1 + (r/h)^2)^-1.5 with h = .55, cut by the shade's soft cone; the stops
   are generated by tools/realism/build-room.py, which also hashes this file into /m/. */
:root{--cloth:url(/gd/m/cloth.7f5a3cc83e.webp) 0 0/128px 128px;--unlit:linear-gradient(#111113,#111113);--pool:620px;--lamp:rgb(118,117,114) 0%,rgb(117,116,113) 5%,rgb(113,112,109) 10%,rgb(108,107,104) 15%,rgb(101,100,98) 20%,rgb(93,92,91) 25%,rgb(85,85,83) 30%,rgb(78,77,76) 35%,rgb(70,70,69) 40%,rgb(64,63,63) 45%,rgb(58,58,57) 50%,rgb(53,52,53) 55%,rgb(48,48,48) 60%,rgb(44,44,45) 65%,rgb(41,40,41) 70%,rgb(35,35,36) 75%,rgb(30,29,31) 80%,rgb(24,24,26) 85%,rgb(20,20,22) 90%,rgb(18,18,20) 95%,rgb(17,17,19) 100%}
@media (max-width:720px){:root{--pool:440px}}

/* the unlit cloth, wherever no lamp reaches (the two pages built from tables; the one-column pages keep their own sheets) */
body:has(#boot) main,body:has(#boot)>footer,body:has(.featured),body:has(.featured)>footer{background:var(--unlit),var(--cloth);background-blend-mode:multiply,normal}

/* one lamp over each table: every section already names where its lamp hangs (--lx/--ly). Seen from a standing
   eye-line a round pool foreshortens into an ellipse, and its depth (--lry) is the distance to the nearer edge of its
   table, so every pool has fallen to the room's black before the next section starts: no seams. */
main .beat,section.cta,body:has(.featured) .hero,.featured{background:radial-gradient(ellipse var(--pool) var(--lry,46%) at var(--lx) var(--ly),var(--lamp)),var(--cloth);background-blend-mode:multiply,normal}
main .beat,section.cta,.table-band,.featured{border-top-color:transparent}      /* one cloth, no seams between its tables */
section.cta{--lry:40%}
.featured{--ly:30%;--lry:30%}
body:has(.featured) .hero{--lry:34%}
@media (max-width:720px){.beat,.beat.rev{--lry:24%}}
.tb-cloth{background:radial-gradient(circle calc(var(--pool)*1.1) at 50% 24%,var(--lamp)),var(--cloth);background-blend-mode:multiply,normal}
main .beat::before,section.cta::before,body:has(.featured) .hero::before,.featured::before,.table-band::before,.tb-cloth::before{display:none}

/* a page that is one column of words: one lamp just above it, fixed, with the cloth sliding under it */
html:not(:has(.beat)):not(:has(#boot)){background:radial-gradient(circle 980px at 50% -160px,var(--lamp)) fixed,var(--cloth);background-blend-mode:multiply,normal}
html:not(:has(.beat)):not(:has(#boot)) body::before{display:none}

/* every print and sheet answers its own lamp: room.js writes --shx/--shy (the cast, falling away from the lamp),
   --gl (the gloss, starting on the lamp's side) and --lit (how much of the lamp reaches it). Without JS they keep
   the bar's own cast, straight down. */
.pol{box-shadow:var(--hl),calc(var(--shx,0)*1px) calc(var(--shy,10)*1px) 16px rgba(0,0,0,.55),calc(var(--shx,0)*1.8px) calc(var(--shy,10)*2.2px) 40px -18px rgba(0,0,0,.5);filter:brightness(var(--lit,1))}
.print6{box-shadow:var(--hl),calc(var(--shx,0)*1px) calc(var(--shy,10)*1px) 16px rgba(0,0,0,.55);filter:brightness(var(--lit,1))}
.card{box-shadow:var(--hl),calc(var(--shx,0)*1px) calc(var(--shy,10)*1px) 16px rgba(0,0,0,.55),calc(var(--shx,0)*1.8px) calc(var(--shy,10)*2.6px) 44px -22px rgba(0,0,0,.55)}
.pol::before,.print6::before{background:linear-gradient(var(--gl,145.3deg),rgba(255,255,255,.14),rgba(255,255,255,0) 70%)}

/* the bar's breath: each print rises two pixels and settles, out of step with its neighbours; never under Reduce Motion */
@media (prefers-reduced-motion:no-preference){.pol,.print6{animation:roomBreath 8.4s ease-in-out infinite;animation-delay:var(--bd,0s)}}
@keyframes roomBreath{0%,100%{translate:0 0}50%{translate:0 -2px}}
/* THE PLATES (2026-11-09, the owner: "revamp all these buttons"). No bubbles: two materials the house already owns.
   GOLD FOIL hot-stamped for the one act a page exists for, and a plate PRESSED into the cloth for the rest: crisp 4px
   corners, labels printed in the house mono, and the existing light-sweep crossing the foil as you reach for it.
   Self-contained (no custom properties), so the restaurant share function can inline it under its own CSP. */
.btn-x,.gobtn,.act{border-radius:4px;text-transform:uppercase;font-family:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;font-weight:600}
.btn-x:not(.dl),.act{font-size:12px;line-height:1.25;letter-spacing:.14em}
.gobtn{letter-spacing:.2em}
.btn-gold,.gobtn:not(.demo),.act.primary{color:#1E1608;text-shadow:0 1px 0 rgba(255,238,190,.5);
  background:url(/tonight/m/paper.b18b431ec1.webp) 0 0/96px 96px padding-box,
    linear-gradient(180deg,#F6DB94 0%,#E7C26C 24%,#D6AB53 52%,#C59640 80%,#B08433 100%) padding-box,
    linear-gradient(180deg,#FFF0C4,#7E5A1C) border-box;
  background-blend-mode:soft-light,normal,normal;
  box-shadow:inset 0 1px 0 rgba(255,248,222,.8),inset 0 -1px 0 rgba(96,66,18,.5),0 1px 0 rgba(0,0,0,.65),0 8px 18px -8px rgba(0,0,0,.85)}
.btn-gold:hover,.gobtn:not(.demo):hover,.act.primary:hover{box-shadow:inset 0 1px 0 rgba(255,250,230,.9),inset 0 -1px 0 rgba(96,66,18,.5),0 1px 0 rgba(0,0,0,.65),0 12px 24px -10px rgba(0,0,0,.9)}
.btn-gold:active,.gobtn:not(.demo):active,.act.primary:active{box-shadow:inset 0 2px 3px rgba(96,66,18,.55)}
.btn-glass,.gobtn.demo,.act.ghost{color:#F2ECEF;-webkit-backdrop-filter:none;backdrop-filter:none;
  background:linear-gradient(#111113,#111113) padding-box,url(/gd/m/cloth.7f5a3cc83e.webp) 0 0/128px 128px padding-box,
    linear-gradient(180deg,rgba(222,186,108,.6),rgba(150,116,52,.38)) border-box;
  background-blend-mode:multiply,normal,normal;
  box-shadow:inset 0 2px 5px rgba(0,0,0,.85),inset 0 -1px 0 rgba(255,246,226,.09),0 1px 0 rgba(255,255,255,.05)}
.top .btn-glass,header .btn-glass{color:#F2ECEF}                   /* gold lives in the hairline, never in the type */
.btn-glass:hover,.gobtn.demo:hover,.act.ghost:hover{color:#fff;
  background:linear-gradient(#151517,#151517) padding-box,url(/gd/m/cloth.7f5a3cc83e.webp) 0 0/128px 128px padding-box,
    linear-gradient(180deg,rgba(240,208,136,.85),rgba(172,136,66,.55)) border-box;
  background-blend-mode:multiply,normal,normal}
.btn-glass:active,.gobtn.demo:active,.act.ghost:active{box-shadow:inset 0 3px 7px rgba(0,0,0,.9),inset 0 -1px 0 rgba(255,246,226,.06)}
.btn-glass::before,.gobtn.demo::before,.act.ghost::before{background:linear-gradient(105deg,rgba(255,246,226,0) 30%,rgba(255,246,226,.07) 48%,rgba(255,246,226,0) 64%)}
