/* Static public bootstrap bundle. */
/* SOURCE: frontend/shared/tokens.css */
:root{
  /* Jazzler Store visual canon — values are contracts, not patch knobs. */
  --ic-paper:#ffffff;
  --ic-card:var(--ic-paper);
  --ic-paper-2:var(--ic-paper); /* legacy compatibility */
  --ic-ink:#111214;
  --ic-muted:#6b655d;
  --ic-line:#d9d2c7;
  --ic-gold:#c89b54;
  --ic-dark:#0b0b0b;
  --ic-dark-2:#181a1d;
  --ic-placeholder:#cfcdc8;
  --ic-placeholder-dark:#343434;
  --ic-frame:1280px;

  /* Responsive spacing canon. Breakpoint-specific values are assigned by responsive.css. */
  --ic-gutter:32px;
  --ic-gutter-desktop:32px;
  --ic-gutter-compact:24px;
  --ic-gutter-tablet:20px;
  --ic-gutter-mobile:14px;

  --ic-sans:'Plus Jakarta Sans',system-ui,sans-serif;
  --ic-brand-serif:'Cinzel',Georgia,serif;
  --ic-serif:var(--ic-sans); /* legacy alias: do not broaden Cinzel usage implicitly */

  /* Typography scale — no runtime UI text should fall below --ic-text-xs. */
  --ic-text-xs:11px;
  --ic-text-sm:12px;
  --ic-text-md:14px;
  --ic-text-lg:16px;
  --ic-title-sm:20px;
  --ic-title-md:28px;
  --ic-title-lg:44px;
  --ic-leading-tight:1.2;
  --ic-leading-body:1.55;

  /* Rhythm. */
  --ic-space-1:4px;
  --ic-space-2:8px;
  --ic-space-3:12px;
  --ic-space-4:16px;
  --ic-space-5:24px;
  --ic-space-6:32px;
  --ic-space-7:48px;

  /* Controls and surfaces. */
  --ic-control-h:44px;
  --ic-control-h-compact:38px;
  --ic-radius-sm:8px;
  --ic-radius-md:12px;
  --ic-radius-lg:16px;
  --ic-radius-pill:999px;
  --ic-border-subtle:#e4ded6;
  --ic-surface-soft:#faf9f7;
  --ic-shadow-float:0 18px 50px rgba(17,18,20,.14);

  /* Motion system. */
  --ic-motion-micro:140ms;
  --ic-motion-ui:220ms;
  --ic-motion-content:360ms;
  --ic-motion-hero:520ms;
  --ic-ease-standard:cubic-bezier(.2,.7,.2,1);
  --ic-ease-emphasized:cubic-bezier(.16,1,.3,1);

  /* Semantic state palette. */
  --ic-state-success:#2d6b42;
  --ic-state-success-bg:#e6f3ea;
  --ic-state-warning:#8a651f;
  --ic-state-warning-bg:#fff4d8;
  --ic-state-danger:#8d3d37;
  --ic-state-danger-bg:#f7e7e5;
  --ic-state-info:#315f89;
  --ic-state-info-bg:#e6eef7;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ic-paper);color:var(--ic-ink);font-family:var(--ic-sans);-webkit-font-smoothing:antialiased}
button,a{font:inherit}
button{cursor:pointer}
img{max-width:100%;display:block}
.ic-frame{width:min(var(--ic-frame),calc(100% - (var(--ic-gutter) * 2)));margin-inline:auto}
.ic-kicker{display:block;color:var(--ic-gold);font-size:var(--ic-text-xs);font-weight:800;letter-spacing:.15em;text-transform:uppercase}
.ic-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--ic-space-2);min-height:var(--ic-control-h);padding:0 20px;border-radius:var(--ic-radius-sm);border:1px solid transparent;font-size:var(--ic-text-md);font-weight:700;text-decoration:none;transition:transform var(--ic-motion-micro) var(--ic-ease-standard),background-color var(--ic-motion-micro) var(--ic-ease-standard),border-color var(--ic-motion-micro) var(--ic-ease-standard),opacity var(--ic-motion-micro) var(--ic-ease-standard)}
.ic-btn--gold{background:var(--ic-gold);color:#111;border-color:var(--ic-gold)}
.ic-btn--dark{background:#111;color:#fff;border-color:#111}
.ic-btn--outline-dark{background:transparent;color:#161616;border-color:#9e968a}
.ic-btn--outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.48)}
.ic-media{position:relative;overflow:hidden;background:var(--ic-placeholder)}
.ic-media--dark{background:var(--ic-placeholder-dark)}
.ic-media-placeholder{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:rgba(20,20,20,.34);font-size:var(--ic-text-xs);letter-spacing:.09em;text-transform:uppercase}
.ic-media--dark .ic-media-placeholder{color:rgba(255,255,255,.42)}
@media(max-width:760px){:root{--ic-gutter:var(--ic-gutter-mobile)}.ic-frame{width:min(620px,calc(100% - (var(--ic-gutter) * 2)))}}

/* Route transitions are intentionally subtle: navigation should feel continuous, never cinematic. */
#app{transition:opacity var(--ic-motion-ui) var(--ic-ease-standard)}
#app.is-route-transitioning{opacity:.985}
[data-clickable="true"]{cursor:pointer}
[data-clickable="true"]:focus-visible{outline:2px solid currentColor;outline-offset:3px}

/* Shared interaction and semantic state canon. */
.ic-btn:not(:disabled):active{transform:translateY(1px)}
.ic-btn:disabled,[aria-disabled="true"]{cursor:not-allowed;opacity:.48}
.ic-status{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:0 10px;border-radius:var(--ic-radius-pill);font-size:var(--ic-text-xs);font-weight:700}
.ic-status--success{color:var(--ic-state-success);background:var(--ic-state-success-bg)}
.ic-status--warning{color:var(--ic-state-warning);background:var(--ic-state-warning-bg)}
.ic-status--danger{color:var(--ic-state-danger);background:var(--ic-state-danger-bg)}
.ic-status--info{color:var(--ic-state-info);background:var(--ic-state-info-bg)}
:where(button,a,input,select,textarea):focus-visible{outline:2px solid var(--ic-gold);outline-offset:2px}
@media (prefers-reduced-motion:reduce){
  :root{
    --ic-motion-micro:.01ms;
    --ic-motion-ui:.01ms;
    --ic-motion-content:.01ms;
    --ic-motion-hero:.01ms;
  }
  html{scroll-behavior:auto}
}

/* Commerce journey primitives — shared by Desktop and Mobile. */
.ic-commerce-progress{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0 0 var(--ic-space-5);padding:0;overflow:hidden;border:1px solid var(--ic-border-subtle);border-radius:var(--ic-radius-md);background:#fff}
.ic-commerce-progress__step{position:relative;display:flex;align-items:center;gap:8px;min-width:0;padding:12px 14px;color:var(--ic-muted);font-size:var(--ic-text-xs);font-weight:700}
.ic-commerce-progress__step:not(:last-child)::after{content:"";position:absolute;right:0;top:25%;height:50%;width:1px;background:var(--ic-border-subtle)}
.ic-commerce-progress__step b{display:grid;place-items:center;flex:0 0 24px;width:24px;height:24px;border-radius:50%;background:var(--ic-surface-soft);color:var(--ic-muted);font-size:10px}
.ic-commerce-progress__step[data-state="done"]{color:var(--ic-state-success)}.ic-commerce-progress__step[data-state="done"] b{background:var(--ic-state-success-bg);color:var(--ic-state-success)}
.ic-commerce-progress__step[data-state="current"]{color:var(--ic-ink)}.ic-commerce-progress__step[data-state="current"] b{background:var(--ic-dark);color:#fff}
.ic-commerce-trust{display:grid;gap:10px;padding:14px;border-radius:var(--ic-radius-md);background:var(--ic-surface-soft)}
.ic-commerce-trust>div{display:flex;align-items:flex-start;gap:9px}.ic-commerce-trust>div>b{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border-radius:50%;background:var(--ic-state-success-bg);color:var(--ic-state-success);font-size:11px}.ic-commerce-trust span{display:grid;gap:2px}.ic-commerce-trust strong{font-size:var(--ic-text-sm)}.ic-commerce-trust small{color:var(--ic-muted);font-size:var(--ic-text-xs);line-height:1.4}
.ic-commerce-confirmation{display:grid;justify-items:center;gap:12px;padding:42px 28px;border:1px solid var(--ic-border-subtle);border-radius:var(--ic-radius-lg);background:#fff;text-align:center}.ic-commerce-confirmation__mark{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--ic-state-success-bg);color:var(--ic-state-success);font-size:24px;font-weight:800}.ic-commerce-confirmation h2{margin:0;font-size:var(--ic-title-md)}.ic-commerce-confirmation p{max-width:520px;margin:0;color:var(--ic-muted);line-height:var(--ic-leading-body)}.ic-commerce-confirmation__order{padding:7px 11px;border-radius:var(--ic-radius-pill);background:var(--ic-surface-soft);font-size:var(--ic-text-sm)}.ic-commerce-confirmation__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:4px}
@media(max-width:760px){.ic-commerce-progress{margin-bottom:var(--ic-space-4)}.ic-commerce-progress__step{justify-content:center;padding:9px 5px}.ic-commerce-progress__step span{display:none}.ic-commerce-progress__step b{width:26px;height:26px;flex-basis:26px}.ic-commerce-confirmation{padding:32px 18px}.ic-commerce-confirmation__actions{width:100%;display:grid}.ic-commerce-confirmation__actions .ic-btn{width:100%}}

/* SOURCE: frontend/shared/account-access.css */
/* Visual-only workspace: account access is intentionally disconnected from backend logic. */
