:root{color-scheme:dark;--bg:#050605;--surface:#111311;--surface-2:#181b18;--line:#2a302b;--accent:#32d05a;--accent-dark:#123f20;--text:#f7f8f7;--muted:#9ca39e;--danger:#ff5f57;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-synthesis:none}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text)}body{letter-spacing:0}button,input{font:inherit}button{color:inherit}.app-shell{min-height:100dvh;max-width:520px;margin:0 auto;background:var(--bg);position:relative;padding-bottom:92px}.screen{padding:calc(20px + env(safe-area-inset-top)) 20px 32px;min-height:calc(100dvh - 82px)}h1,h2,p{margin-top:0}h1{font-size:32px;line-height:1.08;margin-bottom:10px}h2{font-size:20px;line-height:1.2}p{color:var(--muted);line-height:1.5}.eyebrow{display:block;color:var(--accent);font-size:11px;font-weight:800;text-transform:uppercase;margin-bottom:8px}.brand-row,.section-title,.action-row,.privacy-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand-row{margin-bottom:26px}.brand-row h1{font-size:28px}.icon-button{width:42px;height:42px;border:1px solid var(--line);background:var(--surface);display:grid;place-items:center}.icon-button svg{width:19px}.hero-action{border:1px solid #344037;background:linear-gradient(145deg,#141814,#0b0d0b);padding:22px;display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;min-height:184px;position:relative;overflow:hidden}.hero-action:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 31px,rgba(255,255,255,.025) 32px);pointer-events:none}.hero-index{align-self:start;color:#637068;font:700 12px ui-monospace}.hero-action h2{font-size:24px;margin-bottom:8px}.hero-action p{font-size:14px;margin-bottom:0}.round-action{position:relative;z-index:1;width:54px;height:54px;border-radius:50%;border:0;background:var(--accent);color:#071108;display:grid;place-items:center}.round-action svg{width:25px}.section-title{margin:28px 0 12px}.section-title h2{margin:0}.section-title>span{color:var(--muted);font-size:12px}.workout-card,.machine-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0}.workout-card strong,.machine-row strong{display:block;margin-bottom:5px;overflow-wrap:anywhere}.workout-card p,.machine-row p{margin:0;font-size:13px;overflow-wrap:anywhere}.workout-number,.machine-thumb{width:52px;height:52px;background:var(--surface);border:1px solid var(--line);display:grid;place-items:center;overflow:hidden}.machine-thumb img{width:100%;height:100%;object-fit:cover}.machine-thumb svg{width:24px}.text-button{border:0;background:none;color:var(--accent);padding:8px}.screen-heading{padding:14px 0 24px}.screen-heading p{max-width:42ch}.scan-lens{aspect-ratio:4/5;max-height:480px;background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;position:relative;cursor:pointer}.lens-corners:before,.lens-corners:after,.scan-lens:before,.scan-lens:after{content:"";position:absolute;width:52px;height:52px;border-color:var(--accent)}.scan-lens:before{left:18px;top:18px;border-left:2px solid var(--accent);border-top:2px solid var(--accent)}.scan-lens:after{right:18px;top:18px;border-right:2px solid var(--accent);border-top:2px solid var(--accent)}.lens-corners:before{left:18px;bottom:18px;border-left:2px solid var(--accent);border-bottom:2px solid var(--accent)}.lens-corners:after{right:18px;bottom:18px;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent)}.lens-icon{width:58px;height:58px;border:1px solid var(--accent);border-radius:50%;display:grid;place-items:center;color:var(--accent);font-size:26px}.scan-lens small{color:var(--muted)}.privacy-row{align-items:flex-start;flex-direction:column;background:var(--surface);padding:14px;margin:14px 0;font-size:13px}.privacy-row label{display:flex;gap:9px;align-items:flex-start}.privacy-row input{accent-color:var(--accent);margin-top:3px}.button{border:1px solid var(--line);min-height:44px;padding:10px 16px;background:var(--surface)}.button.primary{background:var(--accent);border-color:var(--accent);color:#071108;font-weight:800}.button.secondary{background:transparent}.button.wide{width:100%}.button:disabled{opacity:.55}.inline-status{min-height:24px;font-size:13px;margin:10px 0}.inline-status.error{color:#ff8b85}.confidence{display:flex;align-items:center;gap:12px;margin:12px 0 20px}.confidence:before{content:"";height:4px;background:linear-gradient(90deg,var(--accent) var(--confidence,0),var(--line) 0);flex:1}.callout{border-left:3px solid var(--accent);background:var(--surface);padding:14px;margin:20px 0;display:grid;gap:5px}.callout span{color:var(--muted);font-size:13px}.callout.warning{border-color:#e9a23b}.field{display:grid;gap:7px;color:var(--muted);font-size:12px}.field input{width:100%;background:var(--surface);border:1px solid var(--line);color:var(--text);padding:13px}.action-row{margin-top:16px}.action-row>*{flex:1}.empty-state{border:1px dashed #394139;padding:34px 22px;text-align:center;background:#0b0d0b}.empty-state>span{width:52px;height:52px;margin:0 auto 16px;border:1px solid var(--line);display:grid;place-items:center}.empty-state svg{width:24px}.empty-state strong{display:block}.empty-state p{font-size:14px;margin:8px auto 18px;max-width:34ch}.machine-list{display:grid;min-width:0}.bottom-nav{position:fixed;z-index:10;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,520px);height:calc(76px + env(safe-area-inset-bottom));padding:8px 8px env(safe-area-inset-bottom);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:rgba(8,10,8,.96);border-top:1px solid var(--line);backdrop-filter:blur(16px)}.nav-button{border:0;background:transparent;color:#788078;display:grid;justify-items:center;align-content:center;gap:4px;min-width:0;font-size:10px}.nav-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7}.nav-button.active{color:var(--accent)}.availability{position:sticky;top:0;z-index:20;background:#33270f;color:#ffd68a;padding:9px 14px;font-size:12px;text-align:center}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}button:focus-visible,input:focus-visible,label:focus-within{outline:3px solid var(--accent);outline-offset:3px}@media(min-width:700px){body{background:#0c0e0c}.app-shell{box-shadow:0 0 0 1px #252b26,0 18px 60px rgba(0,0,0,.45)}.scan-lens{aspect-ratio:5/4}.screen{padding-left:28px;padding-right:28px}}@media(max-width:360px){.screen{padding-left:14px;padding-right:14px}.hero-action{grid-template-columns:auto 1fr}.hero-action .round-action{grid-column:2}.nav-button span{font-size:9px}}
button, input, textarea { font: inherit; }
textarea { resize: vertical; }
.full-width { width: 100%; }
.round-action.compact { width: 48px; height: 48px; flex: 0 0 auto; }
.gym-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.gym-heading > div { min-width: 0; }
.gym-tools { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px; }
.tool-button { min-height: 44px; border: 1px solid var(--line); background: var(--surface); display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px; cursor: pointer; }
.tool-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.search-field { height: 48px; border: 1px solid var(--line); background: #0b0d0b; display: grid; grid-template-columns: 22px 1fr; align-items: center; gap: 10px; padding: 0 14px; margin: 0 0 14px; }
.search-field svg { width: 20px; fill: none; stroke: var(--muted); stroke-width: 1.8; }
.search-field input { min-width: 0; width: 100%; border: 0; outline: 0; background: transparent; color: var(--text); }
.search-field input::placeholder { color: #737b74; }
.machine-button { width: 100%; border-left: 0; border-right: 0; background: transparent; text-align: left; cursor: pointer; }
.machine-button:hover { background: #0b0d0b; }
.machine-copy { min-width: 0; display: grid; gap: 5px; }
.machine-copy strong, .machine-copy span { overflow-wrap: anywhere; }
.machine-copy > span { color: var(--muted); font-size: 13px; line-height: 1.4; }
.row-edit { width: 36px; height: 36px; border: 1px solid var(--line); display: grid; place-items: center; }
.row-edit svg { width: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.operation-message { border-left: 3px solid var(--accent); background: var(--surface); color: var(--text); padding: 12px 14px; margin: 0 0 14px; font-size: 13px; }
.recovery-panel { border-left: 3px solid #e9a23b; background: #1c180f; padding: 14px; margin-bottom: 14px; }
.recovery-panel strong { display: block; margin-bottom: 5px; }
.recovery-panel p { margin: 0; font-size: 13px; }
.loading-mark { border-radius: 50%; border: 2px solid var(--line) !important; border-top-color: var(--accent) !important; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.machine-detail { padding-top: 4px; }
.back-button { min-height: 44px; border: 0; background: transparent; color: var(--muted); display: inline-flex; align-items: center; gap: 7px; padding: 0 4px 0 0; margin-bottom: 22px; }
.back-button svg, .danger-link svg { width: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.machine-detail-visual { min-height: 170px; border: 1px solid var(--line); background: #0b0d0b; display: grid; place-items: center; align-content: center; gap: 16px; margin-bottom: 22px; }
.machine-detail-visual .machine-thumb { width: 84px; height: 84px; }
.machine-detail-visual .eyebrow { margin: 0; }
.machine-detail .field { margin-bottom: 16px; }
.field textarea { width: 100%; background: var(--surface); border: 1px solid var(--line); color: var(--text); padding: 13px; line-height: 1.45; }
.detail-metadata { display: flex; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line); padding: 13px 0; margin-bottom: 10px; color: var(--muted); font-size: 12px; }
.danger-link { width: 100%; min-height: 44px; margin-top: 16px; border: 0; background: transparent; color: #ff8b85; display: flex; align-items: center; justify-content: center; gap: 8px; }
.button.danger { border-color: var(--danger); background: transparent; color: #ff8b85; }
.delete-confirmation { border: 1px solid #6b2f2c; background: #1c1010; padding: 16px; margin-top: 16px; }
.delete-confirmation strong { display: block; }
.delete-confirmation p { margin: 6px 0 0; font-size: 13px; }
.availability { display: flex; align-items: center; justify-content: center; gap: 12px; text-align: left; }
.availability[hidden] { display: none; }
.availability[data-state="offline"] { background: #242924; color: #dce2dd; }
.availability[data-state="error"], .availability[data-state="unsupported"] { background: #361817; color: #ffd0cd; }
.availability button { border: 1px solid currentColor; background: transparent; color: inherit; min-height: 32px; padding: 4px 10px; }
@media (max-width: 380px) {
  .gym-tools { grid-template-columns: 1fr; }
  .detail-metadata { flex-direction: column; }
  .availability { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
/* Recognition vertical slice */
.recognition-cancel { margin-top: 10px; }
.privacy-row small { color: var(--muted); line-height: 1.45; padding-left: 24px; }
.result-stage { padding-bottom: 16px; }
.result-stage .confidence { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 14px; align-items: center; }
.result-stage .confidence::before { grid-column: 1 / -1; width: 100%; }
.confidence-label { color: var(--muted); font-size: 12px; }
.result-stage[data-confidence-band="low"] .confidence::before { background: linear-gradient(90deg, #e9a23b var(--confidence, 0), var(--line) 0); }
.result-stage[data-confidence-band="high"] .confidence::before { background: linear-gradient(90deg, var(--accent) var(--confidence, 0), var(--line) 0); }
.result-summary { font-size: 15px; }
.result-purpose, .saved-purpose { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 14px 0; display: grid; gap: 6px; }
.result-purpose span, .saved-purpose span { color: var(--muted); font-size: 11px; text-transform: uppercase; font-weight: 800; }
.result-purpose strong, .saved-purpose strong { line-height: 1.45; }
.muscle-tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 20px; }
.muscle-tags span { border: 1px solid var(--line); background: var(--surface); color: var(--text); padding: 7px 9px; font-size: 12px; }
.guidance-section, .saved-guidance { border-top: 1px solid var(--line); padding: 16px 0 4px; }
.guidance-section h2, .saved-guidance h2 { font-size: 15px; margin-bottom: 10px; }
.guidance-section ol, .saved-guidance ul { margin: 0; padding-left: 22px; color: var(--muted); line-height: 1.5; }
.guidance-section li, .saved-guidance li { padding: 3px 0; overflow-wrap: anywhere; }
.guidance-section.safety, .saved-guidance.safety { border-left: 3px solid #e9a23b; border-top: 0; background: #1c180f; padding: 14px 14px 10px; margin-top: 14px; }
.guidance-section.limitations, .saved-guidance.limitations { font-size: 13px; }
.alternative-list { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 14px 0 18px; }
.alternative-list > span { width: 100%; color: var(--muted); font-size: 12px; }
.alternative-list button { min-height: 38px; border: 1px solid var(--line); background: var(--surface); padding: 7px 10px; }
.confirmation-note { font-size: 12px; margin: 10px 0 0; }
.saved-recognition { margin: 4px 0 20px; }
.saved-recognition > p { border-top: 1px solid var(--line); padding-top: 12px; font-size: 12px; }
@media (max-width: 380px) {
  .result-stage .action-row { flex-direction: column-reverse; align-items: stretch; }
  .result-stage .action-row > * { width: 100%; }
}
/* Workout session vertical slice */
.workout-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.workout-heading > div { min-width: 0; }
.live-mark { flex: 0 0 auto; border: 1px solid var(--accent); color: var(--accent); padding: 7px 9px; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.workout-builder { display: grid; border-top: 1px solid var(--line); }
.workout-machine-option { width: 100%; min-height: 76px; display: grid; grid-template-columns: auto minmax(0, 1fr) 34px; align-items: center; gap: 13px; border: 0; border-bottom: 1px solid var(--line); background: transparent; padding: 12px 0; text-align: left; cursor: pointer; }
.workout-machine-option:hover { background: var(--surface); }
.workout-machine-option.selected { background: #101a12; }
.workout-machine-option > span { min-width: 0; display: grid; gap: 5px; }
.workout-machine-option strong, .workout-machine-option small { overflow-wrap: anywhere; }
.workout-machine-option small { color: var(--muted); line-height: 1.35; }
.workout-machine-option > b { width: 30px; height: 30px; border: 1px solid var(--line); display: grid; place-items: center; color: var(--muted); }
.workout-machine-option.selected > b { border-color: var(--accent); background: var(--accent); color: #071108; }
.workout-start-bar { position: sticky; bottom: 84px; z-index: 4; margin: 18px -20px -12px; padding: 12px 20px; border-top: 1px solid var(--line); background: rgba(5, 6, 5, .96); display: flex; align-items: center; justify-content: space-between; gap: 14px; backdrop-filter: blur(14px); }
.workout-start-bar span { color: var(--muted); font-size: 12px; }
.workout-error { border-left: 3px solid var(--danger); background: #1c1010; color: #ffd0cd; padding: 12px 14px; margin: 0 0 14px; font-size: 13px; }
.exercise-switcher { display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; padding-bottom: 8px; }
.exercise-switcher button { flex: 0 0 auto; max-width: 220px; min-height: 48px; border: 1px solid var(--line); background: var(--surface); padding: 9px 12px; display: flex; align-items: center; gap: 8px; overflow-wrap: anywhere; text-align: left; }
.exercise-switcher button > span { color: var(--muted); font: 700 11px ui-monospace, monospace; }
.exercise-switcher button.active { border-color: var(--accent); background: var(--accent-dark); }
.exercise-switcher button.active > span { color: var(--accent); }
.active-exercise { margin-top: 10px; }
.set-table { border-top: 1px solid var(--line); margin-bottom: 18px; }
.set-head, .set-row { display: grid; grid-template-columns: 42px repeat(3, minmax(0, 1fr)); align-items: center; min-height: 42px; border-bottom: 1px solid var(--line); text-align: right; }
.set-head { min-height: 34px; color: var(--muted); font-size: 11px; }
.set-head > :first-child, .set-row > :first-child { text-align: left; }
.set-row b { color: var(--accent); }
.sets-empty { border-bottom: 1px solid var(--line); padding: 16px 0; margin: 0; font-size: 13px; }
#workout-set-form fieldset { min-width: 0; border: 0; padding: 0; margin: 0 0 14px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
#workout-set-form legend { grid-column: 1 / -1; width: 100%; padding: 0 0 9px; font-size: 12px; color: var(--muted); }
#workout-set-form label { min-width: 0; color: var(--muted); font-size: 11px; display: grid; gap: 6px; }
#workout-set-form input { min-width: 0; width: 100%; height: 48px; border: 1px solid var(--line); background: var(--surface); color: var(--text); padding: 9px; }
.add-exercise { border-top: 1px solid var(--line); margin-top: 28px; }
.workout-builder.compact .workout-machine-option { min-height: 64px; }
.workout-builder.compact .machine-thumb { width: 44px; height: 44px; }
.finish-workout { width: 100%; min-height: 44px; margin-top: 24px; border: 1px solid #6b2f2c; background: transparent; color: #ff8b85; }
.finish-confirmation { border: 1px solid #6b2f2c; background: #1c1010; padding: 16px; margin-top: 24px; }
.finish-confirmation strong { display: block; }
.finish-confirmation p { margin: 6px 0 0; font-size: 13px; }
@media (max-width: 380px) {
  .workout-heading { flex-direction: column; }
  .workout-start-bar { margin-left: -14px; margin-right: -14px; padding-left: 14px; padding-right: 14px; }
  .workout-start-bar { align-items: stretch; flex-direction: column; }
  #workout-set-form fieldset { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #workout-set-form label:last-child { grid-column: 1 / -1; }
  .finish-confirmation .action-row { align-items: stretch; flex-direction: column; }
}
.profile-avatar-button { width: 48px; height: 48px; padding: 0; border: 1px solid var(--line); background: var(--surface); overflow: hidden; flex: 0 0 auto; }
.profile-avatar { width: 100%; height: 100%; display: grid; place-items: center; overflow: hidden; background: linear-gradient(145deg, #19201a, #0b0e0c); color: var(--accent); }
.profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
.profile-avatar svg { width: 56%; fill: none; stroke: currentColor; stroke-width: 1.7; }
.profile-avatar.is-large { width: 96px; height: 96px; border: 1px solid #3b493e; }
.profile-heading { padding: 10px 0 18px; }
.profile-heading p { max-width: 38ch; }
.profile-avatar-editor { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px; align-items: center; padding: 20px 0 24px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-bottom: 24px; }
.profile-avatar-editor strong { display: block; margin-bottom: 6px; }
.profile-avatar-editor p { margin: 0; font-size: 13px; }
.profile-photo-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 16px 0; }
.profile-photo-actions .button { display: grid; place-items: center; text-align: center; cursor: pointer; }
.profile-privacy { border-left: 3px solid var(--accent); background: var(--surface); padding: 14px; margin: 18px 0; }
.profile-privacy strong { display: block; margin-bottom: 5px; }
.profile-privacy p { margin: 0; font-size: 13px; }
@media (max-width: 360px) {
  .profile-photo-actions { grid-template-columns: 1fr; }
}
