:root{--bg-base: #F7F2EB;--bg-card: #FFFFFF;--bg-elevated: #FFFCF8;--bg-warm: #FBF6EF;--cta: #E8743C;--cta-hover: #D9622E;--cta-soft: #FDF0E8;--cta-light: #FFF5EE;--stranger: #7C5CC4;--stranger-soft: #F0EBFA;--stranger-bg: #F5F1FC;--stranger-text: #6B4FAB;--familiar: #E8943C;--familiar-soft: #FEF5E8;--familiar-bg: #FEF7EC;--familiar-text: #D67E2E;--acquaintance: #2E9E6B;--acquaintance-soft: #E6F6EF;--acquaintance-bg: #EBF7F1;--acquaintance-text: #258A5C;--night-bg: #1A2151;--night-bg-2: #232B5C;--night-text: #C8D0F0;--night-accent: #FFD96B;--night-star: rgba(255, 255, 255, .6);--hero-grad-1: #FFF3E0;--hero-grad-2: #FBE6D0;--hero-grad-3: #F5DCCC;--text-primary: #1B2330;--text-title: #15202E;--text-secondary: #6B7280;--text-tertiary: #9CA3AF;--text-inverse: #FFFFFF;--text-faint: #B8BCCC;--border: #EAE4DC;--border-soft: #F0EBE4;--shadow-xs: 0 1px 2px rgba(40, 30, 20, .04);--shadow-sm: 0 2px 8px rgba(40, 30, 20, .05);--shadow-md: 0 4px 20px rgba(40, 30, 20, .06);--shadow-lg: 0 8px 32px rgba(40, 30, 20, .08);--shadow-cta: 0 6px 18px rgba(232, 116, 60, .28);--radius-sm: 8px;--radius-md: 14px;--radius-lg: 20px;--radius-xl: 28px;--radius-2xl: 32px;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px);--nav-height: 58px;--max-mobile: 480px;--max-content: 960px}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html{font-size:16px;-webkit-text-size-adjust:100%;text-size-adjust:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans SC,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;background:var(--bg-base);color:var(--text-primary);line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;overscroll-behavior-y:none;position:fixed;width:100%;height:100vh;height:100dvh}#root{position:fixed;inset:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-top:var(--safe-top);padding-bottom:var(--safe-bottom);padding-left:var(--safe-left);padding-right:var(--safe-right)}button{font-family:inherit;border:none;cursor:pointer;background:none;color:inherit}textarea,input{font-family:inherit;border:none;outline:none;background:none}.app-shell{max-width:var(--max-mobile);margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;position:relative}.app-content{flex:1;padding-bottom:calc(var(--nav-height) + var(--safe-bottom) + 8px);overflow-y:auto}@media (min-width: 768px){.app-shell{max-width:100%;flex-direction:row}.app-content{flex:1;padding-bottom:0;padding-right:240px}.bottom-nav{position:fixed;left:0;top:0;bottom:0;width:240px;height:100%!important;flex-direction:column!important;border-right:1px solid var(--border);border-top:none;border-bottom:none;padding:var(--safe-top) 0 var(--safe-bottom) 0;padding-top:calc(var(--safe-top) + 24px);gap:4px;background:var(--bg-card)!important}.bottom-nav .nav-item{flex-direction:row!important;justify-content:flex-start!important;gap:14px;padding:13px 24px!important;border-radius:14px!important;margin:2px 12px}.bottom-nav .nav-item .nav-icon-svg{width:22px;height:22px}.bottom-nav .nav-label{font-size:15px!important}.main-area{max-width:var(--max-content);margin:0 auto;width:100%}}.main-area{width:100%}.bottom-nav{position:fixed;bottom:0;left:0;right:0;max-width:var(--max-mobile);margin:0 auto;height:var(--nav-height);background:#fffffff2;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--border-soft);display:flex;align-items:center;justify-content:space-around;padding-bottom:var(--safe-bottom);z-index:100;box-shadow:0 -2px 16px #281e140a}.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 4px;color:var(--text-faint);transition:color .2s ease;border-radius:10px;-webkit-tap-highlight-color:transparent}.nav-item:active{transform:scale(.92)}.nav-item.active{color:var(--cta)}.nav-icon-svg{width:22px;height:22px;display:block}.nav-label{font-size:10px;font-weight:600;letter-spacing:.2px}.home-page{padding:0 16px 16px}.home-hero{position:relative;border-radius:var(--radius-xl);padding:28px 22px 24px;margin-bottom:16px;background:linear-gradient(135deg,var(--hero-grad-1) 0%,var(--hero-grad-2) 60%,var(--hero-grad-3) 100%);overflow:hidden;box-shadow:var(--shadow-sm)}.home-hero:before{content:"";position:absolute;top:-40px;right:-30px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(255,220,150,.55) 0%,transparent 70%);pointer-events:none}.home-hero:after{content:"";position:absolute;bottom:-20px;left:-20px;width:100px;height:100px;border-radius:50%;background:radial-gradient(circle,rgba(255,200,120,.25) 0%,transparent 70%);pointer-events:none}.hero-streak{position:absolute;top:18px;right:18px;display:flex;align-items:center;gap:4px;padding:5px 12px 5px 8px;border-radius:20px;background:#ffffffbf;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);font-size:12px;font-weight:700;color:var(--cta);z-index:2;white-space:nowrap}.hero-streak .streak-flame{font-size:14px;line-height:1}.hero-content{position:relative;z-index:1}.hero-title{font-size:27px;font-weight:800;color:var(--text-title);letter-spacing:-.8px;line-height:1.2;margin-bottom:6px}.hero-subtitle{font-size:13.5px;color:var(--text-secondary);font-weight:400;line-height:1.5}.relationship-cards{display:flex;gap:10px;margin-bottom:16px}.rel-card{flex:1 1 0;min-width:0;display:flex;flex-direction:column;padding:14px 12px 12px;border-radius:var(--radius-lg);transition:transform .2s ease,box-shadow .2s ease;position:relative;overflow:hidden;text-align:center;border:none;text-decoration:none}.rel-card:active{transform:scale(.97)}.rel-card.stranger{background:var(--stranger-bg);box-shadow:0 3px 12px #7c5cc414}.rel-card.familiar{background:var(--familiar-bg);box-shadow:0 3px 12px #e8943c14}.rel-card.acquaintance{background:var(--acquaintance-bg);box-shadow:0 3px 12px #2e9e6b14}.rel-illustration{width:100%;height:52px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;margin-bottom:8px;position:relative;overflow:hidden}.rel-card.stranger .rel-illustration{background:linear-gradient(135deg,#e8def8,#d4c5f0)}.rel-card.familiar .rel-illustration{background:linear-gradient(135deg,#fce8cc,#f5d5a8)}.rel-card.acquaintance .rel-illustration{background:linear-gradient(135deg,#c8e8d5,#a5d5bb)}.rel-illustration .rel-silhouette{width:28px;height:28px;border-radius:50%/60% 60% 40% 40%;opacity:.5}.rel-card.stranger .rel-silhouette{background:var(--stranger)}.rel-card.familiar .rel-silhouette{background:var(--familiar)}.rel-card.acquaintance .rel-silhouette{background:var(--acquaintance)}.rel-name{font-size:13px;font-weight:700;margin-bottom:2px}.rel-card.stranger .rel-name{color:var(--stranger-text)}.rel-card.familiar .rel-name{color:var(--familiar-text)}.rel-card.acquaintance .rel-name{color:var(--acquaintance-text)}.rel-count{font-size:20px;font-weight:800;color:var(--text-title);line-height:1.1;margin-bottom:6px}.rel-count-unit{font-size:11px;font-weight:500;color:var(--text-tertiary)}.rel-tags{display:flex;flex-wrap:wrap;gap:3px;justify-content:center;margin-bottom:10px;min-height:20px}.rel-tag{font-size:9.5px;font-weight:600;padding:2px 7px;border-radius:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.rel-card.stranger .rel-tag{background:#7c5cc41f;color:var(--stranger-text)}.rel-card.familiar .rel-tag{background:#e8943c1f;color:var(--familiar-text)}.rel-card.acquaintance .rel-tag{background:#2e9e6b1f;color:var(--acquaintance-text)}.rel-arrow{position:absolute;bottom:10px;right:10px;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;color:var(--text-inverse)}.rel-card.stranger .rel-arrow{background:var(--stranger)}.rel-card.familiar .rel-arrow{background:var(--familiar)}.rel-card.acquaintance .rel-arrow{background:var(--acquaintance)}.scene-capture-card{background:var(--bg-warm);border-radius:var(--radius-xl);padding:20px 18px 18px;margin-bottom:16px;box-shadow:var(--shadow-sm);position:relative}.scene-capture-header{display:flex;align-items:center;gap:10px;margin-bottom:14px}.scene-sticky-note{display:inline-flex;align-items:center;justify-content:center;padding:3px 12px;border-radius:4px;background:var(--cta);color:var(--text-inverse);font-size:11px;font-weight:700;transform:rotate(-3deg);box-shadow:0 2px 6px #e8743c33;flex-shrink:0}.scene-capture-title{font-size:18px;font-weight:800;color:var(--text-title);letter-spacing:-.3px}.category-row{display:flex;gap:6px;margin-bottom:12px}.category-chip{flex:1;display:flex;align-items:center;justify-content:center;gap:4px;padding:7px 4px;border-radius:12px;font-size:12.5px;font-weight:600;background:var(--bg-card);color:var(--text-secondary);border:1.5px solid var(--border-soft);transition:all .18s ease;text-align:center}.category-chip .cat-emoji{font-size:14px;line-height:1}.category-chip.active{background:var(--cta-light);color:var(--cta);border-color:var(--cta)}.scene-textarea{width:100%;min-height:72px;max-height:120px;padding:12px 14px;border-radius:var(--radius-md);background:var(--bg-card);font-size:14.5px;line-height:1.55;color:var(--text-primary);resize:none;border:1.5px solid var(--border-soft);transition:border-color .2s ease}.scene-textarea:focus{border-color:var(--cta)}.scene-textarea::placeholder{color:var(--text-tertiary)}.scene-cta-wrapper{margin-top:12px}.scene-cta{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border-radius:var(--radius-md);background:var(--cta);color:var(--text-inverse);font-size:16px;font-weight:700;transition:all .18s ease;box-shadow:var(--shadow-cta)}.scene-cta:active{transform:scale(.98);background:var(--cta-hover)}.scene-cta:disabled{opacity:.45;box-shadow:none}.scene-cta-icon{font-size:18px;line-height:1}.scene-cta-sub{text-align:center;font-size:12px;color:var(--text-tertiary);margin-top:6px}.voice-toggle{display:flex;align-items:center;gap:6px;padding:7px 14px;border-radius:16px;background:var(--bg-card);color:var(--text-secondary);font-size:13px;font-weight:600;border:1.5px dashed var(--border);transition:all .18s ease;margin-bottom:10px}.voice-toggle:active{background:var(--cta-soft)}.voice-toggle.recording{border-color:var(--cta);color:var(--cta);background:var(--cta-soft);border-style:solid}.today-review-card{background:var(--bg-card);border-radius:var(--radius-xl);padding:16px;margin-bottom:16px;box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:14px;position:relative;overflow:hidden}.today-review-empty{background:var(--bg-card);border-radius:var(--radius-xl);padding:20px 16px;margin-bottom:16px;box-shadow:var(--shadow-sm);text-align:center}.today-review-empty-title{font-size:14px;font-weight:700;color:var(--text-secondary);margin-bottom:4px}.today-review-empty-sub{font-size:12px;color:var(--text-tertiary)}.tr-scene-thumb{width:56px;height:56px;border-radius:var(--radius-md);background:linear-gradient(135deg,#fce8cc,#f5d5a8);flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.tr-scene-thumb:after{content:"";position:absolute;bottom:6px;left:50%;transform:translate(-50%);width:20px;height:20px;border-radius:50%/60% 60% 40% 40%;background:#e8743c4d}.tr-body{flex:1;min-width:0}.tr-title{font-size:15px;font-weight:800;color:var(--text-title);margin-bottom:4px}.tr-prompt{font-size:12.5px;color:var(--text-secondary);line-height:1.4}.tr-actions{display:flex;gap:6px;margin-top:8px}.tr-btn{padding:5px 12px;border-radius:10px;font-size:12px;font-weight:700;transition:all .18s ease}.tr-btn.good{background:var(--acquaintance-soft);color:var(--acquaintance-text);border:1.5px solid transparent}.tr-btn.bad{background:var(--bg-warm);color:var(--text-tertiary);border:1.5px solid var(--border-soft)}.tr-arrow{width:32px;height:32px;border-radius:50%;background:var(--cta-soft);color:var(--cta);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}.familiar-circle-card{background:linear-gradient(160deg,var(--night-bg) 0%,var(--night-bg-2) 100%);border-radius:var(--radius-xl);padding:22px 20px;margin-bottom:16px;position:relative;overflow:hidden;box-shadow:0 8px 28px #1a21512e}.fc-star{position:absolute;border-radius:50%;background:var(--night-star);pointer-events:none}.fc-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;position:relative;z-index:1}.fc-title{font-size:16px;font-weight:800;color:var(--text-inverse);display:flex;align-items:center;gap:4px}.fc-star-icon{color:var(--night-accent);font-size:16px}.fc-illustration{width:48px;height:48px;border-radius:50%;background:radial-gradient(circle,rgba(255,217,107,.2) 0%,transparent 70%);display:flex;align-items:center;justify-content:center;flex-shrink:0}.fc-illustration:after{content:"";width:24px;height:24px;border-radius:50%/60% 60% 40% 40%;background:#c8d0f04d}.fc-stats{display:flex;gap:8px;margin-bottom:16px;position:relative;z-index:1}.fc-stat{flex:1;text-align:center}.fc-stat-num{font-size:22px;font-weight:800;color:var(--text-inverse);line-height:1.1}.fc-stat-label{font-size:10.5px;color:var(--night-text);margin-top:2px;line-height:1.3}.fc-footer{font-size:12.5px;color:var(--night-text);line-height:1.55;position:relative;z-index:1}.fc-footer .fc-heart{color:#e8743c}.cta-button{width:100%;padding:16px;border-radius:var(--radius-md);background:var(--cta);color:var(--text-inverse);font-size:17px;font-weight:700;margin-top:16px;transition:all .2s ease;box-shadow:var(--shadow-cta)}.cta-button:active{transform:scale(.98);background:var(--cta-hover)}.cta-button:disabled{opacity:.5;box-shadow:none}.voice-input-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px;margin-top:12px;border-radius:var(--radius-md);background:var(--bg-base);color:var(--text-secondary);font-size:14px;font-weight:500;border:1.5px dashed var(--border);transition:all .2s ease}.voice-input-btn:active{background:var(--cta-soft)}.voice-input-btn.recording{border-color:var(--cta);color:var(--cta);background:var(--cta-soft)}.extraction-page{padding:24px 20px}.page-header{display:flex;align-items:center;gap:12px;margin-bottom:24px}.back-btn{font-size:22px;color:var(--text-secondary);padding:4px}.page-title{font-size:20px;font-weight:700}.scene-preview{background:var(--bg-card);border-radius:var(--radius-md);padding:16px;margin-bottom:24px;box-shadow:var(--shadow-sm)}.scene-preview-label{font-size:12px;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.scene-preview-text{font-size:15px;color:var(--text-primary);line-height:1.6}.word-cards{display:flex;flex-direction:column;gap:16px}.word-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:24px 20px;box-shadow:var(--shadow-md);border:1.5px solid var(--border)}.word-card-header{display:flex;align-items:baseline;gap:12px;margin-bottom:8px;flex-wrap:wrap}.word-finnish{font-size:28px;font-weight:800;color:var(--text-primary);letter-spacing:-.5px}.word-pos{font-size:13px;color:var(--text-tertiary);background:var(--bg-base);padding:2px 10px;border-radius:12px}.word-chinese{font-size:18px;color:var(--cta);font-weight:600;margin-bottom:12px}.word-example{font-size:14px;color:var(--text-secondary);line-height:1.7;margin-bottom:12px;font-style:italic}.word-reason{font-size:13px;color:var(--text-tertiary);background:var(--bg-base);padding:10px 14px;border-radius:var(--radius-sm);margin-bottom:16px}.word-actions{display:flex;flex-direction:column;gap:8px}.word-action-btn{width:100%;padding:14px;border-radius:var(--radius-md);font-size:15px;font-weight:600;transition:all .2s ease}.word-action-btn:active{transform:scale(.98)}.word-action-btn.primary{background:var(--cta);color:var(--text-inverse);box-shadow:0 4px 12px #e8743c40}.word-action-btn.secondary{background:var(--bg-base);color:var(--text-secondary);border:1px solid var(--border)}.word-action-btn.tertiary{background:transparent;color:var(--text-tertiary)}.word-added-badge{text-align:center;padding:24px;color:var(--acquaintance);font-weight:600;font-size:16px}.review-page{padding:24px 20px}.review-empty{text-align:center;padding:60px 20px}.review-empty-icon{font-size:48px;margin-bottom:16px}.review-empty h3{font-size:18px;font-weight:700;color:var(--text-primary);margin-bottom:8px}.review-empty p{font-size:14px;color:var(--text-secondary)}.review-progress{display:flex;align-items:center;gap:8px;margin-bottom:24px}.review-progress-dot{width:8px;height:8px;border-radius:50%;background:var(--border);flex:1;max-width:40px}.review-progress-dot.done{background:var(--acquaintance)}.review-progress-dot.current{background:var(--cta);box-shadow:0 0 0 4px var(--cta-soft)}.review-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:32px 24px;box-shadow:var(--shadow-md);text-align:center}.review-question{font-size:22px;font-weight:700;color:var(--text-primary);margin-bottom:24px}.review-scene{background:var(--bg-base);border-radius:var(--radius-md);padding:20px;margin-bottom:24px;font-size:16px;color:var(--text-primary);line-height:1.7;text-align:left}.review-hint{font-size:14px;color:var(--text-tertiary);margin-bottom:16px}.review-reveal{margin:24px 0;padding:24px;background:var(--cta-soft);border-radius:var(--radius-md)}.review-reveal-word{font-size:32px;font-weight:800;color:var(--text-primary);margin-bottom:8px}.review-reveal-meaning{font-size:18px;color:var(--cta);font-weight:600}.review-reveal-example{font-size:14px;color:var(--text-secondary);margin-top:12px;font-style:italic}.review-choices{display:flex;flex-direction:column;gap:10px;margin-top:20px}.review-choice-btn{width:100%;padding:16px;border-radius:var(--radius-md);font-size:15px;font-weight:600;transition:all .2s ease;border:1.5px solid var(--border);background:var(--bg-card);color:var(--text-primary)}.review-choice-btn:active{transform:scale(.98)}.review-choice-btn.good{border-color:var(--acquaintance);color:var(--acquaintance);background:var(--acquaintance-soft)}.review-choice-btn.mid{border-color:var(--familiar);color:var(--familiar);background:var(--familiar-soft)}.review-choice-btn.bad{border-color:var(--stranger);color:var(--stranger);background:var(--stranger-soft)}.library-page{padding:24px 20px}.library-search{width:100%;padding:12px 16px;border-radius:var(--radius-md);background:var(--bg-card);border:1px solid var(--border);font-size:15px;margin-bottom:16px}.library-tabs{display:flex;gap:8px;margin-bottom:20px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px}.lib-tab{padding:8px 16px;border-radius:20px;font-size:14px;font-weight:500;white-space:nowrap;background:var(--bg-card);color:var(--text-secondary);border:1px solid var(--border)}.lib-tab.active{background:var(--cta);color:var(--text-inverse);border-color:var(--cta)}.word-list{display:flex;flex-direction:column;gap:10px}.word-list-item{display:flex;align-items:center;gap:12px;padding:16px;border-radius:var(--radius-md);background:var(--bg-card);box-shadow:var(--shadow-sm);transition:all .2s ease}.word-list-item:active{transform:scale(.98)}.word-list-item .wl-finnish{font-size:17px;font-weight:700;color:var(--text-primary)}.word-list-item .wl-chinese{font-size:13px;color:var(--text-secondary);margin-top:2px}.word-list-item .wl-text{flex:1}.word-list-item .wl-status{display:flex;gap:4px}.status-dot{width:8px;height:8px;border-radius:50%}.status-dot.stranger{background:var(--stranger)}.status-dot.familiar{background:var(--familiar)}.status-dot.acquaintance{background:var(--acquaintance)}.profile-detail{padding:24px 20px}.pd-header{text-align:center;margin-bottom:32px}.pd-word{font-size:36px;font-weight:800;color:var(--text-primary);letter-spacing:-1px}.pd-meaning{font-size:18px;color:var(--cta);font-weight:600;margin-top:4px}.pd-pos{font-size:13px;color:var(--text-tertiary);margin-top:4px}.pd-section{background:var(--bg-card);border-radius:var(--radius-md);padding:20px;margin-bottom:16px;box-shadow:var(--shadow-sm)}.pd-section-title{font-size:13px;font-weight:600;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.5px;margin-bottom:12px}.pd-section-content{font-size:15px;color:var(--text-primary);line-height:1.7}.pd-status-row{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.pd-status-pill{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:13px;font-weight:500}.pd-status-pill .pd-dot{width:8px;height:8px;border-radius:50%}.pd-meta-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--border);font-size:14px}.pd-meta-row:last-child{border-bottom:none}.pd-meta-label{color:var(--text-secondary)}.pd-meta-value{color:var(--text-primary);font-weight:500}.pd-timeline{display:flex;flex-direction:column;gap:8px}.pd-timeline-item{display:flex;gap:12px;font-size:14px}.pd-timeline-dot{width:8px;height:8px;border-radius:50%;margin-top:6px;flex-shrink:0}.pd-action-row{display:flex;gap:8px;margin-top:16px}.pd-action-btn{flex:1;padding:12px;border-radius:var(--radius-md);font-size:14px;font-weight:600;transition:all .2s ease}.pd-action-btn.outline{border:1.5px solid var(--border);color:var(--text-primary);background:var(--bg-card)}.pd-action-btn.danger{border:1.5px solid #FECACA;color:#dc2626;background:#fef2f2}.pron-module{padding:24px 20px}.pron-step{text-align:center;margin-bottom:24px}.pron-step-label{font-size:14px;color:var(--cta);font-weight:600;margin-bottom:8px}.pron-word{font-size:32px;font-weight:800;margin-bottom:4px}.pron-meaning{font-size:16px;color:var(--text-secondary)}.pron-flow{display:flex;flex-direction:column;gap:16px;align-items:center}.pron-action-card{width:100%;background:var(--bg-card);border-radius:var(--radius-md);padding:24px;text-align:center;box-shadow:var(--shadow-sm)}.pron-big-btn{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:32px;margin:0 auto 12px;transition:all .2s ease}.pron-big-btn:active{transform:scale(.95)}.pron-listen-btn{background:var(--cta-soft);color:var(--cta)}.pron-record-btn{background:var(--stranger-soft);color:var(--stranger)}.pron-record-btn.recording{animation:pulse 1.2s infinite}@keyframes pulse{0%,to{transform:scale(1);box-shadow:0 0 #8b5cf64d}50%{transform:scale(1.08);box-shadow:0 0 0 12px #8b5cf600}}.pron-card-label{font-size:15px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.pron-card-hint{font-size:13px;color:var(--text-tertiary)}.pron-risks{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;justify-content:center}.pron-risk-chip{padding:6px 12px;border-radius:16px;font-size:13px;background:var(--bg-base);border:1px solid var(--border);color:var(--text-secondary)}.pron-risk-chip.active{background:var(--stranger-soft);color:var(--stranger);border-color:var(--stranger)}.pron-result-btns{display:flex;gap:8px;margin-top:20px;width:100%}.pron-result-btn{flex:1;padding:14px;border-radius:var(--radius-md);font-size:15px;font-weight:600;transition:all .2s ease}.pron-result-btn.stable{background:var(--acquaintance-soft);color:var(--acquaintance);border:1.5px solid var(--acquaintance)}.pron-result-btn.unstable{background:var(--stranger-soft);color:var(--stranger);border:1.5px solid var(--stranger)}.my-page{padding:24px 20px}.my-header{text-align:center;margin-bottom:32px}.my-header h2{font-size:24px;font-weight:800}.my-stats{display:flex;gap:12px;margin-bottom:24px}.my-stat-card{flex:1;background:var(--bg-card);border-radius:var(--radius-md);padding:16px;text-align:center;box-shadow:var(--shadow-sm)}.my-stat-num{font-size:28px;font-weight:800;color:var(--text-primary)}.my-stat-label{font-size:12px;color:var(--text-secondary);margin-top:4px}.my-section{background:var(--bg-card);border-radius:var(--radius-md);padding:8px 0;margin-bottom:16px;box-shadow:var(--shadow-sm);overflow:hidden}.my-row{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-bottom:1px solid var(--border);font-size:15px}.my-row:last-child{border-bottom:none}.my-row-label{color:var(--text-primary)}.my-row-value{color:var(--text-tertiary);font-size:14px}.loading-screen{display:flex;align-items:center;justify-content:center;height:60vh;flex-direction:column;gap:12px}.loading-dots{display:flex;gap:6px}.loading-dots span{width:8px;height:8px;border-radius:50%;background:var(--cta);animation:bounce 1.2s infinite}.loading-dots span:nth-child(2){animation-delay:.2s}.loading-dots span:nth-child(3){animation-delay:.4s}@keyframes bounce{0%,80%,to{transform:scale(.6);opacity:.5}40%{transform:scale(1);opacity:1}}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:fadeIn .35s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.slide-up{animation:slideUp .4s ease-out}@media (max-width: 360px){.hero-title{font-size:23px}.rel-count{font-size:18px}.rel-name{font-size:12px}.rel-tag{font-size:9px;padding:2px 6px}.rel-illustration{height:44px}.scene-capture-title{font-size:16px}.fc-stat-num{font-size:19px}.word-finnish{font-size:24px}.review-question{font-size:19px}.pd-word{font-size:30px}.pron-word{font-size:28px}}@media (min-width: 768px){.home-page{padding:24px}.home-hero{padding:36px 32px 30px}.hero-title{font-size:32px}.relationship-cards{gap:14px}.rel-card{padding:18px 16px 14px}.rel-illustration{height:64px}.rel-illustration .rel-silhouette{width:36px;height:36px}.rel-count{font-size:26px}.scene-capture-card{padding:28px 24px}.scene-capture-title{font-size:20px}.familiar-circle-card{padding:28px 24px}}.lang-select{position:absolute;top:50px;right:18px;z-index:2;background:#ffffffbf;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid var(--border);border-radius:20px;padding:4px 22px 4px 10px;font-size:12px;font-weight:700;color:var(--text-secondary);cursor:pointer;outline:none;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%236B7280' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 6px center}.pd-comparison-toggle{width:100%;text-align:left;padding:12px 16px;background:var(--bg-base);border:1px solid var(--border);border-radius:var(--radius-sm);font-size:14px;font-weight:600;color:var(--text-secondary);cursor:pointer;transition:background .2s ease}.pd-comparison-toggle:active{background:var(--bg-elevated)}.pd-comparison-list{margin-top:8px;display:flex;flex-direction:column;gap:8px}.pd-comparison-item{display:flex;align-items:center;gap:12px;padding:10px 16px;background:var(--bg-base);border-radius:var(--radius-sm)}.pd-comparison-lang{font-size:13px;font-weight:700;color:var(--text-tertiary);white-space:nowrap;min-width:44px}.pd-comparison-expr{flex:1;font-size:15px;font-weight:500;color:var(--text-primary)}.pd-comparison-add{font-size:12px;padding:5px 12px;border-radius:14px;background:var(--cta-soft);color:var(--cta);border:1px solid var(--cta);cursor:pointer;white-space:nowrap;font-weight:600;transition:all .2s ease}.pd-comparison-add:active{transform:scale(.95)}