@import"https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@300;400;500;700&display=swap";:root{--color-bg: #0a0a0f;--color-surface: #141420;--color-surface-hover: #1e1e30;--color-border: #2a2a40;--color-primary: #6c63ff;--color-primary-glow: rgba(108, 99, 255, .3);--color-secondary: #00d4aa;--color-accent: #ff6b6b;--color-text: #e8e8f0;--color-text-muted: #8888a0;--color-success: #00d4aa;--color-warning: #ffb347;--color-danger: #ff6b6b;--radius: 12px;--radius-sm: 8px;--shadow: 0 4px 24px rgba(0, 0, 0, .4)}*{margin:0;padding:0;box-sizing:border-box}html{font-family:Noto Sans TC,system-ui,sans-serif;background:var(--color-bg);color:var(--color-text);scroll-behavior:smooth}body{min-height:100vh;line-height:1.6}a{color:var(--color-primary);text-decoration:none;transition:color .2s}a:hover{color:var(--color-secondary)}.container{max-width:1200px;margin:0 auto;padding:0 1.5rem}.nav{position:sticky;top:0;z-index:100;background:#0a0a0fd9;backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);padding:1rem 0}.nav .container{display:flex;align-items:center;justify-content:space-between}.nav-brand{font-size:1.25rem;font-weight:700;color:var(--color-text);display:flex;align-items:center;gap:.5rem}.nav-links{display:flex;gap:1.5rem;list-style:none}.nav-links a{color:var(--color-text-muted);font-weight:500;font-size:.95rem;transition:color .2s}.nav-links a:hover,.nav-links a.active{color:var(--color-primary)}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:1.5rem;transition:border-color .2s,box-shadow .2s}.card:hover{border-color:var(--color-primary);box-shadow:0 0 20px var(--color-primary-glow)}.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border-radius:var(--radius-sm);font-weight:600;font-size:.95rem;border:none;cursor:pointer;transition:all .2s}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:#5a52e0;box-shadow:0 0 20px var(--color-primary-glow)}.btn-secondary{background:transparent;color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover{border-color:var(--color-primary);color:var(--color-primary)}.btn-success{background:var(--color-success);color:#0a0a0f}.btn-danger{background:var(--color-danger);color:#fff}.detection-container{position:relative;width:100%;max-width:720px;margin:0 auto;border-radius:var(--radius);overflow:hidden;background:#000;aspect-ratio:4/3}.detection-container video,.detection-container canvas{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain}.detection-container canvas{z-index:2}.stats-panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1rem;margin-top:1rem}.stat-item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:1rem;text-align:center}.stat-value{font-size:1.5rem;font-weight:700;color:var(--color-primary)}.stat-label{font-size:.8rem;color:var(--color-text-muted);margin-top:.25rem}.pose-info{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:1.5rem;margin-top:1.5rem}.angle-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.75rem;margin-top:1rem}.angle-item{display:flex;justify-content:space-between;padding:.5rem .75rem;background:var(--color-bg);border-radius:var(--radius-sm);font-size:.9rem}.angle-good{color:var(--color-success)}.angle-warn{color:var(--color-warning)}.angle-bad{color:var(--color-danger)}.upload-zone{border:2px dashed var(--color-border);border-radius:var(--radius);padding:3rem;text-align:center;cursor:pointer;transition:border-color .2s,background .2s}.upload-zone:hover,.upload-zone.dragover{border-color:var(--color-primary);background:#6c63ff0d}.page-header{text-align:center;padding:3rem 0 2rem}.page-header h1{font-size:2rem;font-weight:700;margin-bottom:.5rem}.page-header p{color:var(--color-text-muted);font-size:1.1rem}.badge{display:inline-block;padding:.25rem .75rem;border-radius:999px;font-size:.75rem;font-weight:600}.badge-live{background:#ff6b6b26;color:var(--color-accent);animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@media(max-width:768px){.nav-links{gap:1rem}.page-header h1{font-size:1.5rem}.stats-panel{grid-template-columns:repeat(2,1fr)}}.loading-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#000000b3;z-index:10;border-radius:var(--radius)}.spinner{width:40px;height:40px;border:3px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem}.gallery-item{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:16/9;cursor:pointer}.gallery-item img,.gallery-item video{width:100%;height:100%;object-fit:cover}.gallery-item-overlay{position:absolute;inset:0;background:linear-gradient(transparent 50%,#000c);display:flex;align-items:flex-end;padding:1rem;opacity:0;transition:opacity .3s}.gallery-item:hover .gallery-item-overlay{opacity:1}