/* FISCHRAINE Phase 164 — Global Design System 2.0
   Shared visual tokens and cross-environment polish. 2026-09-04 */
:root{
  --fr-bg:#f3f0ea;
  --fr-bg-dark:#0a0a0a;
  --fr-panel:#fff;
  --fr-ink:#0a0a0a;
  --fr-ink-inverse:#f4f2ed;
  --fr-muted:#6f6c66;
  --fr-muted-dark:#a9a6a0;
  --fr-line:rgba(10,10,10,.18);
  --fr-line-dark:rgba(255,255,255,.18);
  --fr-space-1:6px;
  --fr-space-2:10px;
  --fr-space-3:16px;
  --fr-space-4:24px;
  --fr-space-5:36px;
  --fr-space-6:52px;
  --fr-space-7:76px;
  --fr-max:1440px;
  --fr-touch:44px;
  --fr-micro:11px;
  --fr-label-track:.16em;
  --fr-ease:cubic-bezier(.2,.7,.2,1);
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;}
button,a,input,select,textarea{font:inherit;}
button,a{-webkit-tap-highlight-color:transparent;}
:focus-visible{outline:1px solid currentColor;outline-offset:3px;}
img{max-width:100%;}

/* Shared microtype and rules */
.eyebrow,.cb-eyebrow,.cb-kicker,.nav-section,.collection-browse-count,
.discovery-quick>span,.category-page-back,.provider-link,.step-link,
.command-kicker,.phase163-kicker{
  letter-spacing:var(--fr-label-track);
}

/* Shared brand mark discipline */
.fr-mark-logo,.fr-mark img,.brand-with-logo img,.brand-lockup img{
  object-fit:contain;
  object-position:center;
}

/* Collection */
body:has(.site-header){background:var(--fr-bg);color:var(--fr-ink);}
.site-header{border-bottom-color:var(--fr-line)!important;}
.site-header .main-nav a,.site-header .brand-environment{transition:opacity .22s var(--fr-ease);}
.site-header .main-nav a:hover{opacity:.56;}
.hero .eyebrow,.category-page .eyebrow{font-size:var(--fr-micro);}
.btn,.category-page-back,.discovery-quick button,.discovery-view-toggle button{
  border-radius:0!important;
  transition:background-color .2s var(--fr-ease),color .2s var(--fr-ease),border-color .2s var(--fr-ease),opacity .2s var(--fr-ease);
}
.category-page-grid{align-items:start;}

/* Studio */
.cb-page{background:var(--fr-bg-dark);color:var(--fr-ink-inverse);}
.cb-page .top{border-bottom-color:var(--fr-line-dark)!important;}
.cb-page .cb-section{border-color:var(--fr-line-dark)!important;}
.cb-page .cb-kicker,.cb-page .cb-eyebrow{font-size:var(--fr-micro);letter-spacing:var(--fr-label-track);}
.cb-page .cb-btn,.cb-page .cta{border-radius:0!important;min-height:var(--fr-touch);}
.cb-page .cb-btn,.cb-page .cta,.cb-page .nav a{transition:opacity .2s var(--fr-ease),background-color .2s var(--fr-ease),color .2s var(--fr-ease);}
.cb-page .nav a:hover{opacity:.58;}

/* Handbook */
body:has(.layout .side){background:var(--fr-bg-dark);}
.layout .side{border-right-color:var(--fr-line-dark)!important;}
.layout .side a,.layout .side button{transition:color .18s var(--fr-ease),opacity .18s var(--fr-ease),background-color .18s var(--fr-ease);}
.layout .side::-webkit-scrollbar{width:6px;}
.layout .side::-webkit-scrollbar-track{background:transparent;}
.layout .side::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:10px;}
.layout .side{scrollbar-color:rgba(255,255,255,.22) transparent;scrollbar-width:thin;}

/* Command / operational surfaces */
.phase163-command-shell,.command-shell{--fr-command-sidebar:232px;}
.phase163-command-shell button,.phase163-command-shell a,.command-shell button,.command-shell a{border-radius:0!important;}
.phase163-command-shell input,.phase163-command-shell textarea,.phase163-command-shell select,
.command-shell input,.command-shell textarea,.command-shell select{border-radius:0!important;}

/* Consistent reduced motion */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
}

/* Tablet */
@media (max-width:1024px){
  :root{--fr-space-7:56px;--fr-space-6:42px;}
  .site-header,.cb-page .top{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right));}
}

/* Phones */
@media (max-width:640px){
  :root{--fr-space-7:42px;--fr-space-6:32px;--fr-space-5:28px;}
  body{overflow-x:hidden;}
  input,select,textarea{font-size:16px;}
  .btn,.cb-btn,.cta,button{min-height:var(--fr-touch);}
  .site-header,.cb-page .top{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right));}
}