/**
 * Comedy Republic — design system, shared chrome (home: front-page.php, with design-home.css). The
 * pages not on the canvas no longer load it (each has its own design-<page>.css; inc/chrome.php).
 *
 * PORTED from docs/design/canvas/Main.dc.html (its <style> block), value for value, between the
 * PORT-BEGIN / PORT-END markers: the base half of tests/visual/port-css.py --split. Do not round,
 * re-tokenise or reorder; change the design, then re-port:
 *   python3 tests/visual/port-css.py docs/design/canvas/Main.dc.html --split base --write assets/css/design-base.css
 * (--check instead of --write tells whether the block still matches the design).
 *
 * Scoping: the design root .cr is .crd here; every other selector is prefixed with `.crd ` (relative
 * specificity unchanged). html / body stay global. The design's bare `a` / `a:hover` resets are
 * :where(.crd) a / a:hover, the same specificity as in the design.
 * Asset URLs: the design's /_blob/<id> files live in assets/design/ (+ assets/fonts/guess-sans-800.woff2).
 *
 * This file: fonts, tokens and base type (the grain is baked into the root background), resets, wrap,
 * grain element (off), icons, display/script type, 3D text shadows, header (search button, compact
 * state, burger under 960px), the global nav's search panel and the menu's search + sign-up, buttons,
 * art tiles, chips, ticket stub, sign-up dock (with its peek tab), footer (three columns, mailing-list
 * form), menu. design-home.css (front page only) holds the homepage sections. Theme additions (things
 * the design does not need because it is one static page) are after PORT-END, marked.
 *
 * .crd .cr-promo__art stays here at its design position: in the design it precedes .cr-art and
 * loses to it (the promo tile renders 62px / 56px), which design-home.css, loaded later, would flip.
 */

