/* auto-tech-3d 디자인 토큰 v1 — 디자이너 */
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css");
:root{
  /* 기본 */
  --bg:#F4F6F8; --surface:#FFFFFF; --surface-2:#F9FAFB;
  --line:#E5E7EB; --text:#111827; --text-2:#4B5563; --text-3:#9CA3AF;
  /* 브랜드·상태 */
  --primary:#2563EB; --primary-press:#1D4ED8; --primary-soft:#EFF4FF;
  --success:#16A34A; --danger:#DC2626;
  /* 3D 뷰포트 */
  --viewport-top:#EEF1F5; --viewport-bottom:#D7DDE5;
  --part-base:#9AA3AE;      /* 기본 금속 */
  --part-dim-opacity:.22;   /* 선택 외 부품 */
  --part-hover:#FCD34D;     /* 호버/탭 미리보기 */
  --part-select:#F59E0B;    /* 선택 부품(앰버) */
  --part-outline:#B45309;
  --marker:#E11D48;         /* 측정 위치 마커 */
  --marker-ring:rgba(225,29,72,.25);
  /* 부품 그룹(범례용, 선택) */
  --grp-head:#60A5FA; --grp-block:#94A3B8; --grp-valvetrain:#34D399;
  --grp-crank:#A78BFA; --grp-timing:#F472B6;
  /* 예시값 배지 */
  --badge-ex-bg:#FEF3C7; --badge-ex-text:#92400E;
  /* 타이포 */
  --font:"Pretendard Variable",Pretendard,-apple-system,system-ui,sans-serif;
  --fs-12:12px; --fs-14:14px; --fs-16:16px; --fs-20:20px; --fs-24:24px;
  --lh:1.5; --lh-tight:1.3;
  /* 형태 */
  --r-8:8px; --r-12:12px; --r-16:16px; --r-pill:999px;
  --shadow-1:0 1px 2px rgba(17,24,39,.06),0 1px 3px rgba(17,24,39,.08);
  --shadow-sheet:0 -8px 24px rgba(17,24,39,.12);
  --sp-4:4px; --sp-8:8px; --sp-12:12px; --sp-16:16px; --sp-24:24px;
  --tap:44px; --topbar:52px; --side-panel:380px;
  --ease:cubic-bezier(.2,.8,.2,1); --dur:220ms;
}
body{font-family:var(--font);font-size:var(--fs-16);line-height:var(--lh);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;letter-spacing:-.01em}
.num,.value{font-variant-numeric:tabular-nums}
h1{font-size:var(--fs-20);font-weight:700;line-height:var(--lh-tight)}
h2{font-size:var(--fs-16);font-weight:700}
.caption{font-size:var(--fs-12);color:var(--text-3)}
.viewport{background:linear-gradient(var(--viewport-top),var(--viewport-bottom))}
/* 버튼 */
.btn{height:var(--tap);padding:0 var(--sp-16);border-radius:var(--r-12);font:600 var(--fs-14)/1 var(--font);border:1px solid transparent;transition:background var(--dur) var(--ease),transform 80ms}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--primary);color:#fff}.btn-primary:active{background:var(--primary-press)}
.btn-secondary{background:var(--surface);color:var(--text);border-color:var(--line)}
.btn-icon{width:var(--tap);padding:0;border-radius:var(--r-pill);background:var(--surface);box-shadow:var(--shadow-1)}
.btn:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
/* 슬라이더 */
input[type=range]{-webkit-appearance:none;width:100%;height:var(--tap);background:transparent}
input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(var(--primary),var(--primary)) 0/var(--fill,0%) 100% no-repeat,var(--line)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;margin-top:-10px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px var(--line),0 2px 6px rgba(17,24,39,.2)}
input[type=range]::-moz-range-track{height:4px;border-radius:2px;background:var(--line)}
input[type=range]::-moz-range-progress{height:4px;border-radius:2px;background:var(--primary)}
input[type=range]::-moz-range-thumb{width:24px;height:24px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 1px var(--line),0 2px 6px rgba(17,24,39,.2)}
/* 칩·배지·마커 */
.chip{height:32px;padding:0 12px;border-radius:var(--r-pill);background:var(--surface-2);border:1px solid var(--line);font-size:var(--fs-14)}
.chip[aria-selected=true]{background:var(--primary-soft);border-color:var(--primary);color:var(--primary);font-weight:600}
.badge-example{display:inline-block;padding:2px 8px;border-radius:var(--r-pill);background:var(--badge-ex-bg);color:var(--badge-ex-text);font-size:var(--fs-12);font-weight:600}
.marker{width:28px;height:28px;border-radius:50%;background:var(--marker);color:#fff;font:700 var(--fs-12)/28px var(--font);text-align:center;box-shadow:0 0 0 6px var(--marker-ring)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}