:root{--ink: #161916;--muted: #58615b;--jade: #123c35;--jade-soft: #dcebe2;--persimmon: #d9533f;--persimmon-soft: #f7d7c8;--hanji: #f7f1e7;--paper: #fffaf2;--line: #ded4c4;--shadow: 0 22px 70px rgba(18, 60, 53, .12);font-family:Noto Sans Thai,Noto Sans KR,Sarabun,sans-serif;color:var(--ink);background:radial-gradient(circle at 15% 0%,rgba(217,83,63,.16) 0,transparent 28%),radial-gradient(circle at 88% 10%,rgba(18,60,53,.14) 0,transparent 30%),linear-gradient(135deg,#fffaf2 0%,var(--hanji) 42%,#edf4ef 100%);line-height:1.5;font-weight:400}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:linear-gradient(90deg,rgba(18,60,53,.035) 1px,transparent 1px),linear-gradient(rgba(18,60,53,.03) 1px,transparent 1px);background-size:34px 34px}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at 84% 22%,rgba(217,83,63,.18),transparent 18rem),radial-gradient(circle at 10% 74%,rgba(18,60,53,.12),transparent 18rem)}a{color:inherit;text-decoration:none}.app-shell{max-width:1180px;margin:0 auto;padding:16px}.topbar{position:sticky;top:8px;z-index:20;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid rgba(222,212,196,.8);border-radius:20px;background:#fffaf2d1;box-shadow:0 12px 34px #123c3514;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand{display:inline-flex;align-items:center;gap:10px;color:var(--jade);font-size:1.05rem;font-weight:900;letter-spacing:.02em}.brand small{display:block;margin-top:-5px;color:var(--persimmon);font-size:.68rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.brand-mark{display:inline-grid;width:38px;height:38px;place-items:center;border-radius:14px;color:#fffaf2;background:linear-gradient(135deg,rgba(255,255,255,.18),transparent),var(--jade);box-shadow:0 10px 24px #123c3533;font-family:Noto Sans KR,serif;font-size:1.15rem}.menu{display:flex;flex-wrap:wrap;gap:8px}.menu-link{padding:8px 10px;border-radius:999px;font-size:.92rem;color:#39443f;transition:color .15s ease,background .15s ease,transform .15s ease}.menu-link:hover{color:var(--jade);background:#123c3512;transform:translateY(-1px)}.menu-link.active{color:var(--paper);background:var(--jade)}.auth-links{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.user-chip{display:inline-flex;align-items:center;border:1px solid #c8d7ce;border-radius:999px;padding:8px 10px;font-size:.85rem;color:var(--jade);background:#fffaf2b8}.page-wrap{padding:26px 0 50px}.hero{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);gap:28px;align-items:center;min-height:520px;padding:clamp(30px,6vw,72px);border:1px solid rgba(222,212,196,.88);border-radius:32px;background:linear-gradient(120deg,#fffaf2f0,#f7f1e7b8),radial-gradient(circle at 86% 24%,rgba(217,83,63,.2),transparent 20rem),radial-gradient(circle at 72% 78%,rgba(18,60,53,.18),transparent 20rem);box-shadow:var(--shadow);isolation:isolate;animation:section-rise .55s ease both}.hero:before{content:"한국어";position:absolute;right:32px;top:18px;z-index:-1;color:#123c350f;font-family:Noto Sans KR,serif;font-size:clamp(5rem,16vw,12rem);font-weight:900;letter-spacing:-.12em}.hero-copy{max-width:680px}.eyebrow{margin:0;font-size:.9rem;color:var(--persimmon);font-weight:900;letter-spacing:.06em}h1{margin:10px 0;font-size:clamp(2.15rem,5vw,4.2rem);line-height:1.08;letter-spacing:-.045em}.lead{margin:0;max-width:720px;color:var(--muted);font-size:clamp(1rem,1.6vw,1.18rem)}.action-row{display:flex;gap:10px;margin-top:18px}.highlight-grid{margin-top:22px;padding-left:20px;display:grid;gap:8px}.btn{border:none;border-radius:999px;padding:11px 16px;font-size:.95rem;font-weight:800;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.btn:hover{transform:translateY(-1px)}.btn:disabled{cursor:not-allowed;opacity:.65}.btn.primary{color:#fffaf2;background:var(--jade);box-shadow:0 12px 26px #123c3533}.btn.ghost{color:var(--jade);border:1px solid rgba(18,60,53,.2);background:#fffaf2c7}.hero-visual{position:relative;min-height:380px;border:1px solid rgba(18,60,53,.14);border-radius:30px;padding:28px;background:radial-gradient(circle at 50% 38%,rgba(255,250,242,.62),transparent 9rem),linear-gradient(145deg,#123c35f5,#194d42e6);color:var(--paper);box-shadow:0 28px 70px #123c3538}.hero-visual:before,.hero-visual:after{content:"";position:absolute;border-radius:999px}.hero-visual:before{inset:42px 36px auto auto;width:132px;height:132px;background:var(--persimmon);opacity:.92}.hero-visual:after{left:32px;bottom:42px;width:160px;height:160px;border:1px solid rgba(255,250,242,.35)}.korean-seal{position:relative;z-index:1;display:grid;width:92px;height:92px;place-items:center;border-radius:30px;background:var(--paper);color:var(--jade);font-family:Noto Sans KR,serif;font-size:3.1rem;font-weight:900}.visual-kicker,.visual-title,.visual-script{position:relative;z-index:1}.visual-kicker{margin:58px 0 0;color:#fffaf2c7;font-family:Noto Sans KR,sans-serif;font-weight:800}.visual-title{margin:4px 0 0;font-size:clamp(2.1rem,4vw,3.4rem);font-weight:950;letter-spacing:-.04em}.visual-lines{position:relative;z-index:1;display:grid;gap:9px;max-width:260px;margin-top:30px}.visual-lines span{height:10px;border-radius:999px;background:#fffaf23d}.visual-lines span:nth-child(2){width:76%}.visual-lines span:nth-child(3){width:52%}.visual-script{margin:26px 0 0;color:#fffaf2d1;font-family:Noto Sans KR,sans-serif;font-weight:800}.metric-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:18px;overflow:hidden;border:1px solid rgba(222,212,196,.92);border-radius:24px;background:var(--line);box-shadow:0 12px 38px #123c3514}.metric-item{display:grid;gap:4px;padding:18px;background:#fffaf2e0}.metric-item span{color:var(--muted);font-size:.82rem;font-weight:800;text-transform:uppercase}.metric-item strong{color:var(--jade);font-size:clamp(1rem,2vw,1.25rem)}.card,.exam-shell,.plan-card{border:1px solid rgba(222,212,196,.92);border-radius:22px;background:#fffaf2e6;box-shadow:0 16px 44px #123c3514}.card,.exam-shell{padding:24px}.form-grid{display:grid;gap:12px;margin-top:14px}.form-grid label{display:grid;gap:5px;font-weight:600}input{border:1px solid rgba(18,60,53,.18);border-radius:14px;padding:10px;font-size:1rem;background:#ffffffc7}.helper-text{margin-top:16px;color:#4b5563}.status-message{margin:0;font-size:.9rem}.status-error{color:#b91c1c}.status-success{color:#166534}.exam-header p{margin-top:0;color:var(--muted)}.question-card{border:1px solid rgba(222,212,196,.9);border-radius:20px;padding:18px;margin-top:14px;background:#ffffffb3}.question-label{margin:0;font-size:.88rem;color:#4b5563}.question-text{font-size:1.05rem}.choice-list{display:grid;gap:8px}.choice-btn{text-align:left;border:1px solid rgba(18,60,53,.14);border-radius:14px;padding:10px 12px;background:#fffaf2d1}.choice-btn.selected{border-color:var(--jade);background:var(--jade-soft)}.listening-box{margin-top:18px;padding:14px;border-radius:18px;background:#dcebe2a3;border:1px solid rgba(18,60,53,.14)}.exam-footer{margin-top:16px;display:flex;justify-content:space-between}.table-wrap{overflow-x:auto;margin-top:12px}table{width:100%;border-collapse:collapse}th,td{padding:10px;border-bottom:1px solid #e5e7eb;text-align:left}.pricing-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.plan-card{padding:20px;position:relative;overflow:hidden}.plan-card:before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,var(--persimmon),var(--jade))}.plan-name{margin:0;color:var(--muted);font-weight:900;letter-spacing:.08em;text-transform:uppercase}.plan-period{margin-top:-4px;color:var(--muted)}.plan-card ul{padding-left:20px;min-height:120px}.exam-start-card,.exam-result-card{display:grid;gap:14px}.mode-switch{display:flex;gap:8px;flex-wrap:wrap}.exam-option-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.exam-option{text-align:left;border:1px solid rgba(222,212,196,.92);border-radius:20px;background:#fffaf2d1;padding:14px;cursor:pointer;transition:border-color .15s ease,transform .15s ease,box-shadow .15s ease}.exam-option:hover{transform:translateY(-1px);box-shadow:0 14px 34px #123c3514}.exam-option.selected{border-color:var(--jade);background:var(--jade-soft)}.exam-option h3{margin:0}.exam-option p{margin:6px 0 4px;font-size:.95rem}.exam-option small{color:#4b5563}.timer-row{display:flex;flex-wrap:wrap;gap:10px;border:1px solid rgba(18,60,53,.16);border-radius:16px;background:#dcebe2b8;padding:10px 12px;font-weight:600}.result-grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}.result-grid h3{margin:4px 0 0}.result-label{margin:0;color:#4b5563;font-size:.88rem}.review-wrap{margin-top:8px;border-top:1px solid #e5ece8;padding-top:14px}.review-list{display:grid;gap:12px}.review-item{border:1px solid rgba(222,212,196,.9);border-radius:18px;padding:12px;background:#fffaf2d6}.review-head{margin:0 0 6px;font-weight:600}.review-choice-list{list-style:none;padding:0;margin:8px 0;display:grid;gap:6px}.review-choice{border:1px solid rgba(18,60,53,.14);border-radius:12px;padding:8px;background:#ffffffb8}.review-choice.is-selected{border-color:#b6921d;background:#fff7d7}.review-choice.is-correct{border-color:#1f7a4d;background:#e8f7ef}.review-listening-box{display:grid;gap:6px;margin-top:8px}.content-page{display:grid;gap:18px}.content-hero,.content-section{border:1px solid rgba(222,212,196,.92);border-radius:28px;background:#fffaf2e6;box-shadow:0 14px 44px #123c3512}.content-hero{position:relative;overflow:hidden;padding:38px;background:radial-gradient(circle at 92% 8%,rgba(217,83,63,.16) 0,transparent 28%),linear-gradient(135deg,#fffaf2f5 8%,#e7efe9d1);animation:section-rise .45s ease both}.content-hero:after{content:"";position:absolute;right:-48px;bottom:-80px;width:210px;height:210px;border:1px solid rgba(18,60,53,.14);border-radius:999px}.content-hero>*{position:relative;z-index:1}.path-chip{display:inline-flex;margin-top:18px;border:1px solid rgba(18,60,53,.18);border-radius:999px;padding:7px 10px;color:var(--jade);background:#fffaf2bf;font-size:.86rem;font-weight:600}.content-section{padding:24px;animation:section-rise .45s ease both}.home-guides{margin-top:18px}.section-heading{margin-bottom:16px}.section-heading h2,.content-section h2{margin:4px 0 0;font-size:clamp(1.25rem,2.6vw,1.75rem);line-height:1.25}.content-section h3{margin:0 0 6px;color:var(--jade)}.content-section p{color:var(--muted)}.split-section{display:grid;gap:22px;grid-template-columns:minmax(0,1.45fr) minmax(280px,.85fr)}.info-panel,.script-sample{border-radius:22px;background:#dcebe294;border:1px solid rgba(18,60,53,.14);padding:18px}.content-note{border-left:4px solid var(--persimmon);padding:10px 12px;border-radius:12px;background:#fffaf2bd}.link-list,.clean-list{display:grid;gap:8px;margin:0;padding-left:20px}.link-list a{color:var(--jade);font-weight:700;text-decoration:underline;text-underline-offset:3px}.step-list{display:grid;gap:10px;margin:0;padding-left:24px}.step-list li,.clean-list li{color:#273447}.check-grid,.strategy-row{display:flex;flex-wrap:wrap;gap:10px}.check-grid span,.strategy-row span{border:1px solid #cfe0d7;border-radius:999px;padding:9px 12px;background:#fffaf2d1;color:var(--jade);font-weight:600}.guide-link-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}.guide-link-card{position:relative;overflow:hidden;display:grid;gap:6px;min-height:110px;align-content:start;border:1px solid rgba(222,212,196,.92);border-radius:22px;padding:16px;background:radial-gradient(circle at 100% 0%,rgba(217,83,63,.12),transparent 7rem),linear-gradient(140deg,#fffaf2f0,#ffffffb3);color:var(--jade);font-weight:800;transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}.guide-icon{display:grid;width:40px;height:40px;place-items:center;border-radius:14px;background:var(--jade);color:var(--paper);font-family:Noto Sans KR,serif;font-size:1.2rem;font-weight:900}.guide-link-card span{color:var(--muted);font-size:.9rem;font-weight:500}.guide-link-card .guide-icon{color:var(--paper);font-size:1.2rem;font-weight:900}.guide-link-card:hover{border-color:#123c3547;box-shadow:0 18px 42px #123c351f;transform:translateY(-2px)}.vocab-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.vocab-card,.pattern-grid article,.timeline-grid article{border:1px solid rgba(222,212,196,.9);border-radius:20px;padding:16px;background:#ffffffad}.vocab-card h3{margin:0;font-family:Noto Sans KR,Noto Sans Thai,sans-serif;font-size:1.35rem}.vocab-meaning{margin:2px 0 10px;color:var(--persimmon);font-weight:800}.example-ko{margin:0;color:#111827;font-family:Noto Sans KR,Noto Sans Thai,sans-serif;font-weight:700}.example-th{margin:4px 0 0;color:#4b5563;font-size:.95rem}.script-sample{display:grid;gap:10px;align-content:center;font-family:Noto Sans KR,Noto Sans Thai,sans-serif;font-size:clamp(1.3rem,4vw,2rem);font-weight:800;color:var(--jade)}.pattern-grid,.timeline-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.faq-list{display:grid;gap:10px}.faq-item{border:1px solid rgba(222,212,196,.9);border-radius:18px;background:#ffffffad;padding:0}.faq-item summary{cursor:pointer;padding:16px;color:var(--jade);font-weight:800}.faq-item p{margin:0;border-top:1px solid #e6eee9;padding:0 16px 16px}.final-cta{background:radial-gradient(circle at 88% 20%,rgba(217,83,63,.14),transparent 12rem),linear-gradient(135deg,#dcebe2bd,#fffaf2f0)}@keyframes section-rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}@media (max-width: 700px){.app-shell{padding:12px}.topbar{position:static}.menu{width:100%}.menu-link{flex:1;text-align:center}.auth-links{width:100%}.auth-links .btn{flex:1;text-align:center}.action-row{flex-direction:column}.action-row .btn{width:100%;text-align:center}.hero{grid-template-columns:1fr;min-height:auto;border-radius:24px}.hero-visual{min-height:320px}.metric-strip{grid-template-columns:repeat(2,1fr)}.hero,.content-hero,.content-section{padding:22px}.split-section{grid-template-columns:1fr}.path-chip{width:100%;border-radius:12px}}
