@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@500;600;700&family=Gowun+Dodum&display=swap";:root{font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:DM Sans,Noto Sans KR,system-ui,sans-serif}html,body,#root{min-width:320px;min-height:100%;margin:0}body{min-height:100svh}:root{--ink:#17352e;--muted:#7a8d87;--green:#2e9b72;--green-dark:#207b59;--green-light:#dff2e9;--cream:#f7f4ec;--line:#dfe7e2}*{box-sizing:border-box}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}.app-shell{min-height:100svh;color:var(--ink);background:radial-gradient(circle at 8% 32%,#70af8f1f 0 1px,#0000 1.5px) 0 0/28px 28px,linear-gradient(#fbfaf5 0%,#f5f7f1 100%);flex-direction:column;display:flex;overflow:hidden}.topbar{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:20;background:#fdfcf7e0;border-bottom:1px solid #2e56491f;grid-template-columns:1fr minmax(220px,360px) 1fr;align-items:center;width:100%;height:82px;padding:0 clamp(24px,5vw,80px);display:grid;position:relative}.brand{width:fit-content;color:var(--ink);letter-spacing:-1.2px;align-items:center;gap:9px;font:700 26px/1 DM Sans,sans-serif;text-decoration:none;display:flex}.brand-mark{color:#fff;background:var(--green);border-radius:11px 11px 11px 3px;place-items:center;width:36px;height:36px;font:700 20px/1 DM Sans,sans-serif;display:inline-grid;transform:rotate(-4deg);box-shadow:0 6px 18px #2e9b7238}.progress-area{flex-direction:column;gap:7px;display:flex}.progress-label{color:var(--muted);justify-content:space-between;font-size:12px;display:flex}.progress-label strong{color:var(--green-dark)}.progress-track{background:#e4e8e3;border-radius:10px;height:6px;overflow:hidden}.progress-track span{border-radius:inherit;background:linear-gradient(90deg, #68bd92, var(--green));height:100%;transition:width .5s;display:block}.login-button{color:var(--ink);cursor:pointer;background:#fff;border:1px solid #cbd9d2;border-radius:999px;justify-self:end;padding:10px 22px;font-weight:700}.account-actions{justify-self:end;align-items:center;gap:8px;display:flex}.profile-badge{color:var(--ink);background:#fff;border:1px solid #cbd9d2;border-radius:999px;align-items:center;gap:8px;padding:6px 13px 6px 7px;display:flex}.profile-badge span{color:#fff;background:var(--green);border-radius:50%;place-items:center;width:28px;height:28px;font-weight:700;display:grid}.logout-button{color:#637a72;cursor:pointer;text-transform:uppercase;letter-spacing:.4px;background:#fff;border:1px solid #cbd9d2;border-radius:999px;padding:9px 13px;font:700 11px/1 DM Sans,sans-serif}.logout-button:hover{color:#a24646;background:#fff8f8;border-color:#dfb9b9}.logout-button:disabled{cursor:wait;opacity:.6}.study-area{flex-direction:column;flex:1;align-items:center;width:100%;padding:42px 20px 32px;display:flex}.study-heading{text-align:center}.eyebrow{color:var(--green);letter-spacing:2.4px;font:700 11px/1 DM Sans,sans-serif}.study-heading h1{color:var(--ink);letter-spacing:-1.2px;margin:10px 0 6px;font-family:Gowun Dodum,sans-serif;font-size:clamp(25px,2.4vw,34px);line-height:1.25}.study-heading p{color:var(--muted);margin:0;font-size:14px}.card-stage{perspective:1200px;width:min(88vw,430px);height:min(61vh,560px);min-height:460px;margin-top:30px;position:relative}.word-card{background:#fff;border:1px solid #284a4021;border-radius:28px;position:absolute;inset:0;overflow:hidden}.active-card{z-index:4;cursor:pointer;transition:transform .25s,box-shadow .25s;animation:.42s both card-arrive;box-shadow:0 30px 70px #2746392b,0 4px 12px #27463914}.active-card:hover{transform:translateY(-4px)rotate(.4deg);box-shadow:0 35px 80px #27463938}.active-card:focus-visible{outline-offset:5px;outline:3px solid #2e9b7259}.active-card.leaving{pointer-events:none;animation:.42s cubic-bezier(.65,0,.9,.55) forwards card-leave}.card-behind{pointer-events:none;box-shadow:0 15px 35px #27463914}.card-behind-1{z-index:3;transform:translate(9px,11px)rotate(2deg)scale(.985)}.card-behind-2{z-index:2;opacity:.72;transform:translate(16px,22px)rotate(3.7deg)scale(.965)}.card-image{background-repeat:no-repeat;background-size:400% 500%;width:100%;height:58%;position:relative}.number-badge{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);letter-spacing:1px;background:#1a332bc7;border-radius:50%;place-items:center;width:42px;height:42px;font:700 12px/1 DM Sans,sans-serif;display:grid;position:absolute;top:18px;left:18px}.card-content{flex-direction:column;justify-content:center;gap:20px;height:42%;padding:24px 28px;display:flex}.word-row{justify-content:space-between;align-items:center;display:flex}.word-title-line{align-items:center;gap:10px;display:flex}.word-title-line h2{color:var(--ink);letter-spacing:-1.8px;margin:0;font:700 clamp(34px,5vw,44px)/.95 DM Sans,sans-serif}.sound-button{width:33px;height:33px;color:var(--green-dark);background:var(--green-light);cursor:pointer;border:0;border-radius:50%;place-items:center;padding:7px;display:grid}.sound-button svg{fill:currentColor;width:100%}.pronunciation{color:#8c9b96;margin-top:7px;font:500 13px/1 DM Sans,sans-serif;display:block}.meaning{color:var(--green-dark);background:#edf7f2;border-radius:20px;padding:7px 12px;font-size:14px;font-weight:700}.sentence{background:var(--cream);border-radius:15px;align-items:flex-start;gap:8px;min-height:58px;padding:13px 16px;display:flex}.sentence p{color:#415c53;margin:0;font:600 15px/1.45 DM Sans,sans-serif}.quote-mark{color:#71ad91;font:700 25px/1 Georgia,serif}.next-hint{color:#789087;cursor:pointer;background:0 0;border:0;align-items:center;gap:5px;margin-top:33px;padding:0;font-size:13px;display:flex}.next-hint svg{fill:none;stroke:currentColor;stroke-width:2px;width:18px}.finish-card{border:1px solid var(--line);text-align:center;background:#fff;border-radius:28px;flex-direction:column;justify-content:center;align-items:center;padding:42px;animation:.5s both card-arrive;display:flex;position:absolute;inset:0;box-shadow:0 30px 70px #27463926}.finish-icon{color:#fff;background:var(--green);border:10px solid #dff2e9;border-radius:50%;place-items:center;width:96px;height:96px;margin-bottom:30px;font:700 34px/1 DM Sans,sans-serif;display:grid;box-shadow:0 12px 30px #2e9b7240}.finish-card h2{margin:14px 0 8px;font-family:Gowun Dodum,sans-serif;font-size:27px}.finish-card p{color:var(--muted);margin:0;font-size:14px}.finish-card button{color:#fff;background:var(--green);cursor:pointer;border:0;border-radius:14px;margin-top:30px;padding:13px 24px;font-weight:700}footer{color:#96a59f;border-top:1px solid #2e56491a;justify-content:space-between;align-items:center;min-height:65px;padding:0 clamp(24px,5vw,80px);font-size:11px;display:flex}.modal-backdrop{z-index:50;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#142a2385;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.login-modal{text-align:center;background:#fff;border-radius:26px;width:min(100%,420px);max-height:calc(100svh - 40px);padding:40px;animation:.25s both modal-in;position:relative;overflow-y:auto;box-shadow:0 30px 90px #0d241c40}.close-button{color:#768982;cursor:pointer;background:0 0;border:0;width:34px;height:34px;font-size:28px;position:absolute;top:14px;right:16px}.modal-logo{width:48px;height:48px;margin-bottom:20px;font-size:25px}.login-modal h2{margin:0 0 8px;font-family:Gowun Dodum,sans-serif;font-size:26px}.login-modal>p{color:var(--muted);margin:0 0 28px;font-size:14px}.auth-tabs{background:#f0f4f1;border-radius:12px;grid-template-columns:1fr 1fr;margin-bottom:20px;padding:4px;display:grid}.auth-tabs button{color:#82928c;cursor:pointer;background:0 0;border:0;border-radius:9px;padding:9px;font-weight:700}.auth-tabs button.active{color:var(--green-dark);background:#fff;box-shadow:0 3px 10px #1f433614}.login-modal>.auth-notice{color:#8a5d12;background:#fff6dc;border-radius:10px;margin:0 0 16px;padding:10px 12px;font-size:12px;line-height:1.45}.auth-form{text-align:left;flex-direction:column;gap:13px;display:flex}.auth-form label{flex-direction:column;gap:6px;display:flex}.auth-form label span{color:#50685f;font-size:12px;font-weight:700}.auth-form input{width:100%;height:46px;color:var(--ink);background:#fff;border:1px solid #d6e0db;border-radius:11px;outline:none;padding:0 14px}.auth-form input:focus{border-color:var(--green);box-shadow:0 0 0 3px #2e9b721f}.email-auth-button{color:#fff;background:var(--green);cursor:pointer;border:0;border-radius:12px;height:48px;margin-top:3px;font-weight:700}.email-auth-button:hover{background:var(--green-dark)}.email-auth-button:disabled,.google-login-button:disabled{cursor:wait;opacity:.6}.login-modal>.auth-message{color:#31584a;background:#edf7f2;border-radius:9px;margin:13px 0 0;padding:9px 11px;font-size:12px;line-height:1.45}.auth-divider{color:#9aa8a3;align-items:center;gap:10px;margin:18px 0 8px;font-size:11px;display:flex}.auth-divider:before,.auth-divider:after{content:"";background:#e4eae7;flex:1;height:1px}.google-login-button{color:#334a42;cursor:pointer;background:#fff;border:1px solid #d6e0db;border-radius:12px;justify-content:center;align-items:center;gap:10px;width:100%;height:50px;font-weight:700;transition:border-color .2s,box-shadow .2s;display:flex}.google-login-button:hover{border-color:#aebfb7;box-shadow:0 4px 12px #1f433614}.google-login-button svg{width:20px;height:20px}.login-modal small{color:#9aa8a3;margin-top:24px;font-size:10px;line-height:1.5;display:block}@keyframes card-leave{0%{opacity:1;transform:translate(0)rotate(0)}to{opacity:0;transform:translate(125%)rotate(14deg)}}@keyframes card-arrive{0%{opacity:0;transform:translateY(12px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes modal-in{0%{opacity:0;transform:translateY(10px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=700px){.topbar{grid-template-columns:1fr auto;height:68px;padding:0 18px}.brand{font-size:22px}.brand-mark{width:32px;height:32px;font-size:17px}.progress-area{position:absolute;bottom:-6px;left:0;right:0}.progress-label{display:none}.progress-track{border-radius:0;height:5px}.profile-badge strong{display:none}.profile-badge{padding:5px}.account-actions{gap:5px}.logout-button{padding:9px 10px;font-size:10px}.login-button{padding:8px 17px;font-size:13px}.study-area{padding:31px 14px 24px}.study-heading h1{margin-top:8px;font-size:23px}.study-heading p{font-size:12px}.card-stage{width:min(88vw,390px);height:min(66vh,540px);min-height:435px;margin-top:22px}.word-card,.finish-card{border-radius:23px}.card-content{gap:16px;padding:20px 22px}.word-title-line h2{font-size:34px}.sentence p{font-size:13px}.next-hint{margin-top:28px}footer{min-height:48px;padding:0 18px}footer span:first-child{display:none}footer span:last-child{margin:auto}.login-modal{padding:36px 24px 28px}}@media (height<=760px) and (width>=701px){.study-area{padding-top:24px}.study-heading p{display:none}.card-stage{height:480px;min-height:0;margin-top:18px}.next-hint{margin-top:20px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}