/* page-level compositions only. Shared ui-* components live in components.css. */
.auth-page { min-height:100svh; display:flex; flex-direction:column; position:relative; overflow:hidden; }
.auth-page::before { content:''; position:absolute; width: min(70vw,900px); height: min(70vw,900px); border-radius:50%; background:var(--ui-sage); opacity:.18; left:-30%; top:-55%; pointer-events:none; }
.auth-header,.auth-footer { position:relative; z-index:2; }
.auth-header { padding-block:32px 14px; }
.auth-header__inner { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.auth-header__right { font-size:12px; font-weight:700; color:var(--ui-muted); letter-spacing:.04em; }
.auth-main { display:flex; flex:1; align-items:center; padding-block:30px 58px; }
.auth-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(385px,446px); gap:clamp(35px,6vw,110px); align-items:center; }
.auth-story { min-width:0; }
.auth-story__eyebrow { display:flex; align-items:center; gap:11px; margin:0 0 22px; color:var(--ui-accent); font-size:12px; letter-spacing:.11em; font-weight:750; }
.auth-story__eyebrow::before { content:''; width:30px; border-top:2px solid var(--ui-accent); }
.auth-story__title { margin:0; font-family:'Hiragino Mincho ProN','Yu Mincho','Noto Serif CJK JP',serif; letter-spacing:.025em; font-size:clamp(40px,4.1vw,65px); line-height:1.42; font-weight:650; white-space:nowrap; }
.auth-story__title span { position:relative; display:inline-block; }
.auth-story__title span::after { position:absolute; content:''; left:0; right:0; bottom:4px; height:10px; z-index:-1; background:var(--ui-butter); transform:rotate(-1deg); }
.auth-story__description { max-width:450px; margin:23px 0 0; line-height:2.05; color:var(--ui-ink-mid); font-size:14px; font-weight:520; }
.auth-art { margin-top:46px; position:relative; width:min(100%,562px); min-height:254px; background:#f0efe7; border-radius:var(--ui-radius-lg); border:1px solid #e6e6dc; overflow:hidden; }
.auth-art::after { content:''; position:absolute; border:1px solid #e1e4d8; inset:14px; border-radius:18px; pointer-events:none; }
.auth-art__svg { width:100%; height:254px; }
.auth-art__title { position:absolute; font-size:11px; font-weight:750; color:var(--ui-ink-mid); left:28px; top:25px; letter-spacing:.08em; }
.auth-art__note { position:absolute; right:27px; bottom:22px; font-size:11px; font-family:Georgia,serif; font-style:italic; color:var(--ui-muted); }
.auth-auth { width:100%; min-width:0; }
.auth-auth__panel { padding:35px; background:rgba(255,254,251,.94); box-shadow:0 24px 80px rgba(53,70,54,.055),0 3px 16px rgba(53,70,54,.02); border-color:#e0e4d8; }
.auth-auth__topline { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:10px; }
.auth-auth__mini { color:var(--ui-muted); font-size:10px; letter-spacing:.12em; font-weight:750; }
.auth-auth__kicker { color:var(--ui-accent); font-family:Georgia,serif; font-size:13px; letter-spacing:.05em; font-style:italic; }
.auth-auth__heading { margin:0 0 10px; font-size:27px; line-height:1.45; font-weight:750; letter-spacing:-.025em; }
.auth-auth__description { margin:0 0 23px; color:var(--ui-muted); font-size:12px; line-height:1.85; }
.auth-auth__form { display:grid; gap:17px; margin-top:20px; }
.auth-auth__smallprint { color:var(--ui-muted); font-size:11px; margin:0; line-height:1.75; }
.auth-auth__trial { display:grid; gap:6px; padding:13px 15px; border-radius:12px; background:var(--ui-butter); font-size:11px; color:#534938; line-height:1.75; }
.auth-auth__trial strong { font-size:12px; color:#443c2f; }
.auth-auth__footer { margin-top:20px; display:flex; gap:8px; align-items:center; justify-content:center; color:var(--ui-muted); font-size:11px; }
.auth-auth__status { margin-top:14px; }
.auth-footer { padding:10px 0 22px; }
.auth-footer__inner { border-top:1px solid var(--ui-edge); padding-top:17px; display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:11px; color:var(--ui-muted); }
.auth-footer__links { display:flex; gap:17px; flex-wrap:wrap; }
.auth-footer button { font:inherit; color:inherit; padding:0; background:none; border:0; text-decoration:underline; text-decoration-color:transparent; text-underline-offset:4px; }
.auth-footer button:hover { text-decoration-color:currentColor; }
.auth-footer__mock { color:#79857b; }
.auth-hidden { display:none!important; }
/* All layout rules depend on width, not UA/browser sniffing. */
@media (min-width:1100px) and (max-height:810px) { .auth-art { min-height:194px; margin-top:26px; } .auth-art__svg { height:194px; } .auth-main { padding-block:8px 20px; } .auth-header { padding-block:17px 4px; } }
@media (min-width:680px) and (max-width:1099px) {
  .auth-header { padding-block:26px 12px; }
  .auth-main { align-items:flex-start; padding-block:clamp(55px,9vh,110px) 40px; }
  .auth-layout { grid-template-columns:minmax(0,.96fr) minmax(0,1.04fr); gap:22px; align-items:center; }
  .auth-story__title { font-size:clamp(32px,4.1vw,43px); }
  .auth-story__description { font-size:13px; line-height:1.9; max-width:330px; }
  .auth-art { margin-top:25px; min-height:195px; }
  .auth-art__svg { height:195px; }
  .auth-auth__panel { padding:25px; }
  .auth-auth__heading { font-size:24px; }
  .auth-header__right { font-size:11px; }
}
@media (max-width:679px) {
  .auth-header { padding-block:20px 7px; }
  .auth-header__right { display:none; }
  .auth-main { padding-block:23px 20px; align-items:flex-start; }
  .auth-layout { grid-template-columns:minmax(0,1fr); gap:29px; }
  .auth-story__eyebrow { margin-bottom:12px; font-size:10px; }
  .auth-story__eyebrow::before { width:20px; }
  .auth-story__title { font-size:clamp(31px,9.8vw,43px); line-height:1.42; }
  .auth-story__description { font-size:12px; line-height:1.8; max-width:370px; margin-top:13px; }
  .auth-art { display:none; }
  .auth-auth__panel { padding:22px 19px; border-radius:20px; }
  .auth-auth__heading { font-size:23px; }
  .auth-auth__description { font-size:12px; margin-bottom:15px; }
  .auth-auth__form { gap:15px; }
  .auth-footer { padding-block:8px 18px; }
  .auth-footer__inner { flex-direction:column; align-items:flex-start; gap:13px; line-height:1.8; }
  .auth-footer__links { gap:8px 13px; }
  .auth-footer__mock { font-size:10px; }
}
/* Component catalogue for designer/developer acceptance, never user-facing in production. */
.specimen-page { padding-bottom:64px; }
.specimen-top { border-bottom:1px solid var(--ui-edge); background:var(--ui-surface); }
.specimen-top__inner { display:flex; gap:20px; justify-content:space-between; align-items:center; padding-block:21px; }
.specimen-header { margin-block:38px 31px; }
.specimen-header h1 { font-size:clamp(28px,4vw,43px); margin:8px 0; font-weight:780; letter-spacing:-.03em; }
.specimen-header p { max-width:740px; color:var(--ui-ink-mid); line-height:1.8; }
.specimen-layout { display:grid; grid-template-columns:190px minmax(0,1fr); gap:35px; }
.specimen-nav { position:sticky; top:20px; height:fit-content; display:grid; gap:4px; }
.specimen-nav a { display:block; padding:9px 12px; border-radius:10px; font-size:12px; color:var(--ui-ink-mid); }
.specimen-nav a:hover { background:var(--ui-accent-tint); }
.specimen-body { min-width:0; display:grid; gap:26px; }
.specimen-section { scroll-margin-top:30px; }
.specimen-section__top { display:flex; gap:8px; justify-content:space-between; align-items:baseline; margin-bottom:12px; }
.specimen-section__label { color:var(--ui-muted); font-size:11px; font-weight:700; }
.specimen-content { display:grid; gap:16px; }
.specimen-content--buttons { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }
.specimen-content--columns { grid-template-columns:repeat(2,minmax(0,1fr)); }
.specimen-swatch-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:9px; }
.specimen-swatch-label { font-size:11px; font-weight:700; margin:7px 0 0; }
.specimen-swatch-code { font-size:10px; color:var(--ui-muted); }
.specimen-typescale p { margin:0; }
.specimen-typescale { display:grid; gap:13px; }
.specimen-stage { display:flex; justify-content:space-between; gap:12px; align-items:center; }
.specimen-demo-layout { display:grid; grid-template-columns:190px minmax(0,1fr); gap:16px; }
.specimen-demo-sidebar { border-radius:var(--ui-radius-md); background:var(--ui-sage); padding:17px; display:grid; align-content:start; gap:9px; }
.specimen-demo-sidebar a { display:block; background:rgba(255,255,255,.52); border-radius:var(--ui-radius-xs); padding:9px; font-size:12px; }
.specimen-demo-main { display:grid; gap:13px; }
.specimen-mock-panels { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.specimen-mock-panels .ui-panel { padding:16px; }
@media (max-width:900px) { .specimen-layout { grid-template-columns:1fr; gap:20px; } .specimen-nav { position:static; display:flex; flex-wrap:wrap; gap:5px; } .specimen-nav a { border:1px solid var(--ui-edge); } .specimen-swatch-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:679px) { .specimen-top__inner { flex-wrap:wrap; gap:10px; } .specimen-header { margin-block:22px; } .specimen-swatch-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .specimen-content--columns,.specimen-demo-layout,.specimen-mock-panels { grid-template-columns:1fr; } .specimen-stage { align-items:flex-start; flex-direction:column; } }
/* Public prelaunch notice: no auth API and no account creation until release. */
.auth-prelaunch-note{display:flex;align-items:flex-start;gap:9px;margin:0 0 15px;padding:11px 13px;border:1px solid var(--ui-edge);border-radius:12px;background:var(--ui-sage);color:var(--ui-accent);font-size:12px;line-height:1.7}
.auth-prelaunch-note span{font-size:7px;line-height:20px;flex-shrink:0}
.auth-auth__trial span strong{font-size:inherit;color:#7b3e36;font-weight:800}