/* get a quote page. Same look as the rest of the site: coral accent, graffiti headings with the hard black offset shadow,
   square-ish corners. Headings use --font-nav (so a font swap in style.css carries through), body text is Archivo. */

body.grain-quote { background: #0d0707; overflow-x: clip; }
body.grain-quote .top { background: transparent; }

/* film grain over everything, about 7% */
body.grain-quote::after {
  content: ""; position: fixed; inset: 0; z-index: 50; pointer-events: none; opacity: .07;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

.q-page {
  --q-bg: #0d0707; --q-card: #1a1010; --q-line: #4a3a3a; --q-text: var(--bone); --q-mute: #a89c96;
  --q-accent: var(--coral); --q-accent-hi: #e8605c;
  --q-head: var(--font-nav);
  /* the Aerosoldier demo fonts swap every digit for a "personal use only" banner, and handstyle zeros read like Ds, so prices and
     numbers use the plain body font (bold, with the same hard shadow). The delivery line uses Sedgwick Ave Display. */
  --q-num: var(--font-body);
  --q-hand: "Sedgwick Ave Display", "Marker Felt", cursive;
  --q-shadow: .05em .05em 0 #000;
  max-width: 1000px; margin: 0 auto; padding: 0 16px 120px; color: var(--q-text); font-family: var(--font-body);
}
.q-page h1, .q-page h2 { font-family: var(--q-head); font-weight: 400; letter-spacing: .01em; text-shadow: var(--q-shadow); }
.q-col { width: 100%; max-width: 680px; margin-inline: auto; }

/* ---------- hero ---------- */
.q-hero { position: relative; margin: 0 calc(50% - 50vw) 36px; min-height: clamp(280px, 52vw, 460px); display: grid; align-items: end; overflow: hidden; background: #000; border-bottom: 4px solid #000; }
.q-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.q-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, #0d0707 2%, #0d0707cc 26%, #0d070000 68%); }
.q-hero__txt { position: relative; z-index: 1; padding: 0 20px 24px; max-width: 1000px; width: 100%; margin: 0 auto; }
.q-kicker { margin: 0 0 4px; font-size: .8rem; letter-spacing: .22em; text-transform: uppercase; color: var(--q-text); font-weight: 600; text-shadow: 0 1px 6px #000; }
.q-hero h1 { margin: 0; font-size: clamp(2.7rem, 11vw, 5.6rem); line-height: .95; color: var(--q-accent); transform: rotate(-1.2deg); transform-origin: 0 100%; }
.q-sub { margin: 14px 0 0; max-width: 46ch; color: #cfc4bd; font-size: 1rem; text-shadow: 0 1px 8px #000; }
.q-sub > * { margin: 0; }

/* ---------- form basics ---------- */
.q-form { display: grid; grid-template-columns: minmax(0, 1fr); gap: 40px; }
.q-fields { display: grid; grid-template-columns: minmax(0, 1fr); gap: 34px; }
.q-field { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; border: 0; padding: 0; margin: 0; min-width: 0; }
.q-field > label, .q-lab, .q-field > legend { display: flex; flex-wrap: nowrap; align-items: baseline; gap: 10px; font-size: 1.05rem; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--q-text); }
.q-field > legend { padding: 0; margin-bottom: 12px; width: 100%; }
.q-n { display: inline-grid; place-items: center; width: 1.9em; height: 1.9em; border-radius: 50%; background: var(--q-accent); color: #fff; font-family: var(--q-num); font-weight: 600; font-size: .85rem; line-height: 1; flex: none; box-shadow: 2px 2px 0 #000; text-shadow: 1px 1px 0 #000; }
.q-val { margin-left: auto; flex: none; font-family: var(--q-num); font-weight: 600; font-size: 1.7rem; color: var(--q-accent); line-height: 1; text-shadow: var(--q-shadow); }
.q-opt { font-weight: 400; color: var(--q-mute); font-size: .85rem; }
.q-help { margin: -4px 0 0; font-size: .85rem; color: var(--q-mute); }
.q-page input[type="text"], .q-page input[type="email"], .q-page textarea {
  width: 100%; font: inherit; font-size: 1.05rem; color: var(--q-text); background: var(--q-card); border: 2px solid var(--q-line); border-radius: 4px; padding: 14px 14px; min-height: 54px;
}
.q-page input::placeholder, .q-page textarea::placeholder { color: #75675f; }
.q-page input[type="text"]:focus, .q-page input[type="email"]:focus, .q-page textarea:focus { outline: none; border-color: var(--q-accent); box-shadow: 4px 4px 0 #000; }
.q-page :focus-visible { outline: 3px solid var(--q-accent); outline-offset: 3px; }

/* the site-wide label style is small caps; tiles and turnaround buttons are labels too, so undo it for them */
.q-tile, .q-turn { text-transform: none; letter-spacing: 0; font-size: 1rem; color: inherit; }

/* ---------- 1. shoot type tiles ---------- */
.q-tiles { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.q-tile { position: relative; grid-column: span 2; display: block; cursor: pointer; }
.q-tile:nth-child(n+4) { grid-column: span 3; }
.q-tile input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.q-tile__img { display: block; position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 4px; border: 3px solid #000; background: #1c1210; box-shadow: 4px 4px 0 #000; transition: border-color .15s, transform .15s, box-shadow .15s; }
.q-tile:nth-child(n+4) .q-tile__img { aspect-ratio: 16 / 10; }
.q-tile:nth-child(6) { grid-column: 1 / -1; }
.q-tile:nth-child(6) .q-tile__img { aspect-ratio: 16 / 5; }
.q-tile__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.55) saturate(.8) contrast(1.05); transition: filter .25s, transform .5s; }
.q-tile__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, #000d, #0000 62%); }
.q-tile__name { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding: 10px 12px; font-family: var(--q-head); font-size: 1.7rem; line-height: 1; color: var(--q-text); text-shadow: var(--q-shadow); pointer-events: none; }
.q-tile:hover .q-tile__img img { filter: brightness(.75) saturate(.95); transform: scale(1.04); }
.q-tile input:checked ~ .q-tile__img { border-color: var(--q-accent); transform: translate(-2px, -2px); box-shadow: 6px 6px 0 #000; }
.q-tile input:checked ~ .q-tile__img img { filter: brightness(.95) saturate(1.05); }
.q-tile input:checked ~ .q-tile__name { color: var(--q-accent); }
.q-tile input:focus-visible ~ .q-tile__img { outline: 3px solid var(--q-text); outline-offset: 3px; }

/* ---------- 3. stepper ---------- */
.q-step { display: inline-grid; grid-template-columns: 64px 84px 64px; align-items: stretch; width: max-content; background: var(--q-card); border: 2px solid var(--q-line); border-radius: 4px; overflow: hidden; box-shadow: 4px 4px 0 #000; }
.q-step button { font-size: 1.9rem; line-height: 1; min-height: 58px; color: var(--q-text); background: transparent; }
.q-step button:hover { background: #2a1a1a; color: var(--q-accent); }
.q-step button:active { background: #331f1f; }
.q-page .q-step input { width: 100%; text-align: center; border: 0; border-left: 2px solid var(--q-line); border-right: 2px solid var(--q-line); border-radius: 0; background: transparent; font-family: var(--q-num); font-weight: 600; font-size: 1.9rem; color: var(--q-accent); text-shadow: .04em .04em 0 #000; padding: 0; -moz-appearance: textfield; appearance: textfield; min-height: 0; }
.q-step input::-webkit-outer-spin-button, .q-step input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* ---------- 4 + 5. sliders ---------- */
.q-page input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; height: 44px; padding: 0; border: 0; background: transparent; cursor: pointer; --pct: 0%; }
.q-page input[type="range"]::-webkit-slider-runnable-track { height: 10px; border-radius: 2px; border: 2px solid #000; background: linear-gradient(to right, var(--q-accent) var(--pct), #2a1c1c var(--pct)); }
.q-page input[type="range"]::-moz-range-track { height: 6px; border-radius: 2px; border: 2px solid #000; background: #2a1c1c; }
.q-page input[type="range"]::-moz-range-progress { height: 6px; border-radius: 2px; background: var(--q-accent); }
.q-page input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 32px; height: 32px; margin-top: -13px; border-radius: 4px; background: var(--q-text); border: 4px solid var(--q-accent); box-shadow: 3px 3px 0 #000; }
.q-page input[type="range"]::-moz-range-thumb { width: 24px; height: 24px; border-radius: 4px; background: var(--q-text); border: 4px solid var(--q-accent); box-shadow: 3px 3px 0 #000; }
.q-scale { display: flex; justify-content: space-between; margin-top: -8px; font-size: .78rem; color: var(--q-mute); }
.q-presets { display: flex; flex-wrap: wrap; gap: 10px; }
.q-pill { min-width: 64px; min-height: 46px; padding: 0 18px; border: 2px solid var(--q-line); border-radius: 999px; background: var(--q-card); font-weight: 600; color: var(--q-text); transition: border-color .15s, background .15s, color .15s; }
.q-pill:hover { border-color: #7a6258; }
.q-pill.is-on { border-color: #000; background: var(--q-accent); color: #fff; box-shadow: 3px 3px 0 #000; text-shadow: 1px 1px 0 #000; }

/* ---------- 6. turnaround ---------- */
.q-turns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.q-turn { position: relative; display: block; cursor: pointer; }
.q-turn input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.q-turn__box { display: grid; place-items: center; gap: 2px; min-height: 78px; padding: 10px 6px; text-align: center; background: var(--q-card); border: 2px solid var(--q-line); border-radius: 4px; box-shadow: 4px 4px 0 #000; transition: border-color .15s, background .15s, transform .15s, box-shadow .15s; }
.q-turn__box b { font-family: var(--q-head); font-weight: 400; font-size: 1.5rem; line-height: 1; text-shadow: var(--q-shadow); }
.q-turn__box small { font-size: .82rem; color: var(--q-mute); }
.q-turn:hover .q-turn__box { border-color: #7a6258; }
.q-turn input:checked ~ .q-turn__box { border-color: var(--q-accent); background: #2a1313; transform: translate(-2px, -2px); box-shadow: 6px 6px 0 #000; }
.q-turn input:checked ~ .q-turn__box b { color: var(--q-accent); }
.q-turn input:focus-visible ~ .q-turn__box { outline: 3px solid var(--q-text); outline-offset: 3px; }

/* ---------- estimate ---------- */
.q-est { width: 100%; padding: 26px 22px 22px; background: var(--q-card); border: 3px solid #000; border-radius: 4px; text-align: center; box-shadow: 8px 8px 0 #000, inset 0 0 0 2px var(--q-line); }
.q-est__lab { margin: 0; font-size: .8rem; letter-spacing: .24em; text-transform: uppercase; color: var(--q-mute); }
.q-est__num { font-family: var(--q-num); font-weight: 600; letter-spacing: -.02em; text-shadow: .04em .04em 0 #000; margin: 6px 0 4px; display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 6px 14px; font-size: clamp(2.8rem, 12vw, 4.6rem); line-height: 1; color: var(--q-accent); font-variant-numeric: tabular-nums; }
.q-est__num small { font-family: var(--font-body); font-size: 1rem; color: var(--q-mute); letter-spacing: 0; text-shadow: none; }
.q-est__inc { margin: 0; font-size: .95rem; color: var(--q-text); }
.q-est__why { list-style: none; margin: 14px auto 0; padding: 0; display: grid; gap: 4px; max-width: 460px; text-align: left; font-size: .88rem; color: var(--q-mute); }
.q-est__why li { display: flex; justify-content: space-between; gap: 14px; border-top: 1px dashed var(--q-line); padding-top: 4px; }
.q-est__why li span:last-child { color: var(--q-text); white-space: nowrap; }
.q-est__why li.is-bump span:last-child { color: var(--q-accent); }
.q-est__fine { margin: 14px 0 0; font-size: .82rem; color: var(--q-mute); }

/* ---------- what you get back ---------- */
.q-res h2, .q-cta h2, .q-done h2 { margin: 0 0 16px; font-size: clamp(2.2rem, 7vw, 3.2rem); line-height: 1; color: var(--q-accent); transform: rotate(-1deg); transform-origin: 0 100%; }
.q-res { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; }
.q-row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(170px, 46vw); gap: 10px; overflow-x: auto; scroll-snap-type: x proximity; scroll-padding-inline: 16px; padding-bottom: 12px; margin: 0 -16px; padding-inline: 16px; padding-top: 6px; scrollbar-width: none; }
.q-row::-webkit-scrollbar { display: none; }
.q-ph { container-type: inline-size; position: relative; display: block; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 4px; border: 3px solid #000; background: #1c1210; box-shadow: 4px 4px 0 #000; scroll-snap-align: start; text-decoration: none; animation: qIn .45s ease both; }
.q-ph img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
a.q-ph:hover img { transform: scale(1.05); }
.q-stamp { position: absolute; left: 50%; top: 50%; z-index: 2; width: 128%; aspect-ratio: 1; transform: translate(-50%, -50%); background: url("../img/sample.png") center / contain no-repeat; opacity: .9; filter: drop-shadow(0 0 2px #fffb) drop-shadow(0 2px 6px #000a); pointer-events: none; }
.q-ph--more img { filter: brightness(.32) saturate(.7) blur(1px); }
.q-ph--more[hidden] { display: none; }
.q-ph--more span.q-more { position: absolute; inset: 0; z-index: 1; display: grid; place-content: center; justify-items: center; gap: .15em; padding: 8px; text-align: center; color: var(--q-text); text-shadow: .06em .06em 0 #000; }
.q-more b { font-family: var(--q-num); font-weight: 700; font-size: 26px; font-size: 27cqw; line-height: 1; }
.q-more i { font-style: normal; font-family: var(--q-num); font-weight: 600; font-size: 13px; font-size: 9.5cqw; line-height: 1.1; letter-spacing: .02em; }
.q-ph--more:hover span.q-more { color: var(--q-accent); }
@keyframes qIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.q-res__a { margin: 0; font-family: var(--q-hand); font-size: clamp(1.7rem, 5.4vw, 2.2rem); color: var(--q-text); text-shadow: var(--q-shadow); }
.q-res__b { margin: 14px 0 2px; font-size: .82rem; color: #85766e; }

/* ---------- contact + button ---------- */
.q-cta { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
.q-cta h2 { margin-bottom: 0; }
.q-btn { display: block; width: 100%; min-height: 70px; padding: 8px 20px 12px; border-radius: 4px; border: 3px solid #000; background: var(--q-accent); color: #fff; font-family: var(--q-head); font-size: 2.3rem; line-height: 1.1; text-align: center; text-decoration: none; text-shadow: var(--q-shadow); box-shadow: 6px 6px 0 #000; transition: transform .1s, box-shadow .1s, background .15s; }
.q-btn:hover { background: var(--q-accent-hi); }
.q-btn:active { transform: translate(4px, 4px); box-shadow: 2px 2px 0 #000; }
.q-btn--ghost { background: transparent; color: var(--q-accent); border-color: var(--q-accent); margin-top: 8px; box-shadow: 4px 4px 0 #000; }
.q-alt { margin: 0; text-align: center; font-size: .95rem; color: var(--q-mute); }
.q-alt a { color: var(--q-text); text-underline-offset: 4px; text-decoration-thickness: 2px; text-decoration-color: var(--q-accent); }
.q-err { margin: 0 0 20px; padding: 12px 14px; border-left: 4px solid var(--q-accent); background: var(--q-card); }
.q-done { padding: 12px 0 40px; }
.q-done p { margin: 0 0 10px; font-size: 1.05rem; }
.q-shake { color: var(--q-mute); font-size: .85rem !important; }

/* ---------- sticky estimate bar ---------- */
.q-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px)); background: #000; border-top: 3px solid var(--q-accent); transform: translateY(110%); transition: transform .3s ease; }
.q-bar.is-on { transform: none; }
.q-bar__t { display: grid; line-height: 1.1; }
.q-bar__t span { font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; color: var(--q-mute); }
.q-bar__t strong { font-family: var(--q-num); font-weight: 600; font-size: 1.55rem; color: var(--q-accent); font-variant-numeric: tabular-nums; text-shadow: 2px 2px 0 #2a0c0c; }
.q-bar__go { display: inline-flex; align-items: center; min-height: 46px; padding: 4px 22px 8px; border-radius: 4px; border: 2px solid #000; background: var(--q-accent); color: #fff; font-family: var(--q-head); font-size: 1.35rem; text-decoration: none; text-shadow: var(--q-shadow); box-shadow: 3px 3px 0 #2a0c0c; }

html { scroll-behavior: smooth; }

/* ---------- bigger screens ---------- */
@media (min-width: 720px) {
  .q-page { padding-inline: 24px; }
  .q-tiles { grid-template-columns: repeat(6, 1fr); }
  .q-tile, .q-tile:nth-child(n+4), .q-tile:nth-child(6) { grid-column: auto; }
  .q-tile:nth-child(n+4) .q-tile__img, .q-tile:nth-child(6) .q-tile__img { aspect-ratio: 4 / 5; }
  .q-row { grid-auto-flow: row; grid-template-columns: repeat(3, 1fr); grid-auto-columns: auto; gap: 14px; overflow: visible; margin: 0; padding: 6px 4px 12px 0; }
  .q-bar { left: 50%; right: auto; width: min(560px, calc(100% - 32px)); bottom: 16px; border: 3px solid #000; border-radius: 4px; box-shadow: 0 0 0 2px var(--q-accent), 6px 6px 0 #000; transform: translate(-50%, 140%); }
  .q-bar.is-on { transform: translate(-50%, 0); }
  .q-res { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .q-ph { animation: none !important; }
}

/* ---------- southrngrain (clean) skin ----------
   Same page, new paint: serif headings, brass accent, soft hairlines instead of the hard black offsets. */
html.skin-clean body.grain-quote { background: #0f0e0d; }
html.skin-clean body.grain-quote::after { opacity: .035; }
html.skin-clean .q-page {
  --q-bg: #0f0e0d; --q-card: #181613; --q-line: #3b352b; --q-mute: #a59a88; --q-accent-hi: #d8b774; --q-shadow: none; --q-hand: "Cormorant Garamond", Georgia, serif;
}
html.skin-clean .q-page h1, html.skin-clean .q-page h2 { font-weight: 600; text-shadow: none; }
html.skin-clean .q-hero { border-bottom: 1px solid var(--q-line); background: #0f0e0d; }
html.skin-clean .q-hero::after { background: linear-gradient(to top, #0f0e0d 2%, #0f0e0dcc 26%, #0f0e0d00 68%); }
html.skin-clean .q-hero h1, html.skin-clean .q-res h2, html.skin-clean .q-cta h2, html.skin-clean .q-done h2 { transform: none; }
html.skin-clean .q-kicker { letter-spacing: .3em; }
html.skin-clean .q-sub { color: #d6cdbf; }
html.skin-clean .q-n { color: #15110a; box-shadow: none; text-shadow: none; }
html.skin-clean .q-tile__img, html.skin-clean .q-ph { border: 1px solid var(--q-line); border-radius: 2px; box-shadow: 0 10px 24px #0008; background: #181613; }
html.skin-clean .q-step, html.skin-clean .q-turn__box { border-radius: 2px; box-shadow: none; }
html.skin-clean .q-page .q-step input { text-shadow: none; }
html.skin-clean .q-est { border: 1px solid var(--q-line); border-radius: 2px; box-shadow: 0 18px 40px #0009; }
html.skin-clean .q-page input[type="range"]::-webkit-slider-runnable-track { border: 0; height: 4px; background: linear-gradient(to right, var(--q-accent) var(--pct), #2a2620 var(--pct)); }
html.skin-clean .q-page input[type="range"]::-moz-range-track { border: 0; background: #2a2620; }
html.skin-clean .q-page input[type="range"]::-webkit-slider-thumb { margin-top: -14px; border-radius: 50%; border: 3px solid var(--q-accent); box-shadow: 0 2px 8px #000a; }
html.skin-clean .q-page input[type="range"]::-moz-range-thumb { border-radius: 50%; border: 3px solid var(--q-accent); box-shadow: 0 2px 8px #000a; }
html.skin-clean .q-stamp { filter: drop-shadow(0 0 2px #fffb) drop-shadow(0 2px 6px #000a) saturate(.8); }
html.skin-clean .q-btn { border: 0; border-radius: 2px; color: #15110a; text-shadow: none; box-shadow: 0 10px 24px #0008; font-weight: 600; letter-spacing: .04em; }
html.skin-clean .q-bar { background: #0f0e0d; border-top-color: var(--q-accent); }
html.skin-clean .q-bar__go { border: 0; border-radius: 2px; color: #15110a; text-shadow: none; box-shadow: none; font-weight: 600; }
@media (min-width: 900px) { html.skin-clean .q-bar { border: 1px solid var(--q-line); border-radius: 2px; box-shadow: 0 12px 30px #000a; } }

/* other: no photo, and the extra "what is it" field */
.q-tile--other .q-tile__img { background: repeating-linear-gradient(135deg, #1a1010 0 10px, #211515 10px 20px); display: grid; place-items: center; }
.q-tile__q { position: relative; z-index: 1; font-family: var(--q-head); font-size: clamp(2.4rem, 8vw, 3.4rem); line-height: 1; color: var(--q-line); text-shadow: var(--q-shadow); }
.q-tile--other input:checked ~ .q-tile__img .q-tile__q { color: var(--q-accent); }
.q-tile--other .q-tile__img::after { background: linear-gradient(to top, #000a, #0000 62%); }
.q-other { margin-top: 14px; display: grid; gap: 8px; }
.q-other[hidden] { display: none; }
.q-other label { font-size: .95rem; font-weight: 600; color: var(--q-text); }
.q-other input { background: var(--q-card); border: 2px solid var(--q-line); border-radius: 4px; color: var(--q-text); font: inherit; padding: 12px; width: 100%; }
.q-other input:focus-visible { outline: 3px solid var(--q-accent); outline-offset: 2px; }

/* disclaimer over the sample photos */
.q-rowwrap { position: relative; }
.q-rowwrap.is-disc .q-row { filter: blur(2.5px) brightness(.45); pointer-events: none; }
.q-disc { position: absolute; left: 50%; top: 50%; z-index: 5; transform: translate(-50%, -50%); width: min(420px, calc(100% - 32px)); margin: 0; padding: 16px 18px; text-align: center; background: #000e; border: 3px solid var(--q-accent); border-radius: 4px; box-shadow: 5px 5px 0 #000; font-size: .98rem; line-height: 1.4; font-weight: 600; color: var(--q-text); }
.q-disc[hidden] { display: none; }
html.skin-clean .q-disc { border-width: 1px; border-radius: 2px; box-shadow: 0 12px 30px #000a; }
html.skin-clean .q-tile--other .q-tile__img { background: repeating-linear-gradient(135deg, #14120f 0 10px, #181613 10px 20px); }
.q-page .q-other label { text-transform: none; letter-spacing: 0; font-size: .95rem; color: var(--q-text); }