:root{color-scheme:dark;--bg-primary: #0f1523;--bg-secondary: #151c2e;--bg-card: #1d2740;--bg-input: #182238;--bg-hover: #263352;--accent: #f0647d;--accent-hover: #ff7d92;--accent-fg: #2b0b13;--accent-soft: rgba(240, 100, 125, .15);--text-primary: #edf0f7;--text-secondary: #a9b2c8;--text-muted: #6e7891;--border: #263048;--success: #46c8b4;--warning: #ffd166;--danger: #cf4046;--danger-hover: #de4d53;--danger-fg: #ff858c;--radius: 14px;--radius-sm: 9px;--bubble-tutor-bg: #202c49;--bubble-tutor-fg: #edf0f7;--bubble-tutor-border: rgba(255, 255, 255, .055);--bubble-user-bg: #b84059;--bubble-user-fg: #ffffff;--app-bg: var(--bg-primary);--scrim: rgba(11, 15, 26, .78);--shadow-soft: 0 1px 2px rgba(0, 0, 0, .18), 0 4px 14px rgba(0, 0, 0, .12)}:root[data-theme=paper]{color-scheme:light;--bg-primary: #f6f1e7;--bg-secondary: #efe7d8;--bg-card: #fbf8f1;--bg-input: #fffdf8;--bg-hover: #f0e9db;--accent: #a84a24;--accent-hover: #bf5a30;--accent-fg: #ffffff;--accent-soft: rgba(168, 74, 36, .12);--text-primary: #33281c;--text-secondary: #6a5a45;--text-muted: #8a7a63;--border: #e2d7c3;--success: #2f7255;--warning: #9a6b1a;--danger: #a83a30;--danger-hover: #bd4437;--danger-fg: #a83a30;--bubble-tutor-bg: #fffdf8;--bubble-tutor-fg: #33281c;--bubble-tutor-border: #e7dcc8;--bubble-user-bg: #eec584;--bubble-user-fg: #40300f;--scrim: rgba(246, 241, 231, .84);--shadow-soft: 0 1px 2px rgba(74, 56, 29, .08), 0 4px 14px rgba(74, 56, 29, .08)}:root[data-theme=terracotta]{color-scheme:dark;--bg-primary: #251510;--bg-secondary: #2d1a13;--bg-card: #3a2318;--bg-input: #321e15;--bg-hover: #462b1d;--accent: #d96c47;--accent-hover: #e97f58;--accent-fg: #2b1109;--accent-soft: rgba(217, 108, 71, .16);--text-primary: #f4e8da;--text-secondary: #cdb39e;--text-muted: #957c69;--border: #472c1e;--success: #7fb069;--warning: #e6b451;--danger: #b53d3d;--danger-hover: #c74a4a;--danger-fg: #ff9b80;--bubble-tutor-bg: #372217;--bubble-tutor-fg: #f4e8da;--bubble-tutor-border: rgba(255, 231, 205, .06);--bubble-user-bg: #a8472a;--bubble-user-fg: #fff3e9;--scrim: rgba(30, 15, 9, .78);--shadow-soft: 0 1px 2px rgba(0, 0, 0, .22), 0 4px 14px rgba(0, 0, 0, .16)}:root[data-theme=forest]{color-scheme:dark;--bg-primary: #121a15;--bg-secondary: #17211b;--bg-card: #1e2b23;--bg-input: #1a2620;--bg-hover: #26362c;--accent: #82c8a0;--accent-hover: #9adab5;--accent-fg: #0e2318;--accent-soft: rgba(130, 200, 160, .14);--text-primary: #e7efe9;--text-secondary: #a5b8ac;--text-muted: #6c8072;--border: #283a2f;--success: #67c987;--warning: #e3c25e;--danger: #b5484d;--danger-hover: #c65459;--danger-fg: #f2938c;--bubble-tutor-bg: #22332a;--bubble-tutor-fg: #e7efe9;--bubble-tutor-border: rgba(255, 255, 255, .05);--bubble-user-bg: #2f5f49;--bubble-user-fg: #e9f6ee;--scrim: rgba(10, 16, 12, .78);--shadow-soft: 0 1px 2px rgba(0, 0, 0, .2), 0 4px 14px rgba(0, 0, 0, .14)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}html{background:var(--app-bg)}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Noto Sans,sans-serif;background:var(--app-bg);color:var(--text-primary);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;accent-color:var(--accent);-webkit-tap-highlight-color:transparent;transition:background-color .25s ease,color .25s ease}button,input,textarea,select{font-family:inherit}button{touch-action:manipulation}::selection{background:var(--accent-soft)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media(hover:hover)and (pointer:fine){*{scrollbar-width:thin;scrollbar-color:var(--border) transparent}*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}*::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.app{display:flex;flex-direction:column;height:100%;max-width:900px;margin:0 auto}@media(min-width:901px){.app{border-left:1px solid var(--border);border-right:1px solid var(--border)}}.loading-screen{display:flex;align-items:center;justify-content:center}.spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.navbar{display:flex;align-items:center;gap:3px;padding:8px 10px;padding-top:calc(8px + env(safe-area-inset-top,0px));background:var(--bg-secondary);border-bottom:1px solid var(--border);overflow-x:auto;flex-shrink:0;transition:background-color .25s ease}.navbar a,.navbar button.nav-link{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;color:var(--text-secondary);text-decoration:none;font-size:13.5px;font-weight:500;letter-spacing:.01em;white-space:nowrap;background:none;border:none;cursor:pointer;transition:background-color .18s ease,color .18s ease}.navbar a:hover,.navbar button.nav-link:hover{color:var(--text-primary);background:var(--bg-hover)}.navbar a.active{color:var(--accent);background:var(--accent-soft)}.nav-spacer{flex:1}.nav-user{font-size:12px;color:var(--text-muted);padding:0 6px;white-space:nowrap}.navbar a.nav-icon,.navbar button.nav-icon{width:34px;height:34px;padding:0;justify-content:center;border-radius:50%;flex-shrink:0}.navbar .nav-icon svg{width:17px;height:17px;display:block}.main-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.btn{padding:10px 20px;border:1px solid transparent;border-radius:var(--radius-sm);font-size:15px;font-weight:600;cursor:pointer;transition:background-color .15s ease,color .15s ease,border-color .15s ease,transform .12s ease,opacity .15s ease}.btn:active{transform:scale(.98)}.btn-primary{background:var(--accent);color:var(--accent-fg);width:100%;box-shadow:var(--shadow-soft)}.btn-primary:hover{background:var(--accent-hover)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:var(--bg-card);border-color:var(--border);color:var(--text-primary)}.btn-secondary:hover{background:var(--bg-hover)}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:var(--danger-hover)}.btn-sm{padding:6px 12px;font-size:13px;font-weight:500}.form-group{margin-bottom:16px}.form-group label{display:block;font-size:13px;color:var(--text-secondary);margin-bottom:5px}.form-group input,.form-input{width:100%;padding:10px 14px;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:16px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.form-group input::placeholder,.form-input::placeholder{color:var(--text-muted)}.form-group input:focus,.form-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.error-msg{color:var(--danger-fg);font-size:13px;margin-top:8px}.link-btn{background:none;border:none;color:var(--accent);cursor:pointer;font-size:13px;padding:0}.link-btn:hover{text-decoration:underline}.login-page{display:flex;align-items:center;justify-content:center;height:100%;padding:20px}.login-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:20px;padding:32px 28px;width:100%;max-width:380px;box-shadow:var(--shadow-soft)}.login-card h1{font-size:26px;letter-spacing:-.02em;margin-bottom:4px;color:var(--text-primary)}.login-card h1:before{content:"";display:block;width:46px;height:5px;border-radius:3px;margin-bottom:14px;background:linear-gradient(90deg,#2456b8 0,#2456b8 33.4%,#f4c33f 33.4%,#f4c33f 66.7%,#cf3d43 66.7%,#cf3d43)}.login-card p.subtitle{color:var(--text-muted);margin-bottom:24px;font-size:14px}.chat-page{display:flex;flex-direction:column;height:100%}.chat-page,.appearance-preview{position:relative}.chat-page:before,.appearance-preview:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background-image:linear-gradient(var(--scrim),var(--scrim)),var(--app-bg-image, none);background-size:cover;background-position:center;opacity:0;pointer-events:none;transition:opacity .3s ease}:root[data-wallpaper] .chat-page:before,:root[data-wallpaper] .appearance-preview:before{opacity:1}.chat-page>*,.appearance-preview>*{position:relative;z-index:1}.chat-header{position:relative;display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid var(--border);flex-shrink:0}.chat-header .mode-label{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.09em}.chat-header .mode-label:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent)}:root[data-theme=terracotta] .chat-header:after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;background-image:repeating-linear-gradient(90deg,var(--accent) 0 7px,transparent 7px 13px);opacity:.75;pointer-events:none}.new-session-btn{margin-left:auto;font-size:12px;background:transparent;border:1px solid var(--border);color:var(--text-secondary);border-radius:999px;padding:5px 12px}.new-session-btn:hover{color:var(--accent);border-color:var(--accent);background:transparent}.messages{flex:1;overflow-y:auto;padding:16px 14px 20px;display:flex;flex-direction:column;gap:10px;overscroll-behavior:contain}.message{max-width:85%;padding:10px 15px;border-radius:18px;font-size:15px;line-height:1.55;word-wrap:break-word;overflow-wrap:break-word;box-shadow:var(--shadow-soft);animation:msg-in .22s ease-out}@keyframes msg-in{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}.message-user{align-self:flex-end;background:var(--bubble-user-bg);color:var(--bubble-user-fg);border-bottom-right-radius:5px}.message-assistant{align-self:flex-start;background:var(--bubble-tutor-bg);color:var(--bubble-tutor-fg);border:1px solid var(--bubble-tutor-border);border-bottom-left-radius:5px}.message-user+.message-user{border-top-right-radius:8px;margin-top:-4px}.message-assistant+.message-assistant{border-top-left-radius:8px;margin-top:-4px}.message-system{align-self:center;background:none;border:none;box-shadow:none;color:var(--text-muted);font-size:13px;font-style:italic;text-align:center}.message code{font-family:Cascadia Code,Consolas,Monaco,monospace;font-size:.88em;background:#7d7d7d2e;padding:1px 5px;border-radius:5px}.speak-btn{display:inline-flex;align-items:center;justify-content:center;height:22px;min-width:30px;padding:0 8px;margin-left:6px;vertical-align:text-bottom;border:1px solid currentColor;border-radius:999px;background:transparent;color:inherit;cursor:pointer;opacity:.6;transition:opacity .15s ease,transform .12s ease}.speak-btn svg{width:12px;height:12px;display:block}.speak-btn:hover{opacity:1}.speak-btn:active{transform:scale(.92);opacity:1}.typing-indicator{align-self:flex-start;display:inline-flex;align-items:center;gap:5px;padding:14px 16px;background:var(--bubble-tutor-bg);border:1px solid var(--bubble-tutor-border);border-radius:18px 18px 18px 5px;color:var(--bubble-tutor-fg);box-shadow:var(--shadow-soft);animation:msg-in .22s ease-out}.typing-indicator span{width:7px;height:7px;border-radius:50%;background:currentColor;font-size:0;line-height:0;animation:typing-bounce 1.2s ease-in-out infinite}.typing-indicator span:nth-child(2){animation-delay:.15s}.typing-indicator span:nth-child(3){animation-delay:.3s}@keyframes typing-bounce{0%,55%,to{opacity:.35;transform:translateY(0)}25%{opacity:1;transform:translateY(-3px)}}.chat-input-area{display:flex;gap:8px;align-items:flex-end;padding:10px 12px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--border);flex-shrink:0}.chat-input-area textarea{flex:1;min-width:0;padding:10px 16px;background:var(--bg-input);border:1px solid var(--border);border-radius:21px;color:var(--text-primary);font-size:16px;line-height:1.4;resize:none;outline:none;min-height:42px;max-height:120px;transition:border-color .15s ease,box-shadow .15s ease}.chat-input-area textarea::placeholder{color:var(--text-muted)}.chat-input-area textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.chat-input-area textarea:disabled{opacity:.6}.lang-toggle{height:30px;padding:0 9px;margin-bottom:6px;border-radius:999px;border:1px solid var(--border);background:var(--bg-input);color:var(--accent);font-size:11.5px;font-weight:700;letter-spacing:.04em;cursor:pointer;min-width:34px;flex-shrink:0;transition:border-color .15s ease,background-color .15s ease}.lang-toggle:hover{border-color:var(--accent);background:var(--bg-card)}.mic-btn{width:42px;height:42px;border-radius:50%;border:1px solid var(--border);background:var(--bg-card);color:var(--text-secondary);font-size:19px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background-color .15s ease,color .15s ease,transform .12s ease}.mic-btn:active{transform:scale(.94)}.mic-btn.recording{background:var(--accent);color:var(--accent-fg);border-color:transparent;animation:pulse 1.5s infinite}.mic-btn.transcribing{background:var(--bg-card);color:var(--warning);border-color:var(--warning);cursor:wait}@keyframes pulse{0%{box-shadow:0 0 0 0 var(--accent-soft)}70%{box-shadow:0 0 0 12px transparent}to{box-shadow:0 0 0 0 transparent}}.send-btn{width:42px;height:42px;border-radius:50%;border:none;background:var(--accent);color:var(--accent-fg);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:var(--shadow-soft);transition:background-color .15s ease,transform .12s ease,opacity .15s ease}.send-btn svg{display:block}.send-btn:hover{background:var(--accent-hover)}.send-btn:active{transform:scale(.94)}.send-btn:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}.admin-page{padding:20px 16px calc(28px + env(safe-area-inset-bottom,0px));overflow-y:auto;height:100%}.admin-page h2{font-size:20px;letter-spacing:-.01em;margin-bottom:16px;color:var(--text-primary)}.admin-page h3{font-size:16px;margin:20px 0 10px}.admin-section,.appearance-section{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin-bottom:16px}.admin-section h3:first-child,.appearance-section h3:first-child{margin-top:0}.user-list{list-style:none}.user-list li{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--border);gap:8px}.user-list li:last-child{border-bottom:none}.user-info{flex:1;min-width:0}.user-info .username{font-weight:500}.user-info .role{font-size:12px;color:var(--text-muted);margin-left:8px}.user-actions{display:flex;gap:6px}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0}.toggle-switch{position:relative;width:44px;height:25px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;top:0;right:0;bottom:0;left:0;background:var(--border);border-radius:25px;transition:background-color .2s ease}.toggle-slider:before{content:"";position:absolute;height:19px;width:19px;left:3px;bottom:3px;background:#fff;border-radius:50%;box-shadow:0 1px 3px #0000004d;transition:transform .2s ease}.toggle-switch input:checked+.toggle-slider{background:var(--accent)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(19px)}.toggle-switch input:focus-visible+.toggle-slider{outline:2px solid var(--accent);outline-offset:2px}.create-user-form{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end}.create-user-form input{flex:1;min-width:120px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}.modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);width:100%;max-width:700px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 12px 40px #00000059}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid var(--border)}.modal-header h3{margin:0}.modal-body{flex:1;overflow-y:auto;padding:16px}.modal-body textarea{width:100%;min-height:200px;padding:12px;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:14px;font-family:Cascadia Code,Consolas,Monaco,monospace;resize:vertical;outline:none;line-height:1.5;transition:border-color .15s ease,box-shadow .15s ease}.modal-body textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.modal-footer{padding:12px 16px;border-top:1px solid var(--border);display:flex;gap:8px;justify-content:flex-end}.file-list{list-style:none}.file-list li{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0;border-bottom:1px solid var(--border);font-size:14px}.file-list li:last-child{border-bottom:none}.file-size{color:var(--text-muted);font-size:12px;margin-left:8px}.admin-chat{border:1px solid var(--border);border-radius:var(--radius-sm);margin-top:12px;overflow:hidden}.admin-chat .messages{max-height:300px;min-height:150px;padding:12px}.admin-chat .chat-input-area{padding:8px 12px}.tabs{display:flex;gap:2px;border-bottom:1px solid var(--border);margin-bottom:16px;overflow-x:auto}.tab{padding:8px 14px;background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:14px;font-weight:500;border-bottom:2px solid transparent;white-space:nowrap;margin-bottom:-1px;transition:color .15s ease,border-color .15s ease}.tab:hover{color:var(--text-primary)}.tab.active{color:var(--accent);border-bottom-color:var(--accent)}.flashcard-page,.quiz-page,.shadow-page{display:flex;flex-direction:column;height:100%}.card-container{flex:1;display:flex;align-items:center;justify-content:center;padding:20px}.flashcard{width:100%;max-width:400px;min-height:220px;background:var(--bg-card);border:1px solid var(--border);border-radius:20px;display:flex;align-items:center;justify-content:center;padding:32px;cursor:pointer;text-align:center;font-size:24px;line-height:1.4;box-shadow:var(--shadow-soft);transition:transform .3s ease;-webkit-user-select:none;user-select:none}.flashcard:hover{transform:scale(1.02)}.flashcard .hint{font-size:13px;color:var(--text-muted);margin-top:12px}.appearance-page{padding:20px 16px calc(28px + env(safe-area-inset-bottom,0px));overflow-y:auto;height:100%}.appearance-header{display:flex;align-items:baseline;gap:10px;margin-bottom:16px}.appearance-header h2{font-size:20px;letter-spacing:-.01em;color:var(--text-primary)}.save-status{margin-left:auto;font-size:12px;color:var(--text-muted);white-space:nowrap}.save-status.error{color:var(--danger-fg)}.section-note{font-size:13px;color:var(--text-muted);margin:2px 0 12px;line-height:1.45}.preset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.preset-card{border:2px solid var(--border);background:var(--bg-card);border-radius:var(--radius);padding:0;overflow:hidden;cursor:pointer;text-align:left;transition:border-color .15s ease,box-shadow .15s ease,transform .12s ease}.preset-card:active{transform:scale(.97)}.preset-card.selected{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.preset-swatch{display:flex;flex-direction:column;gap:5px;padding:10px 10px 8px;height:74px}.preset-mini{display:block;height:14px;border-radius:8px}.preset-mini-tutor{width:70%;border-bottom-left-radius:3px}.preset-mini-user{width:52%;align-self:flex-end;border-bottom-right-radius:3px}.preset-mini-accent{display:block;width:22px;height:6px;border-radius:3px;margin-top:auto}.preset-name{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:7px 11px 9px;font-size:13px;font-weight:600;color:var(--text-primary)}.preset-check{color:var(--accent);display:inline-flex}.preset-check svg{width:13px;height:13px;display:block}.pref-row{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--border)}.pref-row:last-child{border-bottom:none}.pref-label{flex:1;font-size:14px;min-width:0}.color-input{width:46px;height:34px;padding:0;border:1px solid var(--border);border-radius:9px;background:var(--bg-input);cursor:pointer;flex-shrink:0}.color-input::-webkit-color-swatch-wrapper{padding:3px}.color-input::-webkit-color-swatch{border:none;border-radius:6px}.color-input::-moz-color-swatch{border:none;border-radius:6px}.pref-reset{background:none;border:none;color:var(--text-muted);font-size:12px;padding:5px 8px;border-radius:6px;cursor:pointer;flex-shrink:0;transition:color .15s ease,background-color .15s ease}.pref-reset:hover{color:var(--accent);background:var(--accent-soft)}.bg-photo-row{display:flex;gap:12px;align-items:flex-start;margin-bottom:4px}.bg-thumb{width:74px;height:74px;object-fit:cover;border-radius:12px;border:1px solid var(--border);flex-shrink:0}.bg-photo-controls{flex:1;min-width:0}.bg-photo-buttons{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;align-items:center}.appearance-preview{display:flex;flex-direction:column;gap:9px;padding:16px 12px;border-radius:var(--radius);border:1px solid var(--border);background:var(--app-bg);overflow:hidden;transition:background-color .25s ease}.appearance-preview .message{animation:none}@media(max-width:600px){.navbar{padding-left:8px;padding-right:8px}.navbar a,.navbar button.nav-link{padding:7px 10px;font-size:13px}.message{max-width:88%}.admin-page{padding-left:12px;padding-right:12px}.modal{max-height:95vh}}@media(max-width:430px){.nav-user{display:none}}