:root{--paper: #f3eee4;--paper-deep: #e8dfd0;--ink: #1c1915;--ink-soft: #5b5348;--seal: #c0452a;--seal-deep: #9a3420;--indigo: #243447;--indigo-soft: #31475f;--gold: #c9a45c;--card: #fffdf8;--line: rgba(36, 28, 20, .1);--shadow: 0 10px 24px rgba(48, 32, 16, .08);--jp: "Noto Serif JP", "Noto Sans JP", serif;--kr: "Noto Sans KR", "Noto Sans JP", sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{font-family:var(--kr);color:var(--ink);background:radial-gradient(circle at 10% 0%,#fff8ec 0%,transparent 36%),linear-gradient(180deg,#f7f1e6 0%,var(--paper) 40%,#efe6d6 100%)}button,select,input{font:inherit}.app-shell{display:grid;grid-template-columns:230px 1fr;min-height:100vh}.sidebar{padding:28px 20px;border-right:1px solid var(--line);background:#fffcf6b8;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.brand{display:flex;gap:12px;align-items:center;margin-bottom:28px}.brand-seal{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--seal);color:#fff8ee;font-family:var(--jp);font-weight:700;box-shadow:inset 0 0 0 3px #ffe6c840}.brand strong{display:block;font-size:18px}.brand p,.side-foot,.muted,.nav-hint,.theme-label,.reading,.example-ko{margin:0;color:var(--ink-soft)}.side-nav{display:flex;flex-direction:column;gap:8px}.nav-item{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;padding:12px 14px;border:0;border-radius:14px;background:transparent;color:inherit;text-align:left;cursor:pointer}.nav-item:hover,.nav-item.active{background:#fff;box-shadow:var(--shadow)}.nav-item.active{outline:1px solid rgba(192,69,42,.18)}.nav-label{font-weight:700}.nav-hint{font-size:12px}.nav-count{position:absolute;top:12px;right:12px;font-style:normal;font-size:11px;padding:2px 7px;border-radius:999px;background:var(--indigo);color:#fff}.nav-count.warn{background:var(--seal)}.side-foot{margin-top:16px;font-size:12px;line-height:1.6}.account-box{margin-top:22px;padding:12px;border-radius:14px;background:#fff;box-shadow:var(--shadow)}.account-box strong,.account-box p,.account-note{display:block;margin:0 0 8px;font-size:12px;line-height:1.5}.account-box strong{font-size:14px}.account-form{display:flex;flex-direction:column;gap:8px}.account-form input{width:100%;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:#fffdf8}.account-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.account-btn,.account-link{border:0;background:transparent;cursor:pointer;padding:0}.account-btn{padding:7px 12px;border-radius:999px;background:var(--indigo);color:#fff;font-weight:700}.account-link{color:var(--seal);font-size:12px}.account-note{color:var(--seal-deep)}.account-btn{text-decoration:none;display:inline-block}.approval-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}.approval-item{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:14px 16px;border-radius:16px;background:#fff;box-shadow:var(--shadow)}.approval-item p{margin:4px 0 0}.app-main{padding:22px 26px 32px;min-width:0}.panel-head,.toolbar,.pager,.head-actions,.card-top,.card-actions,.mistake-head,.setting{display:flex;align-items:center}.panel-head{justify-content:space-between;gap:16px;margin-bottom:18px}.panel-head h1,.mistake-head h2{margin:0 0 6px;font-size:28px;letter-spacing:-.03em}.panel-head p{margin:0;color:var(--ink-soft)}.toolbar{justify-content:space-between;gap:16px;margin-bottom:16px;flex-wrap:wrap}.level-row,.course-row,.pager,.chip-row,.head-actions{gap:8px;flex-wrap:wrap}.course-row{width:100%}.course-chip{border:0;cursor:pointer;padding:8px 14px;border-radius:12px;background:transparent;color:var(--ink-soft);font-weight:700}.course-chip.on{background:#fff;color:var(--seal-deep);box-shadow:var(--shadow)}.level-chip,.btn,.choice,.icon-btn{border:0;cursor:pointer}.level-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:#fff;color:var(--ink);box-shadow:var(--shadow)}.level-chip small{color:var(--ink-soft)}.level-chip.on{background:var(--indigo);color:#fff}.level-chip.on small{color:#d7e4f2}.pager{color:var(--ink-soft);font-size:13px}.btn{padding:9px 14px;border-radius:12px;background:#fff;color:var(--ink);box-shadow:var(--shadow)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--seal);color:#fff8f2}.btn.ghost{background:transparent;box-shadow:none;border:1px solid var(--line)}.btn.stamp{background:#fff4e6;color:var(--seal-deep);font-weight:700}.btn.stamp.on{background:var(--gold);color:#3d2d0d}.card-grid{display:grid;gap:18px;grid-template-columns:repeat(3,minmax(0,1fr))}.word-card{height:540px;perspective:1000px;cursor:pointer}.word-card.is-focused{outline:3px solid var(--gold);outline-offset:3px;border-radius:18px}.card-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;pointer-events:none;transition:transform .28s cubic-bezier(.2,.7,.2,1)}.word-card.is-flipped .card-inner{transform:rotateY(180deg)}.card-face{position:absolute;inset:0;padding:18px 18px 14px;border-radius:18px;backface-visibility:hidden;box-shadow:var(--shadow);overflow:hidden}.card-front{background:var(--card);border:1px solid rgba(255,255,255,.8)}.card-face button{pointer-events:auto}.word-card.is-memorized .card-front{box-shadow:inset 0 0 0 2px var(--gold),var(--shadow)}.word-card.is-kept .card-front{box-shadow:inset 0 0 0 2px #3d5a80,var(--shadow)}.card-back{background:linear-gradient(160deg,var(--indigo) 0%,#1a2a3a 100%);color:#f6f1e8;transform:rotateY(180deg);overflow-y:auto}.card-top{justify-content:space-between;gap:6px}.level-pill,.pos,.wrong-badge{font-size:16px;padding:4px 9px;border-radius:999px}.level-pill{background:#f6e7dc;color:var(--seal-deep);font-weight:700}.theme-label{flex:1;font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.icon-btn{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#f4ece0;color:var(--indigo)}.icon-btn.tiny{width:30px;height:30px;flex:0 0 auto}.icon-btn.light{background:#ffffff1f;color:#fff}.icon-btn.speaking{background:var(--seal);color:#fff8f2;animation:speak-pulse .8s ease-in-out infinite}@keyframes speak-pulse{50%{transform:scale(1.08)}}.lemma{margin:22px 0 0;font-family:var(--jp);font-size:57px;font-weight:700;line-height:1.2}.reading{margin-top:8px;font-size:27px}.wrong-badge{position:absolute;right:10px;bottom:10px;background:#fde8e2;color:var(--seal)}.meaning{margin:10px 0 12px;font-size:39px;font-weight:700}.example-list{display:grid;gap:14px;margin:8px 0 10px}.example-item{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:start}.example-ja,.example-ko{margin:0;font-size:23px;line-height:1.45}.example-ja{font-family:var(--jp)}.ex-word{position:relative;display:inline;margin:0;padding:0 1px;border:0;border-radius:4px;background:transparent;color:inherit;font:inherit;line-height:inherit;cursor:pointer;text-underline-offset:3px}.ex-tip{position:absolute;left:50%;top:calc(100% + 6px);transform:translate(-50%);z-index:5;display:none;min-width:max-content;max-width:220px;padding:6px 10px;border-radius:10px;background:#fff8ee;color:#2b241c;font-family:var(--kr);font-size:16px;font-weight:700;line-height:1.3;box-shadow:0 8px 18px #00000038;pointer-events:none}.ex-word:hover .ex-tip,.ex-word:focus-visible .ex-tip{display:block}.ex-word:hover{background:#ffffff24;text-decoration:underline}.ex-word.on{background:var(--gold);color:#3d2d0d}.example-ko{color:#c9c0b2;margin-top:2px}.chip-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.chip{font:inherit;font-size:20px;padding:4px 10px;border:0;border-radius:999px;background:#ffffff1a;color:inherit;cursor:pointer}.chip:hover{background:#ffffff38}.chip.antonym{color:#ffc4b3}.chip.related{color:#d5e6ff}.front-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.front-stamp{margin-top:0;padding:6px 12px;font-size:13px}.btn.keep{background:#e8eef8;color:#2c4a78;font-weight:700}.btn.keep.on{background:#3d5a80;color:#f6f1e8}.card-actions{flex-wrap:wrap;gap:6px}.card-back .btn{padding:7px 10px;font-size:13px}.empty,.result-card,.quiz,.setting,.mistake-block{background:#fffdf8cc;border-radius:18px;box-shadow:var(--shadow)}.empty,.result-card{padding:40px 24px;text-align:center}.result-card strong{display:block;font-size:42px;margin-bottom:8px}.quiz{padding:28px;max-width:760px}.quiz-prompt{text-align:center;margin-bottom:22px}.quiz-prompt h2{margin:10px 0 0;font-family:var(--jp);font-size:48px}.quiz-choices{display:grid;grid-template-columns:1fr 1fr;gap:10px}.choice{padding:16px;border-radius:14px;background:#fff;text-align:left;box-shadow:var(--shadow)}.choice.right{background:#e7f6ea;outline:2px solid #2f8f4e}.choice.wrong{background:#fde8e2;outline:2px solid var(--seal)}.quiz-explain{margin-top:18px;display:flex;justify-content:space-between;gap:12px;align-items:center}.mistake-block{padding:16px;margin-bottom:16px}.mistake-head{justify-content:space-between;margin-bottom:12px}.mistake-head small{color:var(--ink-soft);font-weight:500}.settings-list{display:grid;gap:12px;max-width:760px}.setting{justify-content:space-between;gap:18px;padding:18px 20px}.setting p{margin:4px 0 0;color:var(--ink-soft);font-size:13px}.setting select,.setting input[type=range]{min-width:120px}@media(max-width:1180px){.app-shell{grid-template-columns:1fr}.sidebar{border-right:0;border-bottom:1px solid var(--line)}.side-nav{flex-direction:row;overflow:auto}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.card-grid{grid-template-columns:1fr}.word-card{height:480px}}