/* ==== PORT-BEGIN docs/design/canvas/Main.dc.html --split base ==== */
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#F5F0D3}
:where(.crd) a{color:inherit}
:where(.crd) a:hover{color:inherit}
.crd{--cream:#F5F0D3;--card:#FFFDF6;--ivory:#FFFBEA;--ink:#2E2D2A;--ink-dk:#242321;--green:#4F744A;--green-dk:#33502F;--sage:#8E9680;--gold:#FFBC29;--gold-dk:#A87700;--ox:#720002;--ox-dk:#3F0001;--blue:#1C79AE;--grey:#B1B2B0;--line:rgba(46,45,42,.15);--muted:#5C5A53;--wrap:1320px;--gut:clamp(20px,4.4vw,64px);--rail-pad:max(var(--gut),calc((100% - var(--wrap)) / 2));position:relative;background-color:var(--cream);background-image:linear-gradient(rgba(245,240,211,.85),rgba(245,240,211,.85)),url('../design/grain.webp');background-size:auto,220px 220px;background-blend-mode:normal,multiply;color:var(--ink);font-family:'futura-pt','Helvetica Neue',Helvetica,Arial,sans-serif;font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
:where(.crd) *,:where(.crd) *::before,:where(.crd) *::after{box-sizing:border-box}
:where(.crd) img{display:block;max-width:100%;height:auto}
:where(.crd) h1,:where(.crd) h2,:where(.crd) h3,:where(.crd) p,:where(.crd) figure,:where(.crd) address{margin:0}
:where(.crd) button{font:inherit;color:inherit}
.crd :focus-visible{outline:3px solid var(--ink);outline-offset:3px;box-shadow:0 0 0 3px var(--gold)}
.crd .cr-footer :focus-visible,.crd .cr-signup :focus-visible,.crd .cr-done :focus-visible,.crd .cr-tab:focus-visible{outline-color:var(--gold);box-shadow:0 0 0 3px var(--ink-dk)}
.crd .cr-wrap{width:min(var(--wrap),calc(100% - 2 * var(--gut)));margin-inline:auto}
.crd .cr-grain{display:none}
.crd .cr-ico{flex:none;width:18px;height:18px}
.crd .cr-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.crd .cr-display{font-family:'futura-pt-bold','Futura','Century Gothic','Avenir Next',sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.01em;line-height:.95}
.crd .cr-script{font-family:'Norican','Brush Script MT',cursive;font-weight:400;line-height:1}
.crd .cr-x-light{text-shadow:-1px 1px 0 #BDBEBB,-2px 2px 0 #ABACA9,-3px 3px 0 #999A97,-4px 4px 0 #878885,-5px 5px 0 #6D6E6B,-9px 12px 22px rgba(0,0,0,.38)}
.crd .cr-x-ink{text-shadow:-1px 1px 0 #BAB6A2,-2px 2px 0 #AEAA96,-3px 3px 0 #A29E8A,-4px 4px 0 #96927E,-5px 5px 0 #8A8672}
.crd .cr-x-sm{text-shadow:-1px 1px 0 rgba(0,0,0,.32),-2px 2px 0 rgba(0,0,0,.26),-3px 3px 0 rgba(0,0,0,.2)}

/* Header */
.crd .cr-header{position:sticky;top:0;z-index:50;background:rgba(245,240,211,.9);-webkit-backdrop-filter:blur(12px) saturate(1.3);backdrop-filter:blur(12px) saturate(1.3);border-bottom:1px solid var(--line)}
.crd .cr-header__inner{display:flex;align-items:center;gap:20px;min-height:88px}
.crd .cr-burger{display:none;flex:none;width:46px;height:46px;padding:0;border:0;background:none;cursor:pointer;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px}
.crd .cr-burger span{display:block;width:24px;height:2px;border-radius:2px;background:var(--ink)}
.crd .cr-burger span:nth-child(2){width:17px}
.crd .cr-burger--x{align-items:center}
.crd .cr-brand{display:flex;flex-direction:column;align-items:flex-start;gap:7px;text-decoration:none}
.crd .cr-brand__logo{width:232px}
.crd .cr-tagline{font-weight:900;font-size:9.5px;line-height:1;letter-spacing:.27em;text-transform:uppercase;color:var(--muted);padding-left:5px;white-space:nowrap}
.crd .cr-nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.crd .cr-nav a{font-weight:700;font-size:15.5px;text-decoration:none;padding:12px 16px;border-radius:999px;transition:background .2s}
.crd .cr-nav a:hover{background:rgba(46,45,42,.07)}
.crd .cr-search{flex:none;width:48px;height:48px;margin-left:6px;border-radius:50%;border:1.5px solid var(--ink);display:grid;place-items:center;text-decoration:none;transition:background .2s,color .2s}
.crd .cr-search:hover{background:var(--ink);color:var(--cream)}
.crd .cr-whatson{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 22px 0 18px;margin-left:8px;border-radius:999px;background:var(--ink);color:var(--cream);font-weight:900;font-size:14.5px;letter-spacing:.03em;text-decoration:none;white-space:nowrap;box-shadow:-3px 3px 0 rgba(46,45,42,.28);transition:transform .15s,box-shadow .15s}
.crd .cr-whatson:hover{color:var(--cream);transform:translate(-1px,1px);box-shadow:-2px 2px 0 rgba(46,45,42,.28)}

/* Promoted slot */
.crd .cr-promo__art{flex:none;width:50px;height:50px;border-radius:10px}

/* Night-by-night rail */
.crd .cr-art{position:relative;isolation:isolate;overflow:hidden;display:grid;place-items:center;width:62px;height:62px;border-radius:12px;color:var(--ivory);background:var(--ink)}
.crd .cr-art::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(rgba(0,0,0,.22) 1px,rgba(0,0,0,0) 1.7px) 0 0/5px 5px,radial-gradient(120% 100% at 15% 0%,rgba(255,255,255,.22),rgba(255,255,255,0) 58%)}
.crd .cr-art__ini{font-family:'futura-pt-bold','Futura',sans-serif;font-weight:800;font-size:23px;line-height:1;letter-spacing:.02em;text-shadow:-1px 1px 0 rgba(0,0,0,.3),-2px 2px 0 rgba(0,0,0,.22)}
.crd .cr-art--ox{background-color:var(--ox)}
.crd .cr-art--blue{background-color:var(--blue)}
.crd .cr-art--green{background-color:var(--green)}
.crd .cr-art--ink{background-color:var(--ink)}
.crd .cr-art--gold{background-color:var(--gold);color:var(--ink)}
.crd .cr-art--sage{background-color:var(--sage);color:var(--ink)}
.crd .cr-art--gold .cr-art__ini,.crd .cr-art--sage .cr-art__ini{text-shadow:-1px 1px 0 rgba(255,255,255,.4),-2px 2px 0 rgba(255,255,255,.22)}
.crd .cr-art--mainstage{background:var(--green) url('../design/tile-main-stage.jpg') center/cover}
.crd .cr-art--mainstage::before{display:none}
.crd .cr-chip{position:relative;display:inline-flex;align-items:center;height:22px;margin-top:8px;padding:0 10px 0 8px;border-radius:3px;font-weight:900;font-size:10px;line-height:1;letter-spacing:.15em;text-transform:uppercase;white-space:nowrap}
.crd .cr-chip::after{content:'';position:absolute;top:0;right:0;width:7px;height:7px;background:linear-gradient(225deg,var(--card) 0 50%,rgba(0,0,0,.26) 50%);border-bottom-left-radius:2px}
.crd .cr-chip--fast{background:var(--gold);color:var(--ink)}
.crd .cr-chip--last{background:var(--ox);color:#FFF6E0}
.crd .cr-chip--sold{background:var(--ink);color:var(--cream)}
.crd .cr-tix{flex:none;display:inline-flex;text-decoration:none;filter:drop-shadow(-3px 3px 0 var(--ox-dk));transition:transform .15s ease,filter .15s ease}
.crd .cr-tix:hover{transform:translate(-1px,1px);filter:drop-shadow(-2px 2px 0 var(--ox-dk))}
.crd .cr-tix:active{transform:translate(-3px,3px);filter:drop-shadow(0 0 0 var(--ox-dk))}
.crd .cr-tix__body{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:98px;height:54px;padding:0 14px 0 26px;border-radius:8px;background:var(--ox);color:#FFF6E0;font-weight:900;font-size:15.5px;line-height:1;letter-spacing:.02em;white-space:nowrap;-webkit-mask:radial-gradient(circle 6.5px at 0 50%,#0000 96%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 6.5px at 100% 50%,#0000 96%,#000) 100% 0/51% 100% no-repeat;mask:radial-gradient(circle 6.5px at 0 50%,#0000 96%,#000) 0 0/51% 100% no-repeat,radial-gradient(circle 6.5px at 100% 50%,#0000 96%,#000) 100% 0/51% 100% no-repeat}
.crd .cr-tix__body::before{content:'';position:absolute;left:15px;top:10px;bottom:10px;border-left:1.5px dashed rgba(255,246,224,.5)}
.crd .cr-tix--wait{filter:drop-shadow(-3px 3px 0 #A29F92)}
.crd .cr-tix--wait:hover{filter:drop-shadow(-2px 2px 0 #A29F92)}
.crd .cr-tix--wait .cr-tix__body{background:#E7E3D2;color:var(--ink)}
.crd .cr-tix--wait .cr-tix__body::before{border-left-color:rgba(46,45,42,.35)}
.crd .cr-tix__w{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase}
.crd .cr-tix__t{margin-top:4px;font-weight:700;font-size:11px;color:var(--muted)}

/* Buttons */
.crd .cr-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 26px;border:0;border-radius:12px;font-weight:900;font-size:15px;line-height:1.2;letter-spacing:.02em;text-align:center;text-decoration:none;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .2s,color .2s}
.crd .cr-btn .cr-ico{width:17px;height:17px}
.crd .cr-btn--block{width:100%}
.crd .cr-btn--ox{background:var(--ox);color:#FFF6E0;box-shadow:-3px 3px 0 var(--ox-dk)}
.crd .cr-btn--ox:hover{color:#FFF6E0;transform:translate(-1px,1px);box-shadow:-2px 2px 0 var(--ox-dk)}
.crd .cr-btn--gold{background:var(--gold);color:var(--ink);box-shadow:-3px 3px 0 var(--gold-dk)}
.crd .cr-btn--gold:hover{color:var(--ink);transform:translate(-1px,1px);box-shadow:-2px 2px 0 var(--gold-dk)}
.crd .cr-btn--ox:active,.crd .cr-btn--gold:active{transform:translate(-3px,3px);box-shadow:0 0 0 transparent}
.crd .cr-btn--outline{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.crd .cr-btn--outline:hover{background:var(--ink);color:var(--cream)}
.crd .cr-btn--ghost{background:transparent;color:var(--ivory);box-shadow:inset 0 0 0 1.5px rgba(255,251,234,.72)}
.crd .cr-btn--ghost:hover{color:var(--ivory);background:rgba(255,251,234,.1)}

/* Sign-up dock */
.crd .cr-dock{position:sticky;bottom:0;z-index:45}
.crd .cr-sentinel{height:1px;margin-top:-1px}
/* Stuck, the dock is fixed, not sticky (Brett, 22 Oct): Chrome scrolls the page whenever a control
   inside a sticky box takes focus or its caret moves (towards the box's un-stuck place), and no
   scroll-padding or script stops the caret's. Fixed content is never scrolled for. The sentinel
   keeps the dock's place in the flow (design.js keeps --cr-dock-h at the dock's height), so the
   page end and the stuck / resting switch read exactly as they did. */
.crd .cr-dock.is-stuck{position:fixed;left:0;right:0}
.crd .cr-dock.is-stuck+.cr-sentinel{margin-top:calc(var(--cr-dock-h,0px) - 1px)}
.crd .cr-dock.is-stuck .cr-signup__sub,.crd .cr-dock.is-stuck .cr-signup__mouth{display:none}
.crd .cr-dock.is-stuck .cr-signup__inner{padding:16px 0 18px}
.crd .cr-dock.is-stuck .cr-signup__title{font-size:26px}
.crd .cr-signup{position:relative;background:var(--ink);color:var(--cream);box-shadow:0 -24px 50px -28px rgba(0,0,0,.55)}
.crd .cr-signup::before{content:'';position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--gold),#FFD772,var(--gold))}
.crd .cr-signup__inner{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) auto;grid-template-areas:"copy form close" "copy err close";align-items:center;gap:6px 40px;padding:30px 0 32px}
.crd .cr-signup__mouth{position:absolute;z-index:2;top:-92px;left:-4px;width:104px;transform:rotate(-8deg);transform-origin:50% 100%;filter:drop-shadow(-4px 6px 0 rgba(0,0,0,.2));pointer-events:none}
.crd .cr-signup__copy{grid-area:copy}
.crd .cr-signup__title{font-size:clamp(26px,2.5vw,38px);line-height:.95;color:var(--ivory)}
.crd .cr-signup__sub{margin-top:8px;font-size:15px;color:rgba(245,240,211,.74)}
.crd .cr-form{grid-area:form;display:flex;gap:10px}
.crd .cr-input{flex:1;min-width:0;height:58px;padding:0 20px;border-radius:12px;border:1.5px solid rgba(245,240,211,.28);background:rgba(245,240,211,.05);color:var(--ivory);font:inherit;font-size:16px;transition:border-color .2s,box-shadow .2s}
.crd .cr-input::placeholder{color:rgba(245,240,211,.5)}
.crd .cr-input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(255,188,41,.2)}
.crd .cr-input[aria-invalid="true"]{border-color:var(--gold)}
.crd .cr-submit{flex:none;height:58px;padding:0 26px;border:0;border-radius:12px;background:var(--gold);color:var(--ink);font-weight:900;font-size:16px;letter-spacing:.02em;cursor:pointer;box-shadow:-3px 3px 0 var(--gold-dk);transition:transform .15s,box-shadow .15s}
.crd .cr-submit:hover{transform:translate(-1px,1px);box-shadow:-2px 2px 0 var(--gold-dk)}
.crd .cr-err{grid-area:err;font-weight:700;font-size:13px;color:var(--gold)}
.crd .cr-close{grid-area:close;width:46px;height:46px;padding:0;border-radius:12px;border:1.5px solid rgba(245,240,211,.3);background:transparent;color:var(--ivory);display:grid;place-items:center;cursor:pointer;transition:background .2s}
.crd .cr-close:hover{background:rgba(245,240,211,.1)}
.crd .cr-tab{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:54px;padding:0 16px;border:0;background:var(--ink);color:var(--ivory);font-weight:900;font-size:13px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;box-shadow:0 -14px 30px -18px rgba(0,0,0,.5)}
.crd .cr-tab b{color:var(--gold);font-weight:900}
.crd .cr-done{position:relative;overflow:hidden;background:var(--ink);color:var(--ivory)}
.crd .cr-done__inner{display:flex;align-items:center;gap:20px;padding:28px 0}
.crd .cr-done__msg{font-size:28px;line-height:1}
.crd .cr-done__sub{flex:1;font-size:15px;color:rgba(245,240,211,.74)}
.crd .cr-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.crd .cr-confetti i{position:absolute;bottom:-14px;display:block;opacity:0}
@keyframes cr-conf-a{0%{opacity:0;transform:translate(0,0) rotate(0deg)}8%{opacity:1}100%{opacity:0;transform:translate(-70px,-170px) rotate(560deg)}}
@keyframes cr-conf-b{0%{opacity:0;transform:translate(0,0) rotate(0deg)}8%{opacity:1}100%{opacity:0;transform:translate(60px,-200px) rotate(-640deg)}}
@keyframes cr-conf-c{0%{opacity:0;transform:translate(0,0) rotate(0deg)}8%{opacity:1}100%{opacity:0;transform:translate(24px,-140px) rotate(400deg)}}
@keyframes cr-conf-d{0%{opacity:0;transform:translate(0,0) rotate(0deg)}8%{opacity:1}100%{opacity:0;transform:translate(-30px,-230px) rotate(-720deg)}}

/* Footer */
.crd .cr-footer{position:relative;isolation:isolate;overflow:hidden;padding:76px 0 34px;background:var(--ink-dk);color:var(--ivory)}
.crd .cr-footer__mark{position:absolute;z-index:-1;right:-70px;bottom:-120px;width:430px;opacity:.06;pointer-events:none}
.crd .cr-footer__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr);gap:48px;align-items:start}
.crd .cr-ftform{display:flex;flex-direction:column;gap:10px}
.crd .cr-ftform__label{font-weight:900;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,240,211,.72)}
.crd .cr-ftform__row{display:flex;gap:8px}
.crd .cr-ftform__input{flex:1;min-width:0;height:52px;padding:0 16px;border-radius:12px;border:1.5px solid rgba(245,240,211,.28);background:rgba(245,240,211,.05);color:var(--ivory);font-size:15px}
.crd .cr-ftform__input::placeholder{color:rgba(245,240,211,.5)}
.crd .cr-ftform__input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(255,188,41,.2)}
.crd .cr-ftform__input[aria-invalid="true"]{border-color:var(--gold)}
.crd .cr-ftform__btn{flex:none;height:52px;padding:0 20px;border:0;border-radius:12px;background:var(--gold);color:var(--ink);font-weight:900;font-size:15px;cursor:pointer;box-shadow:-3px 3px 0 var(--gold-dk);transition:transform .15s,box-shadow .15s}
.crd .cr-ftform__btn:hover{transform:translate(-1px,1px);box-shadow:-2px 2px 0 var(--gold-dk)}
.crd .cr-ftform__note{font-size:13.5px;color:rgba(245,240,211,.72)}
.crd .cr-ftform__done{display:flex;align-items:center;gap:10px;min-height:52px;font-family:'futura-pt-bold','Futura',sans-serif;font-weight:800;text-transform:uppercase;font-size:20px;color:var(--gold)}
.crd .cr-footer__logo{width:300px}
.crd .cr-footer__addr{margin-top:22px;font-style:normal;font-size:16px;line-height:1.65;color:rgba(245,240,211,.78)}
.crd .cr-footer__links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 32px}
.crd .cr-footer__links a{width:fit-content;padding:6px 0;font-size:16.5px;line-height:1.35;text-decoration:none;color:var(--ivory);background:linear-gradient(var(--gold),var(--gold)) 0 calc(100% - 4px)/0 2px no-repeat;transition:background-size .25s}
.crd .cr-footer__links a:hover{color:var(--ivory);background-size:100% 2px}
.crd .cr-footer__base{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:64px;padding-top:22px;border-top:1px solid rgba(245,240,211,.14);font-size:13.5px;color:rgba(245,240,211,.62)}
.crd .cr-footer__legal{display:flex;gap:22px}
.crd .cr-footer__legal a{padding:6px 0;text-decoration:none}
.crd .cr-footer__legal a:hover{color:var(--ivory)}

/* Menu */
.crd .cr-menu{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;background:rgba(36,35,33,.5);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.crd .cr-menu__panel{background:var(--cream);padding-bottom:30px;box-shadow:0 30px 60px -30px rgba(0,0,0,.5);animation:cr-drop .35s cubic-bezier(.2,.75,.2,1)}
@keyframes cr-drop{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
.crd .cr-menu__bar{display:flex;align-items:center;gap:10px;min-height:70px;border-bottom:1.5px solid var(--ink)}
.crd .cr-menu__nav{display:flex;flex-direction:column;margin-top:6px}
.crd .cr-menu__item{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:24px 0 21px;border-bottom:1px solid var(--line);text-decoration:none}
.crd .cr-menu__label{flex:none;font-size:clamp(32px,8.6vw,46px);line-height:.95;white-space:nowrap}
.crd .cr-menu__desc{flex:1;min-width:0;font-size:15px;line-height:1.3;color:var(--muted);text-align:right}
.crd .cr-menu__cta{margin-top:26px}

@media (max-width:1099px){
  .crd .cr-nav a{padding:10px 11px;font-size:15px}
  .crd .cr-brand__logo{width:200px}
}

@media (max-width:899px){
  .crd .cr-header__inner{min-height:70px;gap:10px}
  .crd .cr-burger{display:flex}
  .crd .cr-brand{flex:1;align-items:center;gap:5px}
  .crd .cr-brand__logo{width:158px}
  .crd .cr-tagline{padding-left:0;font-size:7.5px;letter-spacing:.2em}
  .crd .cr-nav,.crd .cr-search{display:none}
  .crd .cr-whatson{height:42px;padding:0 14px 0 12px;margin-left:0;gap:8px;font-size:13px;background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
  .crd .cr-whatson:hover{color:var(--ink);transform:none;box-shadow:inset 0 0 0 1.5px var(--ink)}
  .crd .cr-whatson .cr-ico{width:16px;height:16px}
  .crd .cr-signup__inner{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"copy close" "form form" "err err";gap:14px 12px;padding:22px 0 20px}
  .crd .cr-signup__mouth{top:-58px;left:auto;right:58px;width:66px}
  .crd .cr-signup__title{font-size:24px}
  .crd .cr-signup__sub{margin-top:6px;font-size:13.5px}
  .crd .cr-close{align-self:start;width:40px;height:40px;border-radius:10px}
  .crd .cr-input{height:52px;padding:0 14px}
  .crd .cr-submit{height:52px;padding:0 18px;font-size:15px}
  .crd .cr-err{margin-top:-6px}
  .crd .cr-dock.is-stuck .cr-signup__inner{gap:10px 12px;padding:13px 0 14px}
  .crd .cr-dock.is-stuck .cr-signup__title{font-size:18px}
  .crd .cr-dock.is-stuck .cr-close{width:36px;height:36px}
  .crd .cr-dock.is-stuck .cr-input,.crd .cr-dock.is-stuck .cr-submit{height:46px}
  .crd .cr-done__inner{flex-wrap:wrap;gap:8px 16px;padding:22px 0}
  .crd .cr-done__msg{font-size:22px}
  .crd .cr-done__sub{flex-basis:100%;order:3;font-size:13.5px}
  .crd .cr-done .cr-close{margin-left:auto}
  .crd .cr-footer{padding:52px 0 28px}
  .crd .cr-footer__grid{grid-template-columns:minmax(0,1fr);gap:34px}
  .crd .cr-footer__logo{width:228px}
  .crd .cr-footer__addr{margin-top:16px;font-size:15px}
  .crd .cr-footer__links{gap:0 18px}
  .crd .cr-footer__links a{font-size:15.5px}
  .crd .cr-footer__base{flex-direction:column;align-items:flex-start;gap:10px;margin-top:40px}
  .crd .cr-footer__mark{width:260px;right:-60px;bottom:-60px}
}

@media (max-width:599px){
  .crd .cr-promo__art{width:44px;height:44px;border-radius:9px}
  .crd .cr-art{width:56px;height:56px;border-radius:11px}
  .crd .cr-art__ini{font-size:20px}
  .crd .cr-tix__body{min-width:88px;height:50px;padding:0 12px 0 23px;font-size:14.5px}
  .crd .cr-tix__body::before{left:13px}
}

/* Review round 1 */
.crd .cr-only-mob{display:none}
.crd .cr-tab--peek{display:none}
.crd .cr-dock.is-menu{visibility:hidden}

@media (max-width:899px){
  .crd .cr-only-desk{display:none}
  .crd .cr-only-mob{display:inline}
  .crd .cr-dock.is-stuck:not(.is-open) .cr-signup{display:none}
  .crd .cr-dock.is-stuck:not(.is-open) .cr-tab--peek{display:flex}
}

@media (prefers-reduced-motion:reduce){
  .crd .cr-menu__panel{animation:none}
  .crd .cr-tix,.crd .cr-btn{transition:none}
}

/* Global nav (wireframe 3a): search panel, compact scrolled header, hamburger under 960px, search + sign-up in the menu */
.crd .cr-search{background:transparent;padding:0;color:var(--ink);cursor:pointer;font:inherit}
.crd .cr-search.is-on{background:var(--ink);color:var(--cream)}
.crd .cr-whatson__x{display:none}
.crd .cr-menu{overflow-y:auto}
.crd .cr-sp{border-top:1px solid var(--line);background-color:var(--card);background-image:linear-gradient(rgba(255,253,246,.85),rgba(255,253,246,.85)),url('../design/grain.webp');background-size:auto,220px 220px;background-blend-mode:normal,multiply;box-shadow:0 34px 50px -36px rgba(46,45,42,.55);animation:cr-drop .3s cubic-bezier(.2,.75,.2,1)}
.crd .cr-sp > .cr-wrap{padding:26px 0 30px}
.crd .cr-sp__row{display:flex;align-items:center;gap:12px}
.crd .cr-sp__field{position:relative;display:block;flex:1;min-width:0}
.crd .cr-sp__ico{position:absolute;left:20px;top:50%;width:22px;height:22px;margin-top:-11px;color:var(--muted);pointer-events:none}
.crd .cr-sp__input{display:block;width:100%;height:64px;padding:0 20px 0 56px;border-radius:16px;border:1.5px solid var(--ink);background:#fff;color:var(--ink);font:inherit;font-size:19px;-webkit-appearance:none;appearance:none}
.crd .cr-sp__input::placeholder{color:#8B887E}
.crd .cr-sp__input::-webkit-search-cancel-button,.crd .cr-ms__input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;display:none}
.crd .cr-sp__input:focus{outline:none;box-shadow:0 0 0 4px rgba(255,188,41,.5)}
.crd .cr-sp__close{flex:none;display:inline-flex;align-items:center;gap:8px;height:64px;padding:0 22px;border-radius:16px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);font-weight:900;font-size:15px;cursor:pointer;transition:background .2s,color .2s}
.crd .cr-sp__close:hover{background:var(--ink);color:var(--cream)}
.crd .cr-sp__close .cr-ico{width:16px;height:16px}
.crd .cr-sp__meta{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-top:22px}
.crd .cr-sp__label{font-weight:900;font-size:11.5px;line-height:1.2;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.crd .cr-sp__all{display:inline-flex;align-items:center;gap:6px;padding:8px 0;margin:-8px 0;font-weight:900;font-size:14px;color:var(--green);text-decoration:none;white-space:nowrap}
.crd .cr-sp__all:hover{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.crd .cr-sp__all .cr-ico{width:15px;height:15px}
.crd .cr-sp__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}
.crd .cr-sp__item{display:flex;align-items:center;gap:14px;min-width:0;padding:10px 16px 10px 10px;border-radius:16px;border:1px solid rgba(46,45,42,.16);background:#FFFEF9;color:var(--ink);text-decoration:none;box-shadow:0 14px 26px -22px rgba(46,45,42,.5);transition:border-color .2s,transform .2s}
.crd .cr-sp__item:hover{color:var(--ink);border-color:var(--ink);transform:translateY(-1px)}
.crd .cr-sp__art{position:relative;isolation:isolate;overflow:hidden;flex:none;display:grid;place-items:center;width:56px;height:56px;border-radius:12px;background-color:var(--ink);color:var(--ivory)}
.crd .cr-sp__art::before{content:'';position:absolute;inset:0;z-index:-1;background:radial-gradient(rgba(0,0,0,.22) 1px,rgba(0,0,0,0) 1.7px) 0 0/5px 5px,radial-gradient(120% 100% at 15% 0%,rgba(255,255,255,.22),rgba(255,255,255,0) 58%)}
.crd .cr-sp__art--ox{background-color:var(--ox)}
.crd .cr-sp__art--blue{background-color:var(--blue)}
.crd .cr-sp__art--green{background-color:var(--green)}
.crd .cr-sp__art--gold{background-color:var(--gold);color:var(--ink)}
.crd .cr-sp__art--sage{background-color:var(--sage);color:var(--ink)}
.crd .cr-sp__art--ms{background:var(--green) url('../design/tile-main-stage.jpg') center/cover}
.crd .cr-sp__art--ms::before{display:none}
.crd .cr-sp__ini{font-family:'futura-pt-bold','Futura',sans-serif;font-weight:800;font-size:21px;line-height:1;letter-spacing:.02em;text-shadow:-1px 1px 0 rgba(0,0,0,.3),-2px 2px 0 rgba(0,0,0,.22)}
.crd .cr-sp__art--gold .cr-sp__ini,.crd .cr-sp__art--sage .cr-sp__ini{text-shadow:-1px 1px 0 rgba(255,255,255,.4),-2px 2px 0 rgba(255,255,255,.22)}
.crd .cr-sp__txt{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.crd .cr-sp__title{font-family:'futura-pt-bold','Futura',sans-serif;font-weight:800;text-transform:uppercase;font-size:15.5px;line-height:1.08;letter-spacing:.015em}
.crd .cr-sp__when{font-size:13px;line-height:1.35;color:var(--muted)}
.crd .cr-sp__go{flex:none;width:18px;height:18px;color:var(--muted);transition:transform .2s,color .2s}
.crd .cr-sp__item:hover .cr-sp__go{color:var(--ink);transform:translateX(2px)}
.crd .cr-sp__empty{margin-top:14px;padding:20px 22px;border-radius:16px;border:1.5px dashed rgba(46,45,42,.32);font-size:15.5px;line-height:1.5;color:var(--muted)}
.crd .cr-sp__empty a{font-weight:900;color:var(--green)}
.crd .cr-ms{margin-top:16px}
.crd .cr-ms__field{position:relative;display:block}
.crd .cr-ms__field .cr-sp__ico{left:16px;width:20px;height:20px;margin-top:-10px}
.crd .cr-ms__input{display:block;width:100%;height:54px;padding:0 16px 0 46px;border-radius:14px;border:1.5px solid var(--ink);background:#fff;color:var(--ink);font:inherit;font-size:16px;-webkit-appearance:none;appearance:none}
.crd .cr-ms__input::placeholder{color:#8B887E}
.crd .cr-ms__input:focus{outline:none;box-shadow:0 0 0 4px rgba(255,188,41,.5)}
.crd .cr-ms__results{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.crd .cr-ms__results .cr-sp__label{margin-bottom:2px}
.crd .cr-ms__results .cr-sp__item{padding:8px 14px 8px 8px}
.crd .cr-ms__results .cr-sp__art{width:46px;height:46px;border-radius:10px}
.crd .cr-ms__results .cr-sp__ini{font-size:17px}
.crd .cr-ms__results .cr-sp__empty{margin-top:0;padding:16px 18px;font-size:14.5px}
.crd .cr-msign{display:flex;flex-direction:column;gap:10px;margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.crd .cr-msign__label{font-weight:900;font-size:11px;line-height:1;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.crd .cr-msign__row{display:flex;gap:8px}
.crd .cr-msign__input{flex:1;min-width:0;height:52px;padding:0 16px;border-radius:12px;border:1.5px solid rgba(46,45,42,.4);background:#fff;color:var(--ink);font:inherit;font-size:15px}
.crd .cr-msign__input::placeholder{color:#8B887E}
.crd .cr-msign__input:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 4px rgba(255,188,41,.5)}
.crd .cr-msign__input[aria-invalid="true"]{border-color:var(--ox)}
.crd .cr-msign__btn{flex:none;height:52px;padding:0 20px;border:0;border-radius:12px;background:var(--ink);color:var(--cream);font-weight:900;font-size:15px;cursor:pointer;box-shadow:-3px 3px 0 rgba(46,45,42,.28)}
.crd .cr-msign__note{font-size:13.5px;color:var(--ox)}
.crd .cr-msign__done{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);font-family:'futura-pt-bold','Futura',sans-serif;font-weight:800;text-transform:uppercase;font-size:20px;line-height:1;color:var(--green)}

@media (min-width:960px){
  .crd .cr-header__inner{transition:min-height .25s ease}
  .crd .cr-brand__logo{transition:width .25s ease}
  .crd .cr-header.is-compact .cr-header__inner{min-height:66px}
  .crd .cr-header.is-compact .cr-brand__logo{width:176px}
  .crd .cr-header.is-compact .cr-tagline{display:none}
  .crd .cr-header.is-compact .cr-whatson{background:var(--ox);color:#FFF6E0;box-shadow:-3px 3px 0 var(--ox-dk)}
  .crd .cr-header.is-compact .cr-whatson:hover{color:#FFF6E0;box-shadow:-2px 2px 0 var(--ox-dk)}
  .crd .cr-header.is-compact .cr-whatson__x{display:inline}
}

@media (min-width:960px) and (max-width:1099px){
  .crd .cr-sp__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:959px){
  .crd .cr-header__inner{min-height:70px;gap:10px}
  .crd .cr-burger{display:flex}
  .crd .cr-brand{flex:1;align-items:center;gap:5px}
  .crd .cr-brand__logo{width:158px}
  .crd .cr-tagline{padding-left:0;font-size:7.5px;letter-spacing:.2em}
  .crd .cr-nav,.crd .cr-search,.crd .cr-sp{display:none}
  .crd .cr-whatson{height:42px;padding:0 14px 0 12px;margin-left:0;gap:8px;font-size:13px;background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
  .crd .cr-whatson:hover{color:var(--ink);transform:none;box-shadow:inset 0 0 0 1.5px var(--ink)}
  .crd .cr-whatson .cr-ico{width:16px;height:16px}
}

@media (prefers-reduced-motion:reduce){
  .crd .cr-sp,.crd .cr-header__inner,.crd .cr-brand__logo{animation:none;transition:none}
}

/* Green header (Brett, 07 Oct, round 2): the nav takes the core CR green with the New here panel's felt texture; the page stays brand cream with its grain. Cards, panels and footer are unchanged. */
.crd .cr-header{background:var(--green) url('../design/texture-felt.webp') center/360px;border-bottom:1px solid rgba(0,0,0,.25);box-shadow:inset 0 -1px 0 rgba(255,251,234,.08);color:var(--ivory)}
.crd .cr-header .cr-tagline,.crd .cr-menu__bar .cr-tagline{color:rgba(255,251,234,.9)}
.crd .cr-nav a{color:var(--ivory)}
.crd .cr-nav a:hover{background:rgba(255,251,234,.14)}
.crd .cr-nav a[aria-current]{text-decoration-color:var(--gold)}
.crd .cr-burger span{background:var(--ivory)}
.crd .cr-search{border-color:rgba(255,251,234,.6);color:var(--ivory)}
.crd .cr-search:hover,.crd .cr-search.is-on{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.crd .cr-header .cr-whatson{background:var(--cream);color:var(--ink);box-shadow:-3px 3px 0 rgba(0,0,0,.45)}
.crd .cr-header .cr-whatson:hover{color:var(--ink);box-shadow:-2px 2px 0 rgba(0,0,0,.45)}
.crd .cr-menu__bar{position:relative;isolation:isolate;border-bottom:0;color:var(--ivory)}
.crd .cr-menu__bar::before{content:'';position:absolute;z-index:-1;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);background:var(--green) url('../design/texture-felt.webp') center/360px}
.crd .cr-menu__bar .cr-burger{color:var(--ivory)}
.crd .cr-menu__bar .cr-whatson{background:transparent;color:var(--ivory);box-shadow:inset 0 0 0 1.5px rgba(255,251,234,.7)}
.crd .cr-menu__bar .cr-whatson:hover{color:var(--ivory);transform:none;box-shadow:inset 0 0 0 1.5px rgba(255,251,234,.7)}
.crd .cr-sp{color:var(--ink)}
.crd .cr-header :focus-visible,.crd .cr-menu__bar :focus-visible{outline-color:var(--gold);box-shadow:0 0 0 3px var(--ink-dk)}
.crd .cr-sp :focus-visible{outline-color:var(--ink);box-shadow:0 0 0 3px var(--gold)}
.crd .cr-sp .cr-sp__input:focus-visible{box-shadow:0 0 0 4px rgba(255,188,41,.5)}

@media (min-width:960px){
  .crd .cr-header.is-compact .cr-whatson{background:var(--gold);color:var(--ink);box-shadow:-3px 3px 0 var(--gold-dk)}
  .crd .cr-header.is-compact .cr-whatson:hover{color:var(--ink);box-shadow:-2px 2px 0 var(--gold-dk)}
}

@media (max-width:959px){
  .crd .cr-header .cr-whatson{background:transparent;color:var(--ivory);box-shadow:inset 0 0 0 1.5px rgba(255,251,234,.7)}
  .crd .cr-header .cr-whatson:hover{color:var(--ivory);transform:none;box-shadow:inset 0 0 0 1.5px rgba(255,251,234,.7)}
}
/* ==== PORT-END ==== */

/* ==== Theme additions — not in the design (it is one static page). Keep them few and small. ==== */

/* Skip link: first thing in <body>, outside .crd, off-screen (no layout) until focused. */
.cr-skip{position:absolute;top:0;left:-9999px;z-index:200}
.cr-skip:focus{left:16px;top:16px;padding:12px 18px;border-radius:12px;background:#FFBC29;color:#2E2D2A;font:900 15px/1.2 'futura-pt','Helvetica Neue',Helvetica,Arial,sans-serif;text-decoration:none}

/* The global nav's parts that wait in the page ([hidden]) for design.js: the menu dialog, the header
   search panel, the menu's search results. */
.crd .cr-menu[hidden],.crd .cr-sp[hidden],.crd .cr-ms__results[hidden]{display:none}

/* Without JS the header's search is a link to What's on's search box (the <noscript> one, a flex
   item of the header row like the button): the button (it opens the panel) needs JS. */
html:not(.cr-js) .crd button.cr-search{display:none}
html:not(.cr-js) .crd .cr-header__inner>noscript{display:contents}

/* Sign-up dock, per visitor. The head script sets the html class before paint (so a cached page is
   the same for everyone) and design.js keeps it in step: full block by default (with the design's
   peek tab while it is stuck on a phone), the one-line tab after ×, the done bar after a sign-up,
   nothing for a known subscriber. */
.crd .cr-dock>.cr-tab,.crd .cr-dock>.cr-done{display:none}
html.cr-signup-collapsed .crd .cr-dock>.cr-signup,html.cr-dock-done .crd .cr-dock>.cr-signup{display:none}
html.cr-signup-collapsed .crd .cr-dock>.cr-tab:not(.cr-tab--peek){display:flex}
html.cr-signup-collapsed .crd .cr-dock.is-stuck:not(.is-open) .cr-tab--peek,html.cr-dock-done .crd .cr-dock.is-stuck:not(.is-open) .cr-tab--peek{display:none}
html.cr-dock-done .crd .cr-dock>.cr-done{display:block}
html.cr-subscribed:not(.cr-dock-done) .crd .cr-dock{display:none}
/* Held (design.js): on a screen too short for tonight's first ticket stubs and the stuck dock, the
   dock waits off screen until that stub has scrolled above it. */
.crd .cr-dock{transition:transform .3s ease}
.crd .cr-dock.is-held{transform:translateY(calc(100% + 24px));visibility:hidden;transition:transform .3s ease,visibility 0s .3s}
/* Focus moving into the stuck dock (its peek tab, its field) must not scroll the page: html's
   scroll-padding-bottom keeps focus clear of the dock, which would otherwise count the dock's own
   controls as hidden behind it, scroll, un-stick the dock and drop focus. */
.crd .cr-dock *{scroll-margin-bottom:calc(-1 * var(--cr-dock-h, 0px))}
/* A staff platform embed (Site settings → Email form embed) sits where the design's form does. */
.crd .cr-signup__embed{grid-area:form;min-width:0}
/* A sign-up on its way to Flicket (design.js postSignup): the button dims until Flicket answers. */
.crd form.is-busy button[type=submit]{opacity:.6;cursor:progress}

/* Mailing-list forms (footer.php, the menu dialog): the error note and the done state are in the
   page, hidden; design.js shows them. A known subscriber (html.cr-subscribed) sees the done states.
   A staff platform embed replaces the form. */
.crd .cr-ftform[hidden]{display:none}
html.cr-subscribed .crd [data-cr-ftform],html.cr-subscribed .crd [data-cr-msign]{display:none}
html.cr-subscribed .crd [data-cr-ftform-done]{display:flex}
html.cr-subscribed .crd [data-cr-msign-done]{display:block}
.crd .cr-ftform__embed,.crd .cr-msign__embed{min-width:0}

/* Focus and anchor jumps clear the sticky header (89px; 71px under 960px; the compact header, 67px,
   keeps the same padding) and the stuck sign-up dock (design.js keeps --cr-dock-h at the dock's
   height). No effect at rest. */
html{scroll-padding-top:89px;scroll-padding-bottom:var(--cr-dock-h,0px)}

/* Without JS (no html.cr-js): the dock rests at the page end with no dead ×, and under 960px the nav
   the burger would open shows as a row under the header. */
html:not(.cr-js) .crd .cr-dock{position:relative}
html:not(.cr-js) .crd .cr-signup .cr-close{display:none}
@media (max-width:959px){
  html{scroll-padding-top:71px}
  html:not(.cr-js) .crd .cr-header__inner{flex-wrap:wrap}
  html:not(.cr-js) .crd .cr-burger{visibility:hidden}
  html:not(.cr-js) .crd .cr-nav{display:flex;flex-wrap:wrap;order:1;flex-basis:100%;margin:-6px 0 8px -11px}
}

/* Art tile from an uploaded image (a show's Art image): .cr-art--mainstage with the URL in --art. */
.crd .cr-art--image{background:var(--green) var(--art) center/cover}
.crd .cr-art--image::before{display:none}

/* Under 360px the burger, the brand and the What's on button do not fit one row (the button was cut
   off at the right edge): the button keeps its calendar icon in a 44px square, and its words stay
   its accessible name. */
@media (max-width:359px){
  .crd .cr-whatson{position:relative;width:44px;height:44px;padding:0;justify-content:center}
  .crd .cr-whatson>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
}

/* 360–389px: the burger, the brand and the What's on button need 341px and the row has 320–349px
   (the button ran past the right edge at 360, into the side gutter at 375): the gaps and the
   button's padding tighten under 390px, the wordmark and its tagline under 375px. The 390px design
   is untouched. Same for the open menu's bar. */
@media (min-width:360px) and (max-width:389px){
  .crd .cr-header__inner,.crd .cr-menu__bar{gap:8px}
  .crd .cr-whatson{padding:0 10px 0 9px;gap:6px}
}
@media (min-width:360px) and (max-width:374px){
  .crd .cr-brand__logo{width:148px}
  .crd .cr-tagline{letter-spacing:.14em}
}

/* Touch screens (pointer: coarse): the chrome's small controls get hit areas of at least 44px — an
   invisible ::after around each — without changing what is drawn (the canvas is drawn for a mouse,
   so nothing changes there): footer and legal links (33px tall in the design), the header wordmark
   (30px), What's on (42px on phones), the nav links (43px at 960–1099px), the dock's × (36–40px). */
@media (pointer:coarse){
  .crd .cr-footer__links a,.crd .cr-footer__legal a,.crd .cr-brand,.crd .cr-whatson,.crd .cr-nav a,.crd .cr-close{position:relative}
  .crd .cr-footer__links a::after,.crd .cr-footer__legal a::after{content:'';position:absolute;inset:-6px -6px}
  .crd .cr-brand::after{content:'';position:absolute;inset:-8px 0}
  .crd .cr-whatson::after,.crd .cr-nav a::after{content:'';position:absolute;inset:-2px 0}
  .crd .cr-close::after{content:'';position:absolute;inset:-4px}
}

@media (prefers-reduced-motion:reduce){
  .crd .cr-dock{transition:none}
}
