@import url("https://font.emtech.cc/css/ChironGoRoundTC");
/* SmileVibe tokens.css — FROZEN v2.0.0-frozen · 2026-08-20
   唯一 canonical。與 handoff/tokens.json 完全一致。
   禁止在頁面中寫入非 token 的 hex／字級／間距／圓角。 */
:root{
  --sv-font-ui: 'ChironGoRoundTC','Noto Sans TC','PingFang TC',sans-serif;
  --sv-font-body: 'ChironGoRoundTC','Noto Sans TC','PingFang TC',sans-serif;
  --sv-font-display: 'ChironGoRoundTC','Noto Sans TC',sans-serif;
  --sv-font-brand-display: 'jf-kamabit','jf-jinxuanlatte','ChironGoRoundTC',sans-serif;
  --sv-font-brand-body: 'jf-jinxuanlatte','ChironGoRoundTC','Noto Sans TC',sans-serif;
  --sv-font-hand: 'kolliko','ChironGoRoundTC',sans-serif;
  --sv-font-mono: ui-monospace,'SF Mono','IBM Plex Mono',Menlo,Consolas,monospace;
  --sv-font-article: 'ChironGoRoundTC','Noto Sans TC',sans-serif;

  /* ink & neutral */
  --sv-ink-950:#20252B; --sv-ink-850:#2D343B; --sv-ink-700:#46515C; --sv-ink-550:#65717C;
  --sv-line-300:#CBD3D8; --sv-mist-200:#DCE4E8; --sv-mist-100:#E7EDF0;
  --sv-cloud-050:#F1F4F5; --sv-porcelain:#F7F8F7; --sv-white:#FFFFFF;
  /* fog blue */
  --sv-fog-deep:#303840; --sv-fog-700:#607987; --sv-fog-500:#8199A7; --sv-fog-300:#B6C4CC; --sv-fog-100:#E4EBEE;
  /* accents (少量跳色，單視窗最多 1 主 + 1 輔) */
  --sv-iris:#5F6390; --sv-teal:#5D8983; --sv-berry:#A06478; --sv-lime:#A2AA74; --sv-ice:#5F82A5;
  /* accents — 小字可用的深階（AA） */
  --sv-iris-deep:#50537E; --sv-teal-deep:#3F6863; --sv-berry-deep:#854C5D; --sv-lime-deep:#6E7548; --sv-ice-deep:#4A6884;
  /* semantic (AA on porcelain) */
  --sv-success:#3F6863; --sv-warning:#8A5F22; --sv-error:#A93F4A; --sv-info:#4A6884; --sv-focus:#5F6390;
  /* type */
--sv-fs-min:13px; --sv-fs-caption:13px; --sv-fs-body-s:14px; --sv-fs-body:16px; --sv-fs-body-l:17px;
  --sv-lh-body:1.7; --sv-lh-tight:1.4;
  /* spacing */
  --sv-s-1:4px; --sv-s-2:8px; --sv-s-3:12px; --sv-s-4:16px; --sv-s-5:20px; --sv-s-6:24px;
  --sv-s-7:32px; --sv-s-8:40px; --sv-s-9:48px; --sv-s-10:64px; --sv-s-11:80px; --sv-s-12:110px;
  /* radius */
  --sv-r-xs:6px; --sv-r-sm:8px; --sv-r-md:10px; --sv-r-lg:12px; --sv-r-xl:14px; --sv-r-xxl:16px; --sv-r-hero:18px; --sv-r-pill:999px;
  /* border */
  --sv-b-subtle:1px solid #E7EDF0; --sv-b-default:1px solid #DCE4E8; --sv-b-strong:1px solid #B6C4CC; --sv-b-focus:2px solid #5F6390;
  /* elevation — 僅浮層 */
  --sv-sh-drawer:-14px 0 36px rgba(32,37,43,.18); --sv-sh-modal:0 22px 60px rgba(32,37,43,.22); --sv-sh-fab:0 12px 30px rgba(32,37,43,.28);
  /* motion */
  --sv-t-fast:120ms; --sv-t-base:180ms; --sv-t-slow:260ms; --sv-ease:cubic-bezier(.2,.8,.2,1);
  /* z-index */
  --sv-z-sticky:100; --sv-z-mobilenav:300; --sv-z-backdrop:400; --sv-z-drawer:401; --sv-z-modal:700; --sv-z-toast:900; --sv-z-fab:1000;
  /* touch */
  --sv-touch-min:44px;
}
/* 文字色使用規則（AA）：小字（13–16px）只准用這些 */
.sv-text{color:var(--sv-ink-850)}
.sv-text-muted{color:var(--sv-ink-700)}
.sv-text-brand{color:var(--sv-fog-700)}
/* 禁止：fog-500 / fog-300 / lime / teal / ice 作為 13–16px 文字色 */
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* 深底文字（surface-aware）：深底一律用這三階，禁止 ink700／ink550／*-deep */
.sv-on-dark{color:var(--sv-white)}
.sv-on-dark-body{color:var(--sv-mist-200)}
.sv-on-dark-muted{color:var(--sv-fog-300)}
.sv-on-dark-kicker{color:var(--sv-fog-500)}
/* 白字徽章底色只能用深階 */
.sv-badge-solid-ok{background:var(--sv-teal-deep);color:var(--sv-white)}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;min-width:0;background:var(--sv-porcelain);color:var(--sv-ink-950);font-family:var(--sv-font-body);font-size:var(--sv-fs-body);font-weight:500;line-height:var(--sv-lh-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea{font:inherit;color:inherit} button,a{touch-action:manipulation} button{border:0} a{color:inherit;text-decoration:none} img{max-width:100%;height:auto;display:block} figure{margin:0}
h1,h2,h3,p{margin-block-start:0} h1,h2,h3{font-family:var(--sv-font-display);line-height:var(--sv-lh-tight);letter-spacing:-.02em} h1{font-size:clamp(30px,4vw,46px)} h2{font-size:clamp(24px,3vw,34px)} h3{font-size:clamp(22px,2.3vw,27px)} p{margin-block-end:var(--sv-s-4)}
:focus-visible{outline:var(--sv-b-focus);outline-offset:var(--sv-s-1)} ::selection{background:var(--sv-fog-100)} [hidden]{display:none!important}
.sv-skip-link{position:fixed;z-index:var(--sv-z-toast);inset-block-start:var(--sv-s-2);inset-inline-start:var(--sv-s-2);transform:translateY(-160%);padding:var(--sv-s-3) var(--sv-s-4);border-radius:var(--sv-r-md);background:var(--sv-ink-950);color:var(--sv-white);font-weight:700}.sv-skip-link:focus{transform:translateY(0)}
.sv-container{width:min(100% - (var(--sv-s-8) * 2),1600px);margin-inline:auto;min-width:0}.sv-container--public{max-width:1240px}.sv-section{padding-block:var(--sv-s-11)}.sv-section--compact{padding-block:var(--sv-s-9)}
.sv-grid{display:grid;gap:var(--sv-s-6);min-width:0}.sv-stack{display:flex;flex-direction:column;gap:var(--sv-s-4);min-width:0}.sv-row{display:flex;align-items:center;gap:var(--sv-s-3);min-width:0}.sv-row--between{justify-content:space-between}.sv-wrap{flex-wrap:wrap}
.sv-kicker{font-size:var(--sv-fs-caption);font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--sv-iris-deep)}.sv-hand{font-family:var(--sv-font-hand);font-weight:600}.sv-mono{font-family:var(--sv-font-mono);font-size:var(--sv-fs-caption)}.sv-muted{color:var(--sv-ink-700)}.sv-caption{font-size:var(--sv-fs-caption);line-height:1.6}.sv-body-s{font-size:var(--sv-fs-body-s);line-height:1.65}.sv-on-dark{color:var(--sv-white)}.sv-on-dark-body{color:var(--sv-mist-200)}.sv-on-dark-muted{color:var(--sv-fog-300)}
.sv-button{min-height:var(--sv-touch-min);display:inline-flex;align-items:center;justify-content:center;gap:var(--sv-s-2);padding:var(--sv-s-3) var(--sv-s-5);border-radius:var(--sv-r-lg);border:var(--sv-b-default);background:var(--sv-white);color:var(--sv-ink-850);font-weight:800;cursor:pointer;transition:transform var(--sv-t-fast) var(--sv-ease),border-color var(--sv-t-fast) var(--sv-ease),background var(--sv-t-fast) var(--sv-ease)}.sv-button:hover{transform:translateY(calc(var(--sv-s-1) * -1));border-color:var(--sv-fog-500)}.sv-button:active{transform:translateY(0)}.sv-button--primary{border-color:var(--sv-ink-950);background:var(--sv-ink-950);color:var(--sv-white)}.sv-button--brand{border-color:var(--sv-iris-deep);background:var(--sv-iris-deep);color:var(--sv-white)}.sv-button--quiet{background:transparent;border-color:var(--sv-line-300);color:var(--sv-ink-700)}.sv-button--danger{border-color:var(--sv-error);color:var(--sv-error)}.sv-button--icon{width:var(--sv-touch-min);padding:0;border-radius:var(--sv-r-md);flex:0 0 var(--sv-touch-min)}.sv-button[disabled]{cursor:not-allowed;opacity:.55;transform:none}
.sv-card{min-width:0;border:var(--sv-b-default);border-radius:var(--sv-r-xl);background:var(--sv-white);padding:var(--sv-s-5)}.sv-card--subtle{background:var(--sv-cloud-050)}.sv-card--dark{border-color:var(--sv-ink-700);background:var(--sv-fog-deep);color:var(--sv-white)}.sv-card--selected{border:var(--sv-b-focus)}.sv-card__title{font-size:clamp(17px,2vw,20px);font-weight:800;line-height:var(--sv-lh-tight)}
.sv-media{position:relative;overflow:hidden;border-radius:var(--sv-r-lg);background:var(--sv-mist-100);min-width:0}.sv-media>img{width:100%;height:100%;object-fit:cover}.sv-media--square{aspect-ratio:1}.sv-media--portrait{aspect-ratio:3/4}.sv-media--wide{aspect-ratio:16/9}.sv-media--proof{aspect-ratio:6/5}.sv-media__badge{position:absolute;inset-block-start:var(--sv-s-2);inset-inline-start:var(--sv-s-2)}.sv-watermark::after{content:'校稿預覽 · 非生產檔';position:absolute;inset:0;display:grid;place-items:center;transform:rotate(-18deg);font-family:var(--sv-font-mono);font-size:clamp(17px,3vw,28px);font-weight:800;letter-spacing:.08em;color:color-mix(in srgb,var(--sv-white) 72%,transparent);text-shadow:0 0 var(--sv-s-1) var(--sv-ink-950);pointer-events:none}
.sv-badge{min-height:28px;display:inline-flex;align-items:center;gap:var(--sv-s-2);padding:var(--sv-s-1) var(--sv-s-3);border-radius:var(--sv-r-pill);border:var(--sv-b-default);background:var(--sv-white);font-size:var(--sv-fs-caption);font-weight:800;white-space:nowrap}.sv-badge--success{border-color:var(--sv-teal-deep);background:var(--sv-teal-deep);color:var(--sv-white)}.sv-badge--warning{border-color:var(--sv-warning);background:var(--sv-warning);color:var(--sv-white)}.sv-badge--info{border-color:var(--sv-ice-deep);background:var(--sv-ice-deep);color:var(--sv-white)}.sv-badge--berry{border-color:var(--sv-berry-deep);background:var(--sv-berry-deep);color:var(--sv-white)}.sv-badge--outline{border-color:var(--sv-fog-500);color:var(--sv-fog-700)}
.sv-input,.sv-select,.sv-textarea{width:100%;min-height:var(--sv-touch-min);border:var(--sv-b-default);border-radius:var(--sv-r-md);background:var(--sv-white);padding:var(--sv-s-3) var(--sv-s-4)}.sv-input:hover,.sv-select:hover,.sv-textarea:hover{border-color:var(--sv-fog-500)}.sv-textarea{min-height:110px;resize:vertical}.sv-field{display:flex;flex-direction:column;gap:var(--sv-s-2)}.sv-field>label{font-size:var(--sv-fs-body-s);font-weight:800}.sv-field__hint{font-size:var(--sv-fs-caption);color:var(--sv-ink-700)}
.sv-tabs{display:flex;gap:var(--sv-s-2);overflow-x:auto;scrollbar-width:thin;border-bottom:var(--sv-b-default)}.sv-tab{min-height:var(--sv-touch-min);padding-inline:var(--sv-s-4);background:transparent;border-bottom:2px solid transparent;font-weight:800;white-space:nowrap;cursor:pointer}.sv-tab[aria-selected="true"]{border-bottom-color:var(--sv-iris-deep);color:var(--sv-iris-deep)}
.sv-feedback{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--sv-s-4);border:var(--sv-b-default);border-radius:var(--sv-r-xl);padding:var(--sv-s-5);background:var(--sv-white)}.sv-feedback__character{width:72px;aspect-ratio:1;object-fit:contain}.sv-feedback__code{font-family:var(--sv-font-mono);font-size:var(--sv-fs-caption);color:var(--sv-ink-700)}
.sv-order-preview{display:grid;grid-template-columns:88px minmax(0,1fr);gap:var(--sv-s-4);align-items:center;min-width:0}.sv-order-preview__media{width:88px;aspect-ratio:1;border-radius:var(--sv-r-md);overflow:hidden;background:var(--sv-mist-100)}.sv-order-preview__media img{width:100%;height:100%;object-fit:cover}.sv-order-preview__meta{min-width:0}.sv-order-preview__meta strong,.sv-order-preview__meta span{display:block;overflow-wrap:anywhere}.sv-price-slot{display:inline-flex;align-items:center;min-height:var(--sv-touch-min);padding:var(--sv-s-2) var(--sv-s-4);border:var(--sv-b-strong);border-radius:var(--sv-r-md);font-family:var(--sv-font-mono);font-size:var(--sv-fs-body-s);font-weight:800;color:var(--sv-ink-700)}
.sv-progress{display:flex;align-items:center;gap:var(--sv-s-2);min-width:0}.sv-progress__item{display:flex;align-items:center;gap:var(--sv-s-2);font-size:var(--sv-fs-caption);font-weight:800;white-space:nowrap}.sv-progress__step{width:28px;height:28px;border-radius:var(--sv-r-pill);display:grid;place-items:center;border:var(--sv-b-strong);font-family:var(--sv-font-mono)}.sv-progress__item[data-current="true"] .sv-progress__step{border-color:var(--sv-iris-deep);background:var(--sv-iris-deep);color:var(--sv-white)}.sv-progress__line{width:var(--sv-s-6);height:1px;background:var(--sv-line-300)}
.sv-shell-topbar{min-height:64px;display:flex;align-items:center;gap:var(--sv-s-4);padding:var(--sv-s-2) var(--sv-s-6);border-bottom:var(--sv-b-subtle);background:var(--sv-white)}.sv-shell-topbar--sticky{position:sticky;inset-block-start:0;z-index:var(--sv-z-sticky)}.sv-wordmark{width:104px;height:auto}.sv-shell-title{min-width:0;flex:1}.sv-shell-title strong,.sv-shell-title span{display:block;overflow-wrap:anywhere}
.sv-public-header{min-height:72px;position:sticky;inset-block-start:0;z-index:var(--sv-z-sticky);border-bottom:var(--sv-b-subtle);background:color-mix(in srgb,var(--sv-porcelain) 94%,transparent);backdrop-filter:blur(14px)}.sv-public-header__inner{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:var(--sv-s-5)}.sv-public-nav{display:flex;align-items:center;gap:var(--sv-s-5);font-size:var(--sv-fs-body-s);font-weight:800}.sv-public-nav a{min-height:var(--sv-touch-min);display:inline-flex;align-items:center}.sv-public-header__actions{display:flex;align-items:center;gap:var(--sv-s-2)}.sv-nav-toggle{display:none}
.sv-app-shell{min-height:100svh;display:grid;grid-template-columns:232px minmax(0,1fr);background:var(--sv-porcelain)}.sv-app-shell--admin{grid-template-columns:238px minmax(0,1fr)}.sv-sidebar{position:sticky;inset-block-start:0;height:100svh;display:flex;flex-direction:column;gap:var(--sv-s-5);padding:var(--sv-s-5) var(--sv-s-4);background:var(--sv-ink-950);color:var(--sv-white);overflow-y:auto}.sv-sidebar__brand{display:flex;align-items:center;justify-content:center;min-height:var(--sv-touch-min)}.sv-sidebar__brand img{width:122px;height:auto}.sv-sidebar__nav{display:flex;flex-direction:column;gap:var(--sv-s-2)}.sv-sidebar__nav a{min-height:var(--sv-touch-min);display:flex;align-items:center;gap:var(--sv-s-3);padding:var(--sv-s-2) var(--sv-s-3);border-radius:var(--sv-r-md);color:var(--sv-mist-200);font-size:var(--sv-fs-body-s);font-weight:700}.sv-sidebar__nav a[aria-current="page"]{background:var(--sv-ink-700);color:var(--sv-white)}.sv-sidebar__icon{width:24px;text-align:center;font-family:var(--sv-font-mono);font-weight:800;flex:0 0 24px}.sv-sidebar__footer{margin-block-start:auto;border-top:1px solid var(--sv-ink-700);padding-block-start:var(--sv-s-4)}.sv-app-main{min-width:0;display:flex;flex-direction:column}.sv-app-content{width:min(100%,1600px);margin-inline:auto;padding:var(--sv-s-6);min-width:0}
.sv-mobile-nav{display:none;position:fixed;inset-inline:0;inset-block-end:0;z-index:var(--sv-z-mobilenav);grid-template-columns:repeat(5,minmax(0,1fr));border-top:var(--sv-b-default);background:var(--sv-white);padding-block:var(--sv-s-1) calc(var(--sv-s-1) + env(safe-area-inset-bottom,0px))}.sv-mobile-nav a{min-height:52px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sv-s-1);font-size:var(--sv-fs-caption);color:var(--sv-ink-700)}.sv-mobile-nav a[aria-current="page"]{color:var(--sv-iris-deep);font-weight:800}
.sv-drawer-backdrop{position:fixed;overflow:hidden;inset:0;z-index:var(--sv-z-backdrop);background:color-mix(in srgb,var(--sv-ink-950) 45%,transparent);opacity:0;pointer-events:none;transition:opacity var(--sv-t-base) var(--sv-ease)}.sv-drawer{position:absolute;inset-block:0;inset-inline-end:0;width:min(320px,86vw);display:flex;flex-direction:column;gap:var(--sv-s-4);padding:var(--sv-s-5);background:var(--sv-white);box-shadow:var(--sv-sh-drawer);transform:translateX(105%);transition:transform var(--sv-t-base) var(--sv-ease)}.sv-drawer-backdrop[data-open="false"] .sv-drawer{display:none}.sv-drawer-backdrop[data-open="true"]{opacity:1;pointer-events:auto}.sv-drawer-backdrop[data-open="true"] .sv-drawer{transform:translateX(0)}.sv-drawer__nav{display:flex;flex-direction:column;gap:var(--sv-s-2)}.sv-drawer__nav a{min-height:var(--sv-touch-min);display:flex;align-items:center;padding-inline:var(--sv-s-3);border-bottom:var(--sv-b-subtle);font-weight:800}
.sv-support{position:fixed;inset-inline-end:var(--sv-s-5);inset-block-end:var(--sv-s-5);z-index:var(--sv-z-fab);display:flex;align-items:flex-end;gap:var(--sv-s-3)}.sv-support__panel{width:min(290px,calc(100vw - var(--sv-s-8)));border:var(--sv-b-default);border-radius:var(--sv-r-xl);padding:var(--sv-s-4);background:var(--sv-white);box-shadow:var(--sv-sh-fab)}.sv-support__panel a{min-height:var(--sv-touch-min);display:flex;align-items:center;justify-content:space-between;border-bottom:var(--sv-b-subtle);font-weight:800}.sv-support__trigger{width:64px;height:64px;border-radius:var(--sv-r-pill);background:var(--sv-ink-950);box-shadow:var(--sv-sh-fab);cursor:pointer;overflow:hidden;border:3px solid var(--sv-white)}.sv-support__trigger img{width:100%;height:100%;object-fit:cover}
.sv-metric{display:flex;flex-direction:column;gap:var(--sv-s-2);border:var(--sv-b-default);border-radius:var(--sv-r-xl);background:var(--sv-white);padding:var(--sv-s-4)}.sv-metric__value{font-family:var(--sv-font-mono);font-size:clamp(24px,3vw,34px);font-weight:800;line-height:1.2}.sv-meter{height:8px;border-radius:var(--sv-r-pill);background:var(--sv-mist-100);overflow:hidden}.sv-meter>span{display:block;height:100%;width:var(--meter-value,50%);background:var(--sv-teal-deep);border-radius:inherit}
.sv-scroll-table{max-width:100%;overflow-x:auto;border:var(--sv-b-default);border-radius:var(--sv-r-xl);background:var(--sv-white)}.sv-scroll-table table{width:100%;min-width:760px;border-collapse:collapse}.sv-scroll-table th,.sv-scroll-table td{text-align:left;padding:var(--sv-s-3) var(--sv-s-4);border-bottom:var(--sv-b-subtle);vertical-align:middle}.sv-scroll-table th{font-size:var(--sv-fs-caption);color:var(--sv-ink-700);background:var(--sv-cloud-050)}
@media (max-width:1080px){.sv-container{width:min(100% - (var(--sv-s-6) * 2),1600px)}.sv-section{padding-block:var(--sv-s-10)}.sv-public-nav{display:none}.sv-nav-toggle{display:inline-flex}}
@media (min-width:769px) and (max-width:860px){.sv-app-shell,.sv-app-shell--admin{grid-template-columns:68px minmax(0,1fr)}.sv-sidebar{padding-inline:var(--sv-s-2)}.sv-sidebar__brand img{width:44px;object-fit:cover;object-position:left}.sv-sidebar__label,.sv-sidebar__footer{display:none}.sv-sidebar__nav a{justify-content:center;padding-inline:var(--sv-s-2)}}
@media (max-width:768px){body{font-size:var(--sv-fs-body)}.sv-container{width:min(100% - (var(--sv-s-4) * 2),1600px)}.sv-section{padding-block:var(--sv-s-10)}.sv-section--compact{padding-block:var(--sv-s-8)}.sv-grid{gap:var(--sv-s-4)}.sv-public-header__inner{min-height:64px}.sv-public-header{min-height:64px}.sv-wordmark{width:92px}.sv-app-shell,.sv-app-shell--admin{display:block;padding-block-end:64px}.sv-sidebar{display:none}.sv-mobile-nav{display:grid}.sv-app-content{padding:var(--sv-s-4)}.sv-shell-topbar{padding-inline:var(--sv-s-4);align-items:flex-start;flex-wrap:wrap}.sv-feedback{grid-template-columns:1fr;text-align:center}.sv-feedback__character{margin-inline:auto}.sv-order-preview{grid-template-columns:72px minmax(0,1fr)}.sv-order-preview__media{width:72px}.sv-progress{display:none}.sv-support{inset-inline-end:var(--sv-s-4);inset-block-end:calc(64px + var(--sv-s-4) + env(safe-area-inset-bottom,0px))}.sv-support__trigger{width:56px;height:56px}}
@media (max-width:390px){.sv-button{padding-inline:var(--sv-s-4)}.sv-public-header__actions .sv-button--quiet{display:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.sv-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Font policy (2026-08-22): ChironGoRoundTC is the base face everywhere. Chrome —
   header, footer, nav, sidebar, breadcrumb — always stays on --sv-font-ui so it
   reads the same on every page. Key marketing pages opt into the justfont brand
   faces via [data-brand-fonts]; traffic pages keep the base face. */
.sv-public-header, .public-footer, .public-breadcrumb, .sv-sidebar, .sv-mobile-nav,
.sv-shell-topbar, .sv-public-header *, .public-footer *, .public-breadcrumb *,
.sv-sidebar *, .sv-mobile-nav * { font-family: var(--sv-font-ui); }
[data-brand-fonts] { --sv-font-display: var(--sv-font-brand-display); --sv-font-body: var(--sv-font-brand-body); }

body[data-page-kind="article"],body[data-page-kind="guide"],body[data-page-kind="legal"]{font-family:var(--sv-font-article)}
body[data-page-kind="article"] h1,body[data-page-kind="article"] h2,body[data-page-kind="article"] h3,body[data-page-kind="guide"] h1,body[data-page-kind="guide"] h2,body[data-page-kind="legal"] h1,body[data-page-kind="legal"] h2{font-family:var(--sv-font-article)}
.public-breadcrumb{display:flex;align-items:center;gap:var(--sv-s-2);margin-block-end:var(--sv-s-6);font-size:var(--sv-fs-body-s);color:var(--sv-ink-700)}
.public-breadcrumb a{min-height:var(--sv-touch-min);display:inline-flex;align-items:center;font-weight:800}
.public-page-hero{background:var(--sv-cloud-050)}
.public-page-hero__grid,.public-detail-hero__grid,.public-article-hero__grid,.public-support-hero__grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(420px,1.1fr);gap:var(--sv-s-8);align-items:center}
.public-page-hero__grid h1,.public-detail-hero__grid h1,.public-article-hero__grid h1,.public-support-hero__grid h1{font-size:clamp(34px,4.6vw,60px);margin-block:var(--sv-s-3)}
.public-page-hero__grid p,.public-detail-hero__grid p,.public-article-hero__grid>div>p,.public-support-hero__grid>div>p{font-size:var(--sv-fs-body-l);color:var(--sv-ink-700);max-width:42rem}
.public-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--sv-s-6);margin-block-end:var(--sv-s-7)}
.public-section-head h2{margin:var(--sv-s-2) 0 0}
.public-section-head>p{max-width:34rem;margin:0;color:var(--sv-ink-700)}
.public-filterbar{display:flex;align-items:center;justify-content:space-between;gap:var(--sv-s-5);margin-block-end:var(--sv-s-6)}
.public-filterbar__chips{display:flex;gap:var(--sv-s-2);overflow-x:auto}
.public-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sv-s-6)}
.public-card-grid--search{grid-template-columns:repeat(3,minmax(0,1fr))}
.public-media-card{padding:0;overflow:hidden;transition:transform var(--sv-t-fast) var(--sv-ease),border-color var(--sv-t-fast) var(--sv-ease)}
.public-media-card:hover{transform:translateY(calc(var(--sv-s-1) * -1));border-color:var(--sv-fog-500)}
.public-media-card__link{height:100%;display:flex;flex-direction:column}
.public-media-card__body{display:flex;flex:1;flex-direction:column;gap:var(--sv-s-3);padding:var(--sv-s-5)}
.public-media-card__body h2{font-size:clamp(20px,2.3vw,27px);margin:0}
.public-media-card__body p{margin:0;color:var(--sv-ink-700)}
.public-card-action{margin-block-start:auto;padding-block-start:var(--sv-s-2);font-size:var(--sv-fs-body-s);font-weight:800;color:var(--sv-iris-deep)}
.public-media-card time{font-size:var(--sv-fs-caption);color:var(--sv-ink-700)}
.public-empty{margin-block-start:var(--sv-s-7)}
.public-author-hero{display:grid;grid-template-columns:160px minmax(0,1fr);gap:var(--sv-s-6);align-items:center}
.public-author-hero img{width:160px;aspect-ratio:1;object-fit:cover;border-radius:var(--sv-r-pill)}
.public-author-hero h1{margin-block:var(--sv-s-2)}
.public-home-hero{padding-block-start:var(--sv-s-10);background:var(--sv-porcelain)}
.public-home-hero__grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(480px,1.1fr);gap:var(--sv-s-8);align-items:center}
.public-home-hero__copy{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sv-s-5)}
.public-home-hero h1{font-size:clamp(34px,4.6vw,60px);margin:0}
.public-home-hero h1 em{color:var(--sv-iris-deep);font-style:normal}
.public-home-hero__copy>p{font-size:var(--sv-fs-body-l);line-height:1.75;color:var(--sv-ink-700);max-width:38rem;margin:0}
.public-home-hero__actions{flex-wrap:wrap}
.public-home-proof{display:flex;flex-wrap:wrap;gap:var(--sv-s-4);padding-block-start:var(--sv-s-2);font-size:var(--sv-fs-caption);color:var(--sv-ink-700)}
.public-home-proof span{display:flex;align-items:center;gap:var(--sv-s-1)}
.public-home-proof strong{color:var(--sv-teal-deep)}
.public-home-hero__visual{display:grid;grid-template-columns:minmax(0,1fr) 180px;grid-template-rows:auto auto;gap:var(--sv-s-4);min-width:0}
.public-home-hero__main{grid-row:1 / 3;min-height:0;height:420px;aspect-ratio:auto}
.public-home-hero__main figcaption{position:absolute;inset-inline-start:var(--sv-s-4);inset-block-end:var(--sv-s-4);padding:var(--sv-s-2) var(--sv-s-3);border-radius:var(--sv-r-md);background:var(--sv-ink-950);color:var(--sv-white);font-size:var(--sv-fs-caption);font-weight:800}
.public-home-hero__portrait{min-height:0;height:238px;aspect-ratio:auto}
.public-home-note{display:grid;grid-template-columns:68px minmax(0,1fr);gap:var(--sv-s-2);align-items:center;border:var(--sv-b-default);border-radius:var(--sv-r-xl);background:var(--sv-white);padding:var(--sv-s-3)}
.public-home-note img{width:68px;height:68px;object-fit:contain}
.public-home-note span{font-size:var(--sv-fs-body-s);line-height:1.5}
.public-home-services,.public-home-guides{background:var(--sv-cloud-050)}
.public-case-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(360px,48%);gap:var(--sv-s-5);overflow-x:auto;scroll-snap-type:x mandatory;padding-block-end:var(--sv-s-3);scrollbar-width:thin}
.public-case-rail .public-media-card{scroll-snap-align:start}
.public-process{background:var(--sv-ink-950);color:var(--sv-white)}
.public-process__grid{display:grid;grid-template-columns:minmax(260px,.65fr) minmax(0,1.35fr);gap:var(--sv-s-9);align-items:start}
.public-process__grid>div{position:sticky;inset-block-start:100px}
.public-process__grid>div p{color:var(--sv-mist-200)}
.public-process__grid>div img{width:132px;margin-block-start:var(--sv-s-5)}
.public-process ol{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.public-process li{display:grid;grid-template-columns:72px minmax(0,1fr);gap:var(--sv-s-5);padding-block:var(--sv-s-5);border-bottom:1px solid var(--sv-ink-700)}
.public-process li>span{width:52px;height:52px;display:grid;place-items:center;border-radius:var(--sv-r-pill);border:1px solid var(--sv-fog-500);font-family:var(--sv-font-mono);font-weight:800;color:var(--sv-fog-300)}
.public-process h3{margin-block:0 var(--sv-s-2)}
.public-process li p{margin:0;color:var(--sv-mist-200)}
.public-faq{background:var(--sv-cloud-050)}
.public-faq__grid{display:grid;grid-template-columns:minmax(220px,.5fr) minmax(0,1fr);gap:var(--sv-s-9)}
.public-faq__grid>div:first-child img{width:150px;margin-block-start:var(--sv-s-5)}
.public-faq__list{display:flex;flex-direction:column;border-top:var(--sv-b-default)}
.public-faq details,.public-article-faq details{border-bottom:var(--sv-b-default);padding-block:var(--sv-s-4)}
.public-faq summary,.public-article-faq summary{min-height:var(--sv-touch-min);display:flex;align-items:center;justify-content:space-between;gap:var(--sv-s-4);cursor:pointer;font-weight:800}
.public-faq summary::after,.public-article-faq summary::after{content:'＋';font-family:var(--sv-font-mono)}
.public-faq details[open] summary::after,.public-article-faq details[open] summary::after{content:'−'}
.public-faq details p,.public-article-faq details p{padding-inline-end:var(--sv-s-8);color:var(--sv-ink-700)}
.public-cta{padding-block:var(--sv-s-10);background:var(--sv-fog-deep);color:var(--sv-white)}
.public-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--sv-s-8)}
.public-cta h2{margin-block:var(--sv-s-2);font-size:clamp(28px,4vw,44px)}
.public-cta p{color:var(--sv-mist-200);margin:0}
.public-cta__actions{display:flex;align-items:center;gap:var(--sv-s-3);flex-wrap:wrap;justify-content:flex-end}
.public-cta .sv-price-slot{display:grid;grid-template-columns:auto auto;gap:0 var(--sv-s-3);border-color:var(--sv-fog-500);color:var(--sv-fog-300)}
.public-cta .sv-price-slot small{grid-column:1 / -1}
.public-detail-hero__actions{margin-block:var(--sv-s-5);flex-wrap:wrap}
.public-detail-hero .sv-price-slot,.public-spec-card .sv-price-slot{display:grid;grid-template-columns:auto auto;gap:0 var(--sv-s-3)}
.public-detail-hero .sv-price-slot small,.public-spec-card .sv-price-slot small{grid-column:1 / -1}
.public-compare-section{background:var(--sv-cloud-050)}
.public-before-after{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sv-s-6)}
.public-before-after figure{display:flex;flex-direction:column;gap:var(--sv-s-4)}
.public-before-after figcaption{font-size:var(--sv-fs-body-s);color:var(--sv-ink-700)}
.public-mini-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sv-s-5)}
.public-mini-grid article{padding:0;overflow:hidden}
.public-mini-grid article>img{width:100%;aspect-ratio:4/3;object-fit:cover}
.public-mini-grid article h3,.public-mini-grid article p{margin-inline:var(--sv-s-5)}
.public-mini-grid article h3{margin-block-start:var(--sv-s-4)}
.public-mini-grid article p{color:var(--sv-ink-700);margin-block-end:var(--sv-s-5)}
.public-case-hero{background:var(--sv-cloud-050)}
.public-case-hero__grid{display:grid;grid-template-columns:minmax(0,.7fr) minmax(420px,1.3fr) minmax(230px,.45fr);gap:var(--sv-s-6);align-items:start}
.public-case-hero__grid h1{font-size:clamp(34px,4.6vw,56px);margin-block:var(--sv-s-3)}
.public-case-hero__grid>div>p{color:var(--sv-ink-700);font-size:var(--sv-fs-body-l)}
.public-spec-card{display:flex;flex-direction:column;gap:var(--sv-s-4)}
.public-spec-card dl{margin:0;display:flex;flex-direction:column}
.public-spec-card dl>div{display:grid;grid-template-columns:1fr 1fr;gap:var(--sv-s-2);padding-block:var(--sv-s-3);border-bottom:var(--sv-b-subtle)}
.public-spec-card dt{font-size:var(--sv-fs-caption);color:var(--sv-ink-700)}
.public-spec-card dd{margin:0;text-align:right;font-size:var(--sv-fs-body-s);font-weight:800}
.public-source-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sv-s-5)}
.public-source-grid article{display:flex;flex-direction:column;gap:var(--sv-s-3)}
.public-source-grid article>img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--sv-r-lg)}
.public-source-grid h3,.public-source-grid p{margin:0}
.public-source-grid p{color:var(--sv-ink-700)}
.public-revision{background:var(--sv-cloud-050)}
.public-article-hero{background:var(--sv-cloud-050)}
.public-article-meta{display:flex;gap:var(--sv-s-4);flex-wrap:wrap;font-size:var(--sv-fs-body-s);color:var(--sv-ink-700)}
.public-article-content{background:var(--sv-white)}
.public-article-layout{display:grid;grid-template-columns:240px minmax(0,760px);justify-content:center;gap:var(--sv-s-9);align-items:start}
.public-toc{position:sticky;inset-block-start:100px;display:flex;flex-direction:column;gap:var(--sv-s-4);border-inline-start:3px solid var(--sv-mist-200);padding-inline-start:var(--sv-s-4)}
.public-toc nav{display:flex;flex-direction:column;gap:var(--sv-s-2)}
.public-toc nav a{min-height:var(--sv-touch-min);display:flex;align-items:center;font-size:var(--sv-fs-body-s);font-weight:800;color:var(--sv-ink-700)}
.public-prose{min-width:0;font-size:var(--sv-fs-body-l);line-height:1.85}
.public-prose h2{margin-block:var(--sv-s-9) var(--sv-s-4);scroll-margin-top:100px}
.public-prose h3{margin-block:var(--sv-s-7) var(--sv-s-3)}
.public-prose p,.public-prose li{color:var(--sv-ink-700)}
.public-prose a{color:var(--sv-iris-deep);text-decoration:underline;text-underline-offset:var(--sv-s-1)}
.public-prose figure{margin-block:var(--sv-s-7)}
.public-prose figure img{width:100%;max-height:560px;object-fit:cover;border-radius:var(--sv-r-xl)}
.public-prose figcaption{margin-block-start:var(--sv-s-2);font-size:var(--sv-fs-body-s);color:var(--sv-ink-700)}
.public-prose blockquote{margin:var(--sv-s-7) 0;padding:var(--sv-s-5);border-inline-start:4px solid var(--sv-iris-deep);background:var(--sv-cloud-050);border-radius:0 var(--sv-r-xl) var(--sv-r-xl) 0;color:var(--sv-ink-850)}
.public-prose table{width:100%;min-width:680px;border-collapse:collapse}
.public-prose .sv-article-table{display:table}
.public-prose table th,.public-prose table td{padding:var(--sv-s-3);border:var(--sv-b-default);text-align:left;vertical-align:top}
.public-prose table th{background:var(--sv-cloud-050);font-size:var(--sv-fs-body-s)}
.public-prose:has(table){overflow-wrap:anywhere}
.public-article-faq{margin-block-start:var(--sv-s-10)}
.public-article-cta{display:grid;grid-template-columns:120px minmax(0,1fr);gap:var(--sv-s-5);align-items:center;margin-block-start:var(--sv-s-9);background:var(--sv-cloud-050)}
.public-article-cta img{width:120px}
.public-author-box{background:var(--sv-cloud-050)}
.public-author-box article{display:grid;grid-template-columns:100px minmax(0,1fr);gap:var(--sv-s-5);align-items:center;max-width:760px;margin-inline:auto}
.public-author-box article>img{width:100px;aspect-ratio:1;object-fit:cover;border-radius:var(--sv-r-pill)}
.public-author-box h2,.public-author-box p{margin-block:var(--sv-s-1)}
.public-guide-steps,.public-legal-list{display:flex;flex-direction:column;gap:var(--sv-s-4);max-width:900px}
.public-guide-steps>article,.public-legal-list>article{display:grid;grid-template-columns:64px minmax(0,1fr);gap:var(--sv-s-5);align-items:start}
.public-guide-steps>article>span,.public-legal-list>article>span{width:52px;height:52px;display:grid;place-items:center;border-radius:var(--sv-r-pill);border:var(--sv-b-strong);font-family:var(--sv-font-mono);font-weight:800;color:var(--sv-iris-deep)}
.public-guide-steps h2,.public-guide-steps p,.public-legal-list h2,.public-legal-list p{margin-block:0 var(--sv-s-2)}
.public-guide-steps p,.public-legal-list p{color:var(--sv-ink-700)}
.public-guide-steps .public-guide-check{grid-template-columns:120px minmax(0,1fr);background:var(--sv-cloud-050)}
.public-guide-check img{width:120px}
.public-support-hero{background:var(--sv-cloud-050)}
.public-support-character,.public-search-character{width:min(100%,360px);margin-inline:auto;object-fit:contain}
.public-contact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sv-s-4);margin-block-start:var(--sv-s-7)}
.public-contact-grid article{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sv-s-3)}
.public-contact-grid h2,.public-contact-grid p{margin:0}
.public-contact-grid p{font-size:var(--sv-fs-body-s)}
.public-contact-grid .sv-button{margin-block-start:auto;width:100%}
.public-search__field{display:flex;flex-direction:column;gap:var(--sv-s-2);font-weight:800}
.public-search__field input{min-height:56px;width:100%;padding:var(--sv-s-3) var(--sv-s-5);border:var(--sv-b-strong);border-radius:var(--sv-r-xl);background:var(--sv-white);font-size:var(--sv-fs-body-l)}
.public-search__meta{display:flex;align-items:center;justify-content:space-between;gap:var(--sv-s-4);margin-block:var(--sv-s-5)}
.public-not-found{text-align:center;min-height:65svh;display:grid;place-items:center}
.public-not-found .sv-container{display:flex;flex-direction:column;align-items:center;max-width:640px}
.public-not-found img{width:180px;margin-block-end:var(--sv-s-4)}
.public-not-found h1{font-size:clamp(38px,6vw,70px);margin-block:var(--sv-s-2)}
.public-not-found p{color:var(--sv-ink-700)}
.public-not-found .sv-row{justify-content:center;flex-wrap:wrap}
.public-footer{padding-block:var(--sv-s-9) var(--sv-s-5);background:var(--sv-ink-950);color:var(--sv-white);border-top:1px solid var(--sv-ink-700)}
.public-footer__grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:var(--sv-s-7)}
.public-footer__grid>div{display:flex;flex-direction:column;gap:var(--sv-s-2)}
.public-footer img{width:118px;margin-block-end:var(--sv-s-3)}
.public-footer p{max-width:28rem;color:var(--sv-mist-200)}
.public-footer a,.public-footer span{font-size:var(--sv-fs-body-s);color:var(--sv-fog-300)}
.public-locale{display:flex;justify-content:space-between;gap:var(--sv-s-2)}
.public-locale small{font-size:var(--sv-fs-caption)}
.public-locale--live,.public-locale--live small{color:var(--sv-white)}
.public-footer__bottom{display:flex;justify-content:space-between;gap:var(--sv-s-4);margin-block-start:var(--sv-s-7);padding-block-start:var(--sv-s-4);border-top:1px solid var(--sv-ink-700)}
@media (max-width:1080px){
  .public-page-hero__grid,.public-detail-hero__grid,.public-article-hero__grid,.public-support-hero__grid,.public-home-hero__grid{grid-template-columns:1fr}
  .public-card-grid,.public-card-grid--search{grid-template-columns:repeat(2,minmax(0,1fr))}
  .public-home-hero__visual{grid-template-columns:minmax(0,1fr) 200px}
  .public-process__grid{grid-template-columns:1fr}
  .public-process__grid>div{position:static}
  .public-case-hero__grid{grid-template-columns:minmax(0,1fr) minmax(300px,1fr)}
  .public-spec-card{grid-column:1 / -1}
  .public-contact-grid{grid-template-columns:1fr}
  .public-article-layout{grid-template-columns:200px minmax(0,1fr)}
  .public-footer__grid{grid-template-columns:2fr repeat(2,1fr)}
  .public-footer__locales{grid-column:2 / -1}
}
@media (max-width:768px){
  .public-section-head,.public-filterbar,.public-search__meta,.public-cta__inner{align-items:flex-start;flex-direction:column}
  .public-card-grid,.public-card-grid--search,.public-before-after,.public-mini-grid,.public-source-grid,.public-case-hero__grid,.public-article-layout,.public-faq__grid{grid-template-columns:1fr}
  .public-home-hero{padding-block-start:var(--sv-s-8)}
  .public-home-hero__visual{grid-template-columns:1fr 112px;gap:var(--sv-s-3)}
  .public-home-hero__main{height:300px}
  .public-home-hero__portrait{height:164px}
  .public-home-note{grid-template-columns:44px minmax(0,1fr);padding:var(--sv-s-2)}
  .public-home-note img{width:44px;height:44px}
  .public-home-proof{display:grid;grid-template-columns:1fr}
  .public-case-rail{grid-auto-columns:88%}
  .public-process li{grid-template-columns:52px minmax(0,1fr);gap:var(--sv-s-3)}
  .public-process li>span{width:44px;height:44px}
  .public-faq__grid{gap:var(--sv-s-5)}
  .public-faq__grid>div:first-child img{display:none}
  .public-cta__actions{justify-content:flex-start;width:100%}
  .public-cta__actions .sv-button{width:100%}
  .public-spec-card{grid-column:auto}
  .public-article-layout>*{min-width:0;width:100%;max-width:100%}
  .public-toc{position:static;min-width:0;max-width:100%;overflow:hidden;border-inline-start:0;border-bottom:var(--sv-b-default);padding:0 0 var(--sv-s-4)}
  .public-toc nav{display:flex;flex-direction:row;max-width:100%;overflow-x:auto;gap:var(--sv-s-3)}
  .public-toc nav a{white-space:nowrap}
  .public-prose{font-size:var(--sv-fs-body)}
  .public-prose table{min-width:0;table-layout:fixed}
  .public-prose .sv-article-table{display:table;width:100%;max-width:100%}
  .public-prose table th,.public-prose table td{overflow-wrap:anywhere;word-break:break-word}
  .public-article-cta,.public-author-box article,.public-guide-steps .public-guide-check{grid-template-columns:84px minmax(0,1fr)}
  .public-article-cta img,.public-author-box article>img,.public-guide-check img{width:84px}
  .public-guide-steps>article,.public-legal-list>article{grid-template-columns:52px minmax(0,1fr);gap:var(--sv-s-3)}
  .public-guide-steps>article>span,.public-legal-list>article>span{width:44px;height:44px}
  .public-author-hero{grid-template-columns:96px minmax(0,1fr)}
  .public-author-hero img{width:96px}
  .public-footer__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .public-footer__grid>div:first-child,.public-footer__locales{grid-column:1 / -1}
  .public-footer__bottom{flex-direction:column}
}
@media (max-width:390px){
  .public-home-hero__visual{grid-template-columns:1fr}
  .public-home-hero__main{grid-row:auto;min-height:0;height:auto;aspect-ratio:16/9}
  .public-home-hero__portrait,.public-home-note{display:none}
  .public-home-hero__actions{width:100%}
  .public-home-hero__actions .sv-button{flex:1}
  .public-case-rail{grid-auto-columns:94%}
  .public-article-cta,.public-author-box article,.public-guide-steps .public-guide-check,.public-author-hero{grid-template-columns:1fr;text-align:center}
  .public-article-cta img,.public-author-box article>img,.public-guide-check img,.public-author-hero img{margin-inline:auto}
  .public-footer__grid{grid-template-columns:1fr}
  .public-footer__grid>div{grid-column:auto}
}