/* THE NEW ORG CHART and THE SIGN ON THE DOOR, between SEND IT and BUY $QUIT IN 3 STEPS (tools/quit-site/org-chart.mjs).
   THE WAR ROOM (B1) and THE CLIPPER ARMY (B2 on a desktop, PB2 on a phone), approved by the owner on 23 Oct 2026; the
   ladder (A2) and the sign (B1, PB1) as approved on 22 Oct 2026. The words are live HTML over text-free plates
   (runtime/quit/org-chart-art/), placed in the plates' own proportions so the composition holds at every width.

   Sizes are in the frames' own pixels through the section's width (container units): --w is one pixel of the 1672-wide
   war room and army plates, --u one pixel of the 1536-wide ladder and sign frames, --v one pixel of the 853-wide phone
   frames, --p one pixel of the 941-wide war room phone plate and --q one pixel of the 887-wide PB2 phone frame. The display
   face sets titles, labels and chips, the body face the lines. Colours are the frames': near-black, forest, mint, safety
   orange, cream, tan, brass. */
.q-oc,.q-sign{--oc-black:#0b0f0c;--oc-panel:#0d1a12;--oc-forest:#13261a;--oc-mint:#3ceb86;--oc-orange:#ff6a13;--oc-cream:#efe3c4;--oc-ink:#f4e7cb;--oc-dark:#140b04;--oc-tan:#d69a55;--oc-gold:#c9a24b;--oc-grey:#7e8a80;
 --u:calc(100cqw / 1536);--v:calc(100cqw / 853);--w:calc(100cqw / 1672);--p:calc(100cqw / 941);--q:calc(100cqw / 887);
 position:relative;container-type:inline-size;color:var(--oc-ink);background:#030805;scroll-margin-top:var(--t-header-desktop,72px)}
.q-oc *,.q-sign *{box-sizing:border-box}
:where(.q-oc,.q-sign) :is(h2,h3,p,ul,ol,dl,dt,dd,figure){margin:0;padding:0}
:where(.q-oc,.q-sign) :is(ul,ol){list-style:none}
.q-oc picture,.q-sign picture{display:block}
.q-oc picture img,.q-sign picture img{display:block;width:100%;height:auto}
/* Rivets at a panel's four corners, the frames' small brass and mint screw heads. */
.q-oc-next,.q-oc-sign,.q-sign__panel{--rivet:var(--oc-mint);--rivet-size:calc(9 * var(--u));--rivet-at:calc(8 * var(--u));background-image:radial-gradient(circle,var(--rivet) 0 32%,var(--oc-black) 34% 52%,transparent 54%),radial-gradient(circle,var(--rivet) 0 32%,var(--oc-black) 34% 52%,transparent 54%),radial-gradient(circle,var(--rivet) 0 32%,var(--oc-black) 34% 52%,transparent 54%),radial-gradient(circle,var(--rivet) 0 32%,var(--oc-black) 34% 52%,transparent 54%);background-repeat:no-repeat;background-size:var(--rivet-size) var(--rivet-size);background-position:var(--rivet-at) var(--rivet-at),calc(100% - var(--rivet-at)) var(--rivet-at),var(--rivet-at) calc(100% - var(--rivet-at)),calc(100% - var(--rivet-at)) calc(100% - var(--rivet-at))}

/* B1, THE WAR ROOM: one plate (1672 x 941) carries the windows, the map wall, the platform with the empty chair and its
   blank plaque, the four stations and the empty steel panel under each; the headline sits over the map's calm corner, YOU
   on the plaque, each sign on its station's panel, and Gary's cutout flies out over the section's top edge. A sign
   taller than its panel grows the war room rather than leaving it. */
.q-oc-tower{position:relative;display:grid;grid-template-columns:minmax(0,1fr);background:#07090a}
.q-oc-tower>*{grid-area:1/1}
.q-oc-head{position:absolute;inset:0 0 auto;z-index:2;padding:calc(30 * var(--w)) calc(40 * var(--w)) 0;pointer-events:none}
.q-oc-head>*{pointer-events:auto}
.q-oc-memo{display:inline-block;padding:calc(8 * var(--w)) calc(14 * var(--w)) calc(7 * var(--w));border:calc(3 * var(--w)) solid var(--oc-orange);background:var(--oc-black);color:var(--oc-orange);font:400 calc(19 * var(--w))/1 var(--t-font-display);letter-spacing:.06em}
.q-oc-title{margin-top:calc(6 * var(--w));font:700 calc(64 * var(--w))/1 var(--t-font-display);letter-spacing:0}
.q-oc-title>span{display:table;padding:calc(4 * var(--w)) calc(14 * var(--w)) calc(3 * var(--w)) calc(9 * var(--w));margin-left:calc(-9 * var(--w));background:var(--oc-black)}
.q-oc-title__quit{color:var(--oc-cream)}
.q-oc-title__ai{color:var(--oc-orange)}
.q-oc-lede{display:inline-block;margin:0 0 0 calc(-9 * var(--w));padding:calc(5 * var(--w)) calc(12 * var(--w)) calc(6 * var(--w)) calc(9 * var(--w));background:var(--oc-black);color:var(--oc-ink);font:400 calc(19 * var(--w))/1.2 var(--t-font-body);white-space:nowrap}
.q-oc-lastbuy{position:absolute;top:calc(34 * var(--w));right:calc(34 * var(--w));display:flex;align-items:center;gap:calc(12 * var(--w));padding:calc(12 * var(--w)) calc(16 * var(--w));border:calc(3 * var(--w)) solid #2a3a30;outline:calc(2 * var(--w)) solid #050806;background:var(--oc-black);color:var(--oc-mint);font:400 calc(20 * var(--w))/1 var(--t-font-display);letter-spacing:.04em;white-space:nowrap}
.q-oc-lastbuy__dot{flex:none;width:calc(15 * var(--w));height:calc(15 * var(--w));border-radius:50%;background:var(--oc-mint);box-shadow:0 0 calc(6 * var(--w)) var(--oc-mint)}
/* YOU on the plate's blank cream plaque, on the platform under the empty chair. */
.q-oc-boss{position:absolute;left:calc(748 * var(--w));top:calc(413 * var(--w));z-index:1;width:calc(170 * var(--w));height:calc(79 * var(--w));display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#16120b}
.q-oc-boss__you{font:700 calc(38 * var(--w))/.95 var(--t-font-display);letter-spacing:.02em}
.q-oc-boss__line{margin-top:calc(4 * var(--w));font:600 max(12px,calc(14.5 * var(--w)))/1 var(--t-font-body);letter-spacing:.03em;white-space:nowrap}
/* Gary, cut out, rockets out of the war room over the section's top edge (B1). Decorative and click-through. */
.q-oc .q-oc-gary{position:absolute;left:calc(1078 * var(--w));top:calc(-92 * var(--w));z-index:3;width:calc(340 * var(--w));height:auto;pointer-events:none;filter:drop-shadow(0 calc(12 * var(--w)) calc(10 * var(--w)) rgba(0,0,0,.55));animation:q-oc-fly 3.2s ease-in-out infinite alternate}
@keyframes q-oc-fly{from{transform:translate(0,0) rotate(0deg)}to{transform:translate(calc(10 * var(--w)),calc(-14 * var(--w))) rotate(-2deg)}}
/* The stations: each list item spans its station on the plate (from its top at 508) and the steel panel under it (736
   to 906); its sign fills the panel. Hovering or focusing a station outlines it in mint (B1's live station). */
.q-oc-staff{align-self:start;z-index:1;display:grid;grid-template-columns:calc(32 * var(--w)) calc(382 * var(--w)) calc(20 * var(--w)) calc(390 * var(--w)) calc(22 * var(--w)) calc(392 * var(--w)) calc(18 * var(--w)) calc(386 * var(--w)) minmax(0,1fr);margin-top:calc(508 * var(--w))}
.q-oc-room{grid-row:1;position:relative;display:flex;flex-direction:column;min-height:calc(398 * var(--w));padding:calc(228 * var(--w)) calc(9 * var(--w)) 0}
.q-oc-room[data-oc-room="trader"]{grid-column:2}
.q-oc-room[data-oc-room="quitters"]{grid-column:4}
.q-oc-room[data-oc-room="stage"]{grid-column:6}
.q-oc-room[data-oc-room="treasury"]{grid-column:8}
.q-oc-room::before{content:"";position:absolute;inset:0;z-index:1;border:calc(4 * var(--w)) solid transparent;pointer-events:none;transition:border-color .18s ease-out,box-shadow .18s ease-out}
.q-oc-room:is(:hover,:focus-within)::before{border-color:var(--oc-mint);box-shadow:0 0 calc(20 * var(--w)) rgba(60,235,134,.55),inset 0 0 calc(22 * var(--w)) rgba(60,235,134,.28)}
.q-oc-room__art{display:none}
.q-oc-room__go{position:absolute;inset:0;z-index:2}
.q-oc-room__go:focus-visible{outline:3px solid var(--oc-cream);outline-offset:2px}
.q-oc-sign{flex:1;display:flex;flex-direction:column;align-items:flex-start;min-height:calc(170 * var(--w));padding:calc(13 * var(--w)) calc(15 * var(--w)) calc(12 * var(--w));border:calc(3 * var(--w)) solid var(--oc-mint);background-color:rgba(5,10,7,.94);--rivet:#c98a2e;--rivet-size:calc(8 * var(--w));--rivet-at:calc(3 * var(--w));transition:transform .18s ease-out}
.q-oc-room:is(:hover,:focus-within) .q-oc-sign{transform:translateY(calc(-6 * var(--w)))}
.q-oc-sign__title{margin-bottom:calc(8 * var(--w));color:var(--oc-cream);font:700 calc(21 * var(--w))/1 var(--t-font-display);letter-spacing:.08em;white-space:nowrap}
.q-oc-sign__line{color:var(--oc-ink);font:400 calc(16 * var(--w))/1.2 var(--t-font-body)}
.q-oc-chip{margin-top:auto;padding:calc(6 * var(--w)) calc(14 * var(--w)) calc(5 * var(--w));background:var(--oc-mint);color:var(--oc-black);font:700 max(12px,calc(14 * var(--w)))/1 var(--t-font-display);letter-spacing:.12em;white-space:nowrap}
.q-oc-chip[data-chip-state="soon"]{background:#d6a23d}
.q-oc-chip:is([data-chip-state="off"],[data-chip-state="reading"],[data-chip-state="unknown"],[data-chip-state="unavailable"]){background:#3a463e;color:#c9d2c6}
.q-oc-sign__line+.q-oc-sign__line{margin-top:calc(3 * var(--w))}
.q-oc-sign__line:last-of-type{margin-bottom:calc(9 * var(--w))}

/* B2, THE CLIPPER ARMY: one plate (1672 x 941) carries the steel wall, the empty map screen and the console; the words
   stand on the wall, the pins, marks and reels on the map's box (540, 80; 1120 x 552), the dial on the console's empty
   screen (962, 654). The words and the dial grow the floor if they ever need more height than the plate. */
.q-oc-army{position:relative;display:grid;grid-template-columns:minmax(0,1fr);background:#050806;scroll-margin-top:var(--t-header-desktop,72px)}
.q-oc-army>.q-oc-army__plate,.q-oc-army>.q-oc-army__copy,.q-oc-army>.q-oc-dial{grid-area:1/1}
.q-oc-army__copy{align-self:start;justify-self:start;z-index:1;display:flex;flex-direction:column;align-items:flex-start;width:calc(468 * var(--w));margin:calc(100 * var(--w)) 0 calc(30 * var(--w)) calc(32 * var(--w))}
.q-oc-army__memo{padding:calc(8 * var(--w)) calc(12 * var(--w)) calc(7 * var(--w));border:calc(3 * var(--w)) solid var(--oc-orange);background:var(--oc-black);color:var(--oc-orange);font:400 max(12px,calc(16 * var(--w)))/1 var(--t-font-display);letter-spacing:.06em;white-space:nowrap}
.q-oc-army__title{margin-top:calc(14 * var(--w));color:var(--oc-cream);font:700 calc(48 * var(--w))/1.06 var(--t-font-display);letter-spacing:0}
.q-oc-army__line{display:block}
.q-oc-army__line--hot{color:var(--oc-orange)}
.q-oc-army__lede{margin-top:calc(12 * var(--w));color:var(--oc-ink);font:400 max(12px,calc(17 * var(--w)))/1.3 var(--t-font-body)}
.q-oc-army__steps{display:flex;flex-direction:column;gap:calc(10 * var(--w));width:100%;margin-top:calc(20 * var(--w))}
.q-oc-army__step{display:grid;grid-template-columns:calc(86 * var(--w)) minmax(0,1fr);align-items:center;min-height:calc(60 * var(--w));border:calc(3 * var(--w)) solid #26332b;outline:calc(2 * var(--w)) solid #050806;background:#0b100d}
.q-oc-army__thumb{display:none}
.q-oc-army__num{display:grid;place-items:center;align-self:stretch;border-right:calc(2 * var(--w)) solid #26332b;color:var(--oc-orange);font:700 calc(34 * var(--w))/1 var(--t-font-display)}
.q-oc-army__label{padding:calc(6 * var(--w)) calc(14 * var(--w));color:var(--oc-cream);font:700 max(12px,calc(16 * var(--w)))/1.15 var(--t-font-display);letter-spacing:.06em}
.q-oc-army__keys{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:calc(12 * var(--w));width:100%;margin-top:calc(16 * var(--w))}
.q-oc .c-btn.q-oc-army__join,.q-oc .c-btn.q-oc-army__buy{display:flex;min-height:max(44px,calc(58 * var(--w)));padding:0 calc(10 * var(--w));border-radius:0;font:700 max(12px,calc(15 * var(--w)))/1 var(--t-font-display);letter-spacing:.03em;white-space:nowrap}
.q-oc .c-btn.q-oc-army__buy{border:calc(3 * var(--w)) solid var(--oc-mint);background:transparent;color:var(--oc-mint)}
.q-oc-army__pay{margin-top:calc(10 * var(--w));color:var(--oc-mint);font:400 max(12px,calc(13.5 * var(--w)))/1.3 var(--t-font-body)}
.q-oc-army__map{position:absolute;left:calc(540 * var(--w));top:calc(80 * var(--w));z-index:1;width:calc(1120 * var(--w));height:calc(552 * var(--w));pointer-events:none}
.q-oc .q-oc-army__mapplate{display:none}
/* The pins: small phones on the map's land, each one of the eight reel stills, lit by the dial in their order. */
.q-oc-pins{position:absolute;inset:0}
.q-oc-pin{position:absolute;width:calc(12 * var(--w));height:calc(21 * var(--w));margin:calc(-10.5 * var(--w)) 0 0 calc(-6 * var(--w));border:calc(1.5 * var(--w)) solid #d8f5e2;border-radius:calc(2 * var(--w));background:#0b0f0c var(--sprite) calc(var(--face) * 100% / (var(--tiles) - 1)) 0/calc(var(--tiles) * 100%) 100% no-repeat;box-shadow:0 0 calc(5 * var(--w)) rgba(60,235,134,.75);opacity:0;transform:scale(.3);transition:opacity .25s ease-out,transform .3s cubic-bezier(.2,1.6,.4,1)}
.q-oc-pin[data-on]{opacity:1;transform:none}
/* The official platform marks float over the map. */
.q-oc-mark{position:absolute;z-index:1;display:grid;place-items:center;width:calc(56 * var(--w));height:calc(56 * var(--w));margin:calc(-28 * var(--w)) 0 0 calc(-28 * var(--w));border:calc(2 * var(--w)) solid rgba(239,227,196,.3);border-radius:calc(12 * var(--w));background:#0b0f0c;box-shadow:0 0 0 calc(2 * var(--w)) #050806,0 0 calc(16 * var(--w)) rgba(60,235,134,.35);animation:q-oc-bob 3.6s ease-in-out infinite alternate}
.q-oc-mark:nth-of-type(even){animation-delay:-1.8s}
.q-oc-mark .q-pmark{width:calc(32 * var(--w));height:calc(32 * var(--w))}
@keyframes q-oc-bob{from{transform:translateY(0)}to{transform:translateY(calc(-6 * var(--w)))}}
/* The reels: the still in a phone from cut down, its cutout climbing out over the phone's top. */
.q-oc-phone{position:absolute;z-index:2;aspect-ratio:var(--ar)}
.q-oc-phone__body{position:absolute;left:-7%;right:-7%;top:calc(var(--cut) * 100% - 5%);bottom:-6%;border:calc(3 * var(--w)) solid #3b4a41;border-radius:calc(16 * var(--w));background:#050807;box-shadow:0 0 0 calc(2 * var(--w)) #0b0f0c,0 calc(10 * var(--w)) calc(22 * var(--w)) rgba(0,0,0,.6),0 0 calc(22 * var(--w)) rgba(60,235,134,.4)}
.q-oc .q-oc-phone__reel,.q-oc .q-oc-phone__pop{position:absolute;inset:0;display:block;width:100%;height:100%}
.q-oc-phone__reel{clip-path:inset(calc(var(--cut) * 100%) 0 0 0 round calc(8 * var(--w)))}
.q-oc-phone__pop{clip-path:inset(0 0 calc((1 - var(--cut)) * 100% - 3%) 0);filter:drop-shadow(0 calc(6 * var(--w)) calc(6 * var(--w)) rgba(0,0,0,.45));animation:q-oc-peek 2.8s ease-in-out infinite alternate}
.q-oc-phone:nth-child(odd) .q-oc-phone__pop{animation-delay:-1.4s}
@keyframes q-oc-peek{from{transform:translateY(0)}to{transform:translateY(calc(-5 * var(--w)))}}
.q-oc-phone--lead{display:none}
/* SCALE THE ARMY on the console's empty screen. */
.q-oc-dial{align-self:start;justify-self:start;z-index:1;display:flex;flex-direction:column;width:calc(516 * var(--w));min-height:calc(238 * var(--w));margin:calc(652 * var(--w)) 0 calc(36 * var(--w)) calc(962 * var(--w));color:var(--oc-ink)}
.q-oc-dial__title{color:var(--oc-cream);font:700 calc(24 * var(--w))/1 var(--t-font-display);letter-spacing:.06em;text-align:center}
.q-oc-dial__range{--fill:50%;width:100%;height:max(44px,calc(36 * var(--w)));margin:calc(8 * var(--w)) 0 0;background:transparent;cursor:pointer;-webkit-appearance:none;appearance:none}
.q-oc-dial__range::-webkit-slider-runnable-track{height:calc(16 * var(--w));border:calc(2 * var(--w)) solid #3a463e;border-radius:calc(8 * var(--w));background:linear-gradient(90deg,var(--oc-orange) var(--fill),#101612 var(--fill))}
.q-oc-dial__range::-moz-range-track{height:calc(16 * var(--w));border:calc(2 * var(--w)) solid #3a463e;border-radius:calc(8 * var(--w));background:linear-gradient(90deg,var(--oc-orange) var(--fill),#101612 var(--fill))}
.q-oc-dial__range::-webkit-slider-thumb{width:max(24px,calc(34 * var(--w)));height:max(24px,calc(34 * var(--w)));margin-top:calc(-11 * var(--w));border:calc(3 * var(--w)) solid #ffb27a;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffc59b,var(--oc-orange) 55%,#a83c00);box-shadow:0 0 calc(12 * var(--w)) rgba(255,106,19,.7);-webkit-appearance:none;appearance:none}
.q-oc-dial__range::-moz-range-thumb{width:max(24px,calc(34 * var(--w)));height:max(24px,calc(34 * var(--w)));border:calc(3 * var(--w)) solid #ffb27a;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffc59b,var(--oc-orange) 55%,#a83c00);box-shadow:0 0 calc(12 * var(--w)) rgba(255,106,19,.7)}
.q-oc-dial__range:focus-visible{outline:3px solid var(--oc-cream);outline-offset:4px}
.q-oc-dial__ticks{display:flex;justify-content:space-between;margin-top:calc(2 * var(--w));color:var(--oc-cream);font:700 max(12px,calc(13 * var(--w)))/1 var(--t-font-display)}
.q-oc-dial__label{margin-top:calc(10 * var(--w));color:var(--oc-cream);font:700 max(12px,calc(14 * var(--w)))/1 var(--t-font-display);letter-spacing:.08em;text-align:center}
.q-oc-dial__label span{color:var(--oc-orange)}
.q-oc-dial__readouts{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr) minmax(0,1.25fr);gap:calc(10 * var(--w));margin-top:calc(12 * var(--w))}
.q-oc-dial__cell{display:flex;flex-direction:column;align-items:center;gap:calc(8 * var(--w));min-width:0;padding:calc(9 * var(--w)) calc(4 * var(--w));border:calc(2 * var(--w)) solid var(--oc-mint);background:#050a07}
.q-oc-dial__cell dt{color:var(--oc-mint);font:700 max(12px,calc(11.5 * var(--w)))/1 var(--t-font-display);letter-spacing:.06em;white-space:nowrap}
.q-oc-dial__cell dd{color:var(--oc-mint);font:700 calc(18 * var(--w))/1 var(--t-font-display);font-variant-numeric:tabular-nums;white-space:nowrap;text-shadow:0 0 calc(8 * var(--w)) rgba(60,235,134,.6)}
.q-oc-dial__note{margin-top:calc(9 * var(--w));color:var(--oc-ink);font:400 max(12px,calc(13 * var(--w)))/1.2 var(--t-font-body);text-align:center}
@media (prefers-reduced-motion:reduce){.q-oc .q-oc-gary,.q-oc-mark,.q-oc-phone__pop{animation:none}.q-oc-pin{transition:none}}

/* A2, the ladder: the live strip in the site's riveted bezel, then the climb on the left and NEXT FOR HOLDERS on the right. */
.q-oc-ladder{display:grid;grid-template-columns:minmax(0,920fr) minmax(0,575fr);column-gap:calc(20 * var(--u));padding:calc(14 * var(--u)) calc(11 * var(--u)) calc(54 * var(--u));background:#050806}
.q-oc-strip{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;min-height:calc(132 * var(--u));margin-bottom:calc(42 * var(--u));border-style:solid;border-width:calc(18 * var(--u)) calc(34 * var(--u));border-image:url(/runtime/quit/pages-art/strip.png) 26 46 fill / calc(18 * var(--u)) calc(34 * var(--u)) stretch;background:#020504 padding-box}
.q-oc-strip__cell{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(18 * var(--u));min-width:0;padding:calc(4 * var(--u)) calc(8 * var(--u));border-left:calc(2 * var(--u)) solid var(--oc-mint);text-align:center}
.q-oc-strip__cell:first-child{border-left:0}
/* LAST BUY is hidden while the newest buy is ten minutes old or more (runtime/quit/org-chart.js): the strip closes up
   to its three other cells. */
.q-oc-lastbuy[hidden],.q-oc-strip__cell[hidden]{display:none}
.q-oc-strip:has(>.q-oc-strip__cell[hidden]){grid-template-columns:repeat(3,minmax(0,1fr))}
.q-oc-strip__cell[hidden]+.q-oc-strip__cell{border-left:0}
.q-oc-strip dt{color:var(--oc-mint);font:700 max(10px,calc(15 * var(--u)))/1 var(--t-font-display);letter-spacing:.08em}
.q-oc-strip dd{color:var(--oc-cream);font:700 calc(25 * var(--u))/1 var(--t-font-display);letter-spacing:0;white-space:nowrap}
.q-oc-climb{min-width:0;padding-left:calc(14 * var(--u))}
.q-oc-climb__title{margin:calc(4 * var(--u)) 0 calc(18 * var(--u)) calc(14 * var(--u));color:var(--oc-cream);font:700 calc(56 * var(--u))/1.08 var(--t-font-display);letter-spacing:.02em}
.q-oc-stairs{position:relative;width:calc(905 * var(--u))}
.q-oc-faces{display:none;position:absolute;inset:0;pointer-events:none}
.q-oc-steps{position:absolute;inset:0;pointer-events:none}
.q-oc-step{position:absolute;display:flex;flex-direction:column;padding:calc(24 * var(--u)) calc(12 * var(--u)) 0 calc(22 * var(--u));color:#17130c}
.q-oc-step[data-oc-step="1"]{left:3.4%;top:78.6%;width:30.5%;height:19.4%;padding-top:calc(13 * var(--u))}
.q-oc-step[data-oc-step="2"]{left:34.4%;top:63.8%;width:29.7%;height:34.2%}
.q-oc-step[data-oc-step="3"]{left:64.6%;top:49.4%;width:34.8%;height:48.6%}
.q-oc-step__amount{font:700 calc(21 * var(--u))/1 var(--t-font-display);letter-spacing:0;white-space:nowrap}
.q-oc-step__line{font:400 calc(20 * var(--u))/1.2 var(--t-font-body)}
.q-oc-step__amount+.q-oc-step__line{margin-top:calc(10 * var(--u))}
.q-oc-step__line+.q-oc-step__line{margin-top:calc(14 * var(--u))}
.q-oc-next{display:flex;flex-direction:column;align-items:stretch;align-self:start;margin-top:calc(-4 * var(--u));padding:calc(40 * var(--u)) calc(38 * var(--u)) calc(30 * var(--u));border:calc(3 * var(--u)) solid #2f6b45;outline:calc(2 * var(--u)) solid var(--oc-mint);outline-offset:calc(-12 * var(--u));background-color:var(--oc-panel);--rivet:#3d5a46;--rivet-at:calc(5 * var(--u))}
.q-oc-next__title{color:var(--oc-mint);font:700 calc(35 * var(--u))/1 var(--t-font-display);letter-spacing:.06em}
.q-oc-next__line{margin-top:calc(20 * var(--u));color:var(--oc-ink);font:400 calc(25 * var(--u))/1.25 var(--t-font-body)}
.q-oc-clock{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:calc(10 * var(--u));margin-top:calc(36 * var(--u))}
.q-oc-clock[hidden],.q-oc-next [hidden]{display:none}
.q-oc-clock__cell{display:grid;justify-items:center;gap:calc(13 * var(--u))}
.q-oc-clock__digits{display:grid;place-items:center;width:100%;aspect-ratio:113/100;border:calc(2 * var(--u)) solid #2e3d33;background:#060a07;color:var(--oc-orange);font:700 calc(54 * var(--u))/1 var(--t-font-display);font-variant-numeric:tabular-nums}
.q-oc-clock__unit{color:var(--oc-mint);font:700 max(12px,calc(14 * var(--u)))/1 var(--t-font-display);letter-spacing:.1em}
.q-oc-next__when{margin-top:calc(34 * var(--u));color:var(--oc-ink);font:400 calc(25 * var(--u))/1.2 var(--t-font-body)}
.q-oc .c-btn.q-oc-cta,.q-sign .c-btn.q-sign__cta{display:flex;width:100%;min-height:calc(80 * var(--u));margin-top:calc(34 * var(--u));padding:0 calc(12 * var(--u));border-radius:0;font-size:calc(25 * var(--u));letter-spacing:.04em;white-space:nowrap}
.q-oc .c-btn.q-oc-watch{display:flex;width:100%;min-height:calc(74 * var(--u));margin-top:calc(22 * var(--u));padding:0 calc(16 * var(--u));border:calc(3 * var(--u)) solid var(--oc-mint);border-radius:0;background:transparent;color:var(--oc-mint);font:700 calc(25 * var(--u))/1 var(--t-font-display);letter-spacing:.05em;white-space:nowrap}
.q-oc .c-btn.q-oc-watch--narrow{display:none}
/* WATCH THE STAFF WORK opens the stream the footer's WATCH THE STREAM opens at this width (runtime/quit/stream-links.js
   STREAM_PHONE: the vertical stream on a phone or a portrait tablet), with or without JavaScript. */
@media (max-width:767px),(max-width:1199px) and (max-aspect-ratio:3/4){.q-oc .c-btn.q-oc-watch--wide{display:none}.q-oc .c-btn.q-oc-watch--narrow{display:flex}}
/* The phone frame breaks each title line once (tools/quit-site/org-chart.json title_phone); the desktop frame does not. */
@media (min-width:768px) and (not ((max-width:1199px) and (max-aspect-ratio:3/4))) and (not ((pointer:coarse) and (max-height:500px))){.q-oc-br{display:none}}

/* B1, THE SIGN ON THE DOOR: the faded cubicle pyramid on the left with the canonical Pyramid-Q mounted on its wall. */
.q-sign{padding:.85% .65% .9%;background:#050806}
.q-sign__panel{display:grid;grid-template-columns:calc(686 * var(--u)) minmax(0,1fr);column-gap:calc(40 * var(--u));min-height:calc(786 * var(--u));padding:calc(5 * var(--u));border:calc(3 * var(--u)) solid var(--oc-gold);outline:calc(2 * var(--u)) solid #3b2f14;outline-offset:calc(-9 * var(--u));background-color:#0e0c08;--rivet:var(--oc-gold);--rivet-size:calc(12 * var(--u));--rivet-at:calc(6 * var(--u))}
.q-sign__art{position:relative;overflow:hidden;min-height:100%;background:#0b0906}
.q-sign__plate{position:absolute;inset:0}
/* The plate keeps its own proportions at the bottom of the panel; its wall fades into the panel's above it, so the
   sign hangs on a bare wall over the pyramid, as in B1. */
.q-sign .q-sign__plate{inset:auto 0 0}
.q-sign .q-sign__plate img{width:100%;height:auto;-webkit-mask-image:linear-gradient(transparent,#000 22%);mask-image:linear-gradient(transparent,#000 22%)}
.q-sign__mark{position:absolute;left:15.5%;top:4.6%;width:69%;height:auto;filter:drop-shadow(calc(6 * var(--u)) calc(10 * var(--u)) calc(6 * var(--u)) rgba(0,0,0,.75)) drop-shadow(0 0 calc(18 * var(--u)) rgba(201,162,75,.18))}
.q-sign__copy{display:flex;flex-direction:column;align-items:flex-start;padding:calc(53 * var(--u)) calc(36 * var(--u)) calc(40 * var(--u)) 0}
.q-sign__memo{padding:calc(11 * var(--u)) calc(15 * var(--u)) calc(10 * var(--u));border:calc(3 * var(--u)) solid var(--oc-gold);color:#d9b45c;font:700 calc(17 * var(--u))/1 var(--t-font-display);letter-spacing:.1em}
.q-sign__title{margin-top:calc(28 * var(--u));color:var(--oc-cream);font:700 calc(72 * var(--u))/1.04 var(--t-font-display);letter-spacing:0}
.q-sign__body{margin-top:calc(26 * var(--u));color:var(--oc-ink);font:400 calc(27 * var(--u))/1.14 var(--t-font-body)}
.q-sign__rows{width:100%;margin-top:calc(24 * var(--u));border:calc(2 * var(--u)) solid var(--oc-gold)}
.q-sign__row{display:grid;grid-template-columns:calc(266 * var(--u)) minmax(0,1fr);align-items:center;min-height:calc(54 * var(--u))}
.q-sign__row+.q-sign__row{border-top:calc(2 * var(--u)) solid var(--oc-gold)}
.q-sign__row dt{align-self:stretch;display:flex;align-items:center;padding:0 calc(16 * var(--u));border-right:calc(2 * var(--u)) solid var(--oc-gold);color:var(--oc-cream);font:700 calc(17 * var(--u))/1 var(--t-font-display);letter-spacing:.06em;white-space:nowrap}
.q-sign__row[data-sign-q] dt{color:#e0b450}
.q-sign__row dd{padding:calc(10 * var(--u)) calc(16 * var(--u));color:var(--oc-ink);font:400 calc(21 * var(--u))/1.2 var(--t-font-body)}
.q-sign .c-btn.q-sign__cta{margin-top:calc(22 * var(--u));min-height:calc(72 * var(--u));font-size:calc(29 * var(--u))}
.q-sign__note{margin-top:calc(30 * var(--u));color:var(--oc-ink);font:400 calc(23 * var(--u))/1.2 var(--t-font-body)}

/* Narrow desktops: the signs' lines, the chips and the small labels keep 12 px; a sign may then grow the war room below
   its plate. */
@media (min-width:768px) and (max-width:1279px){
 .q-oc-sign__line{font-size:max(12px,calc(16 * var(--w)))}
 .q-oc-chip,.q-oc-strip dt,.q-oc-clock__unit,.q-oc-dial__cell dt{font-size:max(12px,calc(14 * var(--w)))}
}

/* The phone composition (THE WAR ROOM stacked, PB2, A2 stacked, PB1), in the site's phone column. */
@media (max-width:767px),(max-width:1199px) and (max-aspect-ratio:3/4),(pointer:coarse) and (max-height:500px){
 .q-oc,.q-sign{scroll-margin-top:var(--t-header-phone,62px)}
 /* THE WAR ROOM on a phone: the head box over the windows, Gary flying out at its side, YOU on the plaque, then each
    station's own plate with its sign. */
 .q-oc-head{inset:auto;left:calc(34 * var(--p));top:calc(28 * var(--p));width:calc(640 * var(--p));padding:calc(24 * var(--p)) calc(24 * var(--p)) calc(20 * var(--p));border:calc(4 * var(--p)) solid #2b3a31;background:var(--oc-black);box-shadow:0 0 0 calc(2 * var(--p)) #070b08}
 .q-oc-memo{padding:calc(9 * var(--p)) calc(12 * var(--p)) calc(8 * var(--p));border-width:calc(3 * var(--p));font-size:max(12px,calc(22 * var(--p)));font-weight:700;letter-spacing:.08em;text-wrap:balance}
 .q-oc-title{margin-top:calc(18 * var(--p));font-size:calc(66 * var(--p));line-height:1.08}
 .q-oc-title>span{display:block;padding:0;margin:0;background:none}
 .q-oc-lede{display:block;margin:calc(16 * var(--p)) 0 0;padding:0;background:none;font-size:max(13px,calc(30 * var(--p)));line-height:1.36;white-space:normal}
 .q-oc-lastbuy{position:static;margin-top:calc(12 * var(--p));padding:0;border:0;outline:0;background:none;gap:calc(14 * var(--p));font:700 max(12px,calc(24 * var(--p)))/1 var(--t-font-display);letter-spacing:.08em}
 .q-oc-lastbuy__dot{width:calc(24 * var(--p));height:calc(24 * var(--p))}
 .q-oc .q-oc-gary{left:auto;right:calc(-30 * var(--p));top:calc(70 * var(--p));width:calc(360 * var(--p))}
 .q-oc-boss{left:calc(348 * var(--p));top:calc(1204 * var(--p));width:calc(247 * var(--p));height:calc(106 * var(--p))}
 .q-oc-boss__you{font-size:calc(42 * var(--p))}
 .q-oc-boss__line{margin-top:calc(3 * var(--p));font-size:max(12px,calc(20 * var(--p)));letter-spacing:.04em}
 .q-oc-tower{display:block}
 .q-oc-staff{display:flex;flex-direction:column;margin-top:0;background:#0a0d0b}
 .q-oc-room{display:block;min-height:0;padding:0 0 calc(22 * var(--v))}
 .q-oc-room::before{inset:0 0 calc(22 * var(--v))}
 .q-oc-room__art{display:block;width:100%;height:auto}
 .q-oc-sign{position:relative;z-index:1;min-height:0;margin:calc(-104 * var(--v)) calc(150 * var(--v)) 0 calc(20 * var(--v));padding:calc(20 * var(--v)) calc(22 * var(--v)) calc(18 * var(--v));border-width:calc(4 * var(--v));--rivet-size:calc(10 * var(--v));--rivet-at:calc(4 * var(--v))}
 .q-oc-room:nth-child(even) .q-oc-sign{margin:calc(-104 * var(--v)) calc(20 * var(--v)) 0 calc(150 * var(--v))}
 .q-oc-room:is(:hover,:focus-within) .q-oc-sign{transform:none}
 .q-oc-sign__title{font-size:calc(34 * var(--v));margin-bottom:calc(10 * var(--v))}
 .q-oc-sign__line{font-size:max(12px,calc(25 * var(--v)));line-height:1.3}
 .q-oc-chip{margin-top:calc(8 * var(--v));padding:calc(8 * var(--v)) calc(16 * var(--v)) calc(7 * var(--v));font-size:max(12px,calc(19 * var(--v)))}

 /* THE CLIPPER ARMY on a phone (PB2): the words, the map with its pins, marks and reels, the steps with a reel each, the
    dial, the keys; the first reel climbs out at the top right beside the headline. */
 .q-oc-army{display:flex;flex-direction:column;padding:calc(30 * var(--q)) calc(22 * var(--q)) calc(44 * var(--q));background:#070b08;scroll-margin-top:var(--t-header-phone,62px)}
 .q-oc .q-oc-army__plate{display:none}
 .q-oc-army__copy{display:contents}
 .q-oc-army__memo{order:1;align-self:flex-start;max-width:calc(560 * var(--q));padding:calc(10 * var(--q)) calc(12 * var(--q));border-width:calc(3 * var(--q));font-size:max(12px,calc(20 * var(--q)));white-space:normal}
 .q-oc-army__title{order:2;margin-top:calc(18 * var(--q));padding-right:calc(262 * var(--q));font-size:calc(52 * var(--q));line-height:1.06}
 .q-oc-army__lede{order:3;margin-top:calc(16 * var(--q));padding-right:calc(262 * var(--q));font-size:max(13px,calc(26 * var(--q)));line-height:1.4}
 .q-oc-army__map{order:4;position:relative;left:auto;top:auto;width:100%;height:auto;aspect-ratio:1120/552;margin-top:calc(26 * var(--q));border:calc(4 * var(--q)) solid #26332b;outline:calc(2 * var(--q)) solid #050806}
 .q-oc .q-oc-army__mapplate{display:block;position:absolute;inset:0}
 .q-oc .q-oc-army__mapplate img{width:100%;height:100%;object-fit:cover}
 .q-oc-pin{width:2%;height:auto;aspect-ratio:64/114;margin:-1.8% 0 0 -1%;border-width:1px;border-radius:1px;box-shadow:0 0 3px rgba(60,235,134,.75)}
 .q-oc-mark{width:7.5%;height:auto;aspect-ratio:1;margin:-3.75% 0 0 -3.75%;border-width:1px;border-radius:18%}
 .q-oc-mark .q-pmark{width:58%;height:58%}
 .q-oc-army__map .q-oc-phone[data-oc-phone="bambi"]{display:none}
 .q-oc-phone__body{border-width:2px;border-radius:10px}
 .q-oc-phone--lead{display:block;position:absolute;top:calc(40 * var(--q));right:calc(26 * var(--q));width:calc(220 * var(--q))}
 .q-oc-army__steps{order:5;gap:calc(14 * var(--q));margin-top:calc(26 * var(--q))}
 .q-oc-army__step{grid-template-columns:calc(250 * var(--q)) calc(108 * var(--q)) minmax(0,1fr);min-height:calc(96 * var(--q));border-width:calc(3 * var(--q))}
 .q-oc .q-oc-army__thumb{display:block;width:100%;height:calc(96 * var(--q));object-fit:cover;object-position:50% 30%}
 .q-oc-army__num{font-size:calc(52 * var(--q));border-right-width:calc(3 * var(--q))}
 .q-oc-army__label{padding:calc(10 * var(--q)) calc(16 * var(--q));font-size:max(12px,calc(24 * var(--q)))}
 .q-oc-dial{order:6;align-self:stretch;width:auto;min-height:0;margin:calc(26 * var(--q)) 0 0;padding:calc(26 * var(--q)) calc(24 * var(--q)) calc(22 * var(--q));border:calc(4 * var(--q)) solid #26332b;outline:calc(2 * var(--q)) solid #050806;background:#0b100d}
 .q-oc-dial__title{font-size:calc(36 * var(--q));text-align:left}
 .q-oc-dial__range{margin-top:calc(14 * var(--q))}
 .q-oc-dial__range::-webkit-slider-runnable-track{height:calc(24 * var(--q));border-width:2px;border-radius:calc(12 * var(--q))}
 .q-oc-dial__range::-moz-range-track{height:calc(24 * var(--q));border-width:2px;border-radius:calc(12 * var(--q))}
 .q-oc-dial__range::-webkit-slider-thumb{width:28px;height:28px;margin-top:calc(12 * var(--q) - 14px);border-width:2px}
 .q-oc-dial__range::-moz-range-thumb{width:28px;height:28px;border-width:2px}
 .q-oc-dial__ticks{font-size:max(12px,calc(22 * var(--q)))}
 .q-oc-dial__label{margin-top:calc(16 * var(--q));font-size:max(12px,calc(22 * var(--q)));text-align:left}
 .q-oc-dial__readouts{grid-template-columns:minmax(0,1fr);gap:calc(10 * var(--q));margin-top:calc(16 * var(--q))}
 .q-oc-dial__cell{flex-direction:row;justify-content:space-between;padding:calc(14 * var(--q)) calc(20 * var(--q))}
 .q-oc-dial__cell dt{font-size:max(12px,calc(20 * var(--q)))}
 .q-oc-dial__cell dd{font-size:calc(34 * var(--q))}
 .q-oc-dial__note{margin-top:calc(14 * var(--q));font-size:max(12px,calc(22 * var(--q)))}
 .q-oc-army__keys{order:7;grid-template-columns:minmax(0,1fr);gap:calc(16 * var(--q));margin-top:calc(26 * var(--q))}
 .q-oc .c-btn.q-oc-army__join,.q-oc .c-btn.q-oc-army__buy{min-height:calc(100 * var(--q));font-size:calc(30 * var(--q))}
 .q-oc .c-btn.q-oc-army__buy{border-width:calc(4 * var(--q))}
 .q-oc-army__pay{order:8;margin-top:calc(18 * var(--q));font-size:max(12px,calc(23 * var(--q)));text-align:center}

 .q-oc-ladder{display:flex;flex-direction:column;padding:calc(30 * var(--v)) calc(20 * var(--v)) calc(48 * var(--v))}
 .q-oc-strip{grid-template-columns:minmax(0,1fr);min-height:0;margin-bottom:calc(40 * var(--v));padding:calc(4 * var(--v)) calc(6 * var(--v));border-width:calc(18 * var(--v)) calc(26 * var(--v));border-image-width:calc(18 * var(--v)) calc(26 * var(--v))}
 .q-oc-strip__cell{flex-direction:row;justify-content:space-between;gap:calc(16 * var(--v));padding:calc(16 * var(--v)) calc(6 * var(--v));border-left:0;border-top:calc(3 * var(--v)) solid rgba(60,235,134,.55);text-align:left}
 .q-oc-strip__cell:first-child{border-top:0}
 .q-oc-strip:has(>.q-oc-strip__cell[hidden]){grid-template-columns:minmax(0,1fr)}
 .q-oc-strip__cell[hidden]+.q-oc-strip__cell{border-top:0}
 .q-oc-strip dt{font-size:max(12px,calc(21 * var(--v)));line-height:1.2}
 .q-oc-strip dd{font-size:calc(31 * var(--v));text-align:right}
 .q-oc-climb{padding:0}
 .q-oc-climb__title{margin:0 0 calc(26 * var(--v));font-size:calc(46 * var(--v));line-height:1.14}
 .q-oc-stairs{width:100%}
 /* Each block of the phone plate (stairs-phone, measured faces in % of the plate) carries its amount (the 250,000 block
    in its upper band, clear of the head of the man below); the tiers follow the plate as cream cards in the blocks'
    own colour, lowest first. */
 .q-oc-faces{display:block;inset:0 0 auto;aspect-ratio:941/1672}
 .q-oc-face{position:absolute;display:flex;align-items:center;justify-content:center;color:#17130c;font:700 max(13px,calc(32 * var(--v)))/1 var(--t-font-display);white-space:nowrap}
 .q-oc-face[data-oc-step="1"]{left:5.1%;top:84.9%;width:68.1%;height:15.1%}
 .q-oc-face[data-oc-step="2"]{left:18.3%;top:62.9%;width:67.7%;height:7.2%}
 .q-oc-face[data-oc-step="3"]{left:49.4%;top:42.6%;width:49.8%;height:10.8%}
 .q-oc-steps{position:static;display:flex;flex-direction:column;gap:calc(16 * var(--v));margin-top:calc(22 * var(--v));pointer-events:auto}
 .q-oc-steps .q-oc-step[data-oc-step]{position:static;width:auto;height:auto;padding:calc(22 * var(--v)) calc(24 * var(--v)) calc(20 * var(--v));border-top:calc(8 * var(--v)) solid var(--oc-orange);background:#eeddb9}
 .q-oc-step__amount{font-size:max(14px,calc(32 * var(--v)))}
 .q-oc-step__line{font-size:max(13px,calc(27 * var(--v)));line-height:1.3}
 .q-oc-step__amount+.q-oc-step__line{margin-top:calc(12 * var(--v))}
 .q-oc-step__line+.q-oc-step__line{margin-top:calc(6 * var(--v))}
 .q-oc-next{align-self:stretch;margin-top:calc(34 * var(--v));padding:calc(40 * var(--v)) calc(30 * var(--v)) calc(36 * var(--v));border-width:calc(4 * var(--v));outline-width:calc(3 * var(--v));outline-offset:calc(-14 * var(--v));--rivet-size:calc(12 * var(--v))}
 .q-oc-next__title{font-size:calc(42 * var(--v))}
 .q-oc-next__line,.q-oc-next__when{font-size:calc(30 * var(--v));margin-top:calc(22 * var(--v))}
 .q-oc-clock{gap:calc(14 * var(--v));margin-top:calc(30 * var(--v))}
 .q-oc-clock__cell{gap:calc(14 * var(--v))}
 .q-oc-clock__digits{border-width:calc(3 * var(--v));font-size:calc(72 * var(--v))}
 .q-oc-clock__unit{font-size:max(12px,calc(19 * var(--v)))}
 .q-oc .c-btn.q-oc-cta{min-height:calc(108 * var(--v));margin-top:calc(34 * var(--v));font-size:calc(31 * var(--v))}
 .q-oc .c-btn.q-oc-watch{min-height:calc(100 * var(--v));margin-top:calc(22 * var(--v));border-width:calc(4 * var(--v));font-size:calc(31 * var(--v))}

 .q-sign{padding:4.2% 2.35%}
 .q-sign__panel{display:flex;flex-direction:column;min-height:0;padding:calc(30 * var(--v)) calc(28 * var(--v)) calc(36 * var(--v));border-width:calc(4 * var(--v));outline-width:calc(3 * var(--v));outline-offset:calc(-12 * var(--v));--rivet-size:calc(13 * var(--v))}
 .q-sign__copy{display:contents}
 .q-sign__memo{order:1;align-self:stretch;padding:calc(14 * var(--v)) calc(16 * var(--v)) calc(12 * var(--v));border-width:calc(4 * var(--v));text-align:center;font-size:max(12px,calc(26 * var(--v)));letter-spacing:.16em}
 .q-sign__art{order:2;width:100%;aspect-ratio:755/645;margin-top:calc(22 * var(--v))}
 .q-sign__plate img{object-position:50% 74%}
 .q-sign__mark{left:13%;top:13%;width:74%}
 .q-sign__title{order:3;margin-top:calc(26 * var(--v));font-size:calc(76 * var(--v));line-height:1.06}
 .q-sign__body{order:4;margin-top:calc(22 * var(--v));font-size:calc(30 * var(--v));line-height:1.5}
 .q-sign__rows{order:5;display:flex;flex-direction:column;gap:calc(20 * var(--v));margin-top:calc(28 * var(--v));border:0}
 .q-sign__row{display:block;min-height:0;padding:calc(18 * var(--v)) calc(20 * var(--v));border:calc(3 * var(--v)) solid var(--oc-gold)}
 .q-sign__row+.q-sign__row{border-top:calc(3 * var(--v)) solid var(--oc-gold)}
 .q-sign__row dt{display:block;padding:0;border:0;font-size:max(12px,calc(27 * var(--v)))}
 .q-sign__row[data-sign-q] dt{display:inline-block;padding:calc(8 * var(--v)) calc(26 * var(--v)) calc(6 * var(--v));background:#c9a24b;color:#14100a}
 .q-sign__row dd{padding:calc(10 * var(--v)) 0 0;font-size:max(12px,calc(27 * var(--v)))}
 .q-sign .c-btn.q-sign__cta{order:6;margin-top:calc(26 * var(--v));min-height:calc(98 * var(--v));font-size:calc(33 * var(--v))}
 .q-sign__note{order:7;margin-top:calc(22 * var(--v));font-size:max(12px,calc(26 * var(--v)));line-height:1.35}
}
/* A phone turned sideways keeps the phone composition in the site's centred column. */
@media (orientation:landscape) and (max-width:767px),(pointer:coarse) and (max-height:500px){
 .q-oc,.q-sign{width:min(100%,var(--quit-column,480px));margin-inline:auto}
}