@import"https://fonts.googleapis.com/css2?family=Manrope:wght@500;700;800&family=Noto+Sans+SC:wght@400;500;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}:root{--accent: #d2b13f;--accent-secondary: #8ed4c3;--accent-pink: #d3be73;--accent-lime: #0b6a58;--accent-gold: #e1bf53;--surface: rgba(255,255,255,.05);--surface-strong: rgba(255,255,255,.09);--surface-border: rgba(255,255,255,.09);--text-primary: #f6f0df;--text-secondary: rgba(228,232,224,.72);--text-muted: rgba(206,211,202,.48);--radius-card: 24px;--radius-btn: 18px;--transition-fast: .18s cubic-bezier(.16, 1, .3, 1);--transition-smooth: .32s cubic-bezier(.16, 1, .3, 1);--brand-gold: #e1bf53;--brand-green: #0b6a58;--brand-teal: #8ed4c3;--spinner-track: rgba(255,255,255,.1);--spinner-accent: #d6b74f;--app-body-bg: #0b0f0c;--app-shell-gradient: linear-gradient(180deg, #0a0e0c 0%, #0c110e 52%, #0c110f 100%);--bg-layer-gradient: radial-gradient(circle at 18% 8%, rgba(225,191,83,.1), transparent 20%), radial-gradient(circle at 86% 12%, rgba(142,212,195,.1), transparent 18%), radial-gradient(circle at 28% 92%, rgba(11,106,88,.18), transparent 28%), linear-gradient(180deg, rgba(10,14,12,.98) 0%, rgba(11,15,13,.99) 100%);--bg-pattern-a: rgba(225,191,83,.07);--bg-pattern-b: rgba(142,212,195,.06);--tabbar-bg: linear-gradient(180deg, rgba(12,15,13,.96), rgba(10,13,11,.98));--tabbar-border: rgba(225,191,83,.1);--tab-icon: rgba(239,232,216,.45);--tab-label: rgba(239,232,216,.48);--tab-active-surface: linear-gradient(180deg, rgba(14,106,88,.36), rgba(14,106,88,.18));--tab-active-border: rgba(142,212,195,.18);--tab-active-shadow: rgba(142,212,195,.16);--button-primary-start: #0f8c73;--button-primary-mid: #0a6a58;--button-primary-end: #06493e;--button-primary-shadow: rgba(6,73,62,.28);--input-bg: rgba(255,255,255,.03);--input-border: rgba(255,255,255,.06);--input-focus-border: rgba(142,212,195,.24);--input-focus-bg: rgba(255,255,255,.05);--home-card-bg: linear-gradient(180deg, rgba(12,43,35,.98), rgba(7,35,29,.96));--home-card-border: rgba(142,212,195,.16);--home-card-shadow: rgba(0,0,0,.24);--home-title-color: #8ed4c3;--home-subtitle-color: rgba(239,232,216,.72);--profile-hero-bg: radial-gradient(circle at 50% -10%, rgba(255,255,255,.06), transparent 36%), radial-gradient(circle at top, rgba(225,191,83,.08), transparent 36%), linear-gradient(180deg, rgba(5,18,14,.98), rgba(7,14,12,.98));--profile-hero-border: rgba(225,191,83,.34);--profile-card-bg: linear-gradient(180deg, rgba(37,38,33,.92), rgba(31,32,28,.96));--profile-card-border: rgba(225,191,83,.1);--profile-card-text: #f1cd4f;--profile-secondary-text: rgba(239,232,216,.72);--settings-surface: rgba(255,255,255,.03);--settings-border: rgba(225,191,83,.1);--settings-chip-bg: rgba(255,255,255,.04);--settings-chip-active-bg: linear-gradient(135deg, rgba(225,191,83,.22), rgba(142,212,195,.18));--settings-chip-active-text: #f6f0df;--settings-chip-text: rgba(247,236,207,.88);--login-logo-bg: linear-gradient(180deg, #157f6b, #0b6a58 60%, #075346);--login-logo-shadow: rgba(8,56,47,.28);--login-card-bg: linear-gradient(180deg, rgba(24,39,34,.92), rgba(13,24,21,.94));--login-card-border: rgba(142,212,195,.08);--login-support-text: #8ed4c3;--word-shell-bg: linear-gradient(180deg, rgba(7,16,13,.98), rgba(10,20,17,.96));--word-shell-border: rgba(142,212,195,.14);--word-stage-bg: linear-gradient(180deg, rgba(4,49,40,1), rgba(2,41,33,.98));--word-stage-border: rgba(16,114,95,.56);--word-stage-title: #f4f0e7;--word-stage-subtitle: rgba(255,223,120,.92);--word-stage-khmer: rgba(183,222,210,.92);--word-speaker-bg: linear-gradient(180deg, #2a433a, #202b27);--word-speaker-border: rgba(225,191,83,.18);--word-speaker-icon: #8ed4c3;--example-card-bg: linear-gradient(180deg, rgba(20,24,22,.96), rgba(24,28,25,.98));--example-card-border: rgba(225,191,83,.08);--example-text-main: #f4f0e7;--example-text-sub: rgba(214,232,225,.82);--quiz-panel-bg-start: rgba(20,23,21,.98);--quiz-panel-bg-end: rgba(23,26,24,.96);--quiz-panel-border: rgba(225,191,83,.12);--quiz-answer-bg: linear-gradient(180deg, rgba(9,106,88,.92), rgba(8,87,73,.96));--quiz-answer-bg-idle: linear-gradient(180deg, rgba(38,39,34,.96), rgba(33,34,30,.98));--quiz-answer-border: rgba(142,212,195,.22);--dialog-shell-bg: transparent;--dialog-chip-bg: rgba(39,39,34,.84);--dialog-chip-text: rgba(236,226,199,.76);--dialog-assistant-bubble: linear-gradient(180deg, rgba(6,96,80,.98), rgba(6,87,72,.98));--dialog-assistant-text: #f6f2e8;--dialog-assistant-translation: rgba(184,226,214,.84);--dialog-user-bubble: linear-gradient(180deg, #f3cf57, #e6bc3d);--dialog-user-text: #20423b;--dialog-user-translation: rgba(32,66,59,.72);--dialog-composer-bg: rgba(17,22,20,.94);--dialog-record-bg: linear-gradient(180deg, #0f8c73, #0b6a58);--dialog-record-bg-active: linear-gradient(180deg, #e2b531, #c99a19);--dialog-record-text: #f7f1e3}:root[data-theme=light]{--accent: #c7a132;--accent-secondary: #0b6a58;--accent-pink: #c7a132;--accent-lime: #0b6a58;--accent-gold: #c7a132;--surface: rgba(18,39,102,.05);--surface-strong: rgba(18,39,102,.09);--surface-border: rgba(39,72,151,.09);--text-primary: #143f37;--text-secondary: rgba(20,63,55,.76);--text-muted: rgba(20,63,55,.46);--brand-gold: #d2aa36;--brand-green: #0b6a58;--brand-teal: #7ccfc0;--spinner-track: rgba(20,63,55,.12);--spinner-accent: #c7a132;--app-body-bg: #faf7f0;--app-shell-gradient: linear-gradient(180deg, #fcfaf4 0%, #f8f4ec 58%, #f8f3ea 100%);--bg-layer-gradient: radial-gradient(circle at 12% 10%, rgba(210,170,54,.16), transparent 24%), radial-gradient(circle at 84% 16%, rgba(11,106,88,.1), transparent 20%), radial-gradient(circle at 18% 82%, rgba(124,207,192,.12), transparent 26%), linear-gradient(180deg, rgba(252,250,244,.98) 0%, rgba(248,244,236,.96) 100%);--bg-pattern-a: rgba(20,63,55,.06);--bg-pattern-b: rgba(210,170,54,.06);--tabbar-bg: linear-gradient(180deg, rgba(255,253,248,.96), rgba(248,244,236,.98));--tabbar-border: rgba(20,63,55,.08);--tab-icon: rgba(20,63,55,.44);--tab-label: rgba(20,63,55,.5);--tab-active-surface: linear-gradient(180deg, rgba(11,106,88,.16), rgba(11,106,88,.08));--tab-active-border: rgba(11,106,88,.14);--tab-active-shadow: rgba(11,106,88,.08);--button-primary-start: #0d7f69;--button-primary-mid: #0b6a58;--button-primary-end: #075346;--button-primary-shadow: rgba(11,106,88,.16);--input-bg: rgba(255,255,255,.86);--input-border: rgba(20,63,55,.08);--input-focus-border: rgba(11,106,88,.2);--input-focus-bg: rgba(255,255,255,.98);--home-card-bg: linear-gradient(180deg, rgba(255,255,255,.96), rgba(250,247,240,.98));--home-card-border: rgba(20,63,55,.08);--home-card-shadow: rgba(20,63,55,.06);--home-title-color: #0b6a58;--home-subtitle-color: rgba(20,63,55,.68);--profile-hero-bg: radial-gradient(circle at 50% -10%, rgba(255,255,255,.72), transparent 36%), radial-gradient(circle at top, rgba(210,170,54,.1), transparent 36%), linear-gradient(180deg, rgba(253,250,244,.96), rgba(248,244,236,.96));--profile-hero-border: rgba(210,170,54,.24);--profile-card-bg: linear-gradient(180deg, rgba(255,255,255,.96), rgba(249,246,240,.98));--profile-card-border: rgba(20,63,55,.08);--profile-card-text: #0b6a58;--profile-secondary-text: rgba(20,63,55,.68);--settings-surface: rgba(255,255,255,.82);--settings-border: rgba(20,63,55,.08);--settings-chip-bg: rgba(20,63,55,.05);--settings-chip-active-bg: linear-gradient(135deg, rgba(210,170,54,.26), rgba(11,106,88,.16));--settings-chip-active-text: #143f37;--settings-chip-text: rgba(20,63,55,.82);--login-logo-bg: linear-gradient(180deg, #0b6a58, #075346);--login-logo-shadow: rgba(11,106,88,.16);--login-card-bg: linear-gradient(180deg, rgba(255,255,255,.92), rgba(251,248,242,.96));--login-card-border: rgba(20,63,55,.06);--login-support-text: #0b6a58;--word-shell-bg: linear-gradient(180deg, rgba(255,255,255,.98), rgba(252,249,244,.96));--word-shell-border: rgba(20,63,55,.08);--word-stage-bg: linear-gradient(180deg, rgba(255,255,255,1), rgba(252,248,241,.98));--word-stage-border: rgba(20,63,55,.08);--word-stage-title: #0b6a58;--word-stage-subtitle: rgba(199,161,50,.96);--word-stage-khmer: rgba(20,63,55,.78);--word-speaker-bg: linear-gradient(180deg, #ffffff, #f6f1e7);--word-speaker-border: rgba(199,161,50,.22);--word-speaker-icon: #0b6a58;--example-card-bg: linear-gradient(180deg, rgba(255,255,255,.96), rgba(249,246,240,.98));--example-card-border: rgba(20,63,55,.08);--example-text-main: #1d2a26;--example-text-sub: rgba(20,63,55,.72);--quiz-panel-bg-start: rgba(255,255,255,.96);--quiz-panel-bg-end: rgba(249,246,240,.98);--quiz-panel-border: rgba(20,63,55,.08);--quiz-answer-bg: linear-gradient(180deg, rgba(9,122,102,.98), rgba(7,107,89,.98));--quiz-answer-bg-idle: linear-gradient(180deg, rgba(255,255,255,.96), rgba(247,243,236,.98));--quiz-answer-border: rgba(11,106,88,.1);--dialog-shell-bg: transparent;--dialog-chip-bg: rgba(255,255,255,.72);--dialog-chip-text: rgba(119,105,72,.76);--dialog-assistant-bubble: linear-gradient(180deg, rgba(9,106,88,.98), rgba(7,98,81,.98));--dialog-assistant-text: #f7f2e8;--dialog-assistant-translation: rgba(199,235,224,.86);--dialog-user-bubble: linear-gradient(180deg, #f6d35b, #ecc441);--dialog-user-text: #20423b;--dialog-user-translation: rgba(32,66,59,.72);--dialog-composer-bg: rgba(255,255,255,.92);--dialog-record-bg: linear-gradient(180deg, #0d7f69, #0b6a58);--dialog-record-bg-active: linear-gradient(180deg, #f0c940, #d9ac25);--dialog-record-text: #fffef9}html,body,#root{width:100%;height:100%;overflow:hidden}body{font-family:Manrope,Noto Sans SC,sans-serif;background:var(--app-body-bg);color:var(--text-primary);-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app-container{width:100%;height:100%;max-width:480px;margin:0 auto;position:relative;overflow:hidden;background:var(--app-shell-gradient)}.bg-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none}.bg-gradient{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--bg-layer-gradient)}.bg-gradient:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(circle at 24px 24px,var(--bg-pattern-a) 0 2px,transparent 2.5px),radial-gradient(circle at 72px 72px,var(--bg-pattern-b) 0 1.5px,transparent 2px);background-size:96px 96px;opacity:.38}.blob{position:absolute;border-radius:50%;filter:blur(56px);will-change:transform}.blob-1{width:260px;height:260px;top:-90px;left:-70px;background:radial-gradient(circle,rgba(245,216,143,.18) 0%,transparent 68%);animation:blobFloat1 22s ease-in-out infinite}.blob-2{width:240px;height:240px;top:160px;right:-70px;background:radial-gradient(circle,rgba(245,216,143,.14) 0%,transparent 68%);animation:blobFloat2 24s ease-in-out infinite}.blob-3{width:200px;height:200px;bottom:70px;left:20px;background:radial-gradient(circle,rgba(36,74,157,.18) 0%,transparent 68%);animation:blobFloat3 24s ease-in-out infinite}@keyframes blobFloat1{0%,to{transform:translate(0) scale(1)}50%{transform:translate(26px,18px) scale(1.04)}}@keyframes blobFloat2{0%,to{transform:translate(0) scale(1)}50%{transform:translate(-20px,-22px) scale(.98)}}@keyframes blobFloat3{0%,to{transform:translate(0) scale(1)}50%{transform:translate(20px,-18px) scale(1.03)}}.page-content{position:relative;z-index:1;width:100%;height:calc(100vh - 68px - env(safe-area-inset-bottom,0px));height:calc(100dvh - 68px - env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;overflow:hidden}.temple-deco{position:absolute;top:0;left:0;right:0;height:100%;pointer-events:none;z-index:0;overflow:hidden}.temple-deco:before{content:"";position:absolute;top:-8px;left:-10px;right:-10px;height:72px;background-repeat:repeat-x;background-size:120px 72px;background-position:center top;opacity:.22;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='72' viewBox='0 0 120 72'%3E%3Cpath d='M60 4l4 14h8l2 10h4l2 8h6l4 12H30l4-12h6l2-8h4l2-10h8L60 4z' fill='rgba(245,216,143,0.7)'/%3E%3Cpath d='M20 48l2-8h4l2-10h3l2-8 3 8h3l2 10h4l2 8' fill='none' stroke='rgba(245,216,143,0.5)' stroke-width='1'/%3E%3Cpath d='M100 48l2-8h4l2-10h3l2-8 3 8h3l2 10h4l2 8' fill='none' stroke='rgba(245,216,143,0.5)' stroke-width='1'/%3E%3Cpath d='M0 70h120' stroke='rgba(245,216,143,0.3)' stroke-width='1.5'/%3E%3C/svg%3E")}.temple-deco:after{content:"";position:absolute;bottom:0;left:0;right:0;height:60px;background-repeat:repeat-x;background-size:120px 60px;background-position:center bottom;opacity:.14;transform:scaleY(-1);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='60' viewBox='0 0 120 60'%3E%3Cpath d='M60 4l4 12h8l2 8h4l2 6h6l4 10H30l4-10h6l2-6h4l2-8h8L60 4z' fill='rgba(245,216,143,0.5)'/%3E%3C/svg%3E")}.tabbar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;min-height:68px;height:calc(68px + env(safe-area-inset-bottom,0px));background:var(--tabbar-bg);backdrop-filter:blur(28px) saturate(1.35);-webkit-backdrop-filter:blur(28px) saturate(1.35);border-top:1.5px solid var(--tabbar-border);display:flex;align-items:flex-start;justify-content:space-around;padding:10px 8px calc(8px + env(safe-area-inset-bottom,0px));z-index:50}.tab{display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;width:72px;transition:transform var(--transition-fast)}.tab:active{transform:scale(.92)}.tab-ic{width:44px;height:34px;display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--tab-icon);position:relative;transition:color var(--transition-smooth),transform var(--transition-fast);border-radius:14px}.tab-ic.active{color:var(--text-primary);transform:translateY(-2px)}.tab-ic.active:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--tab-active-surface);border:1px solid var(--tab-active-border);border-radius:14px;box-shadow:0 10px 20px var(--tab-active-shadow)}.tab-lbl{font-size:9px;color:var(--tab-label);transition:color var(--transition-smooth);font-weight:700;letter-spacing:.02em}.tab-lbl.active{color:var(--text-primary)}.btn-grad{width:100%;padding:16px;background:linear-gradient(180deg,var(--button-primary-start) 0%,var(--button-primary-mid) 44%,var(--button-primary-end) 100%);border:none;border-radius:var(--radius-btn);color:#fff;font-size:15px;font-weight:800;cursor:pointer;font-family:Manrope,Noto Sans SC,sans-serif;box-shadow:0 18px 32px var(--button-primary-shadow);transition:transform .15s ease,box-shadow .15s ease,opacity .15s ease}.btn-grad:active{transform:scale(.98);box-shadow:0 8px 18px var(--button-primary-shadow);opacity:.95}.input-box{display:flex;align-items:center;background:var(--input-bg);border:1px solid var(--input-border);border-radius:16px;padding:14px 18px;gap:10px;width:100%;transition:border-color var(--transition-smooth),background var(--transition-smooth),box-shadow var(--transition-smooth)}.input-box:focus-within{border-color:var(--input-focus-border);background:var(--input-focus-bg);box-shadow:0 0 0 3px #d8b45c1a}.input-box i{color:#fff6;font-size:15px}:root[data-theme=light] .input-box i{color:#18346f66}.input-box input{background:none;border:none;outline:none;color:var(--text-primary);font-size:14px;flex:1;letter-spacing:.06em;font-family:Manrope,Noto Sans SC,sans-serif}.input-box input::placeholder{color:var(--text-muted);font-size:12px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}@keyframes floatUp{0%{opacity:0;transform:translateY(32px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .32s ease}.animate-fade-in-up{animation:fadeInUp .42s cubic-bezier(.22,1,.36,1)}.animate-scale-in{animation:scaleIn .3s cubic-bezier(.22,1,.36,1)}.animate-pop-in{animation:scaleIn .36s cubic-bezier(.16,1,.3,1)}.animate-float-up{animation:floatUp .44s cubic-bezier(.22,1,.36,1)}.stagger-1{animation-delay:.05s;animation-fill-mode:both}.stagger-2{animation-delay:.1s;animation-fill-mode:both}.stagger-3{animation-delay:.15s;animation-fill-mode:both}.stagger-4{animation-delay:.2s;animation-fill-mode:both}.stagger-5{animation-delay:.25s;animation-fill-mode:both}.stagger-6{animation-delay:.3s;animation-fill-mode:both}.page-enter{animation:pageEnter .34s cubic-bezier(.22,1,.36,1)}@keyframes pageEnter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.loading-shimmer{background:linear-gradient(90deg,#ffffff0a 25%,#ffffff17,#ffffff0a 75%);background-size:200% 100%;animation:shimmer 1.8s infinite;border-radius:12px}:root[data-theme=light] .loading-shimmer{background:linear-gradient(90deg,#18346f0a 25%,#18346f17,#18346f0a 75%)}
