*{margin:0;padding:0;box-sizing:border-box}body{margin:0;font-family:Segoe UI,Noto Sans KR,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{min-height:100vh}.header{background:linear-gradient(135deg,#3c3530,#4a4035);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:1rem 1.5rem;box-shadow:0 4px 20px #2c241626;border-bottom:2px solid var(--teacher-color);position:relative;z-index:100}.header:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0%,rgba(255,255,255,.03) 100%);pointer-events:none}.header-content{max-width:900px;margin:0 auto;display:flex;align-items:center;gap:1rem;position:relative;z-index:1}.back-button{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.15);border-radius:12px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;color:#f5f3ee;font-size:1.25rem}.back-button:hover{background:#fff3;transform:translate(-3px);box-shadow:0 4px 12px #00000026}.back-button:active{transform:translate(-1px) scale(.95)}.teacher-info{display:flex;align-items:center;gap:1rem;flex:1}.teacher-avatar{width:50px;height:50px;border-radius:50%;overflow:hidden;border:3px solid var(--teacher-color);box-shadow:0 4px 12px #0003;background:#fff;flex-shrink:0}.teacher-avatar-img{width:100%;height:100%;object-fit:cover}.teacher-details{flex:1;min-width:0}.teacher-name{font-size:1.5rem;font-weight:700;color:#f5f3ee;margin:0;letter-spacing:.5px;text-shadow:1px 1px 3px rgba(0,0,0,.2);display:flex;align-items:center;gap:.5rem}.teacher-title{font-size:.9rem;color:var(--teacher-color);margin:.25rem 0 0;font-weight:500;letter-spacing:1px}@media(max-width:768px){.header{padding:.75rem 1rem}.header-content{gap:.75rem}.back-button{width:36px;height:36px;font-size:1.1rem}.teacher-avatar{width:44px;height:44px;border-width:2px}.teacher-name{font-size:1.25rem}.teacher-title{font-size:.8rem}}@media(max-width:480px){.header{padding:.65rem .75rem}.header-content{gap:.65rem}.back-button{width:32px;height:32px;font-size:1rem;border-radius:10px}.teacher-avatar{width:40px;height:40px}.teacher-name{font-size:1.1rem}.teacher-title{font-size:.75rem;margin:.15rem 0 0}}.message-wrapper{display:flex;gap:1rem;margin-bottom:1.5rem;animation:slideIn .4s cubic-bezier(.4,0,.2,1)}.message-wrapper.user{flex-direction:row-reverse}.message-avatar{flex-shrink:0;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #2c241626;position:relative;overflow:hidden}.message-wrapper.user .message-avatar{background:linear-gradient(135deg,#5c5447,#3c3530);border:2px solid rgba(255,255,255,.2)}.message-wrapper.ai .message-avatar{background:#fff;border:3px solid var(--teacher-color, #D4AF37);box-shadow:0 4px 12px #2c241626}.avatar-icon{font-size:1.3rem;color:#f5f3ee;z-index:1}.avatar-image{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.message-wrapper.ai .message-avatar:hover .avatar-image{transform:scale(1.1)}.message-bubble{max-width:70%;padding:1rem 1.25rem;border-radius:1.25rem;box-shadow:0 4px 16px #2c241614;position:relative;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:all .3s ease}.message-bubble:hover{transform:translateY(-2px);box-shadow:0 6px 20px #2c24161f}.message-wrapper.user .message-bubble{background:linear-gradient(135deg,#5c5447,#4a4035);border-bottom-right-radius:.3rem;box-shadow:0 4px 16px #3c353040}.message-wrapper.ai .message-bubble{background:linear-gradient(135deg,#fffffff2,#faf9f6fa);border:1px solid rgba(212,175,55,.15);border-left:3px solid var(--teacher-color, #D4AF37);border-bottom-left-radius:.3rem;position:relative}.message-wrapper.ai .message-bubble:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0%,rgba(212,175,55,.02) 50%,transparent 100%);pointer-events:none;border-radius:inherit}.message-content{font-size:1rem;line-height:1.7;word-wrap:break-word;white-space:pre-wrap;position:relative;z-index:1}.message-wrapper.user .message-content{color:#f5f3ee;text-shadow:0 1px 2px rgba(0,0,0,.1)}.message-wrapper.ai .message-content{color:#2c2416}.typing-indicator{display:flex;gap:.5rem;padding:1rem;align-items:center}.typing-dot{width:8px;height:8px;border-radius:50%;background:var(--teacher-color, #D4AF37);animation:typing 1.4s infinite}@keyframes typing{0%,60%,to{transform:translateY(0);opacity:.7}30%{transform:translateY(-10px);opacity:1}}@media(max-width:768px){.message-wrapper{gap:.75rem;margin-bottom:1.25rem}.message-bubble{max-width:80%;padding:.85rem 1.1rem}.message-avatar{width:40px;height:40px}.avatar-icon{font-size:1.15rem}.message-content{font-size:.95rem;line-height:1.6}}@media(max-width:480px){.message-wrapper{gap:.6rem;margin-bottom:1rem}.message-bubble{max-width:82%;padding:.75rem 1rem;border-radius:1.1rem}.message-wrapper.user .message-bubble{border-bottom-right-radius:.25rem}.message-wrapper.ai .message-bubble{border-bottom-left-radius:.25rem;border-left-width:3px}.message-avatar{width:36px;height:36px}.message-wrapper.ai .message-avatar{border-width:2px}.avatar-icon{font-size:1rem}.message-content{font-size:.9rem;line-height:1.55}}.input-area{background:#ffffffe6;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-top:1px solid rgba(232,228,220,.8);padding:1.5rem;box-shadow:0 -4px 20px #2c24160f;position:relative}.input-area:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(212,175,55,.25),transparent)}.input-form{max-width:900px;margin:0 auto;display:flex;gap:.75rem;align-items:flex-end}.input-field{flex:1;padding:1rem 1.25rem;border:2px solid rgba(232,228,220,.8);border-radius:1.5rem;font-size:1rem;font-family:inherit;resize:none;max-height:120px;min-height:50px;transition:all .3s cubic-bezier(.4,0,.2,1);background:#faf9f6e6;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 2px 8px #2c24160a;color:#2c2416}.input-field:focus{outline:none;border-color:#8b735599;background:#fffffffa;box-shadow:0 4px 16px #8b73551f,0 0 0 3px #8b735514;transform:translateY(-1px)}.input-field:disabled{background:#f0eee8cc;cursor:not-allowed;opacity:.6}.input-field::placeholder{color:#a09080}.mic-button{min-width:50px;min-height:50px;width:50px;height:50px;border:none;border-radius:50%;background:linear-gradient(135deg,#d4af37,#e8c547);color:#3c3530;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #d4af3740;flex-shrink:0;position:relative;overflow:hidden}.mic-button:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.2) 0%,transparent 100%);opacity:0;transition:opacity .3s ease}.mic-button:hover:not(:disabled):before{opacity:1}.mic-button:hover:not(:disabled){transform:translateY(-3px) scale(1.05);box-shadow:0 6px 20px #d4af3766}.mic-button:active:not(:disabled){transform:translateY(-1px) scale(1.02)}.mic-button.listening{background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff;animation:pulse-mic 1.5s ease-in-out infinite}@keyframes pulse-mic{0%,to{box-shadow:0 4px 12px #e74c3c66;transform:scale(1)}50%{box-shadow:0 4px 24px #e74c3cb3;transform:scale(1.05)}}.mic-button:disabled{opacity:.4;cursor:not-allowed;transform:none}.mic-icon{font-size:1.3rem;position:relative;z-index:1}.send-button{min-width:50px;min-height:50px;width:50px;height:50px;border:none;border-radius:50%;background:linear-gradient(135deg,#4a4035,#5c5447);color:#f5f3ee;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px #3c353040;flex-shrink:0;position:relative;overflow:hidden}.send-button:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.15) 0%,transparent 100%);opacity:0;transition:opacity .3s ease}.send-button:hover:not(:disabled):before{opacity:1}.send-button:hover:not(:disabled){transform:translateY(-3px) scale(1.05);box-shadow:0 6px 20px #3c353059}.send-button:active:not(:disabled){transform:translateY(-1px) scale(1.02)}.send-button:disabled{opacity:.4;cursor:not-allowed;transform:none}.send-icon{font-size:1.3rem;position:relative;z-index:1}@media(max-width:768px){.input-area{padding:1rem}.input-form{gap:.6rem;max-width:100%}.input-field{padding:.85rem 1.1rem;font-size:.95rem;min-height:46px;border-radius:1.3rem}.mic-button,.send-button{min-width:46px;min-height:46px;width:46px;height:46px}.mic-icon,.send-icon{font-size:1.2rem}}@media(max-width:480px){.input-area{padding:.75rem .65rem}.input-form{gap:.5rem}.input-field{padding:.7rem 1rem;font-size:.9rem;min-height:44px;border-radius:1.2rem;border-width:1.5px}.mic-button,.send-button{min-width:44px;min-height:44px;width:44px;height:44px}.mic-icon,.send-icon{font-size:1.15rem}}.chat-container{display:flex;flex-direction:column;height:100%;background:transparent;position:relative;overflow:hidden}.messages-container{flex:1;overflow-y:auto;padding:2rem 1.5rem;scroll-behavior:smooth;position:relative;z-index:1}.messages-container::-webkit-scrollbar{width:8px}.messages-container::-webkit-scrollbar-track{background:#e8e4dc80;border-radius:4px}.messages-container::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#c4b59d,#a89880);border-radius:4px;transition:background .3s ease}.messages-container::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#a89880,#8b7355)}.messages-wrapper{max-width:900px;margin:0 auto;position:relative}.typing-indicator{display:flex;gap:.5rem;align-items:center;padding:1rem 1.25rem;margin-left:3.5rem;margin-bottom:1.5rem;background:#ffffffd9;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:1.25rem 1.25rem 1.25rem .3rem;box-shadow:0 4px 16px #2c241614;width:fit-content;animation:slideIn .4s cubic-bezier(.4,0,.2,1)}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.typing-dot{width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,#8b7355,#a89880);animation:typing 1.4s infinite ease-in-out}.typing-dot:nth-child(1){animation-delay:0s}.typing-dot:nth-child(2){animation-delay:.2s}.typing-dot:nth-child(3){animation-delay:.4s}@keyframes typing{0%,60%,to{transform:translateY(0);opacity:.5}30%{transform:translateY(-8px);opacity:1}}@media(max-width:768px){.messages-container{padding:1.5rem 1rem}.messages-wrapper{max-width:100%}.typing-indicator{margin-left:3rem;padding:.85rem 1.1rem;margin-bottom:1.25rem}.typing-dot{width:7px;height:7px}}@media(max-width:480px){.messages-container{padding:1rem .75rem}.typing-indicator{margin-left:2.5rem;padding:.75rem 1rem;margin-bottom:1rem;border-radius:1.1rem 1.1rem 1.1rem .25rem}.typing-dot{width:6px;height:6px}@keyframes typing{0%,60%,to{transform:translateY(0);opacity:.5}30%{transform:translateY(-6px);opacity:1}}}.landing-page{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:2rem;background:linear-gradient(135deg,#f5f3ee,#e8e4dc);position:relative;overflow-y:auto;overflow-x:hidden}.landing-page:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 20% 30%,rgba(212,175,55,.1) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(205,133,63,.1) 0%,transparent 50%);pointer-events:none}.landing-header{text-align:center;margin-bottom:3rem;z-index:1;animation:fadeInDown .8s ease-out}.landing-title{font-size:3rem;font-weight:700;color:#2c2416;margin-bottom:.5rem;text-shadow:2px 2px 4px rgba(0,0,0,.1);letter-spacing:.05em}.landing-subtitle{font-size:1.5rem;color:#5c5447;font-weight:300;letter-spacing:.03em}.teachers-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:2rem;max-width:1200px;width:100%;z-index:1;margin-bottom:2rem}.teacher-card{background:#fff;border-radius:20px;padding:2.5rem 2rem;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 10px 30px #00000014;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;animation:fadeInUp .8s ease-out backwards}.teacher-card:nth-child(1){animation-delay:.1s}.teacher-card:nth-child(2){animation-delay:.2s}.teacher-card:nth-child(3){animation-delay:.3s}.teacher-card:before{content:"";position:absolute;top:0;left:0;right:0;height:5px;background:var(--card-color);transform:scaleX(0);transition:transform .4s ease;transform-origin:left}.teacher-card:hover:before{transform:scaleX(1)}.teacher-card:hover{transform:translateY(-10px);box-shadow:0 20px 40px #00000026}.teacher-image-container{width:120px;height:120px;margin-bottom:1.5rem;border-radius:20%;overflow:hidden;border:4px solid var(--card-color);box-shadow:0 4px 12px #00000026;transition:all .4s ease}.teacher-image{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}.teacher-card:hover .teacher-image-container{transform:scale(1.1);box-shadow:0 8px 20px #00000040}.teacher-card:hover .teacher-image{transform:scale(1.1)}.teacher-name{font-size:2rem;font-weight:700;color:#2c2416;margin-bottom:.25rem;transition:color .3s ease}.teacher-card:hover .teacher-name{color:var(--card-color)}.teacher-title{font-size:1rem;color:var(--card-color);font-weight:600;margin-bottom:1rem;letter-spacing:.05em}.teacher-description{font-size:.95rem;color:#5c5447;margin-bottom:1.5rem;line-height:1.6}.teacher-quote{background:linear-gradient(135deg,#faf9f6,#f0ede6);border-left:3px solid var(--card-color);padding:1rem 1.5rem;border-radius:10px;margin-bottom:1.5rem;position:relative;width:100%}.teacher-quote p{font-size:.9rem;color:#3c3530;font-style:italic;line-height:1.6;margin:0}.quote-mark{color:var(--card-color);font-size:1.5rem;font-weight:700;opacity:.3}.teacher-action{display:flex;align-items:center;gap:.5rem;color:var(--card-color);font-weight:600;font-size:1rem;margin-top:auto;transition:gap .3s ease}.teacher-card:hover .teacher-action{gap:1rem}.arrow{transition:transform .3s ease}.teacher-card:hover .arrow{transform:translate(5px)}.landing-footer{text-align:center;color:#5c5447;font-size:.95rem;margin-top:2rem;z-index:1;animation:fadeIn 1s ease-out .5s backwards}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media(max-width:768px){.landing-page{padding:1.5rem 1rem 3rem;min-height:100vh;height:auto}.landing-header{margin-bottom:2rem;margin-top:1rem}.landing-title{font-size:2rem}.landing-subtitle{font-size:1.2rem}.teachers-grid{grid-template-columns:1fr;gap:1.5rem;margin-bottom:3rem}.teacher-card{padding:2rem 1.5rem}.teacher-image-container{width:100px;height:100px}.teacher-name{font-size:1.5rem}.landing-footer{margin-top:1.5rem;margin-bottom:2rem}}@media(max-width:480px){.landing-page{padding:1.25rem .75rem 3rem}.landing-header{margin-bottom:1.5rem;margin-top:.5rem}.landing-title{font-size:1.75rem}.landing-subtitle{font-size:1rem}.teachers-grid{gap:1.25rem;margin-bottom:2.5rem}.teacher-card{padding:1.5rem 1rem}.teacher-image-container{width:90px;height:90px;border-width:3px}.teacher-name{font-size:1.3rem}.teacher-description,.teacher-quote p{font-size:.85rem}.landing-footer{margin-top:1rem;margin-bottom:1.5rem;padding-bottom:1rem}}.app{min-height:100vh;height:100vh;display:flex;flex-direction:column;font-family:Segoe UI,Noto Sans KR,-apple-system,BlinkMacSystemFont,sans-serif;background:linear-gradient(135deg,#f5f3ee,#e8e4dc);overflow:hidden;position:relative}.app:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 10% 20%,rgba(212,175,55,.08) 0%,transparent 40%),radial-gradient(circle at 90% 80%,rgba(205,133,63,.08) 0%,transparent 40%);pointer-events:none;z-index:0}.main-content{display:flex;flex:1;overflow:hidden;position:relative;z-index:1}.chat-section{flex:1;display:flex;flex-direction:column;overflow:hidden}@media(max-width:768px){.app{min-height:100vh;height:100vh;overflow:hidden}.main-content{flex-direction:column;height:100%}.chat-section{flex:1;min-height:0}}@media(max-width:480px){.app{min-height:100dvh;height:100dvh}}
