@import"https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap";*{box-sizing:border-box;margin:0;padding:0}:root{font-family:system-ui,-apple-system,Segoe UI,Apple SD Gothic Neo,Noto Sans KR,sans-serif;line-height:1.5;font-weight:400;--color-main-green: #203C2E;--color-dark-gray: #282828;--color-brown: #96773D;--color-pale-green: #C7D8B7;--color-beige: #E3D9BD;--color-pale-yellow: #FBF7BE;--color-chart-up: #DC0000;--color-chart-down: #0046B4;--color-quiz-yellow: #FADB13;--color-white: #FFFFFF;--color-black: #000000;--color-background: #F8F8F8;--spacing-0: 0px;--spacing-1: 4px;--spacing-2: 8px;--spacing-3: 12px;--spacing-4: 16px;--spacing-5: 20px;--spacing-6: 24px;--spacing-7: 28px;--spacing-8: 32px;--spacing-10: 40px;--spacing-12: 48px;--spacing-16: 64px;--spacing-20: 80px;--font-size-xs: 12px;--font-size-sm: 14px;--font-size-base: 16px;--font-size-lg: 18px;--font-size-xl: 20px;--font-size-2xl: 24px;--font-size-3xl: 28px;--font-size-4xl: 32px;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.75}body{margin:0;min-width:320px;min-height:100vh;background-color:var(--color-background);color:var(--color-dark-gray)}#root{width:100%;min-height:100vh}.container-content{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--spacing-4)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:var(--color-brown);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-dark-gray)}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;border:none;background:none}img{max-width:100%;height:auto}.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-2);font-family:inherit;font-weight:var(--font-weight-medium);border:none;border-radius:4px;cursor:pointer;transition:all .2s;white-space:nowrap}.button:focus-visible{outline:2px solid var(--color-main-green);outline-offset:2px}.button:disabled{cursor:not-allowed;opacity:.5}.button-primary{background-color:var(--color-main-green);color:var(--color-white)}.button-primary:hover:not(:disabled){background-color:var(--color-brown)}.button-primary:active:not(:disabled){background-color:var(--color-dark-gray)}.button-secondary{background-color:var(--color-white);color:var(--color-main-green);border:1px solid var(--color-main-green)}.button-secondary:hover:not(:disabled){background-color:var(--color-pale-green)}.button-secondary:active:not(:disabled){background-color:var(--color-beige)}.button-danger{background-color:var(--color-chart-up);color:var(--color-white)}.button-danger:hover:not(:disabled){background-color:#b00000}.button-danger:active:not(:disabled){background-color:#8a0000}.button-small{padding:var(--spacing-1) var(--spacing-3);font-size:var(--font-size-sm)}.button-medium{padding:var(--spacing-2) var(--spacing-4);font-size:var(--font-size-base)}.button-large{padding:var(--spacing-3) var(--spacing-6);font-size:var(--font-size-lg)}.button-full-width{width:100%}.button-loading{position:relative;color:transparent}.button-spinner{position:absolute;width:16px;height:16px;border:2px solid transparent;border-top-color:currentColor;border-radius:50%;animation:button-spin .6s linear infinite}@keyframes button-spin{to{transform:rotate(360deg)}}.input-wrapper{display:flex;flex-direction:column;gap:var(--spacing-1)}.input-full-width{width:100%}.input-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-dark-gray)}.input{width:100%;padding:var(--spacing-2) var(--spacing-3);font-family:inherit;font-size:var(--font-size-base);color:var(--color-dark-gray);background-color:var(--color-white);border:1px solid #d1d5db;border-radius:4px;transition:all .2s}.input::placeholder{color:#9ca3af}.input:hover:not(:disabled){border-color:var(--color-main-green)}.input:focus{outline:none;border-color:var(--color-main-green);box-shadow:0 0 0 3px #203c2e1a}.input:disabled{background-color:var(--color-background);cursor:not-allowed;opacity:.6}.input-error{border-color:var(--color-chart-up)}.input-error:focus{border-color:var(--color-chart-up);box-shadow:0 0 0 3px #dc00001a}.input-error-message{font-size:var(--font-size-sm);color:var(--color-chart-up)}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.input-password-wrapper{position:relative}.input-password-toggle{position:absolute;right:var(--spacing-2);top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;padding:var(--spacing-1);color:var(--color-dark-gray)}.input-password-toggle:hover{color:var(--color-main-green)}.card{background-color:var(--color-white);border:1px solid #e5e5e5;border-radius:8px;transition:all .2s}.card-padding-small{padding:var(--spacing-3)}.card-padding-medium{padding:var(--spacing-4)}.card-padding-large{padding:var(--spacing-6)}.card-hoverable{cursor:default}.card-hoverable:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.card-clickable{cursor:pointer}.card-clickable:hover{border-color:var(--color-main-green)}.card-clickable:active{transform:scale(.98)}.card-hoverable.card-clickable:hover{box-shadow:0 6px 16px #00000026;border-color:var(--color-main-green)}@media(max-width:768px){.card-padding-medium{padding:var(--spacing-3)}.card-padding-large{padding:var(--spacing-4)}}.modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:modal-fade-in .2s ease-out}@keyframes modal-fade-in{0%{opacity:0}to{opacity:1}}.modal-content{background-color:var(--color-white);border-radius:8px;width:90%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a;animation:modal-slide-up .2s ease-out}.modal-content--overflow{overflow:visible}@keyframes modal-slide-up{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4) var(--spacing-5);border-bottom:1px solid #e5e5e5}.modal-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin:0}.modal-close{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:none;background:none;cursor:pointer;font-size:var(--font-size-2xl);color:var(--color-dark-gray);border-radius:4px;transition:background-color .2s}.modal-close:hover{background-color:var(--color-background)}.modal-body{padding:var(--spacing-5)}.modal-body--overflow{overflow:visible}@media(max-width:768px){.modal-content{width:95%;max-width:none}.modal-header{padding:var(--spacing-3) var(--spacing-4)}.modal-body{padding:var(--spacing-4)}}.loading-fullscreen{position:fixed;inset:0;background-color:#ffffffe6;display:flex;align-items:center;justify-content:center;z-index:9999}.loading-spinner{border-radius:50%;border-style:solid;border-color:var(--color-pale-green) var(--color-pale-green) var(--color-pale-green) var(--color-main-green);animation:loading-spin .8s linear infinite}.loading-spinner-small{width:20px;height:20px;border-width:2px}.loading-spinner-medium{width:40px;height:40px;border-width:4px}.loading-spinner-large{width:60px;height:60px;border-width:6px}@keyframes loading-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.common-toast{position:fixed;top:80px;right:20px;display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-3) var(--spacing-4);border-radius:8px;box-shadow:0 4px 12px #00000026;z-index:10000;animation:common-toast-slide-in .3s ease-out;min-width:250px;max-width:400px}@keyframes common-toast-slide-in{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.common-toast-icon{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold)}.common-toast-message{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);flex:1}.common-toast-success{background-color:#10b981;color:var(--color-white)}.common-toast-success .common-toast-icon{color:var(--color-white)}.common-toast-error{background-color:var(--color-chart-up);color:var(--color-white)}.common-toast-error .common-toast-icon{color:var(--color-white)}.common-toast-warning{background-color:#f59e0b;color:var(--color-white)}.common-toast-warning .common-toast-icon{color:var(--color-white)}.common-toast-info{background-color:var(--color-chart-down);color:var(--color-white)}.common-toast-info .common-toast-icon{color:var(--color-white)}@media(max-width:768px){.common-toast{top:70px;right:10px;left:10px;max-width:none}}.dropdown{position:relative;width:100%}.dropdown-button{width:100%;display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-2) var(--spacing-3);background-color:var(--color-white);border:1px solid #d1d5db;border-radius:4px;font-size:var(--font-size-base);color:var(--color-dark-gray);cursor:pointer;transition:all .2s}.dropdown-button:hover:not(:disabled){border-color:var(--color-main-green)}.dropdown-button:focus{outline:none;border-color:var(--color-main-green);box-shadow:0 0 0 3px #203c2e1a}.dropdown-button:disabled{background-color:var(--color-background);cursor:not-allowed;opacity:.6}.dropdown-button-text{flex:1;text-align:left}.dropdown-arrow{font-size:var(--font-size-xs);transition:transform .2s}.dropdown-arrow-open{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:calc(100% + 4px);left:0;right:0;background-color:var(--color-white);border:1px solid #d1d5db;border-radius:4px;box-shadow:0 4px 12px #0000001a;max-height:240px;overflow-y:auto;z-index:1000;animation:dropdown-slide-down .2s ease-out}@keyframes dropdown-slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{width:100%;padding:var(--spacing-2) var(--spacing-3);background:none;border:none;text-align:left;font-size:var(--font-size-base);color:var(--color-dark-gray);cursor:pointer;transition:background-color .2s}.dropdown-item:hover{background-color:var(--color-pale-green)}.dropdown-item-selected{background-color:var(--color-beige);font-weight:var(--font-weight-medium);color:var(--color-main-green)}.dropdown-disabled{opacity:.6;pointer-events:none}.animated-number{display:inline-block;position:relative;overflow:hidden;vertical-align:baseline}.animated-number__value{display:inline-block;transition:transform var(--animation-duration, .3s) cubic-bezier(.4,0,.2,1),opacity var(--animation-duration, .3s) ease}.animated-number__value--up{animation:slideUp var(--animation-duration, .3s) cubic-bezier(.4,0,.2,1)}.animated-number__value--down{animation:slideDown var(--animation-duration, .3s) cubic-bezier(.4,0,.2,1)}@keyframes slideUp{0%{transform:translateY(0);opacity:1}50%{transform:translateY(-100%);opacity:0}51%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideDown{0%{transform:translateY(0);opacity:1}50%{transform:translateY(100%);opacity:0}51%{transform:translateY(-100%);opacity:0}to{transform:translateY(0);opacity:1}}.animated-number--highlight-up{color:var(--color-chart-up)}.animated-number--highlight-down{color:var(--color-chart-down)}.animated-number--animating{animation:pulse-highlight var(--animation-duration, .3s) ease}@keyframes pulse-highlight{0%,to{filter:brightness(1)}50%{filter:brightness(1.2)}}.animated-cell{display:inline-block;transition:background-color .3s ease,color .3s ease;border-radius:4px;padding:0 2px;margin:0 -2px}.animated-cell--flash{animation:cellFlash .6s ease}.animated-cell--flash-up{animation:cellFlashUp .6s ease}.animated-cell--flash-down{animation:cellFlashDown .6s ease}@keyframes cellFlash{0%{background-color:#203c2e33}to{background-color:transparent}}@keyframes cellFlashUp{0%{background-color:#e74c3c40}50%{background-color:#e74c3c26}to{background-color:transparent}}@keyframes cellFlashDown{0%{background-color:#3498db40}50%{background-color:#3498db26}to{background-color:transparent}}.flip-text{display:inline-flex;align-items:center}.flip-text__container{display:inline-grid;position:relative;overflow:hidden;vertical-align:bottom}.flip-text__value{grid-area:1 / 1;display:inline-block;padding:2px 4px;border-radius:4px;white-space:nowrap}.flip-text__value--out{animation:slideOutUp .3s ease-out forwards}.flip-text__value--in{animation:slideInUp .3s ease-out forwards}@keyframes slideOutUp{0%{transform:translateY(0);opacity:1}to{transform:translateY(-100%);opacity:0}}@keyframes slideInUp{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.container{width:100%;max-width:1920px;margin:0 auto}.container-content{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}@media(max-width:768px){.container-content{padding:0 16px}}.header-desktop{position:fixed;top:0;left:0;right:0;height:60px;background-color:#fff;border-bottom:1px solid #F0F0F0;z-index:1100}.header-content{max-width:1200px;height:100%;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;overflow:visible}.header-logo{display:flex;align-items:center;gap:8px;text-decoration:none;flex-shrink:0}.header-logo-img{width:40px;height:40px;object-fit:contain}.header-logo-text{font-size:18px;font-weight:700;color:#203c2e;letter-spacing:-.5px}.header-nav{position:relative;display:flex;align-items:center;gap:40px;height:100%;padding-bottom:3px}.header-nav-link{position:relative;display:flex;align-items:center;height:100%;font-size:15px;font-weight:500;color:#8b8b8b;text-decoration:none;padding:0 4px;transition:color .2s ease;white-space:nowrap}.header-nav-link:hover{color:#1a1a1a}.header-nav-link.active{font-weight:700;color:#203c2e}.header-nav-indicator{position:absolute;bottom:0;left:0;height:3px;background:linear-gradient(90deg,#203c2e,#3d6b4f);border-radius:3px 3px 0 0;transition:transform .3s cubic-bezier(.4,0,.2,1),width .3s cubic-bezier(.4,0,.2,1),opacity .2s ease;box-shadow:0 0 8px #203c2e4d;pointer-events:none}.header-profile-area{position:relative}.header-profile-btn{display:flex;align-items:center;gap:8px;padding:6px 12px;background:transparent;border:none;cursor:pointer;border-radius:8px;transition:background-color .2s ease}.header-profile-btn:hover{background-color:#f5f5f5}.header-profile-avatar{width:32px;height:32px;border-radius:50%;background-color:#c7d8b7;display:flex;align-items:center;justify-content:center}.header-profile-avatar span{font-size:13px;font-weight:700;color:#203c2e}.header-profile-name{font-size:14px;font-weight:600;color:#1a1a1a}.header-profile-arrow{color:#8b8b8b;transition:transform .2s ease}.header-profile-arrow.open{transform:rotate(180deg)}.header-profile-dropdown{position:absolute;top:calc(100% + 8px);right:0;width:200px;background:#fff;border-radius:12px;box-shadow:0 4px 20px #0000001f;padding:8px 0;z-index:1101}.profile-dropdown-header{padding:12px 16px;display:flex;flex-direction:column;gap:4px}.profile-dropdown-name{font-size:14px;font-weight:700;color:#1a1a1a}.profile-dropdown-balance{font-size:12px;color:#203c2e;font-weight:600}.profile-dropdown-divider{height:1px;background-color:#f0f0f0;margin:4px 0}.profile-dropdown-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 16px;background:transparent;border:none;font-size:14px;color:#4b5563;cursor:pointer;transition:background-color .2s ease;text-align:left}.profile-dropdown-item:hover{background-color:#f5f5f5}.profile-dropdown-item.logout{color:#dc0000}.profile-dropdown-item svg{flex-shrink:0}.profile-dropdown-title{font-size:11px;color:#6b7280}.header-auth-buttons{display:flex;align-items:center;gap:12px}.header-login-btn{padding:8px 16px;background-color:transparent;color:#1a1a1a;font-size:14px;font-weight:500;border-radius:8px;text-decoration:none;border:1px solid rgba(0,0,0,.15);transition:all .2s ease}.header-login-btn:hover{background-color:#00000008;border-color:#0000004d}.header-signup-btn{padding:8px 16px;background-color:#10b981;color:#fff;font-size:14px;font-weight:600;border-radius:8px;text-decoration:none;transition:all .2s ease}.header-signup-btn:hover{background-color:#059669}.header-profile-skeleton{width:100px;height:32px;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite;border-radius:8px}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.mobile-tabbar{display:none;position:fixed;bottom:0;left:0;right:0;height:60px;background-color:#fff;border-top:1px solid #F0F0F0;z-index:1100}.tabbar-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;color:#9ca3af;transition:color .2s ease;min-width:0;padding:6px 4px}.tabbar-item.active{color:#203c2e}.tabbar-icon{display:flex;align-items:center;justify-content:center}.tabbar-icon svg{width:22px;height:22px}.tabbar-label{font-size:10px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;text-align:center}.tabbar-item.active .tabbar-label{font-weight:700}@media(max-width:768px){.header-desktop{height:50px}.header-nav,.header-profile-name,.header-profile-arrow{display:none}.header-profile-btn{padding:4px}.header-logo-text{font-size:16px}.header-logo-img{width:36px;height:36px}.header-auth-buttons{gap:8px}.header-login-btn,.header-signup-btn{padding:6px 12px;font-size:13px}.mobile-tabbar{display:flex}}@media(max-width:480px){.header-content{padding:0 16px}.header-auth-buttons{gap:6px}.header-login-btn,.header-signup-btn{padding:6px 10px;font-size:12px}.mobile-tabbar{height:56px}.tabbar-label{font-size:9px}.tabbar-icon svg{width:20px;height:20px}.tabbar-item{padding:5px 3px;gap:2px}}@media(max-width:380px){.tabbar-label{font-size:8px}.tabbar-icon svg{width:18px;height:18px}.mobile-tabbar{height:54px}.tabbar-item{padding:4px 2px;gap:1px}}.footer{width:100%;height:32px;background-color:#fafafa;border-top:1px solid #F0F0F0;display:flex;align-items:center;justify-content:center}.footer-copyright{font-size:11px;font-weight:400;color:#9ca3af}@media(max-width:768px){.footer{height:28px;margin-bottom:56px}.footer-copyright{font-size:10px}}@media(max-width:480px){.footer{margin-bottom:52px}}.layout{min-height:100vh;display:flex;flex-direction:column}.layout-main{flex:1;margin-top:60px}@media(max-width:768px){.layout-main{margin-top:50px}}.home-container{font-family:Noto Sans KR,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:linear-gradient(180deg,#f5f5f5,#e8f0e8);min-height:calc(100vh - 200px);padding:40px 20px 60px;max-width:720px;margin:0 auto}.home-loading{display:flex;justify-content:center;align-items:center;min-height:400px}.home-profile-card{background:#fff;border-radius:16px;padding:32px;box-shadow:0 2px 12px #00000014;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px;margin-bottom:24px;animation:fadeInUp .6s ease-out}.home-profile-left{display:flex;align-items:center;gap:20px;flex:1 1 300px}.home-profile-image{position:relative}.home-avatar{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#7eb5a6,#5a9383);display:flex;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 4px 12px #7eb5a64d}.home-avatar img{width:100%;height:100%;object-fit:cover}.home-avatar--achievement{background:linear-gradient(135deg,#fef5e7,#fceabb)}.home-avatar--achievement img{width:100%;height:100%;object-fit:cover;border-radius:50%}.home-nickname{font-size:24px;font-weight:700;margin-bottom:6px;color:#1a202c}.home-title-row{display:flex;align-items:center;gap:12px;margin-bottom:12px;flex-wrap:wrap}.home-title{font-size:14px;color:#718096;margin:0}.home-investment-type{font-size:13px;font-weight:600;display:flex;align-items:center;gap:4px;padding:4px 10px;background:#f7fafc;border-radius:6px}.home-profile-buttons{display:flex;gap:12px}.home-btn{padding:6px 16px;border-radius:8px;font-size:13px;cursor:pointer;font-weight:500;transition:all .2s}.home-btn-edit{background:#edf2f7;border:none;color:#2d3748}.home-btn-edit:hover{background:#e2e8f0}.home-btn-ranking{background:#fff;border:1px solid #e2e8f0;color:#2d3748}.home-btn-ranking:hover{border-color:#cbd5e0;background:#f7fafc}.home-profile-stats{text-align:right}.home-stats-rank{font-size:13px;color:#a0aec0;margin-bottom:6px}.home-stats-balance{font-size:32px;font-weight:800;color:#2d3748;letter-spacing:-.5px;line-height:1.2}.home-stats-unit{font-size:20px;font-weight:600}.home-stats-change{font-size:14px;font-weight:600;display:flex;align-items:center;justify-content:flex-end;gap:4px}.home-stats-change.negative{color:#f56565}.home-stats-change.positive{color:#48bb78}.home-streak-card{background:linear-gradient(135deg,#2f5d50,#1e3a2e);border-radius:16px;padding:48px;box-shadow:0 4px 20px #00000026;position:relative;overflow:hidden;margin-bottom:24px;animation:fadeInUp .6s ease-out .1s backwards}.home-streak-bg-1{position:absolute;top:20px;right:20px;width:120px;height:120px;background:#ffffff0d;border-radius:50%;filter:blur(40px)}.home-streak-bg-2{position:absolute;bottom:20px;left:20px;width:100px;height:100px;background:#ffd93d1a;border-radius:50%;filter:blur(30px)}.home-streak-content{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:32px;position:relative;z-index:1}.home-streak-stats{text-align:right;flex-shrink:0}.home-streak-title{font-size:30px;color:#fff;font-weight:500;line-height:1.3}.home-streak-label{font-size:16px;color:#fffc;margin-bottom:8px;font-weight:500}.home-streak-number{font-size:96px;font-weight:900;color:#fff;line-height:1;letter-spacing:-4px;text-shadow:0 4px 20px rgba(0,0,0,.2)}.home-cta-button{width:100%;padding:18px;background:linear-gradient(135deg,#ffd93d,#f9c80e);border:none;border-radius:12px;font-size:16px;font-weight:700;color:#282828;cursor:pointer;box-shadow:0 4px 16px #f9c80e4d;display:flex;align-items:center;justify-content:center;gap:8px;position:relative;z-index:1;transition:transform .2s,box-shadow .2s,filter .2s}.home-cta-button:hover{transform:translateY(-2px);filter:brightness(1.15);box-shadow:0 8px 28px #f9c80e8c}.home-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:24px;animation:fadeInUp .6s ease-out .2s backwards}.home-curriculum-card{background:#fff;border-radius:16px;padding:28px;box-shadow:0 2px 12px #00000014}.home-wrong-answers-card{background:#fff;border-radius:16px;padding:24px;box-shadow:0 2px 12px #00000014}.home-wrong-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.home-wrong-title{display:flex;align-items:center;gap:8px}.home-wrong-title h4{font-size:16px;font-weight:700;color:#2d3748;margin:0}.home-wrong-icon{width:20px;height:20px}.home-wrong-arrow{font-size:24px;color:#e53e3e;font-weight:300}.home-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.home-card-title{display:flex;align-items:center;gap:8px}.home-card-title span{font-size:18px}.home-card-title h4{font-size:16px;font-weight:700;color:#2d3748;margin:0}.home-achievement-badge{font-size:13px;color:#48bb78;font-weight:600;background:#f0fff4;padding:4px 12px;border-radius:6px}.home-curriculum-content{display:flex;align-items:center;gap:16px}.home-curriculum-icon{width:60px;height:60px;background:linear-gradient(135deg,#4299e1,#3182ce);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:28px;box-shadow:0 4px 12px #4299e14d}.home-curriculum-info{flex:1}.home-curriculum-name{font-size:14px;color:#718096;margin-bottom:6px;font-weight:500}.home-curriculum-chapter{font-size:12px;color:#a0aec0;margin-bottom:8px}.home-progress-bar{width:100%;height:8px;background:#e2e8f0;border-radius:4px;overflow:hidden}.home-progress-fill{height:100%;background:linear-gradient(90deg,#4299e1,#3182ce);border-radius:4px}.home-wrong-answers-content{text-align:center;padding:32px 20px;border:2px dashed #e2e8f0;border-radius:12px;background:#fafafa}.home-wrong-count{font-size:36px;font-weight:800;color:#e53e3e;margin-bottom:8px}.home-wrong-desc{font-size:14px;color:#718096}.home-achievements-card{background:#fff;border-radius:16px;padding:32px;box-shadow:0 2px 12px #00000014;animation:fadeInUp .6s ease-out .3s backwards}.home-achievements-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.home-achievements-detail{background:transparent;border:none;font-size:13px;color:#718096;cursor:pointer;text-decoration:underline;font-weight:500;transition:color .2s}.home-achievements-detail:hover{color:#2d3748}.home-achievements-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(70px,1fr));gap:12px}.home-achievement-item{aspect-ratio:1;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:28px;cursor:pointer;box-shadow:0 2px 8px #0000000f;background:#fef5e7}.home-achievement-item.locked{background:#f7fafc;cursor:not-allowed}.home-achievement-icon-img{width:100%;height:100%;object-fit:cover;border-radius:12px}.home-lock-icon{width:28px;height:28px;color:#a0aec0}.home-achievement-item.locked{opacity:.3;cursor:not-allowed;filter:grayscale(100%);box-shadow:none}.card-hover{transition:transform .3s ease,box-shadow .3s ease}.card-hover:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001f!important}.cta-button{position:relative;overflow:hidden}.cta-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.cta-button:hover:before{left:100%}.glow-effect{position:relative}.glow-effect:after{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;background:radial-gradient(circle,rgba(255,217,61,.3) 0%,transparent 70%);transform:translate(-50%,-50%);opacity:0;transition:opacity .3s ease;pointer-events:none;z-index:-1}.glow-effect:hover:after{opacity:1}.progress-fill{animation:progressFill 1.5s ease-out .5s backwards;transform-origin:left}@keyframes progressFill{0%{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes countUp{0%{opacity:0;transform:translateY(20px) scale(.8)}to{opacity:1;transform:translateY(0) scale(1)}}.streak-number{animation:countUp .8s cubic-bezier(.34,1.56,.64,1) .3s backwards}.achievement-badge{transition:all .3s ease}.achievement-badge:hover:not(.locked){transform:rotate(10deg) scale(1.1)}.tooltip{position:relative}.tooltip:before{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(-8px);padding:8px 12px;background:#2d3748;color:#fff;font-size:12px;border-radius:6px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .3s ease,transform .3s ease;z-index:1000}.tooltip:hover:before{opacity:1;transform:translate(-50%) translateY(-12px)}@media(max-width:768px){.home-container{padding:20px 16px 40px}.home-stats-grid{grid-template-columns:1fr}.home-profile-card{flex-direction:column;text-align:center}.home-profile-left{flex-direction:column}.home-profile-stats{text-align:center;margin-top:20px}.home-stats-change{justify-content:center}.home-streak-content{flex-direction:column;gap:24px}.home-streak-stats{text-align:left}.home-streak-number{font-size:72px}}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;border-radius:8px;width:90%;max-width:700px;max-height:90vh;overflow-y:auto;box-shadow:0 4px 20px #00000026;outline:1px #E0E0E0 solid;outline-offset:-.5px}.modal-header{display:flex;justify-content:center;align-items:center;padding:32px 40px;border-bottom:1px solid #E0E0E0;position:relative}.modal-title{font-size:24px;font-weight:700;color:#1a1a1a;margin:0;font-family:Inter,sans-serif}.modal-close{position:absolute;right:20px;top:50%;transform:translateY(-50%);background:#fff;border:2px solid #E0E0E0;border-radius:8px;font-size:20px;color:#666;cursor:pointer;padding:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.modal-close:hover{background:#f5f5f5;border-color:#999}.modal-body{padding:32px 40px}.form-group{margin-bottom:28px}.form-group:last-child{margin-bottom:0}.form-label{display:block;font-size:14px;font-weight:700;color:#1a1a1a;margin-bottom:12px;font-family:Inter,sans-serif}.required{color:#dc0000}.form-input{width:100%;height:56px;padding:0 20px;border:1px solid #E5E7EB;border-radius:4px;font-size:15px;color:#1a1a1a;transition:all .2s ease;box-sizing:border-box;font-family:Inter,sans-serif}.form-input::placeholder{color:#9ca3af}.form-input:focus{outline:none;border-color:#203c2e;border-width:2px}.form-input--error{border-color:#dc0000;border-width:2px}.error-message{display:block;font-size:12px;color:#dc0000;margin-top:8px;font-family:Inter,sans-serif}.input-counter{text-align:right;font-size:12px;color:#6b7280;margin-top:8px;font-family:Inter,sans-serif}.input-help{font-size:12px;color:#6b7280;margin-top:8px;line-height:1.5;font-family:Inter,sans-serif}.radio-group{display:grid;grid-template-columns:1fr 1fr;gap:20px}.radio-option{display:flex;align-items:center;padding:20px;border:2px solid #E5E7EB;border-radius:4px;cursor:pointer;transition:all .2s ease;background:#fff;min-height:80px}.radio-option--public-active{background:#e8f5e9;border-color:#4caf50}.radio-option--private-active{background:#fff8e6;border-color:#fadb13}.radio-option input[type=radio]{width:24px;height:24px;margin-right:16px;cursor:pointer;flex-shrink:0;appearance:none;background:#fff;border:2px solid #D1D5DB;border-radius:50%;position:relative;transition:all .2s ease}.radio-option--public-active input[type=radio]{background:#4caf50;border-color:#4caf50}.radio-option--public-active input[type=radio]:after{content:"";position:absolute;width:10px;height:10px;background:#fff;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%}.radio-option--private-active input[type=radio]{background:#fadb13;border-color:#fadb13}.radio-option--private-active input[type=radio]:after{content:"";position:absolute;width:10px;height:10px;background:#fff;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%}.radio-content{flex:1}.radio-title{font-size:16px;font-weight:400;color:#1a1a1a;margin-bottom:4px;font-family:Inter,sans-serif}.radio-option--public-active .radio-title,.radio-option--private-active .radio-title{font-weight:700}.radio-desc{font-size:13px;color:#666;line-height:1.4;font-family:Inter,sans-serif}.group-type-info{margin-top:20px;padding:20px;border-radius:4px}.group-type-info--public{background:#e8f5e9}.info-title{font-size:14px;font-weight:700;margin-bottom:12px;font-family:Inter,sans-serif}.group-type-info--public .info-title{color:#203c2e}.info-list{list-style:none;padding:0;margin:0}.info-list li{font-size:13px;line-height:1.8;padding-left:0;margin-bottom:4px;font-family:Inter,sans-serif}.info-list li:last-child{margin-bottom:0}.group-type-info--public .info-list li{color:#4caf50}.number-input-group{display:flex;align-items:center;gap:12px}.number-input-group input{width:200px;height:56px;padding:0 20px;border:1px solid #E5E7EB;border-radius:4px;font-size:15px;color:#1a1a1a;font-family:Inter,sans-serif;transition:all .2s ease}.number-input-group input:focus{outline:none;border-color:#203c2e;border-width:2px}.number-unit{font-size:14px;color:#9ca3af;font-family:Inter,sans-serif}.code-section{margin-top:12px}.code-input-wrapper{background:#fff8e6;border:2px solid #FADB13;border-radius:4px;display:flex;align-items:center;padding:18px 20px;gap:16px;margin-bottom:0}.code-input{flex:1;height:44px;background:#fff;border:1px solid #E5E7EB;border-radius:4px;font-family:Courier New,monospace;font-size:20px;font-weight:700;letter-spacing:2px;text-align:center;color:#1a1a1a;padding:0 16px}.code-info{background:#fff8e6;padding:16px 20px;border-radius:0 0 4px 4px}.code-info-title{font-size:14px;font-weight:700;color:#96773d;margin-bottom:8px;font-family:Inter,sans-serif}.code-info-list{list-style:none;padding:0;margin:0}.code-info-list li{font-size:13px;color:#96773d;line-height:1.8;margin-bottom:4px;font-family:Inter,sans-serif}.code-info-list li:last-child{margin-bottom:0}.modal-footer{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:24px 40px 32px;border-top:1px solid #E5E7EB}.btn-primary,.btn-secondary{height:52px;border:none;border-radius:4px;font-size:15px;font-weight:700;cursor:pointer;transition:all .2s ease;font-family:Inter,sans-serif}.btn-primary{background:#203c2e;color:#fff}.btn-primary:hover:not(:disabled){background:#162b20}.btn-primary:disabled{background:#ccc;color:#666;cursor:not-allowed}.btn-secondary{background:#fff;color:#666;border:1px solid #E5E7EB}.btn-secondary:hover:not(:disabled){background:#f8f8f8}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.btn-small{width:85px;height:44px;background:#203c2e;color:#fff;font-size:13px;font-weight:700;border:none;border-radius:4px;cursor:pointer;font-family:Inter,sans-serif;white-space:nowrap;transition:all .2s ease;flex-shrink:0}.btn-small:hover:not(:disabled){background:#162b20}@media(max-width:768px){.modal-content{width:95%;max-height:95vh}.modal-header,.modal-body{padding:24px 20px}.modal-footer{grid-template-columns:1fr;padding:20px}.radio-group{grid-template-columns:1fr}.number-input-group input{width:150px}}.join-code-modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.join-code-modal-content{background:#fff;border-radius:8px;width:90%;max-width:500px;box-shadow:0 4px 20px #00000026;outline:1px #E0E0E0 solid;outline-offset:-.5px}.join-code-modal-header{display:flex;justify-content:center;align-items:center;padding:32px 40px;border-bottom:1px solid #E0E0E0;position:relative}.join-code-modal-title{font-size:24px;font-weight:700;color:#1a1a1a;margin:0;font-family:Inter,sans-serif}.join-code-modal-close{position:absolute;right:20px;top:50%;transform:translateY(-50%);background:#fff;border:2px solid #E0E0E0;border-radius:8px;font-size:20px;color:#666;cursor:pointer;padding:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.join-code-modal-close:hover{background:#f5f5f5;border-color:#999}.join-code-modal-body{padding:32px 40px}.join-code-modal-description{font-size:16px;color:#1a1a1a;text-align:center;margin:0 0 32px;font-family:Inter,sans-serif;line-height:1.5}.join-code-input-container{margin-bottom:20px}.join-code-input{width:100%;height:80px;padding:0 20px;border:2px solid #E5E7EB;border-radius:8px;font-family:Courier New,monospace;font-size:36px;font-weight:700;letter-spacing:8px;text-align:center;color:#1a1a1a;transition:all .2s ease;box-sizing:border-box}.join-code-input::placeholder{color:#d1d5db;letter-spacing:8px}.join-code-input:focus{outline:none;border-color:#203c2e;border-width:2px}.join-code-input--error{border-color:#dc0000}.join-code-input:disabled{background:#f5f5f5;cursor:not-allowed}.join-code-error-message{font-size:14px;color:#dc0000;margin-bottom:16px;font-family:Inter,sans-serif;display:flex;align-items:center;gap:6px}.join-code-help-text{font-size:14px;color:#96773d;background:#fff8e6;padding:16px 20px;border-radius:4px;line-height:1.6;font-family:Inter,sans-serif}.join-code-modal-footer{padding:24px 40px 32px;border-top:1px solid #E5E7EB}.join-code-btn-primary{width:100%;height:52px;border:none;border-radius:4px;font-size:16px;font-weight:700;cursor:pointer;transition:all .2s ease;font-family:Inter,sans-serif;background:#203c2e;color:#fff}.join-code-btn-primary:hover:not(:disabled){background:#162b20}.join-code-btn-primary:disabled{background:#ccc;color:#666;cursor:not-allowed}@media(max-width:768px){.join-code-modal-content{width:95%}.join-code-modal-header,.join-code-modal-body{padding:24px 20px}.join-code-modal-footer{padding:20px}.join-code-input{font-size:28px;height:70px;letter-spacing:6px}.join-code-input::placeholder{letter-spacing:6px}}.ranking-card{width:100%;min-height:280px;background-color:#fff;border:1px solid #F0F0F0;display:flex;flex-direction:column;box-sizing:border-box}.ranking-card-header{display:flex;justify-content:space-between;align-items:center;padding:18px 24px 12px;border-bottom:1px solid #F0F0F0}.ranking-card-title{font-size:18px;font-weight:700;color:#1a1a1a;font-family:Inter,sans-serif}.ranking-card-date{font-size:12px;font-weight:400;color:#9ca3af;font-family:Inter,sans-serif}.ranking-card-top3{padding:8px 24px}.ranking-item{display:flex;align-items:center;height:40px}.ranking-item--small{height:36px}.ranking-item--me{background-color:#fff5f5;margin:0 -24px;padding:0 24px}.ranking-item-rank{width:28px;font-size:15px;font-weight:700;color:#1a1a1a;font-family:Inter,sans-serif}.ranking-item-nickname{flex:1;font-size:15px;font-weight:600;color:#1a1a1a;font-family:Inter,sans-serif;display:flex;align-items:center;gap:8px}.ranking-item-badge{padding:2px 6px;font-size:10px;font-weight:700;color:#fff;border-radius:2px}.ranking-item-score{font-size:15px;font-weight:700;text-align:right;font-family:Inter,sans-serif}.ranking-expand-section{border-top:1px solid #F0F0F0}.ranking-expand-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:6px;padding:12px 24px;background:#fafafa;border:none;cursor:pointer;font-size:13px;font-weight:600;color:#6b7280;font-family:Inter,sans-serif;transition:background .2s ease}.ranking-expand-btn:hover{background:#f0f0f0}.expand-icon{transition:transform .2s ease}.expand-icon.expanded{transform:rotate(180deg)}.ranking-expanded-list{padding:0 24px 8px;max-height:252px;overflow-y:auto}.ranking-expanded-list::-webkit-scrollbar{width:4px}.ranking-expanded-list::-webkit-scrollbar-track{background:#f0f0f0}.ranking-expanded-list::-webkit-scrollbar-thumb{background:#ccc;border-radius:2px}.my-ranking-section{border-top:1px dashed #E5E7EB;margin-top:auto;padding:8px 0}.my-ranking-item{display:flex;align-items:center;padding:10px 24px;background-color:#fff5f5;gap:8px}.my-ranking-rank{font-size:15px;font-weight:700;min-width:28px;font-family:Inter,sans-serif}.my-ranking-nickname{font-size:15px;font-weight:700;color:#1a1a1a;font-family:Inter,sans-serif}.my-ranking-badge{padding:2px 6px;font-size:10px;font-weight:700;color:#fff;border-radius:2px}.my-ranking-score{flex:1;font-size:15px;font-weight:700;text-align:right;font-family:Inter,sans-serif}.neighbor-ranking{display:flex;align-items:center;padding:6px 24px;gap:8px}.neighbor-rank{font-size:14px;font-weight:400;color:#9ca3af;min-width:28px;font-family:Inter,sans-serif}.neighbor-nickname{flex:1;font-size:14px;font-weight:400;color:#6b7280;font-family:Inter,sans-serif}.neighbor-score{font-size:14px;font-weight:500;text-align:right;font-family:Inter,sans-serif}.ranking-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:180px;color:#9ca3af;font-size:14px;font-family:Inter,sans-serif;gap:12px}.ranking-empty-icon{font-size:32px}.ranking-card-loading{display:flex;align-items:center;justify-content:center;flex:1;padding:24px}.ranking-card-loading .skeleton{background:#e0e0e0;animation:skeleton-pulse 1.5s ease-in-out infinite}.ranking-card-error{display:flex;align-items:center;justify-content:center;flex:1;color:#dc0000;font-size:14px;font-family:Inter,sans-serif}@media(max-width:768px){.ranking-card{min-height:260px}.ranking-card-header{padding:14px 16px 10px}.ranking-card-title{font-size:16px}.ranking-card-top3{padding:6px 16px}.ranking-item{height:36px}.ranking-item--small{height:32px}.ranking-item--me{margin:0 -16px;padding:0 16px}.ranking-item-rank,.ranking-item-nickname,.ranking-item-score{font-size:14px}.ranking-expand-btn{padding:10px 16px;font-size:12px}.ranking-expanded-list{padding:0 16px 6px;max-height:200px}.my-ranking-item{padding:8px 16px}.my-ranking-rank,.my-ranking-nickname,.my-ranking-score{font-size:14px}.neighbor-ranking{padding:5px 16px}.neighbor-rank,.neighbor-nickname,.neighbor-score{font-size:13px}}.community-page{min-height:calc(100vh - 100px);background:#f8f8f8;padding:30px 0 40px}.community-container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}.community-header{margin-bottom:64px}.community-title{font-size:28px;font-weight:700;color:#1a1a1a;margin:0 0 8px;font-family:Inter,sans-serif}.community-desc{font-size:15px;color:#8b8b8b;margin:0;font-family:Inter,sans-serif}.my-room-banner{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;background:linear-gradient(135deg,#203c2e,#2a5038);margin-bottom:24px;cursor:pointer;transition:transform .2s ease}.my-room-banner:hover{transform:translateY(-2px)}.my-room-info{display:flex;flex-direction:column;gap:4px}.my-room-label{font-size:12px;color:#fffc;font-weight:500;font-family:Inter,sans-serif}.my-room-name{font-size:18px;font-weight:700;color:#fff;font-family:Inter,sans-serif}.my-room-btn{padding:8px 24px;background:#fff;color:#203c2e;border:none;font-size:14px;font-weight:600;cursor:pointer;font-family:Inter,sans-serif}.community-search-area{display:flex;gap:20px;margin-bottom:27px}.search-input-wrapper{width:540px;height:52px;background:#fff;border:1px solid #E5E7EB;border-radius:8px;display:flex;align-items:center;padding:0 16px;gap:12px;box-sizing:border-box;transition:border-color .2s ease}.search-input-wrapper.focused{border:2px solid #203C2E}.search-icon{flex-shrink:0}.search-input{flex:1;height:100%;border:none;outline:none;font-size:15px;color:#1a1a1a;font-family:Inter,sans-serif;background:transparent}.search-input::placeholder{color:#9ca3af}.join-code-btn{width:140px;height:52px;background:#fff;border:1px solid #E5E7EB;border-radius:8px;font-size:15px;font-weight:700;color:#203c2e;cursor:pointer;font-family:Inter,sans-serif;transition:background .2s ease}.join-code-btn:hover{background:#f8f8f8}.create-group-btn{width:140px;height:52px;background:#203c2e;border:none;border-radius:8px;font-size:15px;font-weight:700;color:#fff;cursor:pointer;font-family:Inter,sans-serif;transition:background .2s ease}.create-group-btn:hover{background:#162b20}.public-groups-section{background:#fff;margin-bottom:12px}.public-groups-header{display:flex;justify-content:space-between;align-items:center;height:44px;padding:0 20px;background:#fafafa}.public-groups-label{font-size:13px;font-weight:700;color:#6b7280;font-family:Inter,sans-serif}.public-groups-count-label{font-size:13px;font-weight:700;color:#6b7280;font-family:Inter,sans-serif;margin-right:110px}.public-groups-list{height:340px;overflow-y:auto}.public-groups-list::-webkit-scrollbar{width:6px}.public-groups-list::-webkit-scrollbar-track{background:#f0f0f0}.public-groups-list::-webkit-scrollbar-thumb{background:#ccc;border-radius:3px}.public-groups-list::-webkit-scrollbar-thumb:hover{background:#aaa}.group-item{display:flex;align-items:center;height:68px;padding:0 20px;background:#fff;border:1px solid #F0F0F0;border-top:none;box-sizing:border-box}.group-item:first-child{border-top:1px solid #F0F0F0}.group-checkbox{width:12px;height:12px;border:1.5px solid #D1D5DB;background:#fff;margin-right:20px;flex-shrink:0}.group-name{flex:1;font-size:16px;font-weight:400;color:#1a1a1a;font-family:Inter,sans-serif}.group-count{font-size:15px;font-weight:400;color:#6b7280;font-family:Inter,sans-serif;margin-right:20px;min-width:60px;text-align:right}.group-count--full{color:#9ca3af}.group-join-btn{width:90px;height:24px;background:#203c2e;border:none;font-size:12px;font-weight:700;color:#fff;cursor:pointer;font-family:Inter,sans-serif;transition:background .2s ease}.group-join-btn:hover:not(:disabled){background:#162b20}.group-join-btn--disabled{background:#f0f0f0;color:#9ca3af;cursor:not-allowed}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:340px;padding:0 20px}.empty-icon{width:120px;height:120px;background:#f8f8f8;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:20px}.empty-title{font-size:20px;font-weight:700;color:#282828;margin:0 0 12px;text-align:center;font-family:Inter,sans-serif}.empty-desc{font-size:15px;font-weight:400;color:#666;margin:0;text-align:center;font-family:Inter,sans-serif;line-height:1.6}.empty-create-btn{width:200px;height:48px;background:#203c2e;border:none;border-radius:24px;font-size:15px;font-weight:700;color:#fff;cursor:pointer;font-family:Inter,sans-serif;margin-top:24px;transition:background .2s ease}.empty-create-btn:hover{background:#162b20}.empty-search-info{display:flex;align-items:center;gap:8px;margin-top:20px;padding:8px 24px;background:#f8f8f8;font-size:14px;color:#999;font-family:Inter,sans-serif}.empty-search-info .separator{color:#ccc}.reset-link{color:#203c2e;cursor:pointer;text-decoration:underline}.reset-link:hover{color:#162b20}.skeleton-checkbox{width:16px;height:16px;margin-right:24px}.skeleton-name{height:16px;max-width:220px}.skeleton-count{width:48px;height:16px;margin-right:16px;margin-left:auto}.skeleton-btn{width:91px;height:28px}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.5}}.ranking-section{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}.community-toast{position:fixed;bottom:24px;right:24px;padding:16px 24px;border-radius:8px;font-size:14px;font-weight:600;color:#fff;box-shadow:0 4px 12px #00000026;z-index:9999;animation:slideIn .3s ease;font-family:Inter,sans-serif}.community-toast--success{background:#4caf50}.community-toast--error{background:#dc0000}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@media(max-width:1024px){.community-search-area{flex-wrap:wrap}.search-input-wrapper{width:100%;order:1}.join-code-btn{flex:1;width:auto;order:2}.create-group-btn{flex:1;width:auto;order:3}.ranking-section{grid-template-columns:1fr;gap:24px}.public-groups-count-label{margin-right:100px}}@media(max-width:768px){.community-page{padding:20px 0 30px}.community-header{margin-bottom:40px}.community-title{font-size:24px}.community-search-area{gap:12px}.search-input-wrapper,.join-code-btn,.create-group-btn{height:48px}.public-groups-list,.empty-state{height:272px}.group-item{padding:0 16px}.group-name{font-size:14px}.group-count{font-size:13px;min-width:50px}.group-join-btn{width:80px;font-size:11px}.public-groups-count-label{margin-right:90px}.empty-icon{width:80px;height:80px}.empty-icon svg{width:64px;height:64px}.empty-title{font-size:18px}.empty-desc{font-size:14px}}.ranking-list{background-color:#fff;border:1px solid #F0F0F0}.ranking-list-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px 12px;border-bottom:1px solid #F0F0F0}.ranking-list-title{font-size:18px;font-weight:700;color:#1a1a1a;margin:0}.ranking-list-updated{font-size:12px;color:#9ca3af}.ranking-list-info{padding:12px 24px;font-size:13px;color:#6b7280;background-color:#fafafa;border-bottom:1px solid #F0F0F0}.ranking-list-items{display:flex;flex-direction:column}.ranking-list-item{display:flex;align-items:center;padding:14px 24px;border-bottom:1px solid #F0F0F0;transition:background-color .2s ease}.ranking-list-item:hover{background-color:#fafafa}.ranking-list-item:last-child{border-bottom:none}.ranking-list-item.is-me{background-color:#fff5f5}.ranking-list-item.is-me:hover{background-color:#ffeded}.item-rank{width:48px;font-size:15px;font-weight:700;color:#1a1a1a}.item-nickname{flex:1;font-size:15px;font-weight:400;color:#1a1a1a;display:flex;align-items:center;gap:8px}.me-badge{padding:2px 6px;font-size:11px;font-weight:700;color:#fff;background-color:#dc0000;border-radius:2px}.item-score{font-size:15px;font-weight:700;text-align:right}.ranking-list-more{padding:16px 24px;display:flex;justify-content:center}.load-more-btn{width:100%;max-width:300px;padding:12px 24px;font-size:15px;font-weight:500;color:#203c2e;background-color:#fff;border:1px solid #203C2E;border-radius:4px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:8px}.load-more-btn:hover:not(:disabled){background-color:#203c2e;color:#fff}.load-more-btn:disabled{color:#9ca3af;border-color:#e5e7eb;cursor:not-allowed}.btn-spinner{width:16px;height:16px;border:2px solid #E5E7EB;border-top-color:#203c2e;border-radius:50%;animation:spin .8s linear infinite}.ranking-list-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px;color:#6b7280}.loading-spinner{width:40px;height:40px;border:3px solid #E5E7EB;border-top-color:#203c2e;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}.ranking-list-loading p{font-size:15px;margin:0}.ranking-list-error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px;color:#6b7280}.ranking-list-error p{font-size:15px;margin:0 0 16px}.ranking-list-error button{padding:10px 24px;font-size:14px;color:#fff;background-color:#203c2e;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease}.ranking-list-error button:hover{background-color:#2d5440}.ranking-list-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px;text-align:center}.empty-icon{font-size:48px;margin-bottom:16px}.ranking-list-empty p{font-size:16px;font-weight:600;color:#1a1a1a;margin:0 0 8px}.ranking-list-empty span{font-size:14px;color:#6b7280}@media(max-width:768px){.ranking-list-header{padding:16px 16px 10px}.ranking-list-title{font-size:16px}.ranking-list-info{padding:10px 16px}.ranking-list-item{padding:12px 16px}.item-rank{width:40px;font-size:14px}.item-nickname,.item-score{font-size:14px}.ranking-list-more{padding:12px 16px}.ranking-list-loading,.ranking-list-error,.ranking-list-empty{padding:48px 16px}}.ranking-page{min-height:calc(100vh - 70px);background-color:#f5f5f5}.ranking-page-header{background-color:#203c2e;padding:32px 24px}.ranking-page-title{font-size:28px;font-weight:700;color:#fff;margin:0 0 8px}.ranking-page-desc{font-size:15px;color:#c7d8b7;margin:0}.ranking-tabs{display:flex;background-color:#fff;border-bottom:1px solid #E5E7EB}.ranking-tab{flex:1;padding:16px 24px;font-size:15px;font-weight:600;color:#6b7280;background:none;border:none;border-bottom:3px solid transparent;cursor:pointer;transition:all .2s ease}.ranking-tab:hover{color:#1a1a1a;background-color:#fafafa}.ranking-tab.active{color:#203c2e;border-bottom-color:#203c2e}.my-ranking-banner{background-color:#fff5f5;padding:16px 24px;border-bottom:1px solid #F0F0F0}.banner-label{font-size:12px;font-weight:600;color:#6b7280;margin-bottom:8px}.banner-content{display:flex;align-items:center;gap:12px}.banner-rank{font-size:18px;font-weight:700;color:#dc0000;min-width:80px}.banner-nickname{font-size:16px;font-weight:600;color:#1a1a1a}.banner-badge{padding:2px 8px;font-size:11px;font-weight:700;color:#fff;background-color:#dc0000;border-radius:2px}.banner-score{flex:1;font-size:16px;font-weight:700;text-align:right}.score-positive{color:#dc0000}.score-negative{color:#0046b4}.score-learning{color:#2563eb}.ranking-page-content{max-width:800px;margin:0 auto;padding:0}@media(max-width:768px){.ranking-page-header{padding:24px 16px}.ranking-page-title{font-size:24px}.ranking-page-desc{font-size:14px}.ranking-tab{padding:14px 16px;font-size:14px}.my-ranking-banner{padding:14px 16px}.banner-content{gap:8px}.banner-rank{font-size:16px;min-width:60px}.banner-nickname,.banner-score{font-size:14px}}.kakao-login-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:48px;padding:0 16px;background-color:#fee500;border:none;border-radius:8px;font-size:15px;font-weight:600;color:#000;cursor:pointer;transition:background-color .2s ease}.kakao-login-btn:hover{background-color:#f5dc00}.kakao-login-btn:active{background-color:#ecce00}.kakao-login-icon{width:20px;height:20px}.auth-container{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;background:linear-gradient(180deg,#f5f5f5,#e8f0e8)}.auth-header{display:flex;align-items:center;gap:12px;margin-bottom:24px}.auth-header-logo{width:48px;height:48px;object-fit:contain}.auth-header-title{font-size:28px;font-weight:700;color:#203c2e;letter-spacing:-.5px}.auth-card{width:100%;max-width:420px}.auth-card-title{font-size:20px;font-weight:600;color:#444;margin:0 0 24px;text-align:center}.auth-logo-section{display:flex;flex-direction:column;align-items:center;margin-bottom:32px}.auth-logo-wrapper{display:flex;align-items:center;gap:12px;margin-bottom:8px}.auth-logo-img{width:48px;height:48px;object-fit:contain}.auth-logo-text{font-size:28px;font-weight:700;color:#203c2e;letter-spacing:-.5px}.auth-title{font-size:18px;font-weight:500;color:#666;margin:0}.auth-error-box{display:flex;align-items:flex-start;gap:10px;padding:14px 16px;background-color:#fef2f2;border:1px solid #fecaca;border-radius:10px;margin-bottom:20px}.auth-error-icon{flex-shrink:0;width:20px;height:20px;color:#dc0000}.auth-error-content{flex:1}.auth-error-title{font-size:14px;font-weight:600;color:#dc0000;margin:0 0 4px}.auth-error-message{font-size:13px;color:#dc0000;margin:0;line-height:1.5}.auth-field-error{font-size:13px;color:#dc0000;margin:-12px 0 16px}.auth-warning-box{display:flex;align-items:center;gap:8px;padding:12px 14px;background-color:#fffbeb;border:1px solid #fde68a;border-radius:8px;margin-bottom:16px}.auth-warning-icon{flex-shrink:0;width:18px;height:18px;color:#d97706}.auth-warning-message{font-size:13px;color:#92400e;margin:0}.auth-divider{display:flex;align-items:center;margin:20px 0}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background-color:#e0e0e0}.auth-divider-text{padding:0 16px;font-size:13px;color:#999}.auth-button-group{display:flex;flex-direction:column;gap:12px;margin-top:24px}.auth-links{display:flex;justify-content:space-between;margin-top:24px;padding-top:20px;border-top:1px solid #f0f0f0}.auth-link{font-size:14px;color:#666;cursor:pointer;transition:color .2s;background:none;border:none;padding:0}.auth-link:hover{color:#203c2e;text-decoration:underline}.auth-link-center{text-align:center;margin-top:24px;padding-top:20px;border-top:1px solid #f0f0f0;font-size:14px;color:#666}.auth-link-highlight{color:#203c2e;font-weight:600;cursor:pointer;margin-left:4px}.auth-link-highlight:hover{text-decoration:underline}.auth-description{font-size:14px;color:#666;line-height:1.6;margin:0 0 24px;text-align:center}.auth-password-status{display:flex;align-items:center;gap:6px;margin-top:8px;font-size:13px}.auth-password-status.match{color:#16a34a}.auth-password-status.mismatch{color:#dc0000}.auth-password-status-icon{width:16px;height:16px}.auth-success-box{text-align:center;padding:20px 0}.auth-success-icon-wrapper{width:64px;height:64px;margin:0 auto 20px;background-color:#f0fdf4;border-radius:50%;display:flex;align-items:center;justify-content:center}.auth-success-icon-large{width:32px;height:32px;color:#16a34a}.auth-success-title{font-size:18px;font-weight:600;color:#333;margin:0 0 12px}.auth-success-message{font-size:14px;color:#666;line-height:1.6;margin:0}.auth-form{display:flex;flex-direction:column;gap:12px}.roadmap-header{margin-bottom:var(--spacing-10);animation:headerSlideIn .6s ease-out}@keyframes headerSlideIn{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}.roadmap-header__top{display:flex;justify-content:space-between;align-items:flex-start;margin-top:var(--spacing-6);margin-bottom:var(--spacing-6);gap:var(--spacing-6);flex-wrap:wrap}.roadmap-header__title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin-bottom:var(--spacing-2)}.roadmap-header__subtitle{font-size:var(--font-size-base);color:#666}.roadmap-header__toggle{display:flex;gap:var(--spacing-2);background:var(--color-white);border:1px solid #e0e0e0;border-radius:10px;padding:4px}.roadmap-header__toggle-btn{padding:var(--spacing-2) var(--spacing-4);border-radius:8px;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:#666;background:transparent;transition:all .2s ease}.roadmap-header__toggle-btn:hover{background:var(--color-background)}.roadmap-header__toggle-btn--active{background:var(--color-main-green);color:var(--color-white)}.roadmap-header__toggle-btn--active:hover{background:var(--color-main-green)}.roadmap-header__progress-section{background:var(--color-white);border-radius:12px;padding:var(--spacing-5)}.roadmap-header__progress{margin-bottom:var(--spacing-5)}.roadmap-header__progress-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2)}.roadmap-header__progress-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-dark-gray)}.roadmap-header__progress-percent{font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.roadmap-header__progress-bar{width:100%;height:12px;background:#e8e8e8;border-radius:6px;overflow:hidden}.roadmap-header__progress-fill{height:100%;background:linear-gradient(90deg,var(--color-main-green),#3a6b4f);border-radius:6px;transition:width .5s ease}.roadmap-header__type-progress{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-4);padding-top:var(--spacing-4);border-top:1px solid #eee}.roadmap-header__type-item{display:flex;flex-direction:column;gap:var(--spacing-1)}.roadmap-header__type-info{display:flex;justify-content:space-between;align-items:center}.roadmap-header__type-label{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:#666}.roadmap-header__type-count{font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);color:#888}.roadmap-header__type-bar{width:100%;height:6px;background:#e8e8e8;border-radius:3px;overflow:hidden}.roadmap-header__type-fill{height:100%;border-radius:3px;transition:width .5s ease}.roadmap-header__type-fill--normal{background:var(--color-main-green)}.roadmap-header__type-fill--aggressive{background:var(--color-chart-up)}.roadmap-header__type-fill--neutral{background:var(--color-brown)}.roadmap-header__type-fill--stable{background:var(--color-chart-down)}@media(max-width:768px){.roadmap-header__top{flex-direction:column}.roadmap-header__toggle{width:100%;justify-content:center}.roadmap-header__type-progress{grid-template-columns:repeat(2,1fr)}}.chapter-node-wrapper{position:relative}.chapter-node{display:flex;align-items:center;gap:var(--spacing-4);padding:0;background:none;border:none;cursor:pointer;text-align:left;transition:transform .2s ease;opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease,box-shadow .2s ease}.chapter-node.node-visible{opacity:1;transform:translateY(0)}.chapter-node:hover:not(:disabled){transform:scale(1.03)}.chapter-node.node-visible:hover:not(:disabled){transform:translateY(0) scale(1.03)}.chapter-node:disabled{cursor:default;opacity:0}.chapter-node:disabled.node-visible{opacity:1}.chapter-node__circle{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:box-shadow .2s ease,transform .3s ease}.chapter-node:hover:not(:disabled) .chapter-node__circle{transform:scale(1.1)}.chapter-node--completed .chapter-node__circle{background:var(--color-main-green);color:var(--color-white);box-shadow:0 2px 8px #203c2e4d}.chapter-node--available .chapter-node__circle{background:var(--color-quiz-yellow);color:var(--color-dark-gray);box-shadow:0 2px 8px #fadb1366}.chapter-node--locked .chapter-node__circle{background:#e0e0e0;color:#888}.chapter-node__info{display:flex;flex-direction:column;gap:2px}.chapter-node__label{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:#888;letter-spacing:.5px;text-transform:uppercase}.chapter-node__title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.chapter-node--locked .chapter-node__title{color:#aaa}.chapter-node__progress-bar{width:80px;height:4px;background:#e0e0e0;border-radius:2px;overflow:hidden;margin-top:2px}.chapter-node__progress-fill{height:100%;background:var(--color-main-green);border-radius:2px}.chapter-node__tooltip{position:absolute;top:50%;left:100%;transform:translateY(-50%);margin-left:12px;padding:var(--spacing-2) var(--spacing-3);background:var(--color-white);color:var(--color-dark-gray);font-size:var(--font-size-xs);border-radius:8px;border:1px solid #e0e0e0;box-shadow:0 2px 8px #00000014;width:max-content;max-width:240px;line-height:1.4;z-index:10;animation:tooltipFadeIn .2s ease;pointer-events:none}@keyframes tooltipFadeIn{0%{opacity:0;transform:translateY(-50%) translate(-4px)}to{opacity:1;transform:translateY(-50%) translate(0)}}@media(max-width:768px){.chapter-node__tooltip{display:none}}.side-quest-wrapper{position:relative}.side-quest{display:flex;align-items:center;gap:var(--spacing-3);padding:0;background:none;border:none;cursor:pointer;text-align:left;position:relative;opacity:0;transform:translate(-12px);transition:opacity .5s ease,transform .5s ease}.side-quest.node-visible{opacity:1;transform:translate(0)}.side-quest:hover:not(:disabled){transform:scale(1.03)}.side-quest.node-visible:hover:not(:disabled){transform:translate(0) scale(1.03)}.side-quest:disabled{cursor:default;opacity:0}.side-quest:disabled.node-visible{opacity:.5}.side-quest__connector{position:absolute;right:100%;top:50%;width:40px;height:2px;background:#ccc;transform:translateY(-50%)}.side-quest__circle{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--color-white);border:2px solid #ccc;transition:transform .3s ease}.side-quest:hover:not(:disabled) .side-quest__circle{transform:scale(1.1)}.side-quest--completed .side-quest__circle{border-color:var(--color-main-green);color:var(--color-main-green)}.side-quest--available .side-quest__circle{border-color:var(--color-brown);color:var(--color-brown)}.side-quest--locked .side-quest__circle{border-color:#d0d0d0;color:#aaa}.side-quest__info{display:flex;flex-direction:column;gap:1px}.side-quest__label{font-size:11px;color:#999;font-weight:var(--font-weight-medium)}.side-quest__title{font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.side-quest--locked .side-quest__title{color:#aaa}.side-quest__tooltip{position:absolute;top:50%;left:100%;transform:translateY(-50%);margin-left:12px;padding:var(--spacing-2) var(--spacing-3);background:var(--color-white);color:var(--color-dark-gray);font-size:var(--font-size-xs);border-radius:8px;border:1px solid #e0e0e0;box-shadow:0 2px 8px #00000014;width:max-content;max-width:220px;line-height:1.4;z-index:10;animation:sideTooltipFadeIn .2s ease;pointer-events:none}@keyframes sideTooltipFadeIn{0%{opacity:0;transform:translateY(-50%) translate(-4px)}to{opacity:1;transform:translateY(-50%) translate(0)}}@media(max-width:768px){.side-quest__tooltip{display:none}}.roadmap-timeline{position:relative;padding:var(--spacing-8) 0 var(--spacing-16);max-width:600px;margin:0 auto}.roadmap-timeline__line{position:absolute;left:28px;top:0;bottom:0;width:3px;background:#ccc}.roadmap-timeline__items{display:flex;flex-direction:column;gap:var(--spacing-10);position:relative}.roadmap-timeline__item{display:flex;align-items:center;position:relative}.roadmap-timeline__item--main{padding-left:0}.roadmap-timeline__item--side{padding-left:70px}.chapter-detail{padding:var(--spacing-2) 0}.chapter-detail__badge{display:inline-block;background:var(--color-main-green);color:var(--color-white);font-size:11px;font-weight:var(--font-weight-bold);padding:4px 10px;border-radius:4px;letter-spacing:.5px;margin-bottom:var(--spacing-3)}.chapter-detail__title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin-bottom:var(--spacing-4)}.chapter-detail__summary{font-size:var(--font-size-sm);color:#666;line-height:var(--line-height-relaxed);margin-bottom:var(--spacing-8)}.chapter-detail__meta{display:flex;align-items:center;justify-content:center;gap:var(--spacing-5);padding:var(--spacing-4) 0;margin-bottom:var(--spacing-6);border-top:1px solid #eee;border-bottom:1px solid #eee}.chapter-detail__meta-item{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-1)}.chapter-detail__meta-label{font-size:var(--font-size-xs);color:#999}.chapter-detail__meta-value{font-size:var(--font-size-base);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.chapter-detail__meta-icon{margin-right:4px}.chapter-detail__meta-divider{width:1px;height:32px;background:#e0e0e0}.chapter-content{padding:var(--spacing-8) 0 var(--spacing-16);max-width:800px;margin:0 auto}.chapter-content__progress-bar{position:fixed;top:0;left:0;width:100%;height:3px;background:transparent;z-index:200}.chapter-content__progress-fill{height:100%;background:linear-gradient(90deg,var(--color-main-green),var(--color-pale-green));transition:width .1s linear}.chapter-content__back{display:inline-flex;align-items:center;gap:var(--spacing-2);font-size:var(--font-size-sm);color:#666;margin-bottom:var(--spacing-8);padding:var(--spacing-2) 0;transition:color .2s}.chapter-content__back:hover{color:var(--color-main-green)}.chapter-content__header{margin-bottom:var(--spacing-6);animation:fadeSlideDown .6s ease-out}.chapter-content__tags{display:flex;gap:var(--spacing-2);margin-bottom:var(--spacing-4)}.chapter-content__tag{display:inline-block;font-size:12px;font-weight:var(--font-weight-semibold);padding:4px 12px;border-radius:4px;background:#e8e8e8;color:#555}.chapter-content__tag--type{background:var(--color-main-green);color:var(--color-white)}.chapter-content__title{font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);line-height:var(--line-height-tight);margin-bottom:var(--spacing-4)}.chapter-content__summary{font-size:var(--font-size-base);color:#666;line-height:var(--line-height-relaxed)}.chapter-content__divider{height:1px;background:linear-gradient(90deg,transparent,var(--color-pale-green),transparent);margin-bottom:var(--spacing-10)}.chapter-content__body{margin-bottom:var(--spacing-10);line-height:1.85;color:var(--color-dark-gray);font-size:var(--font-size-base)}.chapter-intro{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease;margin-bottom:var(--spacing-10);font-size:var(--font-size-lg);color:#444;line-height:1.9}.chapter-intro.section-visible{opacity:1;transform:translateY(0)}.chapter-intro p{margin-bottom:var(--spacing-5);word-break:keep-all}.chapter-section{position:relative;background:var(--color-white);border:1px solid #eee;border-radius:16px;padding:var(--spacing-8) var(--spacing-6);padding-top:var(--spacing-10);margin-bottom:var(--spacing-8);box-shadow:0 2px 12px #00000008;opacity:0;transform:translateY(32px);transition:opacity .7s ease,transform .7s ease,box-shadow .3s ease}.chapter-section.section-visible{opacity:1;transform:translateY(0)}.chapter-section:hover{box-shadow:0 4px 24px #0000000f}.chapter-section__number{position:absolute;top:-14px;left:24px;width:28px;height:28px;background:var(--color-main-green);color:var(--color-white);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:var(--font-weight-bold);box-shadow:0 2px 6px #203c2e4d}.chapter-section__heading{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin-bottom:var(--spacing-5);padding-bottom:var(--spacing-3);border-bottom:2px solid var(--color-pale-green)}.chapter-section__body p{margin-bottom:var(--spacing-5);word-break:keep-all}.chapter-section__body strong,.chapter-intro strong{font-weight:var(--font-weight-bold);color:var(--color-main-green);background:linear-gradient(transparent 60%,#c7d8b773 60%);padding:0 2px;border-radius:2px}.chapter-section__body ul,.chapter-section__body ol{margin:var(--spacing-4) 0;padding-left:var(--spacing-6)}.chapter-section__body li{margin-bottom:var(--spacing-2)}.chapter-section__body img{display:block;max-width:100%;margin:var(--spacing-8) auto;border-radius:12px;box-shadow:0 4px 20px #00000014}.chapter-section__body blockquote,.chapter-intro blockquote{background:linear-gradient(135deg,#c7d8b733,#e3d9bd26);border-left:4px solid var(--color-main-green);border-radius:0 12px 12px 0;padding:var(--spacing-5) var(--spacing-6);margin:var(--spacing-6) 0;font-size:var(--font-size-sm);color:#333;line-height:1.7}.chapter-content__quiz-action{display:flex;justify-content:center;margin-bottom:var(--spacing-10);padding:var(--spacing-8) 0;background:linear-gradient(180deg,transparent,rgba(199,216,183,.15),transparent);border-radius:16px}.chapter-content__nav{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-4);padding-top:var(--spacing-8);border-top:1px solid #e0e0e0}.chapter-content__nav-btn{display:flex;flex-direction:column;gap:4px;width:100%;padding:var(--spacing-4) var(--spacing-5);text-align:left;background:var(--color-white);border:1px solid #e0e0e0;border-radius:10px;transition:all .2s}.chapter-content__nav-btn:hover{border-color:var(--color-main-green);box-shadow:0 2px 8px #203c2e14;transform:translateY(-1px)}.chapter-content__nav-item--next .chapter-content__nav-btn{text-align:right}.chapter-content__nav-label{font-size:var(--font-size-xs);color:#999}.chapter-content__nav-title{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-dark-gray)}@keyframes fadeSlideDown{0%{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.chapter-content{padding:var(--spacing-4) 0 var(--spacing-10)}.chapter-content__title{font-size:var(--font-size-2xl)}.chapter-content__nav{grid-template-columns:1fr}.chapter-section{background:transparent;border:none;box-shadow:none;padding:0;padding-top:var(--spacing-6);margin-bottom:var(--spacing-4)}.chapter-section:hover{box-shadow:none}.chapter-section__number{position:static;margin-bottom:var(--spacing-2)}.chapter-section__heading{margin-bottom:var(--spacing-3)}.chapter-section__chunk{background:var(--color-white);border:1px solid #eee;border-radius:12px;padding:var(--spacing-4) var(--spacing-5);margin-bottom:var(--spacing-3);box-shadow:0 1px 6px #00000008}.chapter-section__chunk p{margin-bottom:0}.chapter-section__chunk{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}.chapter-section__chunk.section-visible{opacity:1;transform:translateY(0)}.chapter-section{opacity:1;transform:none}}.achievement-header{margin-bottom:var(--spacing-8);animation:headerFadeIn .6s ease-out}.achievement-header__top{display:flex;justify-content:space-between;align-items:center;margin-top:var(--spacing-6);margin-bottom:var(--spacing-6)}.achievement-header__title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin-bottom:var(--spacing-1)}.achievement-header__subtitle{font-size:var(--font-size-sm);color:#666}.achievement-header__title-card{display:flex;flex-direction:column;align-items:center;gap:4px;background:linear-gradient(135deg,#fffef5,#fff9e0);border:2px solid #f5d764;border-radius:12px;padding:var(--spacing-3) var(--spacing-6);flex-shrink:0;animation:titleCardPop .5s cubic-bezier(.34,1.56,.64,1) .3s both}@keyframes titleCardPop{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.achievement-header__title-label{font-size:11px;font-weight:var(--font-weight-semibold);color:#b8a040;letter-spacing:.5px}.achievement-header__title-value{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.achievement-header__title-empty{font-size:var(--font-size-sm);color:#ccc}.achievement-header__progress-card{background:var(--color-white);border:1px solid #eee;border-radius:12px;padding:var(--spacing-5) var(--spacing-6)}.achievement-header__progress-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-3)}.achievement-header__progress-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-dark-gray)}.achievement-header__progress-count{font-size:var(--font-size-sm);color:#999}.achievement-header__progress-count strong{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);color:var(--color-main-green)}.achievement-header__progress-bar{height:10px;background:#e8e8e8;border-radius:5px;overflow:hidden}.achievement-header__progress-fill{height:100%;background:linear-gradient(90deg,var(--color-main-green),var(--color-pale-green));border-radius:5px;transition:width .5s ease}@media(max-width:768px){.achievement-header__top{flex-direction:column;align-items:flex-start;gap:var(--spacing-4)}.achievement-header__title{font-size:var(--font-size-2xl)}}.achievement-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:var(--spacing-2);width:100%;padding:var(--spacing-6);border-radius:16px;border:2px solid transparent;background:var(--color-white);text-align:left;cursor:pointer;transition:all .3s cubic-bezier(.25,.46,.45,.94);box-shadow:0 2px 8px #0000000a;opacity:0;transform:translateY(20px)}.achievement-card.achievement-visible{opacity:1;transform:translateY(0)}.achievement-card--achieved{border-color:#f5d764;background:linear-gradient(145deg,#fffef5,#fff9e0,#fef4c8);box-shadow:0 2px 12px #f5d76426}.achievement-card--achieved .achievement-card__shimmer{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}.achievement-card--achieved .achievement-card__shimmer:after{content:"";position:absolute;top:-50%;left:-60%;width:40%;height:200%;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.5) 45%,rgba(255,255,255,.8) 50%,rgba(255,255,255,.5) 55%,transparent 60%);transform:rotate(25deg);animation:cardShimmer 4s ease-in-out infinite}@keyframes cardShimmer{0%,to{left:-60%}50%{left:120%}}.achievement-card--achieved.achievement-visible:hover{transform:translateY(-4px);box-shadow:0 8px 28px #f5d7644d;animation:cardWiggle .5s ease-in-out}@keyframes cardWiggle{0%{transform:translateY(-4px) rotate(0)}20%{transform:translateY(-4px) rotate(-1.5deg)}40%{transform:translateY(-4px) rotate(1.5deg)}60%{transform:translateY(-4px) rotate(-.8deg)}80%{transform:translateY(-4px) rotate(.8deg)}to{transform:translateY(-4px) rotate(0)}}.achievement-card--locked{background:linear-gradient(135deg,#f7f7f7,#efefef);opacity:0;border-color:#e8e8e8}.achievement-card--locked.achievement-visible{opacity:.65}.achievement-card--locked:hover{opacity:.8}.achievement-card__title-badge{position:absolute;top:-8px;left:14px;font-size:11px;font-weight:var(--font-weight-bold);color:var(--color-white);background:linear-gradient(135deg,var(--color-main-green),#4a8c6f);padding:2px 10px;border-radius:8px;box-shadow:0 2px 8px #203c2e59;animation:badgePop .4s cubic-bezier(.34,1.56,.64,1)}@keyframes badgePop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.15)}to{transform:scale(1);opacity:1}}.achievement-card__icon{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,#f5d76440,#f5d7641a);display:flex;align-items:center;justify-content:center;margin-bottom:var(--spacing-2);transition:transform .3s ease,box-shadow .3s ease}.achievement-card--achieved:hover .achievement-card__icon{transform:scale(1.15) rotate(-5deg);box-shadow:0 4px 12px #f5d7644d}.achievement-card--locked .achievement-card__icon{background:#e8e8e8}.achievement-card__icon img{width:100%;height:100%;object-fit:cover;border-radius:50%}.achievement-card__lock-icon{color:#bbb;opacity:.6}.achievement-card__reward{position:absolute;top:14px;right:14px;font-size:11px;font-weight:var(--font-weight-bold);color:var(--color-main-green);background:#c7d8b759;padding:3px 10px;border-radius:6px;letter-spacing:-.3px}.achievement-card__name{font-size:var(--font-size-base);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);line-height:1.3}.achievement-card__category{font-size:var(--font-size-xs);color:#aaa;display:inline-flex;align-items:center;gap:4px}.achievement-card__category:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--color-pale-green)}.achievement-card--locked .achievement-card__category:before{background:#ccc}.achievement-card__date{font-size:var(--font-size-xs);color:var(--color-main-green);font-weight:var(--font-weight-semibold);margin-top:auto}.achievement-card__status{font-size:var(--font-size-xs);color:#bbb;margin-top:auto}.achievement-grid__filters{display:flex;gap:var(--spacing-2);margin-bottom:var(--spacing-8);animation:filtersFadeIn .5s ease-out .3s both}@keyframes filtersFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.achievement-grid__filter-btn{padding:var(--spacing-2) var(--spacing-5);border-radius:20px;border:1px solid #ddd;background:var(--color-white);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:#666;cursor:pointer;transition:all .2s}.achievement-grid__filter-btn:hover{border-color:var(--color-main-green);color:var(--color-main-green)}.achievement-grid__filter-btn--active{background:var(--color-dark-gray);border-color:var(--color-dark-gray);color:var(--color-white)}.achievement-grid__filter-btn--active:hover{border-color:var(--color-dark-gray);color:var(--color-white)}.achievement-grid__group{margin-bottom:var(--spacing-8)}.achievement-grid__group-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-2);border-bottom:2px solid var(--color-pale-green)}.achievement-grid__cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-4)}.achievement-grid__empty{text-align:center;color:#999;padding:var(--spacing-16) 0;font-size:var(--font-size-base)}@media(max-width:1024px){.achievement-grid__cards{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.achievement-grid__cards{grid-template-columns:1fr}.achievement-grid__filters{flex-wrap:wrap}}.achievement-detail{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--spacing-4) 0;overflow:visible;transition:all .4s cubic-bezier(.34,1.56,.64,1)}@media(min-width:500px){.achievement-detail--expanded{flex-direction:row;align-items:center;justify-content:center;text-align:left;gap:var(--spacing-5);padding:var(--spacing-4)}}@media(min-width:500px){.achievement-detail--expanded .achievement-detail__content{flex:1;max-width:280px;display:flex;flex-direction:column;align-items:flex-start}}.achievement-detail__content{display:contents}.achievement-detail__confetti{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden}.achievement-detail__particle{position:absolute;top:-10px;width:8px;height:8px;border-radius:2px;opacity:0;animation:confettiFall 1.8s ease-out forwards}.achievement-detail__particle:nth-child(1){left:5%;background:#f5d764;animation-delay:0s;width:6px;height:10px}.achievement-detail__particle:nth-child(2){left:12%;background:#ff6b8a;animation-delay:.05s;border-radius:50%}.achievement-detail__particle:nth-child(3){left:20%;background:#4ecdc4;animation-delay:.1s;width:10px;height:6px}.achievement-detail__particle:nth-child(4){left:28%;background:#f5d764;animation-delay:.02s;border-radius:50%}.achievement-detail__particle:nth-child(5){left:35%;background:#a78bfa;animation-delay:.12s}.achievement-detail__particle:nth-child(6){left:42%;background:#ff6b8a;animation-delay:.08s;width:6px;height:10px}.achievement-detail__particle:nth-child(7){left:50%;background:#4ecdc4;animation-delay:.03s}.achievement-detail__particle:nth-child(8){left:58%;background:#f5d764;animation-delay:.15s;border-radius:50%}.achievement-detail__particle:nth-child(9){left:65%;background:#ff9f43;animation-delay:.06s;width:10px;height:6px}.achievement-detail__particle:nth-child(10){left:72%;background:#a78bfa;animation-delay:.1s}.achievement-detail__particle:nth-child(11){left:80%;background:#ff6b8a;animation-delay:.04s;border-radius:50%}.achievement-detail__particle:nth-child(12){left:88%;background:#4ecdc4;animation-delay:.13s;width:6px;height:10px}.achievement-detail__particle:nth-child(13){left:95%;background:#f5d764;animation-delay:.07s}.achievement-detail__particle:nth-child(14){left:8%;background:#ff9f43;animation-delay:.18s;border-radius:50%}.achievement-detail__particle:nth-child(15){left:16%;background:#a78bfa;animation-delay:.09s;width:10px;height:6px}.achievement-detail__particle:nth-child(16){left:24%;background:#4ecdc4;animation-delay:.2s}.achievement-detail__particle:nth-child(17){left:32%;background:#f5d764;animation-delay:.11s;border-radius:50%}.achievement-detail__particle:nth-child(18){left:40%;background:#ff6b8a;animation-delay:.16s;width:6px;height:10px}.achievement-detail__particle:nth-child(19){left:48%;background:#ff9f43;animation-delay:.03s}.achievement-detail__particle:nth-child(20){left:55%;background:#a78bfa;animation-delay:.14s;border-radius:50%}.achievement-detail__particle:nth-child(21){left:62%;background:#4ecdc4;animation-delay:.07s;width:10px;height:6px}.achievement-detail__particle:nth-child(22){left:75%;background:#f5d764;animation-delay:.19s}.achievement-detail__particle:nth-child(23){left:83%;background:#ff6b8a;animation-delay:.05s;border-radius:50%}.achievement-detail__particle:nth-child(24){left:92%;background:#ff9f43;animation-delay:.11s;width:6px;height:10px}@keyframes confettiFall{0%{opacity:1;transform:translateY(0) rotate(0) scale(1)}50%{opacity:1}to{opacity:0;transform:translateY(320px) rotate(720deg) scale(.3)}}.achievement-detail__icon-wrap{position:relative;z-index:1;width:100px;height:100px;border-radius:50%;background:linear-gradient(135deg,#fff9e0,#f5d764);display:flex;align-items:center;justify-content:center;margin-bottom:var(--spacing-4);box-shadow:0 4px 20px #f5d76466;animation:iconBounce .6s cubic-bezier(.34,1.56,.64,1) .2s forwards}@keyframes iconBounce{0%{transform:scale(.3);opacity:0}60%{transform:scale(1.1)}to{opacity:1}}.achievement-detail__icon-wrap--locked{background:#e8e8e8;box-shadow:none;animation:none}.achievement-detail__icon{width:100%;height:100%;object-fit:cover;border-radius:50%}.achievement-detail__icon-wrap:not(.achievement-detail__icon-wrap--locked){cursor:pointer;transition:all .5s cubic-bezier(.34,1.56,.64,1);position:relative}.achievement-detail__icon-wrap:not(.achievement-detail__icon-wrap--locked):after{content:"클릭하여 확대";position:absolute;top:-24px;left:50%;transform:translate(-50%);font-size:11px;color:#999;white-space:nowrap;opacity:0;transition:opacity .2s ease}.achievement-detail__icon-wrap:not(.achievement-detail__icon-wrap--locked):hover:after{opacity:1}.achievement-detail__icon-wrap--expanded{width:160px!important;height:160px!important;flex-shrink:0;box-shadow:0 0 0 4px #fffffff2,0 12px 40px #0003}@media(min-width:500px){.achievement-detail__icon-wrap--expanded{width:180px!important;height:180px!important;margin-bottom:0!important}}.achievement-detail__icon-wrap--expanded:after{content:"클릭하여 축소"!important;opacity:1!important;top:-24px}.achievement-detail__trophy-icon{color:#d4a017}.achievement-detail__lock-icon{color:#bbb;opacity:.5}.achievement-detail__badge{position:relative;z-index:1;display:inline-block;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);color:var(--color-main-green);background:#c7d8b74d;padding:4px 14px;border-radius:12px;margin-bottom:var(--spacing-3);animation:badgeFadeIn .4s ease-out .5s both}@keyframes badgeFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.achievement-detail__name{position:relative;z-index:1;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin-bottom:var(--spacing-2)}.achievement-detail__date{position:relative;z-index:1;font-size:var(--font-size-sm);color:var(--color-main-green);margin-bottom:var(--spacing-4)}.achievement-detail__desc{position:relative;z-index:1;font-size:var(--font-size-sm);color:#666;line-height:var(--line-height-relaxed);max-width:360px;margin-bottom:var(--spacing-6)}@media(min-width:500px){.achievement-detail--expanded .achievement-detail__desc{max-width:none}}.achievement-detail__actions{position:relative;z-index:1;width:100%;display:flex;justify-content:center}@media(min-width:500px){.achievement-detail--expanded .achievement-detail__actions{justify-content:flex-start}}.achievement-detail__category-tag{display:inline-block;font-size:var(--font-size-xs);color:#999;background:#f0f0f0;padding:4px 10px;border-radius:4px;margin-bottom:var(--spacing-4)}.achievement-detail__locked-msg{font-size:var(--font-size-sm);color:#999;margin-top:var(--spacing-2)}.chat-room-container{display:flex;flex-direction:column;margin:32px auto;height:calc(100vh - 134px);background:#fff;max-width:1400px;border-radius:12px;border:1px solid #E0E0E0;box-shadow:0 8px 30px #00000014;overflow:hidden;position:relative}.chat-header{display:flex;justify-content:space-between;align-items:center;padding:0 32px;height:80px;background:#fff;border-bottom:1px solid #E0E0E0;flex-shrink:0}.chat-header-left{display:flex;align-items:center;gap:16px}.chat-room-avatar{width:56px;height:56px;background:#c7d8b7;display:flex;align-items:center;justify-content:center;flex-shrink:0}.chat-room-avatar span{color:#203c2e;font-size:16px;font-weight:700;font-family:Arial,sans-serif}.chat-header-info{display:flex;flex-direction:column;gap:4px}.chat-room-name{font-size:20px;font-weight:700;color:#282828;margin:0;font-family:Arial,sans-serif}.chat-room-meta{display:flex;align-items:center;gap:8px}.chat-online-dot{width:6px;height:6px;background:#8fae5d;border-radius:50%}.chat-online-dot.connected{background:#4caf50}.chat-online-dot.reconnecting{background:#fadb13;animation:pulse 1.5s ease-in-out infinite}.chat-online-dot.disconnected{background:#dc0000}.chat-participant-count{font-size:14px;color:#666;font-family:Arial,sans-serif}.chat-room-type-tag{padding:4px 12px;background:#f8f8f8;font-size:12px;color:#666;font-family:Arial,sans-serif}.chat-header-actions{display:flex;gap:12px}.chat-action-btn.participants-btn{display:flex;align-items:center;gap:8px;padding:0 16px;height:44px;background:#f8f8f8;border:1px solid #E0E0E0;font-size:15px;color:#666;cursor:pointer;font-family:Arial,sans-serif}.chat-action-btn.participants-btn.active{background:#e8f5e9;border-color:#4caf50}.dots-icon{display:flex;gap:4px}.dots-icon .dot{width:5px;height:5px;background:#666;border-radius:50%}.chat-action-btn.leave-btn{padding:0 16px;height:44px;background:#fff;border:1px solid #E0E0E0;font-size:15px;color:#666;cursor:pointer;font-family:Arial,sans-serif}.chat-action-btn.leave-btn:hover{background:#ffebee;color:#dc0000;border-color:#dc0000}.chat-main{display:flex;flex:1;min-height:0;overflow:hidden}.chat-messages-area{flex:1;display:flex;flex-direction:column;background:#fff;min-width:0}.chat-messages-area.with-sidebar{border-right:1px solid #E0E0E0}.connection-status{display:flex;align-items:center;gap:12px;padding:14px 24px;flex-shrink:0}.connection-status.connected{background:#e8f5e9}.connection-status.connected .status-dot{width:12px;height:12px;background:#4caf50;border-radius:50%}.connection-status.connected .status-text{color:#4caf50;font-size:13px;font-family:Arial,sans-serif}.connection-status.reconnecting{background:#fff8e6}.connection-status.reconnecting .status-dot{width:12px;height:12px;background:#fadb13;border-radius:50%;animation:pulse 1.5s ease-in-out infinite}.connection-status.reconnecting .status-text{color:#96773d;font-size:13px;font-family:Arial,sans-serif}.connection-status.disconnected{background:#ffebee}.connection-status.disconnected .status-dot{width:12px;height:12px;background:#dc0000;border-radius:50%}.connection-status.disconnected .status-text{color:#dc0000;font-size:13px;font-family:Arial,sans-serif}.reconnect-btn{margin-left:auto;padding:8px 20px;background:#dc0000;color:#fff;border:none;font-size:13px;font-weight:700;cursor:pointer;font-family:Arial,sans-serif}.reconnect-btn:hover{background:#b00000}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.chat-messages{flex:1;overflow-y:auto;padding:24px 32px;background:#fff}.chat-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#999}.chat-empty-icon{width:80px;height:80px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}.chat-empty p{font-size:16px;font-weight:600;color:#666;margin:0 0 8px}.chat-empty-hint{font-size:14px;color:#999}.chat-date-divider{display:flex;align-items:center;justify-content:center;margin:24px 0;gap:16px}.chat-date-line{flex:1;height:1px;background:#e0e0e0}.chat-date-text{color:#999;font-size:13px;font-family:Arial,sans-serif;white-space:nowrap}.chat-message{display:flex;margin-bottom:16px}.chat-message.others{justify-content:flex-start;align-items:flex-start;gap:12px}.message-avatar{width:64px;height:64px;display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:700;font-family:Arial,sans-serif;flex-shrink:0}.message-content-wrapper{display:flex;flex-direction:column;gap:4px;max-width:700px}.message-content-wrapper.mine{flex-direction:row;align-items:flex-end;gap:8px}.message-header{display:flex;align-items:center;gap:8px}.message-sender{font-size:15px;font-weight:700;color:#282828;font-family:Arial,sans-serif}.message-time{font-size:13px;color:#999;font-family:Arial,sans-serif}.chat-message.others .message-bubble{background:#f8f8f8;padding:12px 20px;max-width:100%}.chat-message.mine{justify-content:flex-end;align-items:flex-end;gap:8px}.message-time-right{display:flex;align-items:flex-end;padding-bottom:4px}.chat-message.mine .message-bubble{background:#fadb13;padding:12px 20px;max-width:856px}.message-content{margin:0;font-size:16px;color:#282828;line-height:1.5;font-family:Arial,sans-serif;white-space:pre-wrap;word-break:break-word}.message-link{color:#2563eb;text-decoration:underline}.message-link:hover{color:#1d4ed8}.system-message{display:flex;justify-content:center;margin:16px 0}.system-message span{padding:8px 16px;background:#f0f0f0;color:#666;font-size:13px;font-family:Arial,sans-serif;border-radius:16px}.chat-input-area{display:flex;align-items:center;gap:12px;padding:22px 32px;background:#fff;border-top:1px solid #E0E0E0;flex-shrink:0}.chat-input-wrapper{flex:1}.chat-input{width:100%;height:56px;padding:0 20px;background:#f8f8f8;border:1px solid #E0E0E0;font-size:16px;color:#282828;outline:none;font-family:Arial,sans-serif}.chat-input::placeholder{color:#999}.chat-input:focus{border-color:#203c2e;background:#fff}.chat-input:disabled{background:#f0f0f0;cursor:not-allowed}.chat-send-btn{width:120px;height:56px;background:#203c2e;color:#fff;border:none;font-size:16px;font-weight:700;cursor:pointer;font-family:Arial,sans-serif}.chat-send-btn:hover:not(:disabled){background:#2a4d3c}.chat-send-btn:disabled{background:#ccc;cursor:not-allowed}.chat-participants-sidebar{width:280px;background:#fafafa;border-left:1px solid #E0E0E0;flex-shrink:0;display:flex;flex-direction:column}.participants-header{display:flex;align-items:center;gap:8px;padding:20px;border-bottom:1px solid #E0E0E0}.participants-header h3{margin:0;font-size:16px;font-weight:700;color:#282828;font-family:Arial,sans-serif}.participants-count{font-size:14px;color:#666;font-family:Arial,sans-serif}.participants-close-btn{margin-left:auto;width:32px;height:32px;background:#f8f8f8;border:none;cursor:pointer;font-size:14px;color:#666}.participants-list{flex:1;overflow-y:auto;padding:12px}.participants-loading{padding:20px;text-align:center;color:#999;font-size:14px}.participant-item{display:flex;align-items:center;gap:12px;padding:12px;border-radius:8px}.participant-item:hover{background:#fff}.participant-avatar{width:48px;height:48px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;font-family:Arial,sans-serif;flex-shrink:0}.participant-name{font-size:14px;color:#282828;font-family:Arial,sans-serif}.owner-badge{margin-left:8px;padding:2px 8px;background:#203c2e;color:#fff;font-size:11px;font-weight:700}.leave-modal-overlay{position:fixed;inset:0;background:#1c191799;display:flex;align-items:center;justify-content:center;z-index:1000}.leave-modal{width:400px;background:#fff;padding:32px;position:relative}.leave-modal-close{position:absolute;top:16px;right:16px;width:32px;height:32px;background:#f8f8f8;border:none;cursor:pointer;font-size:14px;color:#666;display:flex;align-items:center;justify-content:center}.leave-modal-close:hover{background:#e0e0e0}.leave-modal h3{margin:0 0 16px;font-size:20px;font-weight:700;color:#282828;font-family:Arial,sans-serif}.leave-modal p{margin:0 0 24px;font-size:15px;color:#666;font-family:Arial,sans-serif}.leave-modal-actions{display:flex;gap:12px}.leave-modal-cancel{flex:1;height:48px;background:#fff;border:1px solid #E0E0E0;font-size:15px;color:#666;cursor:pointer;font-family:Arial,sans-serif}.leave-modal-confirm{flex:1;height:48px;background:#dc0000;border:none;font-size:15px;font-weight:700;color:#fff;cursor:pointer;font-family:Arial,sans-serif}.chat-error-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:calc(100vh - 70px);padding:40px}.error-icon{font-size:64px;margin-bottom:24px}.chat-error-state p{font-size:18px;color:#666;margin:0 0 24px;font-family:Arial,sans-serif}.error-back-btn{padding:12px 32px;background:#203c2e;color:#fff;border:none;font-size:15px;font-weight:600;cursor:pointer;font-family:Arial,sans-serif}.error-back-btn:hover{background:#2a4d3c}.chat-error-banner{padding:12px 24px;background:#ffebee;color:#dc0000;font-size:14px;font-family:Arial,sans-serif;text-align:center}.context-menu{position:fixed;background:#fff;border:1px solid #E0E0E0;box-shadow:0 4px 12px #00000026;border-radius:4px;z-index:1000;min-width:120px}.context-menu-item{display:flex;align-items:center;gap:8px;width:100%;padding:10px 16px;background:none;border:none;font-size:14px;color:#282828;cursor:pointer;font-family:Arial,sans-serif}.context-menu-item:hover{background:#f8f8f8}.context-menu-icon{font-size:16px}.toast-container{position:fixed;bottom:24px;right:24px;display:flex;flex-direction:column;gap:12px;z-index:9999}.toast{display:flex;align-items:center;gap:12px;padding:16px 20px;background:#fff;border-radius:8px;box-shadow:0 4px 12px #00000026;min-width:280px;max-width:400px;animation:slideInRight .3s ease;position:relative;overflow:hidden}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.toast-icon{width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:12px;font-weight:700;flex-shrink:0}.toast-success .toast-icon{background:#e8f5e9;color:#4caf50}.toast-error .toast-icon{background:#ffebee;color:#dc0000}.toast-info .toast-icon{background:#e3f2fd;color:#2563eb}.toast-content{flex:1;display:flex;flex-direction:column;gap:2px}.toast-title{font-size:14px;font-weight:600;color:#282828;font-family:Arial,sans-serif}.toast-message{font-size:13px;color:#666;font-family:Arial,sans-serif}.toast-close{width:24px;height:24px;background:none;border:none;font-size:14px;color:#999;cursor:pointer;flex-shrink:0}.toast-close:hover{color:#666}.toast-progress{position:absolute;bottom:0;left:0;height:3px;animation:progressShrink 3s linear forwards}.toast-success .toast-progress{background:#4caf50}.toast-error .toast-progress{background:#dc0000}.toast-info .toast-progress{background:#2563eb}@keyframes progressShrink{0%{width:100%}to{width:0}}.skeleton{background:#e0e0e0;animation:skeleton-pulse 1.5s ease-in-out infinite}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.6}}.skeleton-room-avatar{width:56px;height:56px}.skeleton-title{width:200px;height:22px}.skeleton-meta{width:120px;height:16px;margin-top:4px}.skeleton-btn{width:140px;height:44px}.skeleton-date{width:100px;height:16px}.skeleton-message{display:flex;margin-bottom:16px}.skeleton-message.others{gap:12px}.skeleton-message.mine{justify-content:flex-end}.skeleton-avatar{width:64px;height:64px}.skeleton-content{display:flex;flex-direction:column;gap:8px}.skeleton-name{width:80px;height:16px}.skeleton-bubble{width:400px;height:80px}.skeleton-bubble-mine{width:300px;height:60px}.skeleton-input{flex:1;height:56px}.skeleton-send-btn{width:120px;height:56px}.chat-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:calc(100vh - 70px);color:#666;font-size:16px}@media(max-width:1200px){.chat-participants-sidebar{width:240px}.message-avatar{width:48px;height:48px;font-size:14px}}@media(max-width:768px){.chat-header{flex-wrap:wrap;height:auto;padding:12px 16px;gap:12px}.chat-room-avatar{width:40px;height:40px}.chat-room-name{font-size:16px}.chat-header-actions{width:100%;justify-content:flex-end}.chat-action-btn{font-size:13px;padding:0 12px;height:36px}.chat-messages{padding:16px}.message-avatar{width:40px;height:40px;font-size:12px}.chat-message.mine .message-bubble,.chat-message.others .message-bubble{max-width:85%}.chat-input-area{padding:12px 16px}.chat-input{height:44px;font-size:14px}.chat-send-btn{width:80px;height:44px;font-size:14px}.chat-participants-sidebar{position:fixed;right:0;top:70px;bottom:0;width:280px;z-index:100;box-shadow:-4px 0 16px #0000001a}.toast-container{bottom:16px;right:16px;left:16px}.toast{min-width:auto;max-width:none}}.myinfo-container{display:flex;justify-content:center;align-items:flex-start;min-height:calc(100vh - 200px);padding:40px 20px;background:linear-gradient(180deg,#f5f5f5,#e8f0e8)}.myinfo-wrapper{width:100%;max-width:640px}.myinfo-header{text-align:center;margin-bottom:24px}.myinfo-header-logo{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:8px}.myinfo-logo-img{width:40px;height:40px;object-fit:contain}.myinfo-logo-text{font-size:24px;font-weight:700;color:#203c2e;letter-spacing:-.5px}.myinfo-header-title{font-size:16px;font-weight:500;color:#666;margin:0}.myinfo-card{width:100%}.myinfo-title{font-size:20px;font-weight:600;color:#203c2e;margin:0 0 28px;padding-bottom:16px;border-bottom:1px solid #e8e8e8}.myinfo-field{margin-bottom:24px}.myinfo-field-label{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:#333;margin-bottom:8px}.myinfo-field-label-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.myinfo-field-label-left{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:#333}.myinfo-readonly-badge{font-size:12px;color:#888;font-weight:400}.profile-icon{width:20px;height:20px;color:#666}.myinfo-input-wrapper{position:relative;width:100%}.myinfo-input{width:100%;padding:14px 16px;font-size:15px;border:1px solid #e0e0e0;border-radius:8px;background-color:#fff;color:#333;transition:border-color .2s,box-shadow .2s;box-sizing:border-box}.myinfo-input:focus{outline:none;border-color:#203c2e;box-shadow:0 0 0 3px #203c2e1a}.myinfo-input:disabled{background-color:#fafafa;color:#666;cursor:not-allowed}.myinfo-input-with-icon{padding-right:48px}.myinfo-password-toggle{position:absolute;right:14px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;color:#888;transition:color .2s}.myinfo-password-toggle:hover{color:#333}.myinfo-propensity-badge{width:100%;padding:14px 16px;font-size:15px;font-weight:500;background-color:#e3d9bd;border:none;border-radius:8px;color:#333;box-sizing:border-box}.myinfo-social-badge{width:100%;padding:14px 16px;font-size:14px;font-weight:400;background-color:#f5f5f5;border:1px solid #e0e0e0;border-radius:8px;color:#888;box-sizing:border-box}.myinfo-buttons{display:flex;gap:16px;margin-top:32px}.myinfo-buttons .myinfo-btn-reset,.myinfo-buttons .myinfo-btn-save{flex:1}.myinfo-message{display:flex;align-items:center;gap:10px;margin-top:20px;padding:14px 16px;border-radius:10px;font-size:14px}.myinfo-msg-icon{width:20px;height:20px;flex-shrink:0}.myinfo-message-error{background-color:#fef2f2;color:#dc2626;border:1px solid #fecaca}.myinfo-message-error .myinfo-msg-icon{color:#dc2626}.myinfo-message-success{background-color:#f0fdf4;color:#16a34a;border:1px solid #bbf7d0}.myinfo-message-success .myinfo-msg-icon{color:#16a34a}.myinfo-account-actions{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:28px}.myinfo-action-divider{color:#ddd;font-size:14px}.myinfo-action-btn{background:none;border:none;font-size:14px;cursor:pointer;padding:8px 12px;border-radius:6px;transition:all .2s ease}.myinfo-action-logout{color:#666}.myinfo-action-logout:hover{color:#203c2e;text-decoration:underline}.myinfo-action-withdraw{color:#999}.myinfo-action-withdraw:hover{color:#dc2626}.survey-container{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;background:linear-gradient(180deg,#f5f5f5,#e8f0e8)}.survey-header{text-align:center;margin-bottom:32px}.survey-logo{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:24px}.survey-logo-img{width:48px;height:48px;object-fit:contain}.survey-logo-text{font-size:28px;font-weight:700;color:#203c2e;letter-spacing:-.5px}.survey-title{font-size:24px;font-weight:700;color:#203c2e;margin:0 0 12px}.survey-description{font-size:15px;color:#666;margin:0}.survey-card{width:100%;max-width:520px;background:#fff;border-radius:16px;box-shadow:0 4px 20px #00000014;padding:32px}.survey-progress-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.survey-progress-text{font-size:14px;font-weight:500;color:#333}.survey-progress-percent{font-size:14px;font-weight:600;color:#203c2e}.survey-progress-bar{width:100%;height:8px;background-color:#e0e0e0;border-radius:4px;overflow:hidden;margin-bottom:24px}.survey-progress-fill{height:100%;background:linear-gradient(90deg,#203c2e,#3d6b4f);border-radius:4px;transition:width .3s ease}.survey-question-card{background-color:#fff9e0;border-radius:12px;padding:28px 24px;margin-bottom:24px;position:relative}.survey-question-number{display:inline-block;background-color:#203c2e;color:#fff;font-size:12px;font-weight:600;padding:4px 10px;border-radius:12px;margin-bottom:12px}.survey-question-text{font-size:15px;font-weight:500;color:#333;line-height:1.6;margin:0;text-align:center}.survey-options{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}.survey-option{display:flex;align-items:center;gap:12px;width:100%;padding:16px 20px;background:#fff;border:2px solid #e8e8e8;border-radius:12px;font-size:15px;color:#333;cursor:pointer;transition:all .2s ease;text-align:left}.survey-option:hover{border-color:#203c2e;background-color:#fafafa}.survey-option.selected{border-color:#203c2e;background-color:#f0f7f3}.survey-option-number{display:none}.survey-option-label{flex:1}.survey-option-radio{width:20px;height:20px;border:2px solid #ccc;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:border-color .2s ease}.survey-option.selected .survey-option-radio{border-color:#203c2e}.survey-option-radio-dot{width:10px;height:10px;background-color:#203c2e;border-radius:50%}.survey-next-btn{width:100%;padding:16px;background-color:#203c2e;color:#fff;font-size:16px;font-weight:600;border:none;border-radius:12px;cursor:pointer;transition:background-color .2s ease}.survey-next-btn:hover:not(:disabled){background-color:#2a4f3c}.survey-next-btn:disabled{background-color:#ccc;cursor:not-allowed}.survey-error-box{display:flex;align-items:center;gap:10px;padding:14px 16px;background-color:#fef2f2;border:1px solid #fecaca;border-radius:10px;margin-bottom:16px;font-size:14px;color:#dc2626}.survey-error-icon{width:20px;height:20px;flex-shrink:0}.survey-footer-text{margin-top:24px;font-size:13px;color:#888;text-align:center}.survey-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;min-height:300px}.survey-loading p{font-size:15px;color:#666;margin:0}.survey-spinner{width:40px;height:40px;border:3px solid #e0e0e0;border-top-color:#203c2e;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.survey-error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;min-height:300px;text-align:center}.survey-error-container .survey-error-icon{width:48px;height:48px;color:#dc2626}.survey-error-container p{font-size:15px;color:#666;margin:0}.survey-retry-btn{padding:12px 24px;background-color:#203c2e;color:#fff;font-size:14px;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:background-color .2s ease}.survey-retry-btn:hover{background-color:#2a4f3c}.survey-result-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.survey-result-modal{background:#fff;border-radius:20px;padding:40px 32px;max-width:400px;width:100%;text-align:center;box-shadow:0 20px 60px #00000026;animation:modalIn .3s ease}@keyframes modalIn{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.survey-result-icon{font-size:48px;margin-bottom:16px}.survey-result-title{font-size:20px;font-weight:700;color:#333;margin:0 0 20px}.survey-result-type{display:inline-block;font-size:24px;font-weight:700;padding:12px 32px;border-radius:30px;margin-bottom:16px}.survey-result-type--AGGRESSIVE{background-color:#fef2f2;color:#dc2626}.survey-result-type--NEUTRAL{background-color:#fefce8;color:#ca8a04}.survey-result-type--STABLE{background-color:#f0fdf4;color:#16a34a}.survey-result-description{font-size:15px;color:#666;line-height:1.6;margin:0 0 24px}.survey-result-btn{width:100%;padding:16px;background-color:#203c2e;color:#fff;font-size:16px;font-weight:600;border:none;border-radius:12px;cursor:pointer;transition:background-color .2s ease}.survey-result-btn:hover{background-color:#2a4f3c}.quiz-card{width:100%;background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 12px #00000014;display:flex;flex-direction:column;gap:20px}.quiz-card__header{display:flex;justify-content:space-between;align-items:center;padding-bottom:16px;border-bottom:1px solid #e5e7eb}.quiz-card__sequence{font-size:15px;font-weight:600;color:#666}.quiz-card__type-badge{padding:6px 14px;background:#96773d;color:#fff;border-radius:6px;font-size:13px;font-weight:600}.quiz-card__question{font-size:19px;font-weight:600;color:#1a1a1a;line-height:1.6;margin:0;padding:8px 0}.quiz-card__options{display:flex;flex-direction:column;gap:12px}.quiz-card__options--ox{flex-direction:row;gap:16px}.quiz-card__option{padding:16px 20px;background:#f8f9fa;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:12px;font-size:16px;color:#333;text-align:left}.quiz-card__option:hover:not(:disabled){background:#f0f0f0;border-color:#8fae5d}.quiz-card__option--selected{background:#e8f4d8;border-color:#8fae5d;font-weight:600}.quiz-card__option:disabled{cursor:not-allowed;opacity:.6}.quiz-card__option--ox{flex:1;justify-content:center;font-size:32px;font-weight:700;padding:24px}.quiz-card__option-no{min-width:28px;height:28px;background:#203c2e;color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;flex-shrink:0}.quiz-card__option-text{flex:1;line-height:1.5}.quiz-card__submit{margin-top:8px}.quiz-card__error{padding:40px;text-align:center;color:#c94a3a;font-size:16px}@media(max-width:768px){.quiz-card{padding:20px;gap:16px}.quiz-card__question{font-size:17px}.quiz-card__option{padding:14px 18px;font-size:15px}.quiz-card__option--ox{font-size:28px;padding:20px}}@media(max-width:480px){.quiz-card{padding:18px;gap:14px}.quiz-card__header{padding-bottom:12px}.quiz-card__question{font-size:16px;padding:4px 0}.quiz-card__options{gap:10px}.quiz-card__options--ox{gap:12px}.quiz-card__option{padding:12px 16px;font-size:14px;gap:10px}.quiz-card__option--ox{font-size:24px;padding:18px}.quiz-card__option-no{min-width:24px;height:24px;font-size:13px}}.quiz-celebration{width:100%;max-width:600px;margin:0 auto;padding:var(--spacing-6) var(--spacing-4)}.quiz-celebration__content{background:linear-gradient(135deg,#fbf7be,#fadb13);border-radius:16px;padding:var(--spacing-8) var(--spacing-6);text-align:center;box-shadow:0 8px 24px #fadb134d;animation:celebration-appear .6s cubic-bezier(.34,1.56,.64,1)}@keyframes celebration-appear{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.quiz-celebration__icon-wrap{display:flex;justify-content:center;margin-bottom:var(--spacing-4);animation:celebration-icon-bounce .8s ease-out}@keyframes celebration-icon-bounce{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-20px) rotate(-10deg)}50%{transform:translateY(0) rotate(10deg)}75%{transform:translateY(-10px) rotate(-5deg)}}.quiz-celebration__icon{color:#203c2e;filter:drop-shadow(0 4px 12px rgba(32,60,46,.3))}.quiz-celebration__title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:#203c2e;line-height:var(--line-height-normal);margin-bottom:var(--spacing-4);animation:celebration-title-appear .5s ease-out .2s both}@keyframes celebration-title-appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.quiz-celebration__message{font-size:var(--font-size-base);font-weight:var(--font-weight-medium);color:#96773d;line-height:var(--line-height-relaxed);margin-bottom:var(--spacing-6);animation:celebration-message-appear .5s ease-out .4s both}@keyframes celebration-message-appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.quiz-celebration__actions{display:flex;gap:var(--spacing-3);justify-content:center;animation:celebration-actions-appear .5s ease-out .6s both}@keyframes celebration-actions-appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.quiz-celebration{padding:var(--spacing-4) var(--spacing-3)}.quiz-celebration__content{padding:var(--spacing-6) var(--spacing-4)}.quiz-celebration__icon{width:48px;height:48px}.quiz-celebration__title{font-size:var(--font-size-lg)}.quiz-celebration__message{font-size:var(--font-size-sm)}.quiz-celebration__actions{flex-direction:column;width:100%}.quiz-celebration__actions button{width:100%}}.quiz-feedback{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--spacing-6) var(--spacing-4)}.quiz-feedback__icon-wrap{margin-bottom:var(--spacing-4);animation:feedback-icon-appear .5s cubic-bezier(.34,1.56,.64,1)}@keyframes feedback-icon-appear{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.quiz-feedback__icon{filter:drop-shadow(0 2px 8px rgba(0,0,0,.15))}.quiz-feedback__icon--correct{color:#8fae5d}.quiz-feedback__icon--wrong{color:#c94a3a}.quiz-feedback__title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin-bottom:var(--spacing-5);animation:feedback-title-appear .4s ease-out .2s both}@keyframes feedback-title-appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.quiz-feedback--correct .quiz-feedback__title{color:#8fae5d}.quiz-feedback--wrong .quiz-feedback__title{color:#c94a3a}.quiz-feedback__answers{width:100%;display:flex;flex-direction:column;gap:var(--spacing-3);margin-bottom:var(--spacing-4);animation:feedback-answers-appear .4s ease-out .3s both}@keyframes feedback-answers-appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.quiz-feedback__answer-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-3);background-color:#f8f8f8;border-radius:8px}.quiz-feedback__answer-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:#666}.quiz-feedback__answer-value{font-size:var(--font-size-base);font-weight:var(--font-weight-bold);padding:4px 12px;border-radius:6px}.quiz-feedback__answer-value--correct{background-color:#8fae5d26;color:#8fae5d}.quiz-feedback__answer-value--wrong{background-color:#c94a3a26;color:#c94a3a}.quiz-feedback__note{font-size:var(--font-size-sm);color:#96773d;background-color:#fbf7be;padding:var(--spacing-2) var(--spacing-3);border-radius:6px;margin-bottom:var(--spacing-4);animation:feedback-note-appear .4s ease-out .4s both}@keyframes feedback-note-appear{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.quiz-feedback__actions{width:100%;animation:feedback-actions-appear .4s ease-out .5s both}@keyframes feedback-actions-appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.quiz-feedback{padding:var(--spacing-5) var(--spacing-3)}.quiz-feedback__icon-wrap{margin-bottom:var(--spacing-3)}.quiz-feedback__icon{width:56px;height:56px}.quiz-feedback__title{font-size:var(--font-size-lg);margin-bottom:var(--spacing-4)}}.quiz-progress{width:100%;background:#fff;border-radius:12px;padding:20px 28px;box-shadow:0 2px 12px #00000014}.quiz-progress__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.quiz-progress__title{font-size:17px;font-weight:700;color:#1a1a1a;margin:0}.quiz-progress__count{font-size:18px;color:#666;font-weight:500}.quiz-progress__count strong{font-size:22px;font-weight:700;color:#203c2e}.quiz-progress__bar{width:100%;height:10px;background:#e5e7eb;border-radius:999px;overflow:hidden;position:relative}.quiz-progress__fill{height:100%;background:linear-gradient(90deg,#8fae5d,#6b8e3d);border-radius:999px;transition:width .5s cubic-bezier(.4,0,.2,1);box-shadow:0 0 12px #8fae5d66}.quiz-progress__bonus-text{margin-top:8px;font-size:14px;color:#96773d;text-align:center;font-weight:500}@media(max-width:768px){.quiz-progress{padding:18px 24px}.quiz-progress__title{font-size:16px}.quiz-progress__count{font-size:17px}.quiz-progress__count strong{font-size:20px}.quiz-progress__bar{height:9px}}@media(max-width:480px){.quiz-progress{padding:16px 20px;border-radius:10px}.quiz-progress__title{font-size:15px}.quiz-progress__count{font-size:16px}.quiz-progress__count strong{font-size:19px}.quiz-progress__bar{height:8px}}.reward-notification{position:fixed;top:80px;right:20px;display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-3) var(--spacing-4);background:linear-gradient(135deg,#fadb13,#e6a23c);border-radius:12px;box-shadow:0 4px 16px #fadb1366;z-index:10000;animation:reward-slide-in .4s cubic-bezier(.34,1.56,.64,1);min-width:280px}@keyframes reward-slide-in{0%{transform:translate(120%) scale(.8);opacity:0}to{transform:translate(0) scale(1);opacity:1}}.reward-notification__icon-wrap{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:#ffffff4d;border-radius:50%;animation:reward-icon-pulse .6s ease-out}@keyframes reward-icon-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.reward-notification__icon{color:#203c2e}.reward-notification__content{flex:1;display:flex;flex-direction:column;gap:4px}.reward-notification__amount{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:#203c2e;line-height:1.2}.reward-notification__balance{font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:#96773d}@media(max-width:768px){.reward-notification{top:70px;right:10px;left:auto;min-width:260px}}.simple-feedback{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--spacing-8) var(--spacing-4);min-height:320px;justify-content:center}.simple-feedback__icon-wrap{margin-bottom:var(--spacing-5);animation:simple-icon-appear .4s cubic-bezier(.34,1.56,.64,1)}@keyframes simple-icon-appear{0%{transform:scale(0) rotate(-180deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.simple-feedback__icon{filter:drop-shadow(0 4px 12px rgba(0,0,0,.2))}.simple-feedback__icon--correct{color:#8fae5d}.simple-feedback__icon--wrong{color:#c94a3a}.simple-feedback__title{font-size:2rem;font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-3);animation:simple-title-appear .3s ease-out .2s both}@keyframes simple-title-appear{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.simple-feedback--correct .simple-feedback__title{color:#8fae5d}.simple-feedback--wrong .simple-feedback__title{color:#c94a3a}.simple-feedback__message{font-size:var(--font-size-base);color:var(--color-medium-gray);margin-bottom:var(--spacing-6);animation:simple-message-appear .3s ease-out .3s both}@keyframes simple-message-appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.simple-feedback__actions{width:100%;max-width:280px;animation:simple-actions-appear .3s ease-out .4s both}@keyframes simple-actions-appear{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@media(max-width:768px){.simple-feedback{padding:var(--spacing-6) var(--spacing-3);min-height:280px}.simple-feedback__icon-wrap{margin-bottom:var(--spacing-4)}.simple-feedback__icon{width:64px;height:64px}.simple-feedback__title{font-size:1.5rem;margin-bottom:var(--spacing-2)}.simple-feedback__message{font-size:var(--font-size-sm);margin-bottom:var(--spacing-5)}}@media(prefers-reduced-motion:reduce){.simple-feedback__icon-wrap,.simple-feedback__title,.simple-feedback__message,.simple-feedback__actions{animation:none}}.daily-quiz-page{min-height:calc(100vh - 80px);background:#f8fbf4;padding:24px 20px;display:flex;flex-direction:column;align-items:center}.daily-quiz-page__progress-wrapper{width:100%;max-width:700px;margin-bottom:32px;position:sticky;top:16px;z-index:10;padding:0}.daily-quiz-page__content{width:100%;max-width:700px;display:flex;justify-content:center;flex:1}.daily-quiz-page__loading,.daily-quiz-page__error,.daily-quiz-page__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50vh;font-size:18px;color:#666;text-align:center;padding:20px}.daily-quiz-page__error{color:#c94a3a;gap:20px}.daily-quiz-page__retry-btn{padding:12px 32px;background:#203c2e;color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease}.daily-quiz-page__retry-btn:hover{background:#162b20;transform:translateY(-2px)}@media(max-width:768px){.daily-quiz-page{padding:20px 16px}.daily-quiz-page__progress-wrapper{top:12px;margin-bottom:24px;max-width:100%}.daily-quiz-page__content{max-width:100%}}@media(max-width:480px){.daily-quiz-page{padding:16px 12px}.daily-quiz-page__progress-wrapper{top:8px;margin-bottom:20px}.daily-quiz-page__loading,.daily-quiz-page__error,.daily-quiz-page__empty{font-size:16px;min-height:40vh}}.chapter-quiz-result{min-height:calc(100vh - 80px);background:#f8fbf4;display:flex;align-items:center;justify-content:center;padding:40px 20px}.chapter-quiz-result__container{width:100%;max-width:500px;background:#fff;border-radius:24px;padding:48px 40px;box-shadow:0 4px 20px #00000014;display:flex;flex-direction:column;align-items:center;text-align:center}.chapter-quiz-result__icon{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:48px;font-weight:700;margin-bottom:24px}.chapter-quiz-result__icon.passed{background:linear-gradient(135deg,#c7d8b7,#b8d4a0);color:#203c2e}.chapter-quiz-result__icon.failed{background:linear-gradient(135deg,#ffe5e0,#ffcec5);color:#c94a3a}.chapter-quiz-result__status{font-size:32px;font-weight:700;margin-bottom:12px}.chapter-quiz-result__status.passed{color:#203c2e}.chapter-quiz-result__status.failed{color:#c94a3a}.chapter-quiz-result__chapter{font-size:16px;color:#666;margin-bottom:32px}.chapter-quiz-result__score{display:flex;align-items:baseline;gap:8px;margin-bottom:12px}.chapter-quiz-result__score-number{font-size:64px;font-weight:700;color:#203c2e}.chapter-quiz-result__score-divider{font-size:48px;font-weight:400;color:#ccc}.chapter-quiz-result__score-total{font-size:48px;font-weight:400;color:#999}.chapter-quiz-result__rate{font-size:18px;font-weight:600;color:#203c2e;margin-bottom:32px}.chapter-quiz-result__divider{width:100%;height:1px;background:#e0e0e0;margin-bottom:32px}.chapter-quiz-result__details{width:100%;display:flex;flex-direction:column;gap:16px;margin-bottom:32px}.chapter-quiz-result__detail-item{display:flex;justify-content:space-between;align-items:center}.chapter-quiz-result__detail-label{font-size:15px;color:#666}.chapter-quiz-result__detail-value{font-size:15px;font-weight:600;color:#1a1a1a}.chapter-quiz-result__detail-value.reward{color:#2a4f3c;font-size:16px}.chapter-quiz-result__detail-value.unlock{color:#203c2e}.chapter-quiz-result__message{font-size:14px;color:#666;padding:16px;background:#f8fbf4;border-radius:12px}.chapter-quiz-result__actions{width:100%;display:flex;flex-direction:column;gap:12px}@media(max-width:768px){.chapter-quiz-result__container{max-width:100%;padding:40px 32px}.chapter-quiz-result__icon{width:70px;height:70px;font-size:40px}.chapter-quiz-result__status{font-size:28px}.chapter-quiz-result__score-number{font-size:56px}.chapter-quiz-result__score-divider,.chapter-quiz-result__score-total{font-size:40px}}@media(max-width:480px){.chapter-quiz-result{padding:24px 16px}.chapter-quiz-result__container{padding:32px 24px}.chapter-quiz-result__icon{width:60px;height:60px;font-size:36px;margin-bottom:20px}.chapter-quiz-result__status{font-size:24px}.chapter-quiz-result__chapter{font-size:14px}.chapter-quiz-result__score-number{font-size:48px}.chapter-quiz-result__score-divider,.chapter-quiz-result__score-total{font-size:36px}.chapter-quiz-result__rate{font-size:16px}}.chapter-quiz-page{min-height:calc(100vh - 80px);background:#f8fbf4;padding:24px 20px;display:flex;flex-direction:column;align-items:center}.chapter-quiz-page__header{width:100%;max-width:700px;text-align:center;margin-bottom:24px}.chapter-quiz-page__title{font-size:24px;font-weight:700;color:#1a1a1a;margin-bottom:8px}.chapter-quiz-page__subtitle{font-size:14px;color:#666}.chapter-quiz-page__progress-wrapper{width:100%;max-width:700px;background:#fff;border-radius:16px;padding:20px 28px;box-shadow:0 2px 8px #0000000f;margin-bottom:32px}.chapter-quiz-page__progress-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.chapter-quiz-page__progress-text{font-size:15px;font-weight:600;color:#1a1a1a}.chapter-quiz-page__progress-percent{font-size:14px;font-weight:600;color:#203c2e}.chapter-quiz-page__progress-bar{width:100%;height:10px;background:#f0f0f0;border-radius:5px;overflow:hidden}.chapter-quiz-page__progress-fill{height:100%;background:linear-gradient(90deg,#203c2e,#2a4f3c);border-radius:5px;transition:width .3s ease}.chapter-quiz-page__content{width:100%;max-width:700px;margin-bottom:24px}.chapter-quiz-page__submitted-notice{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px;padding:12px 20px;background:linear-gradient(135deg,#e8f5e9,#c8e6c9);border-radius:12px;animation:fadeInUp .3s ease}.chapter-quiz-page__submitted-icon{font-size:20px;color:#2e7d32}.chapter-quiz-page__submitted-text{font-size:14px;font-weight:600;color:#1b5e20}@keyframes fadeInUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.chapter-quiz-page__incomplete-notice{width:100%;max-width:700px;text-align:center;padding:12px 20px;background:#fff9e6;border:1px solid #FFE082;border-radius:12px;font-size:14px;font-weight:500;color:#f57c00;margin-top:16px}.chapter-quiz-page__nav{display:flex;gap:12px;width:100%;max-width:700px}.chapter-quiz-page__nav-btn{flex:1;padding:14px 24px;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease;border:none;background:#fff;color:#203c2e;border:1px solid #E0E0E0}.chapter-quiz-page__nav-btn:hover:not(:disabled){background:#f8fbf4;border-color:#203c2e}.chapter-quiz-page__nav-btn:disabled{opacity:.4;cursor:not-allowed}.chapter-quiz-page__loading,.chapter-quiz-page__error,.chapter-quiz-page__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50vh;font-size:18px;color:#666;text-align:center;gap:20px}.chapter-quiz-page__error{color:#c94a3a}.chapter-quiz-page__back-btn{padding:12px 32px;background:#203c2e;color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease}.chapter-quiz-page__back-btn:hover{background:#162b20;transform:translateY(-2px)}@media(max-width:768px){.chapter-quiz-page{padding:20px 16px}.chapter-quiz-page__header,.chapter-quiz-page__progress-wrapper,.chapter-quiz-page__content,.chapter-quiz-page__nav{max-width:100%}.chapter-quiz-page__title{font-size:20px}.chapter-quiz-page__subtitle{font-size:13px}}@media(max-width:480px){.chapter-quiz-page{padding:16px 12px}.chapter-quiz-page__progress-wrapper{padding:16px 20px}.chapter-quiz-page__nav-btn,.chapter-quiz-page__submit-btn{padding:12px 16px;font-size:14px}}.investment-search{position:relative;margin-top:var(--spacing-6);margin-bottom:var(--spacing-6);animation:searchFadeIn .5s ease-out;min-width:0}@keyframes searchFadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.investment-search__input-wrapper{display:flex;align-items:center;gap:var(--spacing-3);background:var(--color-white);border:1px solid #e0e0e0;border-radius:12px;padding:var(--spacing-3) var(--spacing-4);transition:border-color .2s;min-width:0}.investment-search__input-wrapper:focus-within{border-color:var(--color-main-green)}.investment-search__icon{color:#999;flex-shrink:0}.investment-search__input{flex:1;min-width:0;border:none;outline:none;font-size:var(--font-size-base);color:var(--color-dark-gray);background:transparent}.investment-search__input::placeholder{color:#bbb}.investment-search__dropdown{position:absolute;top:100%;left:0;right:0;margin-top:4px;background:var(--color-white);border:1px solid #e0e0e0;border-radius:12px;box-shadow:0 4px 16px #00000014;max-height:280px;overflow-y:auto;z-index:100;list-style:none;padding:var(--spacing-1) 0;animation:dropdownFadeIn .15s ease-out}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.investment-search__dropdown-item{display:flex;justify-content:space-between;align-items:center;width:100%;padding:var(--spacing-3) var(--spacing-4);border:none;background:none;cursor:pointer;text-align:left;transition:background .15s}.investment-search__dropdown-item:hover{background:var(--color-background)}.investment-search__dropdown-name{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-dark-gray)}.investment-search__dropdown-code{font-size:var(--font-size-xs);color:#999}.popular-stocks{background:var(--color-white);border-radius:12px;padding:var(--spacing-5) var(--spacing-6);animation:tableFadeIn .6s ease-out}@keyframes tableFadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.popular-stocks__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4)}.popular-stocks__title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.popular-stocks__market-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);border-radius:12px}.popular-stocks__market-badge--open{background:#e74c3c1a;color:var(--color-chart-up)}.popular-stocks__market-badge--closed{background:#8888881a;color:#888}.popular-stocks__market-dot{width:6px;height:6px;border-radius:50%}.popular-stocks__market-badge--open .popular-stocks__market-dot{background:var(--color-chart-up);animation:livePulse 1.5s ease-in-out infinite}.popular-stocks__market-badge--closed .popular-stocks__market-dot{background:#888}@keyframes livePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.2)}}.popular-stocks__table-wrapper{overflow-x:auto}.popular-stocks__table{width:100%;border-collapse:collapse}.popular-stocks__th{padding:var(--spacing-3) var(--spacing-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-main-green);text-align:left;border-bottom:2px solid var(--color-pale-green)}.popular-stocks__th--rank{width:50px}.popular-stocks__th--price,.popular-stocks__th--volume,.popular-stocks__th--rate{text-align:right}.popular-stocks__row{cursor:pointer;transition:background .15s}.popular-stocks__row:hover{background:var(--color-background)}.popular-stocks__td{padding:var(--spacing-3) var(--spacing-2);font-size:var(--font-size-sm);color:var(--color-dark-gray);border-bottom:1px solid #f0f0f0}.popular-stocks__td--rank{font-weight:var(--font-weight-semibold);color:#888;width:50px}.popular-stocks__td--name{font-weight:var(--font-weight-bold)}.popular-stocks__td--price,.popular-stocks__td--volume,.popular-stocks__td--rate{text-align:right}.popular-stocks__td--up{color:var(--color-chart-up);font-weight:var(--font-weight-semibold)}.popular-stocks__td--down{color:var(--color-chart-down);font-weight:var(--font-weight-semibold)}.popular-stocks__th--fav{width:40px}.popular-stocks__td--fav{text-align:center}.popular-stocks__fav-btn{display:flex;align-items:center;justify-content:center;padding:4px;border:none;background:none;color:#ddd;cursor:pointer;border-radius:50%;transition:color .2s,transform .2s}.popular-stocks__fav-btn:hover{color:var(--color-chart-up);transform:scale(1.2)}.popular-stocks__fav-btn--active{color:var(--color-chart-up)}.popular-stocks__fav-btn:disabled{opacity:.5;cursor:default}.popular-stocks__animated{display:inline-block;padding:2px 4px;border-radius:4px;transition:background-color .3s ease,color .3s ease}.popular-stocks__flash--up{animation:flashUp .6s ease}.popular-stocks__flash--down{animation:flashDown .6s ease}@keyframes flashUp{0%{background-color:#e74c3c4d}to{background-color:transparent}}@keyframes flashDown{0%{background-color:#3498db4d}to{background-color:transparent}}@media(max-width:768px){.popular-stocks{padding:var(--spacing-4)}.popular-stocks__th--volume,.popular-stocks__td--volume{display:none}}.portfolio-card{position:relative;background:linear-gradient(135deg,#2a4a3a 0%,var(--color-main-green) 50%,#2a4a3a 100%);border-radius:20px;padding:var(--spacing-6);color:var(--color-white);animation:cardPopIn .5s ease-out;overflow:hidden}.portfolio-card__glow{position:absolute;top:-50%;right:-30%;width:200px;height:200px;background:radial-gradient(circle,rgba(199,216,183,.25) 0%,transparent 70%);border-radius:50%;pointer-events:none}@keyframes cardPopIn{0%{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.portfolio-card__content{position:relative;z-index:1}.portfolio-card__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-2)}.portfolio-card__label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:#ffffffb3;letter-spacing:.5px}.portfolio-card__badge{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:20px;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold)}.portfolio-card__badge--up{background:#dc000033;color:#ff6b6b}.portfolio-card__badge--down{background:#0046b433;color:#74b9ff}.portfolio-card__total{display:block;font-size:2rem;font-weight:var(--font-weight-bold);letter-spacing:-.5px;margin-bottom:var(--spacing-1)}.portfolio-card__profit{display:block;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);margin-bottom:var(--spacing-5)}.portfolio-card__profit--up{color:#ff6b6b}.portfolio-card__profit--down{color:#74b9ff}.portfolio-card__breakdown{display:flex;align-items:center;gap:var(--spacing-4);background:#c7d8b71f;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:var(--spacing-4)}.portfolio-card__breakdown-item{display:flex;align-items:center;gap:var(--spacing-3);flex:1}.portfolio-card__breakdown-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#c7d8b733;border-radius:10px;color:var(--color-pale-green)}.portfolio-card__breakdown-info{display:flex;flex-direction:column;gap:2px}.portfolio-card__breakdown-label{font-size:var(--font-size-xs);color:#fff9}.portfolio-card__breakdown-value{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-white)}.portfolio-card__breakdown-divider{width:1px;height:32px;background:#c7d8b74d}.my-holdings{background:var(--color-white);border-radius:12px;padding:var(--spacing-5)}.my-holdings__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4)}.my-holdings__title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.my-holdings__more-link{display:flex;align-items:center;gap:2px;border:none;background:none;color:#888;font-size:var(--font-size-sm);cursor:pointer;transition:color .15s}.my-holdings__more-link:hover{color:var(--color-main-green)}.my-holdings__empty{text-align:center;color:#999;font-size:var(--font-size-sm);padding:var(--spacing-6) 0}.my-holdings__list{display:flex;flex-direction:column;gap:var(--spacing-2)}.my-holdings__item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-3);border:1px solid #f0f0f0;border-radius:10px;cursor:pointer;transition:background .15s,border-color .15s}.my-holdings__item:hover{background:var(--color-background);border-color:#ddd}.my-holdings__item-left{display:flex;flex-direction:column;gap:2px}.my-holdings__item-name{font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.my-holdings__item-qty{font-size:var(--font-size-xs);color:#999}.my-holdings__item-right{display:flex;flex-direction:row;align-items:center;gap:var(--spacing-3)}.my-holdings__item-values{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.my-holdings__item-rate{font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);padding:2px 8px;border-radius:4px}.my-holdings__item-rate--up{color:var(--color-chart-up);background:#dc00000f}.my-holdings__item-rate--down{color:var(--color-chart-down);background:#0046b40f}.my-holdings__item-value{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-dark-gray)}.my-holdings__fav-btn{display:flex;align-items:center;justify-content:center;padding:4px;border:none;background:none;color:#ddd;cursor:pointer;border-radius:50%;transition:color .2s,transform .2s}.my-holdings__fav-btn:hover{color:var(--color-chart-up);transform:scale(1.2)}.my-holdings__fav-btn--active{color:var(--color-chart-up)}.my-holdings__fav-btn:disabled{opacity:.5;cursor:default}.watchlist-section{background:var(--color-white);border-radius:12px;padding:var(--spacing-5)}.watchlist-section__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4)}.watchlist-section__title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.watchlist-section__more-link{display:flex;align-items:center;gap:2px;border:none;background:none;color:#888;font-size:var(--font-size-sm);cursor:pointer;transition:color .15s}.watchlist-section__more-link:hover{color:var(--color-main-green)}.watchlist-section__empty{text-align:center;color:#999;font-size:var(--font-size-sm);padding:var(--spacing-6) 0}.watchlist-section__list{display:flex;flex-direction:column;gap:var(--spacing-2)}.watchlist-section__item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-3);border:1px solid #f0f0f0;border-radius:10px;background:none;cursor:pointer;text-align:left;transition:background .15s,border-color .15s}.watchlist-section__item:hover{background:var(--color-background);border-color:#ddd}.watchlist-section__item-left{display:flex;flex-direction:column;gap:2px}.watchlist-section__item-name{font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.watchlist-section__item-code{font-size:var(--font-size-xs);color:#999}.watchlist-section__item-right{display:flex;flex-direction:row;align-items:center;gap:var(--spacing-3)}.watchlist-section__item-values{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.watchlist-section__item-price{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-dark-gray)}.watchlist-section__item-rate{font-size:var(--font-size-xs);font-weight:var(--font-weight-bold)}.watchlist-section__item-rate--up{color:var(--color-chart-up)}.watchlist-section__item-rate--down{color:var(--color-chart-down)}.watchlist-section__fav-btn{display:flex;align-items:center;justify-content:center;padding:4px;border:none;background:none;color:var(--color-chart-up);cursor:pointer;border-radius:50%;transition:color .2s,transform .2s}.watchlist-section__fav-btn:hover{transform:scale(1.2)}.watchlist-section__fav-btn:disabled{opacity:.5;cursor:default}.recent-transactions{background:var(--color-white);border-radius:12px;padding:var(--spacing-5) var(--spacing-6);margin-top:var(--spacing-5)}.recent-transactions__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-4)}.recent-transactions__title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.recent-transactions__more-link{display:flex;align-items:center;gap:2px;border:none;background:none;color:#888;font-size:var(--font-size-sm);cursor:pointer;transition:color .15s}.recent-transactions__more-link:hover{color:var(--color-main-green)}.recent-transactions__empty{text-align:center;color:#999;font-size:var(--font-size-sm);padding:var(--spacing-6) 0}.recent-transactions__list{display:flex;flex-direction:column;gap:var(--spacing-2)}.recent-transactions__item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-3);border:1px solid #f0f0f0;border-radius:10px;cursor:pointer;transition:background .15s,border-color .15s}.recent-transactions__item:hover{background:var(--color-background);border-color:#ddd}.recent-transactions__item-left{display:flex;flex-direction:column;gap:2px;flex:1}.recent-transactions__item-name{font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.recent-transactions__item-date{font-size:var(--font-size-xs);color:#999}.recent-transactions__item-center{padding-left:var(--spacing-4)}.recent-transactions__badge{display:inline-block;margin-left:8px;padding-inline:3px;border-radius:4px;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold)}.recent-transactions__badge--buy{background:#dc000014;color:var(--color-chart-up)}.recent-transactions__badge--sell{background:#0046b414;color:var(--color-chart-down)}.recent-transactions__item-qty{font-size:var(--font-size-xs);color:#888}.recent-transactions__item-right{min-width:80px}.recent-transactions__item-center-right{text-align:right}.recent-transactions__item-amount{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-dark-gray)}@media(max-width:768px){.recent-transactions{padding:var(--spacing-4)}}.learn-mode-toggle{display:flex;align-items:center;gap:var(--spacing-2);padding:var(--spacing-2) var(--spacing-3);border:1px solid var(--color-pale-green);border-radius:20px;background:var(--color-white);color:var(--color-main-green);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all .2s ease}.learn-mode-toggle:hover{background:var(--color-pale-green);border-color:var(--color-main-green)}.learn-mode-toggle--active{background:var(--color-main-green);border-color:var(--color-main-green);color:var(--color-white)}.learn-mode-toggle--active:hover{background:#2a4a3a}.learn-mode-toggle__badge{padding:2px 6px;border-radius:10px;font-size:10px;font-weight:var(--font-weight-bold);background:#0000001a}.learn-mode-toggle--active .learn-mode-toggle__badge{background:#fff3;color:var(--color-pale-yellow)}.learn-spotlight{position:relative}.learn-spotlight--enabled{cursor:pointer;transition:all .3s ease}.learn-spotlight--enabled:hover{transform:scale(1.01)}.learn-spotlight--enabled>*:not(.learn-spotlight__hint):not(.learn-spotlight__card){pointer-events:none}.learn-spotlight--active>*:not(.learn-spotlight__hint):not(.learn-spotlight__card){position:relative;z-index:1}.learn-spotlight--enabled:before{content:"";position:absolute;inset:-4px;border:2px dashed transparent;border-radius:8px;pointer-events:none;transition:all .3s ease}.learn-spotlight--enabled:hover:before{border-color:var(--color-main-green)}.learn-spotlight--active{z-index:1000}.learn-spotlight--active:before{border-color:var(--color-main-green);border-style:solid;background:#ffffffe6;box-shadow:0 0 0 4px #203c2e1a}.learn-spotlight__hint{position:absolute;top:-8px;right:-8px;display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:var(--color-main-green);color:var(--color-white);border-radius:50%;box-shadow:0 2px 8px #203c2e4d;animation:pulse 2s infinite;z-index:10}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.learn-spotlight__card{position:absolute;top:100%;left:50%;transform:translate(-50%);margin-top:var(--spacing-3);width:280px;max-width:calc(100vw - 32px);padding:var(--spacing-4);background:var(--color-white);border-radius:12px;box-shadow:0 8px 32px #00000026;z-index:1001;animation:cardFadeIn .2s ease-out;scroll-margin-bottom:80px}@media(max-width:768px){.learn-spotlight__card{scroll-margin-bottom:80px}}.learn-spotlight--edge-left .learn-spotlight__card{left:0;transform:none}.learn-spotlight--edge-left .learn-spotlight__card:before{left:20px;transform:none}.learn-spotlight--edge-right .learn-spotlight__card{left:auto;right:0;transform:none}.learn-spotlight--edge-right .learn-spotlight__card:before{left:auto;right:20px;transform:none}.learn-spotlight--position-top .learn-spotlight__card{top:auto;bottom:100%;margin-top:0;margin-bottom:var(--spacing-3)}.learn-spotlight--position-top .learn-spotlight__card:before{top:auto;bottom:-8px;border-width:8px 8px 0 8px;border-color:var(--color-white) transparent transparent transparent}.learn-spotlight--position-top.learn-spotlight--edge-left .learn-spotlight__card:before{left:20px}.learn-spotlight--position-top.learn-spotlight--edge-right .learn-spotlight__card:before{left:auto;right:20px}@keyframes cardFadeIn{0%{opacity:0;transform:translate(-50%) translateY(-8px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.learn-spotlight__card:before{content:"";position:absolute;top:-8px;left:50%;transform:translate(-50%);border-width:0 8px 8px 8px;border-style:solid;border-color:transparent transparent var(--color-white) transparent}.learn-spotlight__close{position:absolute;top:var(--spacing-2);right:var(--spacing-2);display:flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;background:#f0f0f0;border-radius:50%;color:#666;cursor:pointer;transition:all .15s}.learn-spotlight__close:hover{background:#e0e0e0;color:#333}.learn-spotlight__title{font-size:var(--font-size-base);font-weight:var(--font-weight-bold);color:var(--color-main-green);margin:0 0 var(--spacing-2);padding-right:var(--spacing-6)}.learn-spotlight__description{font-size:var(--font-size-sm);color:var(--color-dark-gray);line-height:1.6;margin:0 0 var(--spacing-3)}.learn-spotlight__tip{display:flex;align-items:flex-start;gap:var(--spacing-2);padding:var(--spacing-3);background:var(--color-pale-yellow);border-radius:8px;font-size:var(--font-size-xs);color:var(--color-brown);line-height:1.5}.learn-spotlight__tip svg{flex-shrink:0;margin-top:2px}.learn-overlay{position:fixed;inset:0;background:#0000;pointer-events:none;z-index:999;transition:background .3s ease}.learn-overlay--active{background:#00000080;pointer-events:auto}.investment-page__header{display:flex;align-items:center;gap:var(--spacing-4);margin-bottom:var(--spacing-5)}.investment-page__header .investment-search{flex:1}.investment-page__header .learn-mode-toggle{flex-shrink:0;white-space:nowrap}.investment-page__grid{display:grid;grid-template-columns:3fr 2fr;gap:var(--spacing-6);align-items:start}.investment-page__right{display:flex;flex-direction:column;gap:var(--spacing-5)}@media(max-width:1024px){.investment-page__grid{grid-template-columns:1fr;padding-bottom:200px}}@media(max-width:768px){.investment-page__grid{padding-bottom:200px}}.stock-header{background:var(--color-white);border-radius:12px;margin-top:var(--spacing-6);margin-bottom:var(--spacing-6);padding:var(--spacing-5) var(--spacing-6);animation:headerFade .5s ease-out}@keyframes headerFade{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.stock-header__top{display:flex;align-items:center;gap:var(--spacing-3);margin-bottom:var(--spacing-3)}.stock-header__back-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:1px solid #e0e0e0;border-radius:8px;background:var(--color-white);color:#666;cursor:pointer;transition:all .15s}.stock-header__back-btn:hover{border-color:var(--color-main-green);color:var(--color-main-green)}.stock-header__fav{display:flex;align-items:center;padding:4px;border:none;background:none;color:#ddd;cursor:pointer;transition:color .2s,transform .2s}.stock-header__fav:hover{color:var(--color-chart-up);transform:scale(1.15)}.stock-header__fav--active{color:var(--color-chart-up)}.stock-header__market-badge{font-size:11px;font-weight:var(--font-weight-bold);padding:2px 8px;border-radius:4px}.stock-header__market-badge--kospi{color:var(--color-main-green);background:#203c2e14}.stock-header__market-badge--kosdaq{color:var(--color-brown);background:#96773d14}.stock-header__code{font-size:var(--font-size-sm);color:#888;padding:var(--spacing-1) var(--spacing-5) var(--spacing-1) var(--spacing-3);border-radius:4px}.stock-header__name{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin:0 0 var(--spacing-2)}.stock-header__price-row{display:flex;align-items:baseline;gap:var(--spacing-1);margin-bottom:var(--spacing-2)}.stock-header__price{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.stock-header__flip-price{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold)}.stock-header__flip-price .flip-text__value{padding:4px 10px 4px 0;border-radius:8px}.stock-header__flip-change{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold)}.stock-header__flip-change .flip-text__value{padding:2px 6px;border-radius:4px}.stock-header__change{font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold)}.stock-header__change--up{color:var(--color-chart-up)}.stock-header__change--down{color:var(--color-chart-down)}.stock-header__sector{display:flex;align-items:center;gap:var(--spacing-2);margin-bottom:var(--spacing-3);padding-bottom:var(--spacing-3);border-bottom:1px solid #f0f0f0}.stock-header__sector-label{font-size:var(--font-size-xs);color:#888;white-space:nowrap}.stock-header__sector-name{font-size:var(--font-size-xs);color:var(--color-dark-gray);font-weight:var(--font-weight-medium)}.stock-header__meta{display:flex;flex-wrap:wrap;gap:var(--spacing-2) var(--spacing-2)}.stock-header__meta-item{font-size:var(--font-size-xs);color:#888;padding:var(--spacing-2) var(--spacing-6) var(--spacing-2) var(--spacing-4);background:var(--color-background);border-radius:6px}.stock-header__meta-item strong{color:var(--color-dark-gray);margin-left:4px}@media(max-width:480px){.stock-header__meta{gap:var(--spacing-2)}.stock-header__meta-item{padding:var(--spacing-1) var(--spacing-3)}.stock-header__sector-name{word-break:keep-all}}.candle-chart{background:var(--color-white);border-radius:12px;padding:var(--spacing-4) var(--spacing-5);animation:chartFadeIn .6s ease-out .1s both}@keyframes chartFadeIn{0%{opacity:0}to{opacity:1}}.candle-chart__tabs{display:flex;gap:var(--spacing-1);margin-bottom:var(--spacing-4)}.candle-chart__tab{padding:var(--spacing-1) var(--spacing-3);border:none;background:none;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:#888;cursor:pointer;border-bottom:2px solid transparent;transition:color .2s,border-color .2s}.candle-chart__tab:hover{color:var(--color-dark-gray)}.candle-chart__tab--active{color:var(--color-chart-up);border-bottom-color:var(--color-chart-up);font-weight:var(--font-weight-bold)}.candle-chart__container{width:100%}.candle-chart__empty{display:flex;align-items:center;justify-content:center;height:360px;color:#999;font-size:var(--font-size-sm)}.trading-panel{background:var(--color-white);border-radius:12px;padding:var(--spacing-5);animation:panelSlideIn .5s ease-out .2s both}@keyframes panelSlideIn{0%{opacity:0;transform:translate(12px)}to{opacity:1;transform:translate(0)}}.trading-panel__tabs{display:flex;gap:var(--spacing-2);margin-bottom:var(--spacing-4)}.trading-panel__tab{flex:1;padding:var(--spacing-2);border:none;border-radius:8px;font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);cursor:pointer;transition:all .15s;background:var(--color-background);color:#888}.trading-panel__tab--buy.trading-panel__tab--active{background:var(--color-chart-up);color:var(--color-white)}.trading-panel__tab--sell.trading-panel__tab--active{background:var(--color-chart-down);color:var(--color-white)}.trading-panel__holding{background:var(--color-background);border-radius:8px;padding:var(--spacing-3);margin-bottom:var(--spacing-4)}.trading-panel__holding-row{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-1) 0;font-size:var(--font-size-xs);color:#666}.trading-panel__holding-row strong{font-size:var(--font-size-sm);color:var(--color-dark-gray)}.trading-panel__profit--up{color:var(--color-chart-up);font-weight:var(--font-weight-semibold)}.trading-panel__profit--down{color:var(--color-chart-down);font-weight:var(--font-weight-semibold)}.trading-panel__field{margin-bottom:var(--spacing-4)}.trading-panel__label{display:block;font-size:var(--font-size-xs);color:#888;margin-bottom:var(--spacing-2)}.trading-panel__price-display{display:flex;justify-content:flex-end;align-items:center;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);padding:var(--spacing-2) var(--spacing-3);background:var(--color-background);border-radius:8px}.trading-panel__flip-price{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold)}.trading-panel__flip-price .flip-text__value{padding:2px 6px;border-radius:6px}.trading-panel__input{width:100%;padding:var(--spacing-2) var(--spacing-3);border:1px solid #e0e0e0;border-radius:8px;font-size:var(--font-size-base);text-align:right;outline:none;transition:border-color .2s;box-sizing:border-box}.trading-panel__input:focus{border-color:var(--color-main-green)}.trading-panel__ratios{display:flex;gap:var(--spacing-2);margin-top:var(--spacing-2)}.trading-panel__ratio-btn{flex:1;padding:var(--spacing-1) 0;border:1px solid #e0e0e0;border-radius:6px;background:none;font-size:var(--font-size-xs);color:#666;cursor:pointer;transition:all .15s}.trading-panel__ratio-btn:hover:not(:disabled){border-color:var(--color-main-green);color:var(--color-main-green)}.trading-panel__ratio-btn:disabled{opacity:.4;cursor:default}.trading-panel__summary{padding:var(--spacing-3) 0;border-top:1px solid #eee;margin-bottom:var(--spacing-4)}.trading-panel__summary-row{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-1) 0;font-size:var(--font-size-sm);color:#666}.trading-panel__summary-row strong{font-size:var(--font-size-base);color:var(--color-dark-gray)}.trading-panel__message{text-align:center;font-size:var(--font-size-sm);padding:var(--spacing-2);border-radius:6px;margin-bottom:var(--spacing-3)}.trading-panel__message--success{color:var(--color-main-green);background:#203c2e0f}.trading-panel__message--error{color:var(--color-chart-up);background:#dc00000f}.trading-panel__btn{width:100%;padding:var(--spacing-3);border:none;border-radius:10px;font-size:var(--font-size-base);font-weight:var(--font-weight-bold);color:var(--color-white);cursor:pointer;transition:opacity .2s}.trading-panel__btn:disabled{opacity:.4;cursor:default}.trading-panel__btn--buy{background:var(--color-chart-up)}.trading-panel__btn--sell{background:var(--color-chart-down)}.trading-panel__btn:not(:disabled):hover{opacity:.85}.stock-detail__header{display:flex;justify-content:space-between;align-items:center;margin-top:var(--spacing-5)}.stock-detail__market-status{display:inline-flex;align-items:center;gap:6px;padding:6px 20px;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);border-radius:16px}.stock-detail__market-status--open{background:#203c2e14;color:var(--color-main-green)}.stock-detail__market-status--closed{background:#8888881a;color:#888}.stock-detail__market-dot{width:6px;height:6px;border-radius:50%}.stock-detail__market-status--open .stock-detail__market-dot{background:var(--color-main-green);animation:stockDetailPollPulse 2s ease-in-out infinite}.stock-detail__market-status--closed .stock-detail__market-dot{background:#888}@keyframes stockDetailPollPulse{0%,to{opacity:1}50%{opacity:.4}}.stock-detail__grid{display:grid;grid-template-columns:3fr 2fr;gap:var(--spacing-5);margin-top:var(--spacing-5);align-items:start}.stock-detail__left,.stock-detail__right{min-width:0}@media(max-width:1024px){.stock-detail__grid{grid-template-columns:1fr;padding-bottom:200px}}@media(max-width:768px){.stock-detail__grid{padding-bottom:200px}}.transaction-table__wrapper{overflow-x:auto}.transaction-table{width:100%;border-collapse:collapse;font-size:var(--font-size-sm)}.transaction-table th{padding:var(--spacing-3) var(--spacing-3);text-align:left;font-weight:var(--font-weight-semibold);color:#888;border-bottom:2px solid #eee;white-space:nowrap}.transaction-table td{padding:var(--spacing-3) var(--spacing-3);border-bottom:1px solid #f0f0f0;white-space:nowrap}.transaction-table__right{text-align:right!important}.transaction-table__row{cursor:pointer;transition:background .15s}.transaction-table__row:hover{background:var(--color-background)}.transaction-table__date{font-weight:var(--font-weight-medium);color:var(--color-dark-gray)}.transaction-table__time{font-size:var(--font-size-xs);color:#999}.transaction-table__stock-name{font-weight:var(--font-weight-medium);color:var(--color-dark-gray)}.transaction-table__stock-code{font-size:var(--font-size-xs);color:#999}.transaction-table__badge{display:inline-block;padding:2px 10px;border-radius:12px;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold)}.transaction-table__badge--buy{background:#dc000014;color:var(--color-chart-up)}.transaction-table__badge--sell{background:#0046b414;color:var(--color-chart-down)}.transaction-table__status{font-size:var(--font-size-xs);color:var(--color-main-green);font-weight:var(--font-weight-medium)}.transaction-table__empty{text-align:center;padding:var(--spacing-8) 0!important;color:#999}@media(max-width:768px){.transaction-table{font-size:var(--font-size-xs)}.transaction-table th,.transaction-table td{padding:var(--spacing-2)}}.pagination{display:flex;justify-content:center;align-items:center;gap:var(--spacing-1);margin-top:var(--spacing-5)}.pagination__btn{display:flex;align-items:center;justify-content:center;min-width:36px;height:36px;border:1px solid #e0e0e0;border-radius:8px;background:var(--color-white);font-size:var(--font-size-sm);color:#666;cursor:pointer;transition:all .15s}.pagination__btn:hover:not(:disabled){border-color:var(--color-main-green);color:var(--color-main-green)}.pagination__btn:disabled{opacity:.3;cursor:default}.pagination__btn--active{background:var(--color-main-green);border-color:var(--color-main-green);color:var(--color-white);font-weight:var(--font-weight-bold)}.pagination__btn--active:hover:not(:disabled){color:var(--color-white)}.pagination__dots{padding:0 var(--spacing-1);color:#999;font-size:var(--font-size-sm)}.transaction-page__header{display:flex;justify-content:space-between;align-items:flex-start;margin-top:var(--spacing-6);margin-bottom:var(--spacing-6)}.transaction-page__title-row{display:flex;align-items:center;gap:var(--spacing-3)}.transaction-page__back-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #e0e0e0;border-radius:10px;background:var(--color-white);color:#666;cursor:pointer;transition:all .15s}.transaction-page__back-btn:hover{border-color:var(--color-main-green);color:var(--color-main-green)}.transaction-page__title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin:0}.transaction-page__subtitle{font-size:var(--font-size-sm);color:#888;margin:var(--spacing-1) 0 0}.transaction-page__actions{display:flex;gap:var(--spacing-2)}.transaction-page__icon-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #e0e0e0;border-radius:10px;background:var(--color-white);color:#666;cursor:pointer;transition:all .15s}.transaction-page__icon-btn:hover{border-color:var(--color-main-green);color:var(--color-main-green)}.transaction-page__content{background:var(--color-white);border-radius:12px;padding:var(--spacing-5)}.transaction-page__total{text-align:center;font-size:var(--font-size-sm);color:#999;margin-top:var(--spacing-4)}.holdings-page__header{display:flex;justify-content:space-between;align-items:flex-start;margin-top:var(--spacing-6);margin-bottom:var(--spacing-6)}.holdings-page__title-row{display:flex;align-items:center;gap:var(--spacing-3)}.holdings-page__back-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #e0e0e0;border-radius:10px;background:var(--color-white);color:#666;cursor:pointer;transition:all .15s}.holdings-page__back-btn:hover{border-color:var(--color-main-green);color:var(--color-main-green)}.holdings-page__title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin:0}.holdings-page__subtitle{font-size:var(--font-size-sm);color:#888;margin:var(--spacing-1) 0 0}.holdings-page__actions{display:flex;align-items:center;gap:var(--spacing-3)}.holdings-page__market-status{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);border-radius:16px}.holdings-page__market-status--open{background:#203c2e14;color:var(--color-main-green)}.holdings-page__market-status--closed{background:#8888881a;color:#888}.holdings-page__market-dot{width:6px;height:6px;border-radius:50%}.holdings-page__market-status--open .holdings-page__market-dot{background:var(--color-main-green);animation:pollPulse 2s ease-in-out infinite}.holdings-page__market-status--closed .holdings-page__market-dot{background:#888}@keyframes pollPulse{0%,to{opacity:1}50%{opacity:.4}}.holdings-page__icon-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #e0e0e0;border-radius:10px;background:var(--color-white);color:#666;cursor:pointer;transition:all .15s}.holdings-page__icon-btn:hover{border-color:var(--color-main-green);color:var(--color-main-green)}.holdings-page__content{background:var(--color-white);border-radius:12px;padding:var(--spacing-5)}.holdings-page__table-wrapper{overflow-x:auto}.holdings-page__table{width:100%;border-collapse:collapse;font-size:var(--font-size-sm)}.holdings-page__table th{padding:var(--spacing-3);text-align:left;font-weight:var(--font-weight-semibold);color:var(--color-main-green);border-bottom:2px solid var(--color-pale-green);white-space:nowrap}.holdings-page__table td{padding:var(--spacing-3);border-bottom:1px solid #f0f0f0;white-space:nowrap}.holdings-page__right{text-align:right!important}.holdings-page__row{cursor:pointer;transition:background .15s}.holdings-page__row:hover{background:var(--color-background)}.holdings-page__stock-name{font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.holdings-page__stock-code{font-size:var(--font-size-xs);color:#999}.holdings-page__up{color:var(--color-chart-up);font-weight:var(--font-weight-semibold)}.holdings-page__down{color:var(--color-chart-down);font-weight:var(--font-weight-semibold)}.holdings-page__empty{text-align:center;padding:var(--spacing-8) 0!important;color:#999}.holdings-page__total{text-align:center;font-size:var(--font-size-sm);color:#999;margin-top:var(--spacing-4)}.holdings-page__center{text-align:center!important}.holdings-page__fav-btn{display:flex;align-items:center;justify-content:center;padding:4px;border:none;background:none;color:#ddd;cursor:pointer;border-radius:50%;transition:color .2s,transform .2s}.holdings-page__fav-btn:hover{color:var(--color-chart-up);transform:scale(1.2)}.holdings-page__fav-btn--active{color:var(--color-chart-up)}.holdings-page__fav-btn:disabled{opacity:.5;cursor:default}.holdings-page__animated{display:inline-block;padding:2px 4px;border-radius:4px;transition:background-color .3s ease}.holdings-page__flash--up{animation:holdingsFlashUp .6s ease}.holdings-page__flash--down{animation:holdingsFlashDown .6s ease}@keyframes holdingsFlashUp{0%{background-color:#e74c3c40}to{background-color:transparent}}@keyframes holdingsFlashDown{0%{background-color:#3498db40}to{background-color:transparent}}@media(max-width:768px){.holdings-page__table{font-size:var(--font-size-xs)}.holdings-page__table th,.holdings-page__table td{padding:var(--spacing-2)}}.watchlist-page__header{display:flex;justify-content:space-between;align-items:flex-start;margin-top:var(--spacing-6);margin-bottom:var(--spacing-6)}.watchlist-page__title-row{display:flex;align-items:center;gap:var(--spacing-3)}.watchlist-page__back-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #e0e0e0;border-radius:10px;background:var(--color-white);color:#666;cursor:pointer;transition:all .15s}.watchlist-page__back-btn:hover{border-color:var(--color-main-green);color:var(--color-main-green)}.watchlist-page__up{color:var(--color-chart-up);font-weight:var(--font-weight-semibold)}.watchlist-page__down{color:var(--color-chart-down);font-weight:var(--font-weight-semibold)}.watchlist-page__right{text-align:right!important}.watchlist-page__title{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin:0}.watchlist-page__subtitle{font-size:var(--font-size-sm);color:#888;margin:var(--spacing-1) 0 0}.watchlist-page__actions{display:flex;align-items:center;gap:var(--spacing-3)}.watchlist-page__market-status{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);border-radius:16px}.watchlist-page__market-status--open{background:#203c2e14;color:var(--color-main-green)}.watchlist-page__market-status--closed{background:#8888881a;color:#888}.watchlist-page__market-dot{width:6px;height:6px;border-radius:50%}.watchlist-page__market-status--open .watchlist-page__market-dot{background:var(--color-main-green);animation:watchlistMarketPulse 2s ease-in-out infinite}.watchlist-page__market-status--closed .watchlist-page__market-dot{background:#888}@keyframes watchlistMarketPulse{0%,to{opacity:1}50%{opacity:.4}}.watchlist-page__icon-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid #e0e0e0;border-radius:10px;background:var(--color-white);color:#666;cursor:pointer;transition:all .15s}.watchlist-page__icon-btn:hover{border-color:var(--color-main-green);color:var(--color-main-green)}.watchlist-page__content{background:var(--color-white);border-radius:12px;padding:var(--spacing-5)}.watchlist-page__table-wrapper{overflow-x:auto}.watchlist-page__table{width:100%;border-collapse:collapse;font-size:var(--font-size-sm)}.watchlist-page__table th{padding:var(--spacing-3);text-align:left;font-weight:var(--font-weight-semibold);color:var(--color-main-green);border-bottom:2px solid var(--color-pale-green);white-space:nowrap}.watchlist-page__table td{padding:var(--spacing-3);border-bottom:1px solid #f0f0f0;white-space:nowrap}.watchlist-page__center{text-align:center!important}.watchlist-page__row{cursor:pointer;transition:background .15s}.watchlist-page__row:hover{background:var(--color-background)}.watchlist-page__stock-name{font-weight:var(--font-weight-bold);color:var(--color-dark-gray)}.watchlist-page__stock-code{font-size:var(--font-size-xs);color:#999}.watchlist-page__badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold)}.watchlist-page__badge--kospi{background:#203c2e1a;color:var(--color-main-green)}.watchlist-page__badge--kosdaq{background:#dc000014;color:var(--color-chart-up)}.watchlist-page__date{color:#888}.watchlist-page__remove-btn{display:flex;align-items:center;justify-content:center;padding:4px;border:none;background:none;color:#e74c3c;cursor:pointer;border-radius:50%;transition:transform .2s,opacity .2s}.watchlist-page__remove-btn:hover{transform:scale(1.2)}.watchlist-page__remove-btn:disabled{opacity:.5;cursor:default}.watchlist-page__animated{display:inline-block;padding:2px 4px;border-radius:4px;transition:background-color .3s ease}.watchlist-page__flash--up{animation:watchlistFlashUp .6s ease}.watchlist-page__flash--down{animation:watchlistFlashDown .6s ease}@keyframes watchlistFlashUp{0%{background-color:#e74c3c40}to{background-color:transparent}}@keyframes watchlistFlashDown{0%{background-color:#3498db40}to{background-color:transparent}}.watchlist-page__empty{text-align:center;padding:var(--spacing-8) 0!important;color:#999}.watchlist-page__total{text-align:center;font-size:var(--font-size-sm);color:#999;margin-top:var(--spacing-4)}@media(max-width:768px){.watchlist-page__table{font-size:var(--font-size-xs)}.watchlist-page__table th,.watchlist-page__table td{padding:var(--spacing-2)}}.review-note-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-8);padding:var(--spacing-6) 0;animation:headerFadeIn .6s ease-out}@keyframes headerFadeIn{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}.review-note-header__title-area{flex:1}.review-note-header__title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin-bottom:var(--spacing-2)}.review-note-header__subtitle{font-size:var(--font-size-base);color:#666}.review-note-header__count-card{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-1);background:var(--color-white);border:2px solid var(--color-quiz-yellow);border-radius:12px;padding:var(--spacing-4) var(--spacing-6);min-width:120px}.review-note-header__count-label{font-size:var(--font-size-sm);color:#666}.review-note-header__count-value{font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);color:var(--color-quiz-yellow)}@media(max-width:768px){.review-note-header{flex-direction:column;align-items:flex-start;gap:var(--spacing-4)}.review-note-header__title{font-size:var(--font-size-2xl)}.review-note-header__count-card{width:100%}}.review-note-card{position:relative;display:flex;align-items:center;gap:var(--spacing-4);background:var(--color-white);border:1px solid #e8e8e8;border-radius:12px;padding:var(--spacing-5);transition:all .2s ease;opacity:0;transform:translateY(12px)}.review-note-card.card-visible{opacity:1;transform:translateY(0)}.review-note-card:hover{border-color:var(--color-main-green);box-shadow:0 2px 8px #203c2e14;transform:translateY(-2px)}.review-note-card__icon{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#fadb1326,#fadb130d);display:flex;align-items:center;justify-content:center;color:var(--color-quiz-yellow);flex-shrink:0}.review-note-card__content{flex:1;min-width:0}.review-note-card__title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-dark-gray);margin-bottom:var(--spacing-1);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.review-note-card__meta{display:flex;align-items:center;gap:var(--spacing-3);font-size:var(--font-size-xs);color:#999}.review-note-card__date{display:flex;align-items:center;gap:4px}.review-note-card__type{display:inline-block;padding:2px 8px;background:#f0f0f0;border-radius:4px;font-size:11px;font-weight:var(--font-weight-semibold);color:#666}.review-note-card__actions{display:flex;gap:var(--spacing-2)}.review-note-card__delete-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid #ddd;border-radius:6px;background:var(--color-white);color:#999;cursor:pointer;transition:all .2s ease}.review-note-card__delete-btn:hover{border-color:#dc0000;color:#dc0000;background:#fff5f5}@media(max-width:640px){.review-note-card{flex-direction:column;align-items:stretch}.review-note-card__actions{justify-content:stretch}.review-note-card__actions button{flex:1}}.review-note-list{margin-bottom:var(--spacing-10)}.review-note-list__group{margin-bottom:var(--spacing-8)}.review-note-list__group-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-dark-gray);margin-bottom:var(--spacing-4);padding-bottom:var(--spacing-2);border-bottom:2px solid var(--color-pale-green)}.review-note-list__cards{display:flex;flex-direction:column;gap:var(--spacing-3)}.review-note-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-20) var(--spacing-6);text-align:center}.review-note-empty__icon{width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#c7d8b733,#c7d8b70d);border-radius:50%;color:var(--color-main-green);margin-bottom:var(--spacing-6)}.review-note-empty__message{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-dark-gray);margin-bottom:var(--spacing-2)}.review-note-empty__submessage{font-size:var(--font-size-base);color:#666;margin-bottom:var(--spacing-6)}.review-feedback{display:flex;flex-direction:column;align-items:center;text-align:center;padding:var(--spacing-8) var(--spacing-6)}.review-feedback__icon-wrap{margin-bottom:var(--spacing-4);animation:feedback-icon-pop .4s cubic-bezier(.34,1.56,.64,1)}@keyframes feedback-icon-pop{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.review-feedback__icon{filter:drop-shadow(0 2px 8px rgba(0,0,0,.15))}.review-feedback__icon--correct{color:#8fae5d}.review-feedback__icon--wrong{color:#c94a3a}.review-feedback__message{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);margin-bottom:var(--spacing-6);animation:feedback-message-appear .3s ease-out .2s both}@keyframes feedback-message-appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.review-feedback__message--correct{color:#8fae5d}.review-feedback__message--wrong{color:#c94a3a}.review-feedback__reward{font-size:var(--font-size-sm);color:#96773d;background:#fbf7be;padding:var(--spacing-2) var(--spacing-4);border-radius:6px;margin-bottom:var(--spacing-6);animation:feedback-reward-appear .3s ease-out .3s both}@keyframes feedback-reward-appear{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.review-feedback__button{width:100%;animation:feedback-button-appear .3s ease-out .4s both}@keyframes feedback-button-appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.review-feedback{padding:var(--spacing-6) var(--spacing-4)}.review-feedback__icon{width:56px;height:56px}.review-feedback__message{font-size:var(--font-size-xl);margin-bottom:var(--spacing-5)}}.review-note-page{max-width:800px;margin:0 auto;padding:var(--spacing-8) var(--spacing-4)}.review-note-page__loading,.review-note-page__error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-20) var(--spacing-6);text-align:center}.review-note-page__loading-text,.review-note-page__error-text{font-size:var(--font-size-lg);color:#666;margin-top:var(--spacing-4)}.review-note-page__error-text{color:#dc0000}.review-note-modal{padding:var(--spacing-2) 0}.review-note-modal__content{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-dark-gray);margin-bottom:var(--spacing-8);line-height:var(--line-height-relaxed)}.review-note-modal__type{display:inline-block;padding:4px 10px;background:var(--color-quiz-yellow);color:var(--color-dark-gray);font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);border-radius:6px;margin-bottom:var(--spacing-4)}.review-note-modal__ox-buttons{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-4);margin-bottom:var(--spacing-6)}.review-note-modal__ox-btn{height:80px;font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);border-radius:12px;border:2px solid #e0e0e0;background:var(--color-white);cursor:pointer;transition:all .2s ease}.review-note-modal__ox-btn--o{color:var(--color-chart-up)}.review-note-modal__ox-btn--o:hover{border-color:var(--color-chart-up);background:#fff5f5}.review-note-modal__ox-btn--x{color:var(--color-chart-down)}.review-note-modal__ox-btn--x:hover{border-color:var(--color-chart-down);background:#f5f8ff}.review-note-modal__choices{display:flex;flex-direction:column;gap:var(--spacing-3);margin-bottom:var(--spacing-6)}.review-note-modal__choice{display:flex;align-items:center;gap:var(--spacing-3);padding:var(--spacing-4);border:2px solid #e0e0e0;border-radius:10px;cursor:pointer;transition:all .2s ease}.review-note-modal__choice:hover{border-color:var(--color-main-green);background:#c7d8b70d}.review-note-modal__choice input[type=radio]{width:20px;height:20px;cursor:pointer}.review-note-modal__choice-text{flex:1;font-size:var(--font-size-base);color:var(--color-dark-gray)}@media(max-width:640px){.review-note-page{padding:var(--spacing-4) var(--spacing-3)}.review-note-modal__ox-buttons{grid-template-columns:1fr}}.landing{height:100vh;background:#fff;color:#1a1a1a;overflow-x:hidden;overflow-y:auto;scroll-snap-type:y mandatory;scroll-behavior:smooth}.landing__section{min-height:100vh;scroll-snap-align:start;scroll-snap-stop:always}.landing__hero{position:relative;min-height:100vh;display:flex;flex-direction:column;padding:80px 5% 0;scroll-snap-align:start;scroll-snap-stop:always}.landing__hero-bg{position:absolute;inset:0;overflow:hidden;z-index:0}.landing__hero-gradient{position:absolute;top:-50%;left:-20%;width:80%;height:100%;background:radial-gradient(ellipse,rgba(16,185,129,.12) 0%,transparent 70%);animation:pulse 8s ease-in-out infinite}.landing__hero-gradient:after{content:"";position:absolute;top:20%;right:-50%;width:80%;height:100%;background:radial-gradient(ellipse,rgba(59,130,246,.08) 0%,transparent 70%);animation:pulse 10s ease-in-out infinite reverse}@keyframes pulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:.8;transform:scale(1.1)}}.landing__hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(0,0,0,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.03) 1px,transparent 1px);background-size:60px 60px;-webkit-mask-image:linear-gradient(to bottom,transparent,black 20%,black 80%,transparent);mask-image:linear-gradient(to bottom,transparent,black 20%,black 80%,transparent)}.landing__hero-content{position:relative;z-index:10;flex:1;display:flex;flex-direction:column;justify-content:center;max-width:600px;padding:40px 0}.landing__hero-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:#10b9811a;border:1px solid rgba(16,185,129,.3);border-radius:100px;font-size:.875rem;color:#059669;width:fit-content;margin-bottom:24px;animation:fadeInUp .6s ease-out}.landing__hero-title{font-size:clamp(2.5rem,6vw,4.5rem);font-weight:800;line-height:1.1;margin:0 0 24px;color:#1a1a1a;animation:fadeInUp .6s ease-out .1s both}.landing__hero-highlight{background:linear-gradient(135deg,#10b981,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.landing__hero-subtitle{font-size:1.25rem;color:#0000008c;line-height:1.6;margin:0 0 32px;animation:fadeInUp .6s ease-out .2s both}.landing__hero-cta{display:flex;gap:16px;margin-bottom:48px;animation:fadeInUp .6s ease-out .3s both}.landing__cta-primary{display:flex;align-items:center;gap:8px;padding:16px 32px;background:linear-gradient(135deg,#10b981,#059669);border:none;border-radius:12px;color:#fff;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s;box-shadow:0 4px 20px #10b9814d}.landing__cta-primary:hover{transform:translateY(-2px);box-shadow:0 8px 30px #10b98166}.landing__cta-primary--large{padding:20px 40px;font-size:1.2rem}.landing__cta-secondary{padding:16px 32px;background:transparent;border:1px solid rgba(0,0,0,.15);border-radius:12px;color:#1a1a1a;font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.landing__cta-secondary:hover{background:#00000008;border-color:#0000004d}.landing__hero-stats{display:flex;align-items:center;gap:32px;animation:fadeInUp .6s ease-out .4s both}.landing__stat{display:flex;flex-direction:column;gap:4px}.landing__stat strong{font-size:1.5rem;font-weight:700;color:#1a1a1a}.landing__stat span{font-size:.875rem;color:#00000080}.landing__stat-divider{width:1px;height:40px;background:#0000001a}.landing__hero-visual{position:absolute;right:5%;top:55%;transform:translateY(-50%);z-index:5}.landing__phone-mockup{width:280px;height:500px;background:linear-gradient(135deg,#f8fafc,#e2e8f0);border-radius:40px;padding:12px;box-shadow:0 50px 100px #00000026,0 20px 40px #0000001a,inset 0 1px #fffc;animation:float 6s ease-in-out infinite}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-15px)}}.landing__phone-screen{width:100%;height:100%;background:#fff;border-radius:32px;padding:24px;display:flex;flex-direction:column;box-shadow:inset 0 0 20px #00000008}.landing__phone-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.landing__phone-header span:first-child{font-weight:600;color:#1a1a1a}.landing__phone-price{font-size:1.25rem;font-weight:700;color:#10b981}.landing__phone-chart{flex:1;display:flex;align-items:center}.landing__chart-svg{width:100%;height:auto}.landing__phone-stats{display:flex;gap:16px;margin-top:auto}.landing__phone-stat{flex:1;background:#f8fafc;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:4px}.landing__phone-stat span{font-size:.75rem;color:#00000080}.landing__phone-stat strong{font-size:1rem;font-weight:600;color:#1a1a1a}.landing__phone-stat--up{color:#10b981!important}.landing__floating-card{position:absolute;display:flex;align-items:center;gap:10px;padding:12px 20px;background:#fffffff2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(0,0,0,.08);border-radius:12px;font-weight:500;color:#1a1a1a;box-shadow:0 10px 40px #0000001a;animation:floatCard 4s ease-in-out infinite}.landing__floating-card--1{top:40px;left:-60px;animation-delay:0s}.landing__floating-card--1 svg{color:#3b82f6}.landing__floating-card--2{bottom:120px;right:-40px;animation-delay:2s}.landing__floating-card--2 svg{color:#10b981}@keyframes floatCard{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-10px) rotate(2deg)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.landing__scroll-indicator{position:absolute;bottom:40px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;z-index:10;animation:fadeInUp .6s ease-out .6s both}.landing__scroll-indicator span{font-size:.75rem;color:#0006;letter-spacing:1px;text-transform:uppercase}.landing__scroll-mouse{width:24px;height:40px;border:2px solid rgba(0,0,0,.2);border-radius:12px;display:flex;justify-content:center;padding-top:8px}.landing__scroll-wheel{width:4px;height:8px;background:#0006;border-radius:2px;animation:scrollWheel 1.5s ease-in-out infinite}@keyframes scrollWheel{0%,to{opacity:1;transform:translateY(0)}50%{opacity:.3;transform:translateY(8px)}}.landing__features{min-height:100vh;padding:120px 5%;background:linear-gradient(180deg,#fff,#f8fafc);scroll-snap-align:start;scroll-snap-stop:always;display:flex;flex-direction:column;justify-content:center}.landing__section-header{text-align:center;margin-bottom:64px}.landing__section-badge{display:inline-block;padding:8px 16px;background:#10b9811a;border-radius:100px;font-size:.875rem;font-weight:600;color:#059669;text-transform:uppercase;letter-spacing:1px;margin-bottom:16px}.landing__section-title{font-size:clamp(2rem,4vw,3rem);font-weight:800;margin:0 0 16px;line-height:1.2;color:#1a1a1a}.landing__section-title span{color:#10b981}.landing__section-subtitle{font-size:1.1rem;color:#00000080;max-width:500px;margin:0 auto}.landing__features-marquee{overflow:hidden;width:100%;mask-image:linear-gradient(to right,transparent,black 5%,black 95%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,black 5%,black 95%,transparent)}.landing__features-track{display:flex;gap:24px;width:max-content;animation:marquee 30s linear infinite}.landing__features-track:hover{animation-play-state:paused}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}.landing__feature-card{flex:0 0 300px;max-width:300px;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:20px;padding:32px;margin-block:20px;transition:all .3s;box-shadow:0 4px 20px #0000000a}.landing__feature-card:hover{transform:translateY(-4px);border-color:#0000001a;box-shadow:0 12px 40px #00000014}.landing__feature-icon{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:20px}.landing__feature-icon--green{background:#10b9811f;color:#10b981}.landing__feature-icon--blue{background:#3b82f61f;color:#3b82f6}.landing__feature-icon--purple{background:#8b5cf61f;color:#8b5cf6}.landing__feature-icon--orange{background:#f973161f;color:#f97316}.landing__feature-card h3{font-size:1.25rem;font-weight:700;margin:0 0 12px;color:#1a1a1a}.landing__feature-card p{font-size:.95rem;color:#0000008c;line-height:1.6;margin:0}.landing__how{min-height:100vh;padding:120px 5%;background:#fff;scroll-snap-align:start;scroll-snap-stop:always;display:flex;flex-direction:column;justify-content:center}.landing__how-steps{display:flex;align-items:flex-start;justify-content:center;gap:24px;max-width:1000px;margin:0 auto}.landing__how-step{flex:1;text-align:center;padding:40px 32px;background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:24px;transition:all .3s;box-shadow:0 4px 20px #0000000a}.landing__how-step:hover{transform:translateY(-8px);box-shadow:0 16px 50px #0000001a;border-color:#10b9814d}.landing__how-step h3{font-size:clamp(1.75rem,3vw,2.5rem);font-weight:800;margin:0 0 8px;color:#1a1a1a}.landing__step-number{font-size:.875rem;font-weight:700;color:#10b981;letter-spacing:2px;text-transform:uppercase;margin-bottom:20px}.landing__how-step p{font-size:1rem;color:#0000008c;line-height:1.7;max-width:280px;margin:0 auto}.landing__how-connector{width:40px;height:2px;background:linear-gradient(90deg,#10b981,#3b82f6);margin-top:60px;opacity:.3}.landing__cta-section{min-height:60vh;padding:80px 5%;background:linear-gradient(135deg,#10b98114,#3b82f614);text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;scroll-snap-align:start}.landing__cta-content{display:flex;flex-direction:column;align-items:center}.landing__cta-content h2{font-size:clamp(1.75rem,4vw,2.5rem);font-weight:800;margin:0 0 16px;color:#1a1a1a}.landing__cta-content p{font-size:1.1rem;color:#0000008c;margin:0 0 32px}@media(max-width:1024px){.landing__hero-visual{display:none}.landing__hero-content{max-width:100%;text-align:center;align-items:center}.landing__hero-cta{flex-direction:column;align-items:center}.landing__hero-stats{justify-content:center}.landing__scroll-indicator{display:none}}@media(max-width:768px){.landing{scroll-snap-type:none;height:auto}.landing__hero{padding-top:70px;min-height:auto;padding-bottom:60px}.landing__hero-title{font-size:2rem}.landing__hero-subtitle{font-size:1rem}.landing__features{padding:60px 0;min-height:auto}.landing__features .landing__section-header{padding:0 5%}.landing__features-track{gap:16px;animation-duration:20s}.landing__feature-card{flex:0 0 280px;max-width:280px}.landing__how{padding:60px 5%;min-height:auto}.landing__how-steps{flex-direction:column;gap:16px;width:100%}.landing__how-connector{display:none}.landing__how-step{padding:28px 24px;width:100%}.landing__how-step h3{font-size:1.5rem;margin-bottom:12px}.landing__how-step p{font-size:.95rem;max-width:100%;line-height:1.6}.landing__cta-section{min-height:auto;padding:60px 5%}}@media(max-width:480px){.landing__hero{padding-top:60px;padding-bottom:40px}.landing__hero-content{padding:20px 0}.landing__hero-badge{font-size:.7rem;padding:6px 12px}.landing__hero-title{font-size:1.6rem;margin-bottom:16px}.landing__hero-subtitle{font-size:.9rem;margin-bottom:24px}.landing__hero-cta{margin-bottom:0;gap:12px}.landing__cta-primary{padding:14px 24px;font-size:.95rem;width:100%;justify-content:center}.landing__cta-secondary{padding:12px 24px;font-size:.9rem;width:100%}.landing__features{padding:40px 0}.landing__features-track{gap:12px;animation-duration:15s}.landing__section-header{margin-bottom:32px}.landing__section-badge{font-size:.75rem;padding:6px 12px}.landing__section-title{font-size:1.4rem}.landing__section-subtitle{font-size:.9rem}.landing__feature-card{flex:0 0 250px;max-width:250px;padding:20px}.landing__feature-card h3{font-size:1.1rem}.landing__feature-card p{font-size:.85rem}.landing__how{padding:40px 5%}.landing__how-step{padding:24px 20px}.landing__step-number{font-size:.75rem;margin-bottom:8px}.landing__how-step h3{font-size:1.25rem;margin-bottom:10px}.landing__how-step p{font-size:.9rem;max-width:100%;line-height:1.5}.landing__cta-section{padding:40px 5%}.landing__cta-content h2{font-size:1.3rem}.landing__cta-content p{font-size:.9rem;margin-bottom:24px}.landing__cta-primary--large{padding:16px 32px;font-size:1rem}}
