:root{--ink:#20251f;--muted:#777e75;--paper:#f7f7f1;--white:#fff;--green:#d8f36a;--green-dark:#344b22;--line:#e5e7dd;--lav:#ece9fa;--orange:#f7c58e}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:15px}.app-shell{max-width:1180px;margin:auto;padding:0 42px}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font-size:18px;font-weight:800;letter-spacing:-.7px}.brand small{display:block;font-size:8px;letter-spacing:2px;color:var(--muted);margin-top:4px}.brand-mark{width:38px;height:38px;border-radius:12px;background:var(--green);display:grid;place-items:center;font-size:22px}.top-note{font-size:12px;color:var(--muted);display:flex;align-items:center;gap:8px}.dot{width:7px;height:7px;background:#7fba4b;border-radius:50%}.hero{min-height:330px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;position:relative;overflow:hidden;border-bottom:1px solid var(--line)}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:800;color:#777e65;margin:0 0 15px}.hero h1{font-size:clamp(40px,5.1vw,65px);line-height:.99;letter-spacing:-3.7px;margin:0;font-weight:760}.hero h1 em{font-family:Georgia,serif;font-weight:400;color:#7d8e55}.hero-desc{max-width:420px;line-height:1.65;color:var(--muted);font-size:14px;margin-top:22px}.hero-art{height:300px;position:relative;display:grid;place-items:center}.orbit{position:absolute;border:1px solid #e2e6d4;border-radius:50%;width:270px;height:270px}.orbit-two{width:215px;height:215px;border-style:dashed}.floating-card{position:absolute;box-shadow:0 18px 50px #3332;border-radius:14px}.card-back{right:13%;top:48px;background:var(--lav);padding:17px 24px;font:italic 24px Georgia;transform:rotate(9deg);color:#625a91}.card-back span{font:12px sans-serif;color:#8b83b5}.card-front{z-index:1;background:#fff;width:225px;padding:23px 22px;transform:rotate(-5deg);display:flex;flex-direction:column}.mini-label{font-size:8px;letter-spacing:1.5px;color:#8a9180}.card-front strong{font: bold 34px Georgia;margin-top:15px;letter-spacing:-1px}.phonetic{font-size:11px;color:#999;margin-top:4px}.card-rule{height:1px;background:var(--line);margin:16px 0 12px}.meaning{font-size:13px;font-weight:700}.tiny-example{font-size:10px;color:var(--muted);margin-top:8px}.spark{position:absolute;color:#9bb654;font-size:25px}.spark-a{top:55px;left:16%}.spark-b{bottom:40px;right:10%;color:#b8a8e5}.tabs{display:flex;gap:7px;border-bottom:1px solid var(--line);padding-top:24px}.tab{border:0;background:transparent;padding:13px 17px;color:var(--muted);font:inherit;font-size:13px;cursor:pointer;border-radius:9px 9px 0 0}.tab span{margin-right:8px}.tab.active{background:var(--green);color:var(--ink);font-weight:700}.tab b{font-size:10px;background:#fff8;border-radius:10px;padding:3px 6px;margin-left:7px}.view{display:none;padding:38px 0 48px}.view.active{display:block}.section-heading{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:26px}.section-heading h2{font-size:31px;letter-spacing:-1.3px;margin:0}.section-desc{color:var(--muted);margin:10px 0 0;font-size:13px}.step-label{font-size:10px;letter-spacing:1.5px;color:#9ba18e;padding-top:8px}.topic-form{background:#fff;border:1px solid var(--line);padding:23px;border-radius:15px}.topic-form label{font-size:12px;font-weight:700;display:block;margin-bottom:10px}.topic-row{display:grid;grid-template-columns:minmax(150px,1fr) 175px auto;gap:10px}.topic-row input,.topic-row select,.library-toolbar input,textarea{font:inherit;border:1px solid var(--line);border-radius:9px;background:#fbfbf8;padding:13px 14px;min-width:0;color:var(--ink);outline:none}.topic-row input:focus,.topic-row select:focus,textarea:focus,.library-toolbar input:focus{border-color:#9ab653;box-shadow:0 0 0 3px #d8f36a33}.primary-btn{border:0;background:var(--ink);color:white;padding:0 17px;border-radius:9px;font-weight:700;font-size:12px;cursor:pointer;min-height:44px;transition:transform .15s,background .15s}.primary-btn:hover{background:#3c4935;transform:translateY(-1px)}.primary-btn span{color:var(--green);font-size:17px;margin-left:10px}.primary-btn:disabled{opacity:.55;cursor:wait;transform:none}.suggestions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:15px;font-size:11px;color:var(--muted)}.chip{border:1px solid var(--line);border-radius:20px;background:#fff;padding:6px 11px;font-size:11px;cursor:pointer;color:#555d50}.chip:hover{border-color:#9ab653}.status{font-size:12px;color:var(--muted);padding-top:13px}.status.error{color:#b34343}.cards-area{margin-top:12px}.empty-state{min-height:220px;border:1px dashed #d8dccd;border-radius:15px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:30px}.empty-icon{width:49px;height:49px;border-radius:15px;background:var(--green);display:grid;place-items:center;font:italic bold 21px Georgia;margin-bottom:12px}.empty-state h3{margin:0;font-size:16px}.empty-state p{font-size:12px;color:var(--muted);max-width:300px;line-height:1.6}.flashcard-wrap{display:grid;grid-template-columns:1fr 1fr;gap:14px}.flashcard{min-height:245px;background:#fff;border:1px solid var(--line);border-radius:15px;padding:24px;cursor:pointer;position:relative;display:flex;flex-direction:column;justify-content:space-between;transition:transform .2s,border-color .2s}.flashcard:hover{transform:translateY(-2px);border-color:#c7d79b}.flashcard .card-top{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.2px;color:#929989}.flashcard .word{font: bold clamp(27px,3vw,38px) Georgia;margin-top:22px;overflow-wrap:anywhere}.flashcard .hint{font-size:11px;color:#969b90;margin-top:8px}.flashcard .translation{font-size:23px;font-weight:700;margin-top:24px}.flashcard .example{font-size:12px;color:#697064;line-height:1.55;margin-top:11px}.flashcard .flip-tip{font-size:10px;color:#a0a597;margin-top:20px}.flashcard.revealed{background:#f2f6e6}.card-controls{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:20px;font-size:12px;color:var(--muted)}.round-btn{width:36px;height:36px;border:1px solid var(--line);background:#fff;border-radius:50%;font-size:17px;cursor:pointer}.text-btn{background:none;border:0;color:#65784a;font-size:12px;cursor:pointer;margin-left:12px}.hidden{display:none!important}.practice-panel{background:#fff;border:1px solid var(--line);border-radius:15px;padding:25px}.panel-label{font-size:10px;letter-spacing:1.5px;font-weight:800;color:#8b927d;margin-bottom:15px}.word-picker{display:flex;flex-wrap:wrap;gap:9px;min-height:42px}.word-option{border:1px solid var(--line);background:#fafbf7;border-radius:8px;padding:9px 12px;font-size:12px;cursor:pointer}.word-option.selected{background:var(--green);border-color:#c1df5d}.muted{font-size:12px;color:var(--muted)}.answer-label{margin-top:28px}textarea{width:100%;resize:vertical;line-height:1.5}.practice-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:13px}.sentence-result{margin-top:22px;border-radius:11px;background:#f4f6ec;padding:18px;line-height:1.65;font-size:13px}.sentence-result h3{margin:0 0 10px;font-size:16px}.sentence-result p{margin:7px 0}.library-toolbar{display:flex;gap:10px;margin-bottom:18px}.library-toolbar input{flex:1}.secondary-btn{border:1px solid var(--line);border-radius:9px;padding:0 14px;background:#fff;color:var(--ink);font-size:12px;display:flex;align-items:center;cursor:pointer;min-height:43px}.secondary-btn:hover{border-color:#a8bc72}.library-list{display:grid;gap:9px}.library-item{display:grid;grid-template-columns:1fr 1fr auto;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:10px;padding:15px 17px}.library-word{font-weight:750}.library-translation{font-size:13px;color:var(--muted)}.library-meta{font-size:10px;color:#929989;margin-top:5px}.delete-word{border:0;background:transparent;color:#a3a69d;font-size:20px;cursor:pointer}.delete-word:hover{color:#ba4c4c}footer{border-top:1px solid var(--line);padding:22px 0;display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;color:#9ba18e}footer span:last-child{letter-spacing:0}@media(max-width:760px){.app-shell{padding:0 18px}.hero{grid-template-columns:1fr;min-height:0;padding:38px 0 0}.hero h1{font-size:48px}.hero-art{height:260px}.topbar{height:68px}.top-note{font-size:0}.top-note .dot{font-size:initial}.tabs{gap:2px;overflow-x:auto}.tab{white-space:nowrap;padding:12px 10px;font-size:11px}.view{padding-top:28px}.section-heading h2{font-size:26px}.topic-row{grid-template-columns:1fr 1fr}.topic-row input{grid-column:1/-1}.topic-row .primary-btn{grid-column:1/-1}.flashcard-wrap{grid-template-columns:1fr}.flashcard{min-height:210px}.practice-panel{padding:18px}.practice-footer{align-items:stretch;flex-direction:column}.practice-footer .primary-btn{padding:12px}.library-toolbar{flex-wrap:wrap}.library-toolbar input{flex-basis:100%}.library-item{grid-template-columns:1fr auto}.library-translation{grid-column:1}.delete-word{grid-column:2;grid-row:1/3}.step-label{font-size:8px}.suggestions{gap:6px}}
/* Active recall review mode */
.review-setup{margin-bottom:18px}
.review-settings{display:grid;grid-template-columns:2fr 2fr 1fr;gap:12px;margin-bottom:18px}
.review-settings label{display:grid;gap:8px;font-size:12px;font-weight:700}
.review-settings select,.review-question input{font:inherit;border:1px solid var(--line);border-radius:9px;background:#fbfbf8;padding:13px 14px;min-width:0;color:var(--ink);width:100%}
.review-session{max-width:760px;margin:20px auto 0}
.review-progress{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:9px}
.review-progress-track{height:5px;border-radius:9px;background:#e9ecdf;overflow:hidden;margin-bottom:16px}
#review-progress-bar{height:100%;width:0;background:#a9c94e;transition:width .2s}
.review-question{background:#fff;border:1px solid var(--line);border-radius:15px;padding:clamp(20px,4vw,34px)}
.review-prompt{font:700 clamp(30px,5vw,46px) Georgia,serif;overflow-wrap:anywhere;margin:12px 0}
.review-example{font-size:12px;color:var(--muted);margin-bottom:20px;line-height:1.5}
.review-question .answer-label{display:block;font-size:12px;font-weight:700;margin:18px 0 9px}
.review-actions{display:flex;gap:10px;margin-top:12px}
.review-actions button{min-height:44px}
.review-feedback{margin-top:18px;padding:16px;border-radius:10px;font-size:13px;line-height:1.65}
.review-feedback.correct{background:#eef6df;border:1px solid #d7e8b6}
.review-feedback.incorrect{background:#fff0eb;border:1px solid #f0d0c6}
.review-feedback p{margin:5px 0}
#next-review{margin-top:14px}
.review-summary{margin-top:18px;background:#fff;border:1px solid var(--line);border-radius:15px;padding:25px}
.review-summary h3{margin-top:0}
.review-summary strong{font-size:28px}
@media(max-width:650px){.review-settings{grid-template-columns:1fr}.review-actions{flex-direction:column}.review-actions button{width:100%}}