*{box-sizing:border-box}body{margin:0;font-family:Hiragino Sans,Yu Gothic,sans-serif;background:#f5f3ef;color:#2c2c2c}.app{display:flex;flex-direction:column;height:100vh}.top-bar{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;background:#fff;border-bottom:1px solid #e0ddd6}.screen{max-width:480px;margin:0 auto;padding:24px;width:100%}.login-screen{display:flex;flex-direction:column;gap:12px;margin-top:32px}.login-screen input{padding:10px;border:1px solid #ccc;border-radius:6px}.login-screen button[type=submit]{padding:10px;background:#7b6b53;color:#fff;border:none;border-radius:6px}.login-welcome{text-align:center;margin-bottom:8px}.login-avatar{width:180px;height:138px;object-fit:cover;object-position:center top;border-radius:14px;box-shadow:0 4px 16px #0002}.login-welcome h1{font-size:20px;margin:16px 0 8px}.login-supervisor{font-size:12px;color:#999;margin:0 0 10px}.login-desc{font-size:13px;color:#666;line-height:1.6;margin:0}.login-plans{display:flex;gap:10px;margin-bottom:8px}.login-plan-card{flex:1;border:1px solid #e0ddd6;border-radius:10px;padding:10px;text-align:center;background:#fff}.login-plan-name{display:block;font-size:12px;color:#999}.login-plan-price{display:block;font-size:17px;font-weight:700;color:#7b6b53;margin:2px 0}.login-plan-desc{display:block;font-size:11px;color:#666}.login-updates{margin-top:32px;border-top:1px solid #e0ddd6;padding-top:16px}.login-updates h2{font-size:13px;color:#999;font-weight:400;margin:0 0 8px}.login-updates ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.login-updates li{display:flex;gap:10px;font-size:12px;color:#666}.update-date{color:#7b6b53;white-space:nowrap}.link-button{background:none;border:none;color:#7b6b53;text-decoration:underline;cursor:pointer}.error{color:#c0392b;font-size:14px}.chat-screen{display:flex;flex-direction:column;height:100%;padding:0;max-width:600px}.chat-header{display:flex;align-items:center;gap:12px;padding:8px 16px;background:#fff;border-bottom:1px solid #e0ddd6;font-size:13px}.phase-badge{background:#7b6b53;color:#fff;padding:2px 10px;border-radius:12px}.mode-toggle{display:flex;gap:4px}.mode-toggle button{padding:4px 10px;border:1px solid #ccc;background:#fff;border-radius:12px;font-size:12px;cursor:pointer}.mode-toggle button.active{background:#7b6b53;color:#fff;border-color:#7b6b53}.usage-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 16px;background:#f0ede6;border-bottom:1px solid #e0ddd6}.usage-elapsed{font-size:15px;font-weight:700;color:#7b6b53}.usage-total{font-size:12px;color:#444}.upgrade-banner{background:#fff3cd;padding:8px 16px;font-size:13px;display:flex;justify-content:space-between;align-items:center}.messages{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}.message{padding:10px 14px;border-radius:12px;max-width:80%;line-height:1.5}.message.assistant{background:#fff;align-self:flex-start}.message.user{background:#7b6b53;color:#fff;align-self:flex-end}.chat-input{display:flex;gap:8px;padding:12px;background:#fff;border-top:1px solid #e0ddd6}.chat-input input{flex:1;padding:10px;border:1px solid #ccc;border-radius:6px}.chat-input button{padding:10px 18px;background:#7b6b53;color:#fff;border:none;border-radius:6px}.avatar-area{background:#fff;padding:8px 16px 4px;text-align:center;border-bottom:1px solid #e0ddd6}.speak-controls{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:4px}.speak-toggle{background:none;border:1px solid #ccc;border-radius:14px;padding:4px 12px;font-size:12px;cursor:pointer}.speed-control{display:flex;align-items:center;gap:6px;font-size:12px;color:#666}.speed-control input[type=range]{width:120px;accent-color:#7b6b53}.speed-value{min-width:28px;color:#7b6b53;font-weight:700}.avatar-img-wrap{position:relative;display:inline-block}.avatar-img-clip{width:340px;height:260px;overflow:hidden;border-radius:14px;position:relative;margin:0 auto;box-shadow:0 4px 16px #0002}.avatar-img{width:340px;height:auto;object-fit:cover;object-position:center top;display:block;transition:filter .3s}.avatar-img.talking{filter:brightness(1.04)}.avatar-img.listening{filter:brightness(1.02) saturate(1.1)}.avatar-img.thinking{filter:brightness(.96) saturate(.9)}.avatar-overlay{position:absolute;bottom:8px;left:50%;transform:translate(-50%)}.sound-wave{display:flex;align-items:flex-end;gap:3px;height:28px}.sound-wave .bar{width:4px;border-radius:2px;background:#7b6b53;animation:wave .8s ease-in-out infinite}.listening-wave .bar{background:#4a90c8}.bar1{animation-delay:0s;height:10px}.bar2{animation-delay:.12s;height:18px}.bar3{animation-delay:.24s;height:26px}.bar4{animation-delay:.12s;height:18px}.bar5{animation-delay:0s;height:10px}@keyframes wave{0%,to{transform:scaleY(.4);opacity:.7}50%{transform:scaleY(1);opacity:1}}.think-dots{display:flex;gap:6px;align-items:center}.think-dots .dot{width:8px;height:8px;border-radius:50%;background:#7b6b53;animation:pulse 1.1s ease-in-out infinite}.avatar-state-label{font-size:11px;color:#7b6b53;margin-top:4px;letter-spacing:.05em}.mic-button{padding:10px 14px;background:#fff;border:1px solid #ccc;border-radius:6px;font-size:16px;cursor:pointer}.mic-button.active{background:#e74c3c;border-color:#e74c3c;animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}.session-end-screen,.pricing-screen{text-align:center;margin-top:40px}.actions{display:flex;gap:12px;justify-content:center;margin-top:20px}.actions button{padding:10px 16px;background:#7b6b53;color:#fff;border:none;border-radius:6px}.plans{display:flex;gap:16px;justify-content:center;margin-top:20px;flex-wrap:wrap}.plan-card{border:1px solid #ddd;border-radius:10px;padding:16px;width:180px;background:#fff}.plan-card .price{font-size:20px;font-weight:700}.note{font-size:12px;color:#999}.history-screen{display:flex;flex-direction:column;height:100%;padding:0;max-width:600px}.history-list{list-style:none;margin:0;padding:12px;display:flex;flex-direction:column;gap:8px}.history-item{background:#fff;border-radius:10px;padding:14px 16px;cursor:pointer;border:1px solid #e0ddd6;display:flex;gap:12px;align-items:center}.history-item:hover{background:#f9f7f4}.history-date{flex:1;font-size:14px}.history-duration{color:#7b6b53;font-size:13px}.history-count{color:#999;font-size:12px}.history-empty{color:#999;text-align:center;padding:40px 16px}.login-legal-links,.pricing-legal-links{margin-top:20px;padding-top:12px;border-top:1px solid #e0ddd6;display:flex;gap:14px;justify-content:center;flex-wrap:wrap}.login-legal-links .link-button,.pricing-legal-links .link-button{font-size:11px}.legal-screen{text-align:left}.legal-body{font-size:13px;line-height:1.8;color:#444;margin-bottom:20px}.legal-section{margin-bottom:18px}.legal-section h3{font-size:14px;color:#7b6b53;margin:0 0 6px}.legal-section p{margin:0 0 4px}.legal-table{width:100%;border-collapse:collapse}.legal-table th,.legal-table td{border:1px solid #e0ddd6;padding:10px 12px;text-align:left;vertical-align:top;font-size:13px}.legal-table th{width:34%;background:#f5f3ef;color:#7b6b53;font-weight:400;white-space:nowrap}.legal-table td p{margin:0 0 4px}.legal-table td p:last-child{margin-bottom:0}.safety-notice{display:flex;align-items:flex-start;gap:8px;background:#fff0eb;border-left:4px solid #e67e22;border-radius:8px;padding:10px 14px;margin:0 0 12px;font-size:12.5px;color:#7a4a2a;line-height:1.7}.safety-notice .link-button{font-size:12.5px;color:#7a4a2a;text-decoration:underline;padding:0}.safety-notice-dismiss{margin-left:auto;background:none;border:none;color:#a06840;font-size:16px;line-height:1;cursor:pointer;padding:0 2px;flex-shrink:0}.mfa-banner{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#f5f3ef;border:1px solid #e0ddd6;border-radius:8px;padding:10px 14px;margin:0 0 12px;font-size:13px;color:#444}.mfa-screen{max-width:360px;margin:40px auto;text-align:center}.mfa-screen input{width:100%;margin-bottom:10px;padding:10px;border:1px solid #ccc;border-radius:6px}.mfa-screen button[type=submit],.mfa-screen>button:not(.link-button){width:100%;padding:10px;background:#7b6b53;color:#fff;border:none;border-radius:6px;margin-top:4px}.payjp-card-form{max-width:320px;margin:24px auto 0;display:flex;flex-direction:column;gap:10px}#payjp-card-element{padding:10px;border:1px solid #ccc;border-radius:6px;background:#fff}.payjp-card-form button[type=submit]{padding:10px;background:#7b6b53;color:#fff;border:none;border-radius:6px}