@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600&display=swap";body{margin:0;padding:0}:root{--bg-color:#fff;--text-color:#0d0d0d;--accent-color:#000;--secondary-color:#f5f5f7;--font-main:"Outfit", sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}body{background:var(--bg-color);color:var(--text-color);font-family:var(--font-main);height:100vh;overflow:hidden}.app-container.minimal{height:100vh;padding:env(safe-area-inset-top) 20px env(safe-area-inset-bottom);flex-direction:column;display:flex}.minimal-header{border-bottom:1px solid #f0f0f0;justify-content:center;padding:15px 0;display:flex}.brand{letter-spacing:-.5px;font-size:.9rem;font-weight:600}.version{color:#ccc;margin-left:5px;font-size:.6rem}.content{flex-direction:column;flex:1;display:flex}.view{flex-direction:column;flex:1;padding:15px 0;display:flex}.summary-card{background:var(--secondary-color);border-radius:24px;align-items:center;gap:20px;margin-bottom:20px;padding:25px;display:flex}.progress-circle{background:#fff;border-radius:50%;justify-content:center;align-items:center;width:55px;height:55px;font-size:.75rem;font-weight:600;display:flex;box-shadow:0 4px 10px #0000000d}.summary-text h2{font-size:1rem;font-weight:600}.summary-text p{color:#86868b;font-size:.75rem}.list-section{flex-direction:column;gap:10px;margin-bottom:20px;display:flex}.list-item{background:#fff;border:1px solid #f5f5f7;border-radius:20px;justify-content:space-between;align-items:center;padding:18px;display:flex;box-shadow:0 2px 5px #00000005}.list-item.completed{opacity:.5;background:#f9f9f9}.item-name{font-size:.9rem;font-weight:600}.item-target{color:#aaa;text-transform:uppercase;margin-top:2px;font-size:.6rem;display:block}.training-header-nav{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.training-header-nav button{color:#0071e3;background:0 0;border:none;font-family:inherit;font-size:.85rem;font-weight:600}.ex-title-chip{background:var(--secondary-color);text-transform:uppercase;border-radius:20px;padding:6px 14px;font-size:.6rem;font-weight:600}.viewport-container{background:#000;border-radius:30px;flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.video-element{object-fit:cover;width:100%;height:100%;transform:scaleX(-1)}.canvas-element{object-fit:cover;pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0;transform:scaleX(-1)}.guide-overlay{z-index:10;background:#000;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;display:flex;position:absolute;top:0;left:0}.guide-card{text-align:center;background:#fff;border-radius:24px;width:100%;max-width:320px;padding:25px}.guide-image-placeholder{background:#f5f5f7;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;width:100%;height:180px;margin-bottom:20px;display:flex}.guide-text{color:#333;margin-bottom:25px;font-size:.85rem;font-weight:400;line-height:1.5}.camera-setup{z-index:5;text-align:center;color:#fff;position:absolute}.hud-minimal{pointer-events:none;flex-direction:column;align-items:center;gap:20px;width:100%;display:flex;position:absolute;top:30px;left:0}.main-stat{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);text-align:center;background:#fffffff2;border-radius:28px;padding:18px 35px}.stat-value{color:#000;font-size:2.8rem;font-weight:600;line-height:1;display:block}.stat-label{color:#999;text-transform:uppercase;margin-top:4px;font-size:.6rem;font-weight:600}.posture-badge{color:#fff;border-radius:20px;padding:6px 18px;font-size:.6rem;font-weight:600}.posture-badge.ok{background:#2ecc71}.posture-badge.err{background:#e74c3c;animation:1s infinite flash}@keyframes flash{0%,to{opacity:1}50%{opacity:.6}}.btn-primary{color:#fff;background:#000;border:none;border-radius:30px;width:100%;padding:18px;font-family:inherit;font-size:.95rem;font-weight:600}.btn-black{color:#fff;background:#000;border:none;border-radius:20px;width:100%;padding:18px;font-family:inherit;font-size:.9rem;font-weight:600}.btn-secondary{color:#aaa;background:0 0;border:none;width:100%;padding:12px;font-family:inherit;font-size:.75rem}.view.finished{text-align:center;justify-content:center;padding:40px}.token-box{background:var(--secondary-color);border-radius:24px;margin:30px 0;padding:40px}.token-label{color:#aaa;margin-bottom:8px;font-size:.6rem;display:block}.token-value{letter-spacing:2px;font-size:2rem;font-weight:600}.spin{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}
