@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 600; font-display: swap; src: url('assets/fonts/barlow-condensed-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url('assets/fonts/barlow-condensed-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 800; font-display: swap; src: url('assets/fonts/barlow-condensed-latin-800-normal.woff2') format('woff2'); }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url('assets/fonts/plus-jakarta-sans-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url('assets/fonts/plus-jakarta-sans-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url('assets/fonts/plus-jakarta-sans-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url('assets/fonts/plus-jakarta-sans-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Plus Jakarta Sans'; font-style: normal; font-weight: 800; font-display: swap; src: url('assets/fonts/plus-jakarta-sans-latin-800-normal.woff2') format('woff2'); }
/* ============================================================
   NEVER REST: Design v2 (loaded AFTER styles.css, overrides it)
   Light, flat surfaces, orange accent, depth buttons, black sidebar.
   Tokens follow DESIGN-HANDOFF. Dark mode: body.mode-dark
   ============================================================ */
:root, body, body[class*="theme-"] {
  --bg: #F1F2F4; --card: #FFFFFF; --ink: #111214; --muted: #5C6370;
  --line: #E2E4E8; --btn-edge: #D9DCE1; --accent: #FF5A1F; --on-accent: #111214;
  --good: #1E7A4C; --warn: #B53A0C;
  --bg-glow: none;
  --accent-ink: #111214;
  --text: #111214; --text-muted: #5C6370; --text-on-glow: #5C6370;
  --glass-fill: #FFFFFF; --glass-fill-2: #FFFFFF;
  --glass-border: #E2E4E8; --glass-border-2: #D9DCE1;
  --surface: #111214;
  --c-activity: #1E7A4C; --c-sleep: #111214; --c-hydration: #5C6370;
  --c-energy: #FF5A1F; --c-cardio: #B53A0C;
  --r-sm: 16px; --r-lg: 22px; --r-pill: 100px;
  --shadow-hero: 0 2px 0 #E2E4E8; --shadow-card: 0 2px 0 #E2E4E8; --shadow-btn: 0 3px 0 #D9DCE1;
  --font-ui: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
  --font-display: 'Barlow Condensed', 'Arial Narrow', Impact, sans-serif;
  font-family: var(--font-ui);
}
body.mode-dark, body.mode-dark[class*="theme-"] {
  --bg: #0E0F11; --card: #1A1C1F; --ink: #F2F3F5; --muted: #9AA0A8;
  --line: #2A2D31; --btn-edge: #090A0B;
  --text: #F2F3F5; --text-muted: #9AA0A8; --text-on-glow: #9AA0A8;
  --glass-fill: #1A1C1F; --glass-fill-2: #1A1C1F; --glass-border: #2A2D31; --glass-border-2: #34383D;
  --surface: #000000; --c-sleep: #F2F3F5;
  --shadow-hero: 0 2px 0 #090A0B; --shadow-card: 0 2px 0 #090A0B; --shadow-btn: 0 3px 0 #090A0B;
  --good: #4CC38A; --warn: #FF8A5C;
}
html, body { background: var(--bg); color: var(--ink); font-family: var(--font-ui); font-variant-numeric: tabular-nums; }
body { padding-bottom: 32px; }

/* ---- type ---- */
h1, .headline, .card h3, .modal-sheet h3 {
  font-family: var(--font-display); font-weight: 800; text-transform: uppercase; letter-spacing: 0.01em; color: var(--ink);
}
h1, .headline { font-size: 30px; line-height: 1; }
header.topbar h1 { font-size: 30px; letter-spacing: 0; }
.card h3 { font-size: 22px; letter-spacing: 0.01em; margin-bottom: 8px; }
.stat-number, .stat-box .num, .timer-display, .gauge-big-value { font-family: var(--font-display); font-weight: 800; letter-spacing: 0; }
.stat-box .num { font-size: 34px; }
.label-sm, label.field, .section-title { font-size: 12px; font-weight: 800; letter-spacing: 0.1em; color: var(--muted); }
.card .meta, .meta { color: var(--muted); font-size: 13px; line-height: 1.5; }

/* ---- surfaces ---- */
.glass-panel, .card, .stat-box, .exercise-item, .select-trigger, .gauge-card, .scan-carousel-card {
  background: var(--card); border: 0; backdrop-filter: none; -webkit-backdrop-filter: none;
  box-shadow: 0 2px 0 var(--line); border-radius: var(--r-lg);
}
.hero-card { background: var(--card); box-shadow: 0 2px 0 var(--line); }
.hero-card::before { display: none !important; }
.card { padding: 18px; }
.exercise-item { border-radius: 18px; }
.exercise-item.selected { box-shadow: inset 0 0 0 2px var(--ink), 0 2px 0 var(--line); }
.screen { padding: 8px 20px 48px; }
#app { max-width: 520px; }

/* ---- header ---- */
header.topbar { padding: max(18px, env(safe-area-inset-top)) 20px 12px; }
.icon-btn, .close-x {
  width: 44px; height: 44px; border-radius: 22px; border: 0; background: var(--card); color: var(--ink);
  backdrop-filter: none; box-shadow: 0 3px 0 var(--btn-edge); font-size: 17px; font-weight: 800;
}
.close-x { width: 40px; height: 40px; border-radius: 20px; font-size: 15px; }
.icon-btn:active, .close-x:active { transform: translateY(3px); box-shadow: 0 0 0 var(--btn-edge); border: 0; }
.sticky-top { background: var(--bg); }
.nr-hdr { display: flex; align-items: center; gap: 12px; width: 100%; }
.nr-hdr-mid { flex: 1; min-width: 0; }
.nr-hdr-title { font-family: var(--font-display); font-weight: 800; font-size: 26px; line-height: 1; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nr-hdr-sub { font-size: 13px; color: var(--muted); font-weight: 600; margin-top: 3px; }

/* ---- buttons with depth ---- */
.btn {
  background: var(--card); color: var(--ink); border: 0; backdrop-filter: none;
  border-radius: 16px; padding: 14px 18px; font-size: 14px; font-weight: 800; text-transform: none; letter-spacing: 0.01em;
  min-height: 44px; box-shadow: 0 3px 0 var(--btn-edge); text-shadow: none; transition: transform .08s, box-shadow .08s;
}
.btn:active { transform: translateY(3px); box-shadow: 0 0 0 transparent; }
.btn.primary { background: var(--accent); color: var(--on-accent); box-shadow: 0 4px 0 rgba(17,18,20,.35); text-shadow: none; border-radius: 18px; text-transform: uppercase; letter-spacing: .04em; }
.btn.primary:active { transform: translateY(4px); box-shadow: 0 0 0 transparent; }
.btn.green { background: var(--ink); color: var(--bg); box-shadow: 0 3px 0 #000; text-shadow: none; border-radius: 16px; }
body.mode-dark .btn.green { background: #F2F3F5; color: #111214; box-shadow: 0 3px 0 #000; }
.btn.green:active { transform: translateY(3px); box-shadow: 0 0 0 transparent; }
.btn.ghost { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 2px var(--line); }
.btn.ghost:active { transform: none; box-shadow: inset 0 0 0 2px var(--ink); color: var(--ink); }
.btn.danger { background: var(--card); color: var(--warn); box-shadow: 0 3px 0 var(--btn-edge); border: 0; }
.btn.sm { padding: 9px 14px; font-size: 13px; border-radius: 14px; min-height: 40px; }
.btn:disabled { opacity: .4; }
.btn.block { width: 100%; }

/* ---- segmented / chips / toggles ---- */
.set-type-toggle, .segmented { background: var(--line); border: 0; box-shadow: none; border-radius: 16px; padding: 4px; gap: 4px; }
body.mode-dark .set-type-toggle, body.mode-dark .segmented { background: #0E0F11; }
.set-type-toggle .btn, .segmented-item { border-radius: 12px !important; min-height: 44px; font-size: 13px; font-weight: 800; text-transform: none; letter-spacing: 0; }
.set-type-toggle .btn.ghost, .segmented-item { background: transparent; box-shadow: none; color: var(--muted); }
.set-type-toggle .btn.primary, .segmented-item.active { background: var(--card); color: var(--ink); box-shadow: 0 2px 0 var(--btn-edge); text-shadow: none; border-radius: 12px !important; text-transform: none; }
.chip { background: var(--card); border: 0; backdrop-filter: none; box-shadow: 0 2px 0 var(--line); color: var(--ink); text-transform: none; letter-spacing: 0; font-size: 13px; font-weight: 700; padding: 10px 16px; min-height: 40px; }
.chip.selected { background: var(--ink); color: var(--bg); box-shadow: 0 2px 0 #000; }
.toggle-switch { background: var(--line); border: 0; box-shadow: none; width: 52px; height: 32px; }
.toggle-switch.on { background: var(--ink); box-shadow: none; }
body.mode-dark .toggle-switch.on { background: var(--accent); }
.toggle-switch-knob { background: #fff; box-shadow: 0 2px 0 rgba(0,0,0,.2); width: 26px; height: 26px; top: 3px; left: 3px; }
.toggle-switch.on .toggle-switch-knob { transform: translateX(20px); }

/* ---- inputs ---- */
input[type=text], input[type=number], input[type=email], input[type=password], input[type=search], input[type=date], select, textarea {
  background: var(--card); border: 2px solid var(--line); border-radius: 14px; backdrop-filter: none; color: var(--ink);
  min-height: 48px; font-weight: 600;
}
input:focus, select:focus, textarea:focus { border-color: var(--ink); outline: none; }
.select-trigger-value, .dropdown-option .name { color: var(--ink); }

/* ---- modals / toast ---- */
.modal-overlay { background: rgba(17,18,20,.55); backdrop-filter: none; }
.modal-sheet { background: var(--bg); border: 0; border-radius: 28px 28px 0 0; backdrop-filter: none; box-shadow: none; color: var(--ink); }
.toast { background: var(--ink); color: var(--bg); border: 0; backdrop-filter: none; font-weight: 700; box-shadow: 0 3px 0 #000; }
body.mode-dark .toast { background: #F2F3F5; color: #111214; }

/* ---- badges / pills ---- */
.intensity-badge.high { background: rgba(255,90,31,.14); color: #B53A0C; }
.intensity-badge.medium { background: var(--line); color: var(--muted); }
.intensity-badge.low { background: rgba(30,122,76,.12); color: var(--good); }
.pill-warmup { background: var(--line); color: var(--muted); }
.pill-working { background: var(--ink); color: var(--bg); }
.pill-dropset { background: rgba(255,90,31,.16); color: #B53A0C; }
.log-row { border-bottom: 1px solid var(--line); }
.progress-line { background: var(--line); }
.progress-line .fill { background: var(--accent); }
.bar-chart .bar { background: var(--ink); }
.cal-cell.has-workout { background: var(--ink); border-color: transparent; }
.cal-cell.has-workout .cal-daynum { color: var(--bg); }
.cal-dot { background: var(--accent); } .cal-dur { color: var(--accent); }
.cal-cell.rest-day { background: transparent; border: 1.5px dashed var(--btn-edge); }
.cal-cell.today { border-color: var(--accent); border-width: 2px; }

/* ---- sidebar (black panel) ---- */
.sidebar-overlay.open { background: rgba(17,18,20,.55); backdrop-filter: none; }
.sidebar-panel { width: 318px; max-width: 86%; background: #111214; color: #fff; border-radius: 0 32px 32px 0; box-shadow: none; padding: max(28px, env(safe-area-inset-top)) 18px max(22px, env(safe-area-inset-bottom)); overflow-y: auto; }
.sidebar-panel::after { display: none; }
.sb-head { display: flex; align-items: center; gap: 12px; padding: 0 6px 16px; }
.sb-avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--accent); color: #111214; display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-weight: 800; font-size: 22px; flex-shrink: 0; overflow: hidden; }
.sb-avatar img { width: 100%; height: 100%; object-fit: cover; }
.sb-name { font-family: var(--font-display); font-weight: 800; font-size: 24px; line-height: 1; text-transform: uppercase; color: #fff; }
.sb-sub { font-size: 12.5px; color: #9AA0A8; margin-top: 3px; font-weight: 600; }
.sb-resume { display: flex; align-items: center; justify-content: space-between; width: 100%; border: 0; border-radius: 18px; padding: 15px 18px; margin-bottom: 8px; background: var(--accent); color: #111214; font-weight: 800; font-size: 14px; letter-spacing: .04em; box-shadow: 0 4px 0 rgba(255,255,255,.18); }
.sb-group { font-size: 11px; font-weight: 800; letter-spacing: .14em; color: #7A808A; padding: 16px 10px 6px; }
.sidebar-item { color: #C9CDD3; font-size: 15px; font-weight: 600; padding: 9px 10px; border-radius: 16px; gap: 14px; min-height: 48px; }
.sidebar-item.active { background: #26282C; color: #fff; font-weight: 800; }
.sidebar-item-icon { width: 34px; height: 34px; border-radius: 50%; background: #1F2125; color: #C9CDD3; display: flex; align-items: center; justify-content: center; font-size: 0; flex-shrink: 0; }
.sidebar-item-icon svg { width: 18px; height: 18px; }
.sidebar-item.active .sidebar-item-icon { background: var(--accent); color: #111214; }
.sb-foot { margin-top: auto; padding: 18px 10px 0; font-size: 12.5px; color: #9AA0A8; display: flex; align-items: center; gap: 8px; font-weight: 600; }
.sb-foot i { width: 8px; height: 8px; border-radius: 50%; background: #4CC38A; display: inline-block; }

/* ---- swipe controls ---- */
.swipe-track { height: 68px; border-radius: 34px; background: #111214; border: 0; box-shadow: inset 0 3px 8px rgba(0,0,0,.5), 0 6px 0 rgba(17,18,20,.12); }
.swipe-fill { background: rgba(255,90,31,.35) !important; mix-blend-mode: normal; border-radius: 34px; }
.swipe-label { color: #fff; text-shadow: none; font-size: 13px; font-weight: 800; letter-spacing: .1em; }
.swipe-thumb { width: 60px; height: 60px; top: 4px; left: 4px; background: var(--accent) !important; color: #111214; box-shadow: 0 3px 0 rgba(0,0,0,.35); font-size: 24px; }
.swipe-thumb:active { box-shadow: 0 0 0 transparent; }

/* ---- workout ---- */
.mini-clock-label { color: var(--muted); } .mini-clock-val { font-family: var(--font-display); font-size: 22px; font-weight: 800; color: var(--ink) !important; }
.workout-action-bar { background: transparent; }
.ex-icon { background: var(--line); border-radius: 18px; }
.nr-set-pills { display: flex; gap: 8px; overflow-x: auto; padding: 2px 2px 6px; }
.nr-pill { flex: 0 0 auto; min-width: 52px; height: 44px; border-radius: 22px; padding: 0 16px; border: 0; font-weight: 800; font-size: 14px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; background: var(--card); color: var(--ink); box-shadow: 0 3px 0 var(--btn-edge); }
.nr-pill.cur { background: #111214; color: #fff; box-shadow: 0 3px 0 var(--accent); }
body.mode-dark .nr-pill.cur { background: #F2F3F5; color: #111214; }
.nr-pill.next { background: transparent; box-shadow: inset 0 0 0 2px var(--btn-edge); color: var(--muted); }
.nr-suggest { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; background: var(--card); border: 0; border-radius: 16px; padding: 12px 14px; box-shadow: 0 2px 0 var(--line); color: var(--ink); font-size: 14px; }
.nr-suggest .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); flex-shrink: 0; }
.nr-suggest .why { margin-left: auto; font-weight: 800; font-size: 12px; color: var(--muted); }
.nr-why-text { font-size: 12.5px; color: var(--muted); padding: 2px 4px 0; line-height: 1.5; }
.nr-ruler-card { background: var(--card); border-radius: 22px; box-shadow: 0 2px 0 var(--line); padding: 14px 0 6px; overflow: hidden; }
.nr-ruler-head { display: flex; align-items: baseline; gap: 8px; padding: 0 18px; }
.nr-ruler-head .l { font-size: 12px; font-weight: 800; letter-spacing: .1em; color: var(--muted); }
.nr-ruler-head .v { font-family: var(--font-display); font-weight: 800; font-size: 46px; line-height: 1; margin-left: auto; }
.nr-ruler-head .u { font-size: 14px; font-weight: 800; color: var(--muted); }
.nr-ruler { position: relative; margin-top: 6px; height: 64px; }
.nr-ruler-scroll { position: absolute; inset: 0; overflow-x: scroll; overflow-y: hidden; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; touch-action: pan-x; }
.nr-ruler-scroll::-webkit-scrollbar { display: none; }
.nr-ruler-track { display: flex; align-items: flex-end; height: 100%; padding: 0 calc(50% - 6px); }
.nr-tick { flex: 0 0 12px; width: 12px; scroll-snap-align: center; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; position: relative; }
.nr-tick i { display: block; width: 2px; border-radius: 1px; background: #D3D6DB; height: 14px; }
.nr-tick.maj i { height: 26px; background: #9AA0A8; }
.nr-tick b { position: absolute; top: 0; font-size: 12px; font-weight: 800; color: var(--muted); transform: none; white-space: nowrap; }
.nr-ruler-mid { position: absolute; left: 50%; top: 14px; bottom: 0; width: 3px; margin-left: -1.5px; background: var(--accent); border-radius: 2px; pointer-events: none; }
.nr-plates { font-size: 12.5px; color: var(--muted); padding: 0 4px; min-height: 16px; }
.nr-warn { background: rgba(255,90,31,.14); color: #8A2A06; border-radius: 14px; padding: 10px 14px; font-weight: 700; font-size: 13px; }
body.mode-dark .nr-warn { color: #FFB89C; }

/* set in progress: full orange */
.nr-active { position: fixed; inset: 0; z-index: 40; background: var(--accent); color: #111214; padding: max(24px, env(safe-area-inset-top)) 20px 0; display: flex; flex-direction: column; gap: 14px; }
.nr-active .top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.nr-chip { height: 44px; padding: 0 16px; border-radius: 22px; border: 0; background: rgba(17,18,20,.12); color: #111214; font-weight: 800; font-size: 14px; display: inline-flex; align-items: center; justify-content: center; }
.nr-chip.sq { width: 44px; padding: 0; }
.nr-active .eyebrow { font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; margin-top: 18px; }
.nr-active .exname { font-family: var(--font-display); font-weight: 800; font-size: 34px; line-height: 1; text-transform: uppercase; }
.nr-active .big { font-family: var(--font-display); font-weight: 800; font-size: min(52vw, 200px); line-height: .85; letter-spacing: -.03em; margin-top: 10px; }
.nr-active .facts { display: flex; gap: 22px; margin-top: 6px; }
.nr-active .facts .n { font-family: var(--font-display); font-weight: 800; font-size: 44px; line-height: 1; }
.nr-active .facts .k { font-size: 12px; font-weight: 800; letter-spacing: .1em; }
.nr-active .facts .sep { width: 2px; background: rgba(17,18,20,.2); }
.nr-active .swipe-wrap { position: absolute; left: 20px; right: 20px; bottom: max(28px, env(safe-area-inset-bottom)); }
.nr-active .swipe-track { height: 84px; border-radius: 42px; }
.nr-active .swipe-thumb { width: 76px; height: 76px; background: #fff !important; }
.nr-active .swipe-label { font-size: 13px; }
body.nr-active-on .toast { bottom: 130px; }

/* rest */
.nr-saved { background: #111214; color: #fff; border-radius: 22px; padding: 16px 18px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.nr-saved .k { font-size: 12px; font-weight: 800; letter-spacing: .12em; color: #9AA0A8; }
.nr-saved .v { font-family: var(--font-display); font-weight: 800; font-size: 32px; line-height: 1.05; }
.nr-pr { background: var(--accent); color: #111214; border-radius: 10px; padding: 4px 9px; font-size: 12px; font-weight: 800; letter-spacing: .06em; }
.nr-saved .icon-btn { background: #26282C; color: #fff; box-shadow: 0 3px 0 #000; }
.nr-rest { text-align: center; padding: 6px 0 0; }
.nr-rest .k { font-size: 13px; font-weight: 800; letter-spacing: .14em; }
.nr-rest .time { font-family: var(--font-display); font-weight: 800; font-size: min(38vw, 150px); line-height: .9; letter-spacing: -.02em; margin: 6px 0 10px; }
.nr-rest.over .time { color: var(--warn); animation: restOverduePulseScale 1s ease-in-out infinite; }
.nr-bar { height: 12px; border-radius: 6px; background: var(--line); overflow: hidden; margin: 0 4px; }
.nr-bar > div { height: 100%; background: var(--ink); border-radius: 6px; transition: width 900ms linear; }
body.mode-dark .nr-bar > div { background: var(--accent); }
.nr-rest-btns { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-top: 18px; }
.nr-rest-btns .btn { padding: 0; height: 56px; font-size: 15px; }
.nr-next { background: var(--card); border-radius: 22px; padding: 16px 18px; box-shadow: 0 2px 0 var(--line); }
.nr-alarm { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 12.5px; color: var(--muted); font-weight: 600; }

/* misc legacy pieces recoloured */
.auth-sync-spinner { border-color: var(--line); border-top-color: var(--accent); }
.rest-popup-overlay { display: none !important; }
.screen-flash { background: var(--accent); }
.celebration-card { background: var(--bg); color: var(--ink); }
.celebration-overlay { background: rgba(17,18,20,.55); }

.screen:has(.nr-active) { animation: none; padding: 0; }
.nr-tick b { left: 50%; transform: translateX(-50%); }

.nr-hdr-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12.5px; }
.nr-ruler-card + .nr-ruler-card { margin-top: 0; }

/* ---- schedule / plans / lists ---- */
.nr-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-bottom: 14px; }
.nr-day { border: 0; border-radius: 16px; padding: 8px 0 8px; display: flex; flex-direction: column; align-items: center; gap: 2px; background: transparent; color: var(--ink); min-height: 76px; justify-content: center; box-shadow: inset 0 0 0 1.5px var(--btn-edge); }
.nr-day .wd { font-size: 11px; font-weight: 800; letter-spacing: .06em; color: inherit; opacity: .7; }
.nr-day .n { font-family: var(--font-display); font-weight: 800; font-size: 26px; line-height: 1; }
.nr-day .tag { font-size: 9.5px; font-weight: 800; letter-spacing: .08em; }
.nr-day.done { background: var(--card); box-shadow: 0 3px 0 var(--btn-edge); }
.nr-day.rest { color: #8A9099; }
.nr-day.plan { box-shadow: inset 0 0 0 1.5px var(--ink); }
.nr-day.today { background: #111214; color: #fff; box-shadow: 0 4px 0 var(--accent); }
body.mode-dark .nr-day.today { background: #F2F3F5; color: #111214; }
.nr-today { background: #111214; color: #fff; border-radius: 26px; padding: 18px; display: flex; flex-direction: column; gap: 12px; margin-bottom: 14px; }
body.mode-dark .nr-today { background: #1A1C1F; }
.nr-today .k { font-size: 12px; font-weight: 800; letter-spacing: .14em; color: #9AA0A8; }
.nr-today .t { font-family: var(--font-display); font-weight: 800; font-size: 40px; line-height: 1; text-transform: uppercase; }
.nr-today .ex { display: flex; justify-content: space-between; font-size: 14px; color: #D3D6DB; padding: 4px 0; }
.nr-today .why { font-size: 12.5px; color: #9AA0A8; line-height: 1.5; }
.nr-today a, .nr-today .link { color: #fff; font-size: 13px; font-weight: 700; text-decoration: underline; background: none; border: 0; padding: 0; }
.nr-start { display: flex; align-items: center; justify-content: space-between; width: 100%; border: 0; border-radius: 20px; padding: 18px 20px; background: var(--accent); color: #111214; font-weight: 800; font-size: 16px; letter-spacing: .04em; box-shadow: 0 4px 0 rgba(255,255,255,.2); }
.nr-start:active { transform: translateY(4px); box-shadow: none; }
.nr-two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
.nr-tile { background: var(--card); border-radius: 22px; box-shadow: 0 2px 0 var(--line); padding: 14px 16px; border: 0; text-align: left; color: var(--ink); display: flex; flex-direction: column; gap: 2px; }
.nr-tile .big { font-family: var(--font-display); font-weight: 800; font-size: 34px; line-height: 1; text-transform: uppercase; }
.nr-tile .small { font-size: 12.5px; color: var(--muted); font-weight: 600; }
button.nr-tile:active { transform: translateY(2px); }
.nr-sec { font-size: 12px; font-weight: 800; letter-spacing: .12em; color: var(--muted); margin: 18px 4px 8px; text-transform: uppercase; }
.nr-row { display: flex; align-items: center; gap: 12px; background: var(--card); border-radius: 18px; padding: 14px 16px; box-shadow: 0 2px 0 var(--line); margin-bottom: 8px; border: 0; width: 100%; text-align: left; color: var(--ink); }
.nr-row .a { font-weight: 800; font-size: 14px; min-width: 62px; } .nr-row .b { font-family: var(--font-display); font-weight: 800; font-size: 22px; text-transform: uppercase; flex: 1; } .nr-row .c { font-size: 13px; color: var(--muted); font-weight: 600; }
.nr-tabs { display: flex; background: var(--line); border-radius: 16px; padding: 4px; gap: 4px; margin-bottom: 14px; }
body.mode-dark .nr-tabs { background: #0E0F11; }
.nr-tabs button { flex: 1; min-height: 44px; border: 0; border-radius: 12px; background: transparent; color: var(--muted); font-weight: 800; font-size: 14px; }
.nr-tabs button[aria-selected="true"] { background: var(--card); color: var(--ink); box-shadow: 0 2px 0 var(--btn-edge); }
.nr-plan { background: var(--card); border-radius: 22px; box-shadow: 0 2px 0 var(--line); padding: 16px; margin-bottom: 12px; }
.nr-plan .n { font-family: var(--font-display); font-weight: 800; font-size: 28px; line-height: 1; text-transform: uppercase; }
.nr-plan .m { font-size: 13px; color: var(--muted); font-weight: 600; margin-top: 3px; }
.nr-plan .bot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; }
.nr-plan .mu { font-size: 13px; font-weight: 700; flex: 1; }
.nr-hint { font-size: 13px; color: var(--muted); text-align: center; padding: 6px 12px 0; }

/* ---- landing + auth ---- */
.nr-land { max-width: 520px; margin: 0 auto; padding: max(20px, env(safe-area-inset-top)) 20px 0; display: flex; flex-direction: column; gap: 16px; min-height: 100vh; padding-bottom: 210px; }
.nr-land-top { display: flex; align-items: center; justify-content: space-between; }
.nr-logo { width: 36px; height: 36px; border-radius: 10px; background: #111214; color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-weight: 800; font-size: 17px; }
.nr-wordmark { font-family: var(--font-display); font-weight: 800; font-size: 22px; letter-spacing: .02em; }
.nr-land-hero { position: relative; height: 170px; border-radius: 26px; overflow: hidden; background: #DCDFE4; }
.nr-land-hero img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; display: block; }
.nr-land-hero span { position: absolute; left: 14px; bottom: 14px; height: 30px; padding: 0 12px; border-radius: 15px; background: #111214; color: #fff; display: flex; align-items: center; font-size: 12px; font-weight: 700; }
.landing-page h1.nr-land-h1, .nr-land-h1 { margin: 0; font-family: var(--font-display); font-size: 44px; line-height: .95; font-weight: 800; text-transform: uppercase; color: var(--ink); text-shadow: none; letter-spacing: 0; }
.nr-land-h1 span { color: var(--accent); }
.nr-land-p { margin: 8px 0 0; font-size: 15px; line-height: 1.45; color: var(--muted); }
.nr-land-steps { display: flex; flex-direction: column; gap: 6px; }
.nr-land-step { display: flex; align-items: center; gap: 12px; height: 52px; padding: 0 8px; border-radius: 16px; background: var(--card); box-shadow: 0 2px 0 var(--line); }
.nr-land-step img { width: 40px; height: 40px; border-radius: 12px; object-fit: cover; }
.nr-land-step b { font-family: var(--font-display); font-size: 18px; font-weight: 800; color: var(--accent); width: 18px; }
.nr-land-step span { flex: 1; font-size: 14px; font-weight: 700; }
.nr-land-cta { position: fixed; left: 0; right: 0; bottom: 0; max-width: 520px; margin: 0 auto; padding: 16px 20px max(22px, env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 10px; background: linear-gradient(180deg, rgba(241,242,244,0), var(--bg) 22%); }
body.mode-dark .nr-land-cta { background: linear-gradient(180deg, rgba(14,15,17,0), var(--bg) 22%); }
.nr-cta { height: 58px; border-radius: 16px; border: 0; background: var(--accent); color: #111214; display: flex; align-items: center; justify-content: space-between; padding: 0 22px; font-family: var(--font-display); font-size: 22px; font-weight: 800; letter-spacing: .02em; box-shadow: 0 4px 0 rgba(17,18,20,.35), 0 10px 22px rgba(255,90,31,.25); width: 100%; }
.nr-cta:active { transform: translateY(4px); box-shadow: 0 0 0 transparent; }
.nr-cta:disabled { opacity: .5; }
.nr-link { background: none; border: 0; color: var(--muted); font-size: 14px; font-weight: 600; padding: 10px; min-height: 44px; }
.nr-link b { color: var(--ink); }
.nr-auth { display: flex; flex-direction: column; gap: 14px; padding-top: 6px; }
.nr-auth-h1 { font-size: 44px !important; line-height: .95 !important; margin: 0; }
.nr-stepbar { display: flex; gap: 6px; } .nr-stepbar i { flex: 1; height: 6px; border-radius: 3px; background: var(--line); } .nr-stepbar i.on { background: var(--ink); }
.nr-lbl { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 800; color: var(--muted); }
.nr-lbl input { width: 100%; color: var(--ink); }
.nr-pw { position: relative; display: block; } .nr-pw input { padding-right: 70px; }
.nr-pw button { position: absolute; right: 6px; top: 6px; bottom: 6px; border: 0; background: transparent; font-weight: 800; color: var(--ink); padding: 0 12px; }
.nr-note { font-size: 13px; color: var(--muted); background: var(--card); border-radius: 14px; padding: 12px 14px; box-shadow: 0 2px 0 var(--line); line-height: 1.45; }
input[type=password], input[type=email], input[type=search] { width: 100%; }
input[type=text], input[type=number], input[type=email], input[type=password], input[type=search], input[type=date], select { padding: 12px 14px; }

/* ---- supplements ---- */
.supp-row { border-bottom: 1px solid var(--line); }
.supp-row-head { display: flex; align-items: center; gap: 8px; padding: 6px 0; cursor: pointer; }
.supp-ev { font-size: 12px; font-weight: 800; letter-spacing: .02em; }
.supp-take { display: flex; align-items: center; gap: 8px; width: 112px; flex-shrink: 0; justify-content: flex-end; font-size: 12.5px; font-weight: 800; color: var(--ink); min-height: 44px; }
.supp-take input { width: 24px; height: 24px; accent-color: #111214; flex-shrink: 0; min-height: 0; padding: 0; }
body.mode-dark .supp-take input { accent-color: var(--accent); }
.supp-row.expanded .supp-row-detail { padding-bottom: 14px; }
.nr-today .ex span:first-child { color: #fff; }
.supp-row-head > *:nth-child(1){min-width:0;flex:1 1 0;overflow-wrap:anywhere}

.nr-cam{position:absolute;right:-6px;bottom:-6px;width:30px;height:30px;border-radius:50%;border:2px solid var(--card,#fff);background:var(--accent);color:#fff;font-weight:800;font-size:18px;line-height:1;padding:0;display:flex;align-items:center;justify-content:center}
.ex-icon.lg{overflow:visible}.ex-icon.lg>img{border-radius:18px}

.gauge-card{background:transparent!important;box-shadow:none!important;border:0!important;padding:0!important;margin-top:8px}
.seg{margin-bottom:14px}

.nr-tabs{display:flex;gap:4px;padding:5px;border-radius:18px;background:var(--line);margin-bottom:14px}
.nr-tabs button{flex:1;border:0;background:transparent;font-weight:800;font-size:14px;padding:11px 0;border-radius:14px;color:var(--muted);font-family:var(--font-ui);min-height:44px}
.nr-tabs button[aria-selected=true]{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.nr-legal-links a,.nr-auth a,.nr-note a{color:var(--muted);font-weight:700;text-decoration:underline}
.nr-land{padding-bottom:250px}

.nr-stack-wrap{position:relative}
.nr-stack{height:96px;overflow-y:auto;scroll-snap-type:y mandatory;overscroll-behavior:contain;border-radius:22px;background:var(--card);box-shadow:0 3px 0 var(--line);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.nr-stack::-webkit-scrollbar{display:none}
.nr-stack-page{height:96px;scroll-snap-align:start;scroll-snap-stop:always;display:flex;align-items:center;gap:14px;padding:0 64px 0 14px;box-sizing:border-box}
.nr-stack-name{font-family:var(--font-display);font-weight:800;font-size:22px;line-height:1.05;text-transform:uppercase;margin:2px 0 3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nr-stackdots{position:absolute;right:8px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:5px;pointer-events:none}
.nr-stackdots i{width:6px;height:6px;border-radius:50%;background:var(--line)}
.nr-stackdots i.on{background:var(--ink);height:14px;border-radius:3px}
.nr-stack-menu{position:absolute;right:22px;top:50%;transform:translateY(-50%);width:40px;height:40px}

.nr-stack-wrap .ex-icon.lg{overflow:visible}

.nr-tick.mid i{height:20px;background:#B5BAC1}
.nr-stack-page{overflow:hidden}.nr-stack-name{font-size:20px;margin:1px 0 2px}

/* ===== Rest heat tint ===== */
:root { --rest-bg: #F1F2F4; --rest-sub: #5C6370; }
body, .sticky-top { transition: background-color 1s linear; }
body.is-resting, body.is-resting .sticky-top { background-color: var(--rest-bg); }
body.no-tint-anim, body.no-tint-anim .sticky-top { transition: none !important; }
body.is-resting .nr-rest .meta, body.is-resting .nr-alarm { transition: color .4s ease; }
body.is-resting.rest-warm .nr-rest .meta, body.is-resting.rest-warm .nr-alarm, body.is-resting.rest-warm .nr-rest .k { color: #3A3D42; }
body.mode-dark.is-resting.rest-warm .nr-rest, body.mode-dark.is-resting.rest-warm .nr-rest .time { color: #111214; }
body.is-resting .nr-bar { background: rgba(17,18,20,.1); }
body.is-resting .nr-bar > div { background: #111214; }

/* ===== Lock animation ===== */
.next-card { transition: transform .4s cubic-bezier(.3,1.5,.5,1); }
.next-card.is-squish { transform: scale(.98); }
.next-head { display: flex; align-items: center; justify-content: space-between; }
.next-title { font-weight: 800; letter-spacing: .1em; color: var(--muted); transition: color .25s ease; }
.next-card:not([data-lock="edit"]) .next-title { color: var(--ink); }
.lock-badge { width: 32px; height: 32px; border-radius: 16px; background: #D3D6DB; color: #fff; display: grid; place-items: center; transition: background-color .25s ease, transform .35s cubic-bezier(.3,1.8,.5,1); }
.next-card:not([data-lock="edit"]) .lock-badge { background: #FF5A1F; }
.lock-badge.is-pop { transform: scale(1.15); }
.btn-lock { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; margin-top: 14px; background: #FF5A1F; color: #fff; border: 0; border-radius: 16px; height: 60px; font-family: var(--font-display); font-weight: 800; font-size: 22px; letter-spacing: .02em; box-shadow: 0 4px 0 #C23D0C; transition: transform .12s ease, box-shadow .12s ease, background-color .25s ease; }
.btn-lock.is-pressed { transform: translateY(4px); box-shadow: 0 0 0 #C23D0C; }
.next-card[data-lock="locking"] .btn-lock, .next-card[data-lock="locked"] .btn-lock { background: #111214; box-shadow: 0 4px 0 #000; }
.edit-block { max-height: 1400px; opacity: 1; overflow: hidden; transition: max-height .5s cubic-bezier(.4,0,.2,1), opacity .25s ease; }
.next-card[data-lock="locked"] .edit-block { max-height: 0; opacity: 0; pointer-events: none; transition: max-height .5s cubic-bezier(.4,0,.2,1) .2s, opacity .25s ease .15s; }
.lock-row { max-height: 0; opacity: 0; transform: translateY(-8px); overflow: hidden; transition: max-height .3s ease, opacity .2s ease, transform .2s ease; display: grid; grid-template-columns: 1fr auto; gap: 8px 12px; align-items: center; }
.next-card[data-lock="locked"] .lock-row { max-height: 200px; opacity: 1; transform: none; padding-top: 10px; transition: max-height .45s cubic-bezier(.4,0,.2,1) .35s, opacity .35s ease .45s, transform .45s cubic-bezier(.4,0,.2,1) .45s; }
.lock-row-val { font-family: var(--font-display); font-weight: 800; font-size: 34px; line-height: 1; }
.lock-row-sub, .lock-row-hint { color: var(--muted); font-size: 13px; }
.lock-row-hint { grid-column: 1 / -1; }
.btn-unlock { height: 44px; padding: 0 18px; border-radius: 14px; border: 0; background: var(--line); color: var(--ink); font-weight: 800; box-shadow: 0 3px 0 rgba(0,0,0,.15); }
#restTimer { display: inline-block; transition: transform .35s cubic-bezier(.3,1.6,.5,1); }
#restTimer.is-pulse { transform: scale(1.06); }
@media (prefers-reduced-motion: reduce) {
  .next-card, .lock-badge, #restTimer { transition: none !important; transform: none !important; }
  .edit-block, .lock-row { transition: opacity .15s ease !important; transform: none !important; }
}

/* ===== Auto-start undo bar ===== */
.nr-undo { position: fixed; left: 12px; right: 12px; top: max(10px, env(safe-area-inset-top)); z-index: 60; background: #111214; color: #fff; border-radius: 16px; padding: 12px 14px 10px; box-shadow: 0 6px 20px rgba(0,0,0,.3); }
.nr-undo .row { display: flex; align-items: center; justify-content: space-between; font-weight: 700; }
.nr-undo button { background: #fff; color: #111214; border: 0; border-radius: 10px; height: 34px; padding: 0 14px; font-weight: 800; }
.nr-undo .cd { height: 4px; border-radius: 2px; background: rgba(255,255,255,.2); margin-top: 10px; overflow: hidden; }
.nr-undo .cd > div { height: 100%; background: #FF5A1F; animation: nrUndoCd 5s linear forwards; }
@keyframes nrUndoCd { from { width: 100%; } to { width: 0; } }

/* ===== exercise viewer (my photo + guide) ===== */
.nr-fs{position:fixed;inset:0;z-index:200;background:rgba(10,11,13,.97);display:flex;flex-direction:column}
.nr-fs-x{position:absolute;top:max(14px,env(safe-area-inset-top));right:14px;z-index:3;width:44px;height:44px;border-radius:22px;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:18px;font-weight:800}
.nr-fs-pages{flex:1;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;min-height:0}
.nr-fs-pages::-webkit-scrollbar{display:none}
.nr-fs-page{flex:0 0 100%;scroll-snap-align:center;display:flex;align-items:center;justify-content:center;padding:64px 12px 12px;position:relative;min-height:0}
.nr-fs-page img{max-width:100%;max-height:100%;object-fit:contain;border-radius:12px}
.nr-fs.rot .nr-fs-page[data-k="guide"] img{position:absolute;top:calc(50% + 32px);left:50%;max-width:none;max-height:none;width:min(calc(100dvh - 240px),calc(100vw * 1.7778));transform:translate(-50%,-50%) rotate(90deg)}
.nr-fs-bar{padding:10px 16px max(20px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px;align-items:center}
.nr-fs-tabs{display:flex;background:rgba(255,255,255,.12);border-radius:16px;padding:4px;gap:4px}
.nr-fs-tabs button{height:40px;padding:0 20px;border-radius:12px;border:0;background:transparent;color:#C9CDD3;font:800 14px var(--font-ui,sans-serif);letter-spacing:.04em}
.nr-fs-tabs button.on{background:#fff;color:#111214}
.nr-fs-actions{display:flex;gap:10px;width:100%;max-width:420px}
.nr-fs-actions .btn{flex:1}
.nr-guide{position:absolute;left:-6px;bottom:-6px;width:28px;height:28px;border-radius:50%;border:2px solid var(--card,#fff);background:var(--ink,#111214);color:#fff;font:italic 800 15px Georgia,serif;line-height:1;padding:0;display:flex;align-items:center;justify-content:center}
.nr-guide-card{position:relative;border-radius:16px;overflow:hidden;margin:0 0 12px;cursor:pointer;background:#111214}
.nr-guide-card img{display:block;width:100%}
.nr-guide-card span{position:absolute;left:10px;bottom:10px;background:rgba(17,18,20,.85);color:#fff;font-size:12px;font-weight:800;letter-spacing:.04em;padding:6px 10px;border-radius:10px}

/* Workout progress: subtle segmented line under the header title (absolute, shifts nothing) */
.nr-hdr{position:relative}
.nr-prog{position:absolute;left:62px;right:62px;bottom:-9px;height:5px;display:flex;align-items:center;gap:3px;pointer-events:none}
.nr-prog span{display:block;height:3px;border-radius:2px;background:color-mix(in srgb, var(--ink) 14%, transparent);overflow:hidden}
.nr-prog span.cur{height:5px;border-radius:3px;background:color-mix(in srgb, var(--ink) 26%, transparent)}
.nr-prog span i{display:block;height:100%;background:var(--ink);border-radius:inherit;transition:width .4s ease}
.cal-cell.sick-day{background:transparent;border:1.5px dotted var(--ink)}
.cal-legend-dot.sick{background:transparent;border:1.5px dotted var(--ink)}
.cal-cell{cursor:default}
.cal-cell.sick-day{background:transparent;border:1.5px dotted var(--ink)}
.cal-legend-dot.sick{background:transparent;border:1.5px dotted var(--ink)}

:root{--bm-out:#E9EBEF;--bm-stroke:#B4BAC4;--bm-m:#CBD0D8}
body.mode-dark{--bm-out:#23262A;--bm-stroke:#3A3E44;--bm-m:#3A3F46}
.bm-stage{margin-top:12px;background:var(--bg);border-radius:22px;padding:12px 0;display:flex;justify-content:center}
.bm-out{fill:var(--bm-out);stroke:var(--bm-stroke);stroke-width:3;stroke-linejoin:round}
.bm-m{fill:var(--bm-m);stroke:var(--bg);stroke-width:2;transition:fill .15s}
.bm-m.on{fill:var(--accent)}
.bm-g{cursor:pointer;-webkit-tap-highlight-color:transparent}
.bm-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;justify-content:center}
.bm-pill{min-height:44px;padding:0 16px;border-radius:22px;border:1.5px solid var(--btn-edge);background:transparent;color:var(--ink);font-weight:800;font-size:14px}
.bm-pill.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* Profile hub */
.ph-card{background:var(--card);border-radius:22px;box-shadow:0 3px 0 var(--btn-edge);padding:0 16px;overflow:hidden}
.ph-row{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;background:none;border:0;border-top:1px solid var(--line);color:var(--ink);text-align:left;padding:0}
.ph-card>.ph-row:first-child{border-top:0}
.ph-lab{flex:1;font-weight:700;font-size:14px}
.ph-val{color:var(--muted);font-weight:700;font-size:14px;text-align:right;max-width:55%}
.ph-add{padding:5px 12px;border-radius:14px;background:color-mix(in srgb,var(--accent) 22%,transparent);font-weight:800;font-size:12px}
.ph-chev{color:var(--muted);font-size:20px}
.ph-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.ph-pill{min-height:44px;padding:0 16px;border-radius:22px;border:1.5px solid var(--btn-edge);background:transparent;color:var(--ink);font-weight:800;font-size:14px}
.ph-pill.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.ph-field{margin-top:14px}.ph-fl{display:flex;justify-content:space-between;align-items:baseline;font-weight:800;font-size:14px}
.ph-input{width:100%;min-height:50px;border-radius:14px;border:1.5px solid var(--btn-edge);background:var(--card);color:var(--ink);padding:0 14px;font-weight:800;font-size:17px;margin-top:6px;box-sizing:border-box}
.ph-days{display:flex;justify-content:space-between;margin-top:8px}
.ph-day{width:42px;height:42px;border-radius:50%;border:1.5px solid var(--btn-edge);background:transparent;color:var(--ink);font-weight:800}
.ph-day.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.ph-stepper{display:flex;align-items:center;gap:10px;margin-top:6px}
.ph-sb{width:48px;height:48px;border-radius:14px;border:1.5px solid var(--btn-edge);background:transparent;color:var(--ink);font-size:22px;font-weight:800}
.ph-sb.dark{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.ph-sv{flex:1;text-align:center;font-family:var(--font-display);font-weight:800;font-size:30px}

/* exercise knowledge */
.kn-sum{font-size:14px;color:var(--muted);margin:6px 0 10px}
.kn-pills{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0}
.kn-pill{font-size:12px;font-weight:700;border:1.5px solid var(--line);border-radius:999px;padding:4px 10px;text-transform:capitalize}
.kn-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;background:var(--line);padding:4px;border-radius:12px;margin:12px 0}
.kn-tab{border:0;background:transparent;font:700 13px var(--font-ui);color:var(--muted);padding:9px 2px;border-radius:9px}
.kn-tab.on{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.kn-h{font:800 11px var(--font-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:14px 0 6px}
.kn-ol,.kn-ul{margin:0;padding-left:20px;font-size:14px;line-height:1.45}.kn-ol li,.kn-ul li{margin:4px 0}
.kn-chip{display:inline-block;font-size:13px;font-weight:600;background:var(--line);border:0;color:var(--ink);padding:6px 11px;border-radius:999px;margin:0 6px 6px 0}
.kn-chip.link{background:color-mix(in srgb,#4C8DF6 16%,transparent);color:#4C8DF6}
.kn-mist{border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:8px}
.kn-mist summary{font-weight:700;font-size:14px;cursor:pointer}
.kn-x{color:#E0573D;font-weight:900;margin-right:8px}
.kn-fix{font-size:14px;margin-top:6px}