/* Shared GoldPen presentation. Keep native glyphs sharp: no filters or animation. */
:root {
  color-scheme: dark;
  --bg:#000; --bg-page:#000; --bg-page-2:#000; --panel:#000;
  --surface:#000; --card:#000; --card-bg:#000; --tile-bg:#000; --rail-bg:#000;
  --topbar-grad:#000; --content-grad:#000; --blue-pale:#000; --accent-pale:#000;
  --gold-pale:#000; --gn-plum:#000; --gn-track:#000;
  --text:#f5f5f5; --text-heading:#fff; --text-muted:#bdbdbd; --text-faint:#aaa;
  --muted:#bdbdbd; --ivory:#fff; --ink:#f5f5f5;
  --gold:#d9b44a; --gold-bright:#f0cf70;
  --line:#383838; --border:#383838; --card-border:#383838; --tile-border:#383838;
  --gn-bg:#000; --gn-panel:#000; --gn-nav:#000; --gn-text:#f5f5f5; --gn-muted:#bdbdbd;
  --gp-text-glow:0 0 7px rgb(255 255 255 / 14%);
}
html, body { background:#000!important; color:var(--text); }
body { text-shadow:var(--gp-text-glow); }
/* Semantic surfaces share black; borders retain visual separation. Media stays intact. */
body :is(header,nav,footer,dialog,[role="dialog"],.card,.panel,.order,.notice,
  .email-setup,.email-account-address,.email-password-field input,.payment-email-address,
  .account-menu,.sidebar,.workspace-nav,.modal,.modal-content,.modal-card,
  .modal-panel,.auth-card,.login-card,.section-card,.settings-card,.pack,
  .topbar,.shell,.content-well,.content,.main-panel,.account-card,.review-budget,
  .category,.network,.pending,section[data-step]) {
  background:#000!important; color:#f5f5f5;
}
body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),textarea,select,option) {
  background-color:#000!important; color:#f5f5f5; border-color:#484848;
}
body :is(.order-total,.price,.eyebrow,.payment-review-items strong) { color:var(--gold-bright); }
body :is(.order-note,.notice,.email-setup p) { color:#c9c9c9; }
body .order-row { border-color:#383838; }
body .service-art { background:#000; }
body :is(.pick:has(input:disabled),.payment-button:disabled) {
  background:#000; border-color:#484848; color:#aaa;
}
/* No halo on dark lettering over gold buttons, icons, media or masked credentials. */
button,.pick,input,textarea,select,option,svg,canvas,img,video,
.email-enter-button,.admin-btn,.member-btn { text-shadow:none; }
body :is(.email-account-modal,.service-payment-modal,.service-processing-modal) {
  background:#000!important; color:#fff;
}
body .email-account-modal :is(h2,output,label,li,p) { text-shadow:var(--gp-text-glow); }
/* One aligned indicator per native dropdown. Leave multi-select listboxes native. */
:is(body,body:has(#appShell)) select:not([multiple]):is(:not([size]),[size="0"],[size="1"]) {
  -webkit-appearance:none!important; appearance:none!important;
  min-height:44px; padding-inline-end:42px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23F0CF70' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important; background-position:right 14px center!important;
  background-size:16px 16px!important;
}
:is(body,body:has(#appShell)) select:disabled { opacity:.6; cursor:not-allowed; }
:is(body,body:has(#appShell)) details:not(.workspace-panel)>summary {
  position:relative; display:flex; align-items:center; min-height:44px;
  box-sizing:border-box; padding-inline-end:40px!important; list-style:none;
}
:is(body,body:has(#appShell)) details:not(.workspace-panel)>summary::-webkit-details-marker { display:none; }
:is(body,body:has(#appShell)) details:not(.workspace-panel)>summary::marker { content:''; }
:is(body,body:has(#appShell)) details:not(.workspace-panel)>summary::before { content:none!important; display:none!important; }
:is(body,body:has(#appShell)) details:not(.workspace-panel)>summary::after {
  content:''; position:absolute; inset-inline-end:16px; top:50%; width:8px; height:8px;
  margin:0; border:0; border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor;
  transform:translateY(-70%) rotate(45deg); pointer-events:none; flex-shrink:0;
  transition:transform .16s ease;
}
:is(body,body:has(#appShell)) details:not(.workspace-panel)[open]>summary::after { transform:translateY(-30%) rotate(225deg); }
body .gp-advanced summary .gp-chev,
body .gm-advanced>summary>svg,
body .gm-advanced>summary>span[aria-hidden="true"]:last-child { display:none; }
:is(body,body:has(#appShell)) details>summary:focus-visible { outline:2px solid var(--gold); outline-offset:4px; }
:is(body,body:has(#appShell)) select:dir(rtl):not([multiple]):is(:not([size]),[size="0"],[size="1"]) { background-position:left 14px center!important; }
@media(max-width:540px) {
  :is(body,body:has(#appShell)) select:not([multiple]):is(:not([size]),[size="0"],[size="1"]) { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) {
  :is(body,body:has(#appShell)) details:not(.workspace-panel)>summary::after { transition:none; }
}
@media(forced-colors:active) {
  :is(body,body:has(#appShell)) select:not([multiple]):is(:not([size]),[size="0"],[size="1"]) {
    -webkit-appearance:auto!important; appearance:auto!important; background-image:none!important;
  }
}
@media (prefers-contrast:more) { :root { --gp-text-glow:none; } }
@media (forced-colors:active) {
  html,body,body :is(header,nav,footer,dialog,[role="dialog"],.card,.panel,.order,.notice,.email-setup) {
    background:Canvas!important; color:CanvasText;
  }
  body { text-shadow:none; }
}
@media print { html,body { background:#fff!important; color:#000; } body { text-shadow:none; } }