/* GENERATED by design/theme/export.py from the canvas board page boards. Change the canvas and re-export; do not edit. */
/* Main.dc.html */
a{color:#f1e8d4}a:hover{color:#f6d98f}
.hero{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:56px;padding:72px var(--gutter) 88px;max-width:1260px;margin:0 auto}
.wordmark b{display:block;font:400 clamp(64px,10vw,136px)/.95 var(--f-script);color:var(--ivory);transform:rotate(-4deg);transform-origin:left bottom;text-shadow:0 3px 0 #000,0 12px 24px #000c}
.wordmark span{display:block;font:400 clamp(22px,3.3vw,44px)/1 var(--f-wide);letter-spacing:.5em;color:var(--gold);margin:12px 0 0 4px;text-transform:uppercase}
@media (max-width:980px){.hero{grid-template-columns:1fr;text-align:center}.hero .knob-row{justify-content:center}.wordmark b{transform-origin:center}}
/* Shows.dc.html */
a{color:#f1e8d4}a:hover{color:#f6d98f}
.year{display:flex;align-items:center;gap:20px;margin:64px 0 28px;font:900 40px/1 var(--f-display);color:var(--gold)}
.year::after{content:"";flex:1;border-top:1.5px dashed #c8b49a40}
/* Show.dc.html */
a{color:#f1e8d4}a:hover{color:#f6d98f}
.photos{columns:3 260px;column-gap:14px}
.photos a{display:block;break-inside:avoid;margin-bottom:14px;border-radius:10px;overflow:hidden}
.photos img{width:100%}
@media (max-width:720px){.photos{columns:2 140px;column-gap:8px}.photos a{margin-bottom:8px}}
/* Club.dc.html */
a{color:#f1e8d4}a:hover{color:#f6d98f}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
.step{padding:28px;border-radius:16px;background:#fffaf0;box-shadow:0 0 0 1px #0000000f,0 10px 24px -14px #0006}
.step b{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;margin-bottom:18px;background:#0e1012;color:#f1e8d4;font:900 26px/1 var(--f-display);box-shadow:0 0 0 3px #c9d0d4,0 0 0 5px #5b646a}
.step h3{font:900 26px/1 var(--f-display);text-transform:uppercase;margin-bottom:10px}
@media (max-width:720px){.steps{grid-template-columns:1fr}}
/* Shop.dc.html */
a{color:#f1e8d4}a:hover{color:#f6d98f}
.tee::before{content:"";position:absolute;width:80%;height:80%;top:13%;background:#0b0b0b;clip-path:polygon(30% 0,40% 6%,60% 6%,70% 0,100% 16%,90% 36%,80% 32%,80% 100%,20% 100%,20% 32%,10% 36%,0 16%)}
.tee img{position:relative;width:46%}
.decal img{width:82%;filter:drop-shadow(3px 0 0 #fff) drop-shadow(-3px 0 0 #fff) drop-shadow(0 3px 0 #fff) drop-shadow(0 -3px 0 #fff) drop-shadow(0 8px 10px #0006)}
.koozie span{width:52%;aspect-ratio:.76;display:grid;place-items:center;overflow:hidden;border-radius:10px;background:#0b0b0b;box-shadow:0 16px 22px -8px #000}
.koozie img{width:150%;max-width:none}
.poster span{width:66%;aspect-ratio:.77;display:grid;align-content:center;justify-items:center;gap:6px;background:#f1e8d4;color:#b02f26;font:400 18px/1 'Yellowtail',cursive;box-shadow:0 20px 24px -8px #000}
.poster img{width:86%}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.facts h3{font:400 11px/1 var(--f-wide);letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
@media (max-width:720px){.facts{grid-template-columns:1fr}}
/* Viewer.dc.html */
.drums{display:flex;padding:3px;border-radius:6px;background:#c9d0d4;box-shadow:0 4px 10px -4px #000}
.drums span{width:22px;height:34px;display:grid;place-items:center;font:900 24px/1 var(--f-display);color:#f1e8d4;background:#1b1d1f;box-shadow:inset 0 8px 8px -4px #000,inset 0 -8px 8px -4px #000;border-right:1px solid #000}
.drums span:last-child{border-right:0}
.vdial{position:relative;width:100%;height:22px;border-radius:5px;background:repeating-linear-gradient(90deg,#f6d69259 0 1px,transparent 1px 10%) 0 70%/100% 40% no-repeat,radial-gradient(60% 160% at 40% 50%,#5a3d17,transparent 70%),#140e07;box-shadow:inset 0 2px 6px #000,0 0 0 3px #2a2d30,0 0 0 4px #8f999f}

/* Theme-only rules: things the canvas comps don't need (WordPress chrome, real buttons, the viewer as a dialog). */
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
body.wcc { margin: 0; background: #0e1012; }
.wp-site-blocks { padding: 0; }
button.btn { border: 0; cursor: pointer; }
.photos a[hidden] { display: none; }
.photos img { height: auto; } /* WordPress adds width and height attributes; keep each photo's own shape */
.hero-gauge { width: 100%; max-width: 560px; justify-self: center; }
.wcc-prose > * + * { margin-top: 1em; }
.wcc-prose a { color: var(--gold-hi); }

/* Photo viewer, from the canvas Viewer board */
dialog.viewer { width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 0; border: 0; background: #060708; color: #f1e8d4; }
dialog.viewer[open] { display: grid; grid-template-rows: minmax(0, 1fr) auto; }
dialog.viewer::backdrop { background: #060708; }
.viewer-stage { display: grid; place-items: center; min-height: 0; padding: 72px 20px 12px; }
.viewer-stage img { max-width: 100%; max-height: 100%; object-fit: contain; min-height: 0; }
.viewer-controls { position: relative; width: min(100% - 24px, 760px); margin: 0 auto 12px; padding: 16px 20px 18px; border-radius: 18px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 24px; box-shadow: 0 0 0 2px #2a2d30, 0 0 0 3px #8f999f; }
.viewer-btn, .viewer-close { all: unset; cursor: pointer; border-radius: 50%; }
.viewer-btn .knob-cap > span { font: 400 24px/1 'DM Sans', sans-serif; }
.viewer-btn:focus-visible, .viewer-close:focus-visible { outline: 3px solid var(--turq); outline-offset: 3px; }
.viewer-close { position: absolute; top: 12px; right: 12px; }
.viewer-close .knob-cap { width: 52px; height: 52px; }
.viewer-info { display: grid; gap: 10px; justify-items: center; min-width: 0; }
.viewer-title { font: 900 22px/1 'Big Shoulders Display', sans-serif; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.viewer-count { display: flex; align-items: center; gap: 8px; }
.viewer-count b { font: 400 10px/1 'Michroma', sans-serif; letter-spacing: .2em; text-transform: uppercase; color: #b3ada2; }
.vdial i { position: absolute; top: 3px; bottom: 3px; left: 3%; width: 2px; background: #df4a3a; box-shadow: 0 0 8px #df4a3a; transition: left .35s cubic-bezier(.2, 1.3, .4, 1); }
@media (prefers-reduced-motion: reduce) { .vdial i { transition: none; } }