:root{--bg: #121212;--paper: #1a1a1a;--ink: #fafafa;--accent: #76bada;--line: #2a2a2a;--danger: #e87b7b}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,Hiragino Sans,sans-serif;-webkit-font-smoothing:antialiased;width:100%;min-height:100vh;overflow-x:hidden}#app{width:100%;min-height:100vh}main{width:100%;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center;gap:1.25rem}main.landing h1{font-size:2rem;font-weight:300;letter-spacing:.1em;margin-bottom:1rem}main.landing .tagline{font-size:1rem;opacity:.7;margin-bottom:3rem}main.landing .footer{position:absolute;bottom:2rem;font-style:italic;font-size:.9rem;opacity:.5}.course-grid{display:flex;flex-direction:column;gap:.75rem;width:100%;max-width:320px;margin-bottom:2rem}.course-card{background:var(--paper);border:1px solid var(--line);color:var(--ink);padding:1.25rem 1.5rem;border-radius:.75rem;cursor:pointer;display:flex;flex-direction:column;gap:.25rem;text-align:left;transition:border-color .2s ease,transform .15s ease}.course-card:hover,.course-card:active{border-color:var(--accent);transform:translateY(-2px)}.course-card .course-label{font-size:1.1rem;font-weight:500;letter-spacing:.05em;color:var(--accent)}.course-card.video .course-label{color:var(--ink)}.course-card .course-hint{font-size:.85rem;opacity:.7}.course-card .course-meta{font-size:.75rem;opacity:.5;letter-spacing:.05em;margin-top:.25rem}.course-tag{font-size:.95rem;color:var(--accent);letter-spacing:.05em;margin-bottom:.5rem}main.done-stills{padding:3rem 1rem;justify-content:flex-start}.stills-grid{display:flex;flex-direction:column;gap:.75rem;width:100%;max-width:420px}.stills-cell{display:block;background:var(--paper);border-radius:.5rem;overflow:hidden;border:1px solid var(--line);text-decoration:none}.stills-cell img{width:100%;height:auto;display:block}main.done-stills .hint{font-size:.85rem;opacity:.6}button.primary,a.primary{background:var(--accent);color:var(--bg);border:none;padding:1rem 3rem;font-size:1.1rem;font-weight:600;border-radius:.5rem;cursor:pointer;text-decoration:none;display:inline-block}button.primary:hover,a.primary:hover{opacity:.9}button.ghost{background:transparent;color:var(--ink);border:1px solid var(--line);padding:.75rem 2rem;font-size:.95rem;border-radius:.5rem;cursor:pointer;opacity:.7}button.ghost:hover{opacity:1}main.capturing{justify-content:flex-start;padding-top:3rem}.capture-header{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.5rem}.step-counter{font-size:.85rem;opacity:.5;letter-spacing:.2em}.capture-header h2{font-size:1.5rem;font-weight:400;letter-spacing:.05em;color:var(--accent)}.prompt{font-size:1.1rem;font-weight:300;margin-top:.25rem}.hint{font-size:.85rem;opacity:.5}.silhouette-frame{width:100%;max-width:320px;aspect-ratio:3 / 4;background:var(--paper);border-radius:1rem;overflow:hidden;display:flex;align-items:center;justify-content:center;border:1px solid var(--line)}.silhouette-frame img{width:100%;height:100%;object-fit:cover}.silhouette-placeholder{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem}.silhouette-placeholder svg{width:60%;height:auto}.silhouette-text{font-size:.85rem;opacity:.5}.capture-btn{background:var(--accent);color:var(--bg);padding:1rem 3rem;font-size:1.1rem;font-weight:600;border-radius:.5rem;cursor:pointer;-webkit-user-select:none;user-select:none}main.review{padding:3rem 1rem;justify-content:flex-start}main.review h2{font-size:1.5rem;font-weight:400;margin-bottom:1rem}.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;width:100%;max-width:480px;margin-bottom:1.5rem}.review-cell{position:relative;aspect-ratio:3 / 4;background:var(--paper);border-radius:.5rem;overflow:hidden}.review-cell img{width:100%;height:100%;object-fit:cover}.review-cell span{position:absolute;left:.4rem;bottom:.4rem;font-size:.65rem;background:#0009;padding:.15rem .4rem;border-radius:.25rem;letter-spacing:.05em}main.uploading{gap:2rem}.spinner{width:48px;height:48px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}main.processing{gap:2rem}.progress-ring{position:relative;width:160px;height:160px}.progress-ring svg{width:100%;height:100%}.progress-num{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:1.8rem;font-weight:300;letter-spacing:.05em}.status-text{font-size:1.05rem;color:var(--accent);letter-spacing:.05em;text-align:center;line-height:1.6}.status-hint{font-size:.85rem;opacity:.5}.killer-hint{font-size:.9rem;opacity:.6;letter-spacing:.15em;margin-top:.5rem}.killer-hint em{font-style:italic;color:var(--accent)}.dna-dots{display:flex;flex-direction:column;gap:.5rem;width:100%;max-width:260px;margin:1rem 0}.dna-dot{display:flex;align-items:center;gap:.75rem;opacity:.3;transition:opacity .4s ease}.dna-dot.lit{opacity:1}.dna-dot .dot{width:8px;height:8px;border-radius:50%;background:var(--line);flex-shrink:0;transition:background .4s ease,box-shadow .4s ease}.dna-dot.lit .dot{background:var(--accent);box-shadow:0 0 8px var(--accent)}.dna-dot .dot-label{font-size:.8rem;letter-spacing:.08em;color:var(--ink);opacity:.7}main.done video{width:100%;max-width:420px;border-radius:.75rem;background:#000}.killer{font-size:1.1rem;line-height:1.6;letter-spacing:.05em;margin:1rem 0}.killer em{color:var(--accent);font-style:italic;letter-spacing:.1em}main.error h2{color:var(--danger);font-weight:400}