/* assets/css/style.css */
/* codename: AxisSync-HMX13 | build: 2025-10-20 */
:root{
  --sync-bg:#0b0f1a;--sync-surface:#0f1422;--sync-primary: rgb(246 201 14);--sync-accent:#3fd2ff;--sync-text:#E6EDF4;
  --sync-muted:#9FB0C3;--sync-line:#182235;--sync-ring: rgba(246,201,14,.9);
  --sync-r:18px;--sync-gap:16px;--sync-pad:20px;--sync-rail:92px;--sync-max:1220px;
}
h2{font-size:clamp(20px,2.6vw,28px);margin:0 0 14px}
p{margin:0 0 10px}
small{color:var(--sync-muted)}
/* Micro interactions */
.sync-btn{transition:transform .2s ease, box-shadow .2s ease}
.sync-btn:active{transform:translateY(1px)}
.sync-btn--pri{box-shadow:0 10px 26px rgba(246,201,14,.25)}
.sync-rbtn{transition:border-color .2s ease, transform .2s ease}
.sync-rbtn:hover{transform:translateY(-2px)}
.sync-stripx{box-shadow:0 10px 30px #0008}
.sync-cell:hover{transform:translateY(-1px);transition:transform .2s ease}
/* Focus visible */
:where(a,button,summary,.sync-stripx){outline:none}
:where(a,button,summary,.sync-stripx):focus-visible{outline:2px solid var(--sync-ring);outline-offset:2px;border-radius:12px}
/* Reduced motion already handled inline */