:root{--bg:#fbf8f8;--surface:#ffffff;--surface-2:#f7f1f3;--ink:#2d2630;--muted:#766d78;--line:#eee3e8;--accent:#e58eaf;--accent-dark:#b94e79;--accent-soft:#fbe8ef;--pink:#f8dfe9;--peach:#faecd9;--mint:#dceee9;--blue:#e5eafa;--gold:#f8edc8;--danger:#a83e68;--shadow:0 10px 28px rgba(87,54,69,.055);--radius:22px;--font:'Times New Roman',Times,serif;--display:'Times New Roman',Times,serif}
:root.dark{--bg:#1d1920;--surface:#29232b;--surface-2:#342b35;--ink:#f8eff3;--muted:#c0aeb8;--line:#493844;--accent:#d982a5;--accent-dark:#f0a9c3;--accent-soft:#49313e;--pink:#4b303d;--peach:#4a3a2e;--mint:#29413b;--blue:#30394d;--gold:#4a4028;--danger:#f19ab8;--shadow:0 12px 34px rgba(0,0,0,.22)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--ink);font:14px var(--font)}body{min-height:100vh}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed;transform:none!important}a{color:inherit;text-decoration:none}.muted{color:var(--muted)}.small{font-size:12px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted)}.display{font-family:var(--display);letter-spacing:-.5px}.boot{min-height:100vh;display:grid;place-content:center;text-align:center;gap:12px}.brand-mark{width:48px;height:48px;border-radius:16px;background:var(--accent-soft);color:var(--accent-dark);display:grid;place-items:center;font-size:25px;font-weight:800;margin:auto}.boot-title{font:600 27px var(--display)}
/* Auth */
.auth-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(420px,.98fr);background:var(--surface)}.auth-story{padding:clamp(34px,7vw,92px);display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(145deg,#eee8f6 0%,#f9eee9 55%,#f3e7e9 100%);color:#302b38;position:relative;overflow:hidden}.auth-story:after{content:"";position:absolute;width:420px;height:420px;border:1px solid #ffffffa8;border-radius:50%;right:-120px;bottom:-160px;box-shadow:0 0 0 45px #ffffff2a,0 0 0 90px #ffffff18}.story-brand{display:flex;align-items:center;gap:12px;font-weight:800;font-size:17px;position:relative;z-index:1}.story-brand .brand-mark{margin:0;background:#ffffffb5}.story-copy{max-width:560px;position:relative;z-index:1}.story-copy h1{font:600 clamp(38px,5.1vw,64px)/1.04 var(--display);margin:16px 0}.story-copy p{font-size:15px;line-height:1.8;color:#655f68;max-width:490px}.story-points{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:600px;position:relative;z-index:1}.story-point{padding:14px;background:#ffffff8a;border:1px solid #ffffffa8;border-radius:15px}.story-point strong{display:block;font-size:13px;margin-bottom:5px}.story-point span{font-size:11px;color:#746c76;line-height:1.5}.auth-panel{display:grid;place-items:center;padding:34px 26px}.auth-card{width:min(440px,100%)}.auth-card h2{font:600 34px var(--display);margin:10px 0 7px}.auth-card p{line-height:1.7}.auth-tabs{display:flex;padding:4px;background:var(--surface-2);border-radius:12px;margin:22px 0 18px}.auth-tabs button{flex:1;border:0;background:transparent;color:var(--muted);padding:10px;border-radius:9px;font-weight:700}.auth-tabs button.active{background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}
/* Fields / buttons */
.field{display:grid;gap:7px;margin:12px 0}.field label{font-size:12px;font-weight:700;color:var(--muted)}input,textarea,select{width:100%;min-width:0;padding:11px 13px;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--ink);outline:none}textarea{resize:vertical;min-height:88px}input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 15%,transparent)}.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--ink);font-weight:700;transition:.16s}.btn:hover{border-color:var(--accent);transform:translateY(-1px)}.btn.primary{background:var(--accent);border-color:var(--accent);color:white}.btn.primary:hover{background:var(--accent-dark)}.btn.soft{background:var(--accent-soft);color:var(--accent-dark);border-color:transparent}.btn.danger{background:color-mix(in srgb,var(--danger) 12%,var(--surface));color:var(--danger);border-color:transparent}.btn.block{width:100%}.btn.small-btn{padding:7px 10px;font-size:12px}.btn.icon-btn{width:38px;height:38px;padding:0}.btn.ghost{background:transparent}.divider-label{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px;margin:17px 0}.divider-label:before,.divider-label:after{content:"";height:1px;background:var(--line);flex:1}.auth-note{font-size:11px;color:var(--muted);line-height:1.6;margin-top:16px}
/* App shell */
.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:248px;background:var(--surface);border-right:1px solid var(--line);padding:20px 14px;display:flex;flex-direction:column;z-index:30;overflow:auto}.brand{display:flex;align-items:center;gap:10px;padding:2px 10px 22px;font-size:18px;font-weight:800;letter-spacing:-.5px}.brand .brand-mark{width:36px;height:36px;border-radius:12px;margin:0;font-size:19px}.nav-group{margin:13px 0 5px;padding:0 12px;font-size:10px;font-weight:800;letter-spacing:1.25px;color:var(--muted)}.nav{display:grid;gap:3px}.nav button{width:100%;display:flex;align-items:center;gap:12px;border:0;background:transparent;color:var(--muted);padding:10px 12px;border-radius:11px;text-align:left;font-weight:600}.nav button:hover{background:var(--surface-2);color:var(--ink)}.nav button.active{background:var(--accent-soft);color:var(--accent-dark);font-weight:800}.nav .nav-symbol{width:20px;text-align:center;font-size:16px}.nav .nav-count{margin-left:auto;font-size:10px;padding:3px 7px;border-radius:20px;background:var(--pink);color:var(--ink)}.side-bottom{margin-top:auto;padding:12px 8px 0}.connection-card{background:var(--surface-2);padding:12px;border-radius:13px;font-size:11px;line-height:1.5;color:var(--muted)}.connection-status{display:flex;align-items:center;gap:7px;color:var(--ink);font-weight:700;margin-bottom:5px}.dot{width:7px;height:7px;border-radius:50%;background:#65a77b}.dot.off{background:#c69b54}.app-main{margin-left:248px;min-height:100vh}.topbar{height:76px;position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,3vw,42px);gap:16px}.topbar-left{min-width:0}.topbar h1{font:600 22px var(--display);margin:2px 0}.top-actions{display:flex;align-items:center;gap:9px}.pill{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);border-radius:30px;padding:8px 11px;font-size:11px;font-weight:800}.avatar{height:36px;width:36px;border-radius:50%;border:1px solid var(--line);background:var(--pink);color:var(--ink);display:grid;place-items:center;font-weight:800}.main-content{max-width:1480px;margin:0 auto;padding:26px clamp(18px,3vw,42px) 60px}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px}.page-head h2{font:600 28px var(--display);margin:4px 0}.page-head p{color:var(--muted);margin:0;line-height:1.6}.grid{display:grid;gap:15px}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.stat-card,.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);min-width:0}.stat-card{position:relative;overflow:hidden}.stat-card .stat-label{font-size:11px;color:var(--muted);font-weight:700}.stat-card .stat-number{font:600 30px var(--display);margin:8px 0 3px}.stat-card .stat-foot{font-size:11px;color:var(--muted)}.stat-accent{position:absolute;right:16px;top:15px;width:34px;height:34px;border-radius:11px;background:var(--accent-soft);display:grid;place-items:center;color:var(--accent-dark);font-size:16px}.two-col{grid-template-columns:1.25fr 1fr;margin-top:15px}.three-col{grid-template-columns:repeat(3,1fr)}.card h3{font:600 18px var(--display);margin:0 0 13px}.card h4{font-size:13px;margin:0 0 7px}.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.card-head h3{margin:0}.muted-line{color:var(--muted);font-size:11px;line-height:1.6}.progress{height:8px;background:var(--surface-2);border-radius:20px;overflow:hidden}.progress span{height:100%;display:block;background:var(--accent);border-radius:20px}.progress-row{display:flex;justify-content:space-between;gap:12px;font-size:11px;color:var(--muted);margin:8px 0}.heatmap{display:grid;grid-template-columns:repeat(14,1fr);gap:5px;margin-top:17px}.heat-cell{aspect-ratio:1;border-radius:4px;background:var(--surface-2)}.heat-cell[data-v="1"]{background:#d9cde9}.heat-cell[data-v="2"]{background:#b9a6d4}.heat-cell[data-v="3"]{background:#927bb7}.heat-cell[data-v="4"]{background:#6e588f}.dark .heat-cell[data-v="1"]{background:#504363}.dark .heat-cell[data-v="2"]{background:#6e5a8e}.dark .heat-cell[data-v="3"]{background:#9a83bf}.dark .heat-cell[data-v="4"]{background:#c5a9ed}.bar-row{display:grid;grid-template-columns:88px 1fr 32px;align-items:center;gap:9px;margin:11px 0;font-size:11px}.bar-row .progress{height:9px}.empty{padding:34px 18px;text-align:center;color:var(--muted);line-height:1.7}.empty strong{display:block;color:var(--ink);font:600 20px var(--display);margin-bottom:5px}.toolbar{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0}.toolbar input{flex:1;min-width:190px}.toolbar select{width:auto;min-width:140px}.tabs{display:flex;gap:6px;flex-wrap:wrap;padding:5px;background:var(--surface-2);border-radius:12px;width:max-content;max-width:100%}.tabs button{border:0;background:transparent;padding:8px 11px;border-radius:9px;color:var(--muted);font-size:12px;font-weight:700}.tabs button.active{background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse;min-width:760px}.table th,.table td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:middle}.table th{font-size:10px;color:var(--muted);letter-spacing:1px;text-transform:uppercase}.table tbody tr:hover{background:color-mix(in srgb,var(--surface-2) 55%,transparent)}.word-title{font-weight:800}.word-ipa{font-size:11px;color:var(--muted);margin-top:3px}.chip{display:inline-flex;align-items:center;padding:4px 8px;border-radius:30px;background:var(--surface-2);font-size:10px;font-weight:700;color:var(--muted);margin:2px}.chip.accent{background:var(--accent-soft);color:var(--accent-dark)}.chip.good{background:var(--mint);color:#4c7658}.chip.warn{background:var(--gold);color:#896c36}.chip.bad{background:var(--pink);color:var(--danger)}.deck-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.deck-card{min-height:168px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.deck-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.deck-color{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent-dark)}.deck-card h3{font:600 19px var(--display);margin:13px 0 5px}.deck-card p{color:var(--muted);font-size:11px;line-height:1.6;margin:0}.deck-foot{display:flex;justify-content:space-between;align-items:center;margin-top:16px;font-size:11px;color:var(--muted)}.subdeck{margin:8px 0 0 16px;padding-left:13px;border-left:1px solid var(--line)}.session-grid{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:14px}.mode-card{padding:16px;border:1px solid var(--line);border-radius:15px;background:var(--surface);text-align:left;min-height:115px}.mode-card:hover{border-color:var(--accent);background:var(--accent-soft)}.mode-card strong{display:block;margin:9px 0 4px}.mode-card span{font-size:11px;color:var(--muted);line-height:1.5}.study-card{max-width:760px;margin:20px auto;padding:clamp(20px,4vw,34px);text-align:center}.study-word{font:600 clamp(34px,6vw,48px) var(--display);margin:30px 0 6px}.study-meaning{font-size:18px;line-height:1.6}.answer-list{display:grid;gap:9px;max-width:540px;margin:20px auto}.answer-option{padding:13px 15px;border:1px solid var(--line);border-radius:12px;background:var(--surface);text-align:left;color:var(--ink)}.answer-option:hover{border-color:var(--accent);background:var(--accent-soft)}.answer-option.correct{border-color:#6eaa80;background:var(--mint)}.answer-option.incorrect{border-color:var(--danger);background:var(--pink)}.rating-row{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:20px}.rating-row .btn{min-width:82px}.feedback{max-width:560px;margin:16px auto;padding:12px 14px;border-radius:12px;text-align:left;background:var(--surface-2);line-height:1.65}.feedback.ok{background:var(--mint)}.feedback.no{background:var(--pink)}.match-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0}.match-option{padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--surface);text-align:left;min-height:56px}.match-option.selected{border-color:var(--accent);background:var(--accent-soft)}.match-option.matched{opacity:.4;text-decoration:line-through}.session-progress{display:flex;justify-content:space-between;color:var(--muted);font-size:11px}.session-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:15px}.path-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.path-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:17px}.path-card h3{font:600 19px var(--display);margin:7px 0}.activity-bars{display:flex;align-items:flex-end;gap:8px;height:150px;padding:12px 2px 0;border-bottom:1px solid var(--line)}.activity-bar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:6px}.activity-bar i{display:block;width:100%;max-width:24px;min-height:2px;border-radius:5px 5px 0 0;background:var(--accent)}.activity-bar span{font-size:9px;color:var(--muted)}.modal-backdrop{position:fixed;inset:0;background:#211d2c83;z-index:60;display:grid;place-items:center;padding:16px}.modal{background:var(--surface);border:1px solid var(--line);border-radius:18px;width:min(760px,100%);max-height:90vh;overflow:auto;padding:20px;box-shadow:0 24px 80px #0003}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}.modal-head h3{font:600 23px var(--display);margin:0}.modal-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:16px}.notice{padding:12px 14px;border-radius:12px;background:var(--accent-soft);color:var(--accent-dark);font-size:12px;line-height:1.6;margin:10px 0}.notice.warn{background:var(--gold);color:#85662f}.notice.success{background:var(--mint);color:#4b7556}.toast{position:fixed;right:18px;bottom:18px;z-index:100;background:var(--ink);color:var(--surface);padding:12px 16px;border-radius:12px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transform:translateY(10px);transition:.2s;max-width:min(420px,calc(100vw - 36px));font-size:12px}.toast.show{opacity:1;transform:translateY(0)}.mobile-menu{display:none}.mobile-nav{display:none}.hidden{display:none!important}.skeleton{height:10px;border-radius:10px;background:var(--surface-2)}.settings-grid{grid-template-columns:1fr 1fr}.profile-avatar{width:66px;height:66px;border-radius:20px;background:var(--pink);display:grid;place-items:center;font:600 30px var(--display)}.admin-tag{font-size:9px;border-radius:5px;background:var(--gold);padding:3px 6px;color:#8c6f36;font-weight:800}
@media(max-width:1100px){.sidebar{width:220px}.app-main{margin-left:220px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.deck-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.two-col{grid-template-columns:1fr}}
@media(max-width:760px){.auth-shell{grid-template-columns:1fr}.auth-story{display:none}.auth-panel{min-height:100vh}.sidebar{display:none}.app-main{margin-left:0;padding-bottom:70px}.topbar{height:64px;padding:0 16px}.topbar h1{font-size:19px}.topbar .eyebrow{display:none}.main-content{padding:20px 14px 32px}.mobile-menu{display:inline-flex}.mobile-nav{display:flex;position:fixed;z-index:40;inset:auto 0 0;background:var(--surface);border-top:1px solid var(--line);padding:7px 5px max(7px,env(safe-area-inset-bottom));justify-content:space-around;gap:2px}.mobile-nav button{display:grid;justify-items:center;gap:3px;flex:1;border:0;background:transparent;color:var(--muted);font-size:9px;padding:5px 2px}.mobile-nav button.active{color:var(--accent-dark);font-weight:800}.mobile-nav b{font-size:17px;font-weight:500}.mobile-nav span{white-space:nowrap}.session-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.path-grid{grid-template-columns:1fr}.settings-grid{grid-template-columns:1fr}.story-points{grid-template-columns:1fr}.page-head{align-items:flex-start;flex-direction:column}.page-head .btn{width:100%}}
@media(max-width:430px){.stats-grid{gap:9px}.stat-card{padding:13px}.stat-card .stat-number{font-size:25px}.stat-accent{right:10px;top:10px;width:28px;height:28px}.deck-grid{grid-template-columns:1fr}.session-grid{grid-template-columns:1fr 1fr}.top-actions .pill:nth-child(2){display:none}.toolbar>*{min-width:0}.match-grid{gap:7px}.match-option{font-size:11px;padding:10px}}
.row-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.row-item:last-child{border-bottom:0}


/* Vocab Studio · Soft Bento / Times New Roman design refresh */
:root{font-family:'Times New Roman',Times,serif}
html,body,button,input,textarea,select{font-family:'Times New Roman',Times,serif!important}
.display,.boot-title,.story-copy h1,.auth-card h2,.topbar h1,.page-head h2,.stat-card .stat-number,.card h3,.deck-card h3,.study-word,.empty strong,.modal-head h3,.path-card h3{font-family:'Times New Roman',Times,serif!important}
body{background:var(--bg)}
.sidebar{background:linear-gradient(180deg,#fff 0%,#fffafb 100%);border-right-color:#f0e4e9}
:root.dark .sidebar{background:var(--surface);border-right-color:var(--line)}
.brand-mark{background:#f9e4ed;color:#b94e79}
.nav button.active{background:#f5dce7;color:#9f3f68}
.btn.primary{background:#dc7fa3;border-color:#dc7fa3;color:#fff}
.btn.primary:hover{background:#c86690}
.btn.soft{background:#f9e6ee;color:#9f3f68}
.stat-card,.card,.deck-card,.path-card,.mode-card{border:1px solid rgba(225,204,214,.48);border-radius:22px;box-shadow:0 8px 24px rgba(74,47,62,.045)}
.stats-grid .stat-card:nth-child(4n+1){background:#e2efec}
.stats-grid .stat-card:nth-child(4n+2){background:#f9e3ec}
.stats-grid .stat-card:nth-child(4n+3){background:#fbefc9}
.stats-grid .stat-card:nth-child(4n+4){background:#eae4f4}
:root.dark .stats-grid .stat-card{background:var(--surface)}
.stats-grid .stat-card .stat-number{font-size:34px}
.deck-card:nth-child(4n+1){background:#e4efec}
.deck-card:nth-child(4n+2){background:#fae5ed}
.deck-card:nth-child(4n+3){background:#fbefce}
.deck-card:nth-child(4n+4){background:#ece6f5}
:root.dark .deck-card{background:var(--surface)}
.mode-card{background:var(--surface);transition:transform .18s,box-shadow .18s}
.mode-card:nth-child(4n+1){background:#e5f0ed}.mode-card:nth-child(4n+2){background:#fae5ed}.mode-card:nth-child(4n+3){background:#fbf0d0}.mode-card:nth-child(4n){background:#ece6f5}
:root.dark .mode-card{background:var(--surface)}
.mode-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.study-card{max-width:900px;padding:clamp(18px,3vw,30px);text-align:left;background:transparent;border:0;box-shadow:none}
.study-card>.session-progress,.study-card>.progress{max-width:820px;margin-left:auto!important;margin-right:auto!important}
.study-card>.session-progress{font-size:13px;font-weight:700;color:var(--muted)}
.flashcard-panel{position:relative;max-width:820px;margin:20px auto 0;padding:clamp(24px,4vw,42px);border:2px solid #efd4df;border-radius:30px;background:linear-gradient(145deg,#fff 0%,#fff9fb 100%);box-shadow:0 14px 35px rgba(100,65,82,.07);min-height:360px}
.flashcard-topline{display:flex;justify-content:space-between;align-items:center}
.flashcard-bookmark{border-radius:50%;color:#b94e79}
.flashcard-word{font-size:clamp(42px,6vw,58px);font-weight:700;line-height:1.05;letter-spacing:-1px;margin:12px 0 5px;color:#2d1f2b}
.flashcard-ipa{font-size:19px;font-style:italic;color:#827481}
.flashcard-audio{display:flex;gap:9px;position:absolute;right:clamp(24px,4vw,42px);top:76px}
.flashcard-audio .btn{border-radius:30px;background:#fff;border-color:#f0dce5;color:#8d4566;padding:9px 17px}
.flashcard-reveal{margin-top:22px}
.flashcard-answer{margin-top:24px}
.flashcard-meaning{font-size:clamp(22px,3vw,29px);font-weight:700;line-height:1.35;color:#c84e80;margin:8px 0}
.flashcard-definition{font-size:18px;line-height:1.55;color:#5f5662;margin:5px 0 18px}
.flashcard-example{background:#fff;border:1px solid #f1e7ec;border-radius:20px;padding:18px 20px;margin:18px 0 14px;box-shadow:0 5px 18px rgba(70,50,60,.035)}
.flashcard-example strong{display:block;font-size:17px;line-height:1.5;color:#302632}
.flashcard-example p{margin:7px 0 0;color:#746a77;font-size:16px;line-height:1.5}
.flashcard-tags{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0}
.flashcard-tags .chip{background:#f0eafa;color:#51457d;font-size:13px;padding:7px 12px}
.flashcard-related{font-size:14px;color:var(--muted)}
.flashcard-rate-label{text-align:center;font-size:16px;font-weight:700;margin:24px 0 12px;color:var(--ink)}
.flashcard-answer .rating-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:10px}
.flashcard-answer .rating-row .btn{min-width:0;min-height:78px;display:flex;flex-direction:column;gap:5px;border:0;border-radius:17px;padding:12px 8px;background:#f9e3ec;color:#a23d68}
.flashcard-answer .rating-row .btn:nth-child(2){background:#faecd9;color:#87501f}
.flashcard-answer .rating-row .btn:nth-child(3){background:#dff0ec;color:#286f66}
.flashcard-answer .rating-row .btn:nth-child(4){background:#e8efdf;color:#4e793e}
.flashcard-answer .rating-row .btn b{font-size:16px}
.flashcard-answer .rating-row .btn small{font-size:12px!important}
.flashcard-answer .rating-row .btn:hover{transform:translateY(-2px);filter:saturate(1.08)}
:root.dark .flashcard-panel{background:linear-gradient(145deg,#302832,#29232b);border-color:#614153}
:root.dark .flashcard-word,:root.dark .flashcard-example strong{color:var(--ink)}
:root.dark .flashcard-example{background:#352d36;border-color:#594451}
:root.dark .flashcard-audio .btn{background:#392e38;color:#f2b6cd;border-color:#64475a}
:root.dark .flashcard-definition,:root.dark .flashcard-example p{color:#d0c1ca}
.rating-row:not(.flashcard-answer .rating-row) .btn{border-radius:13px}
@media(max-width:650px){.flashcard-panel{padding:22px 17px;border-radius:23px}.flashcard-audio{position:static;margin-top:15px}.flashcard-word{font-size:42px}.flashcard-answer .rating-row{grid-template-columns:repeat(2,minmax(0,1fr))}.flashcard-answer .rating-row .btn{min-height:70px}.study-card{padding:8px 0}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Vocab Studio 2.0 — coherent pastel bento design and recreated legacy flashcard layout */
:root{--bg:#fbf8f8;--surface:#fff;--surface-2:#f7f1f3;--ink:#2d2630;--muted:#766d78;--line:#eee3e8;--accent:#e58eaf;--accent-dark:#b94e79;--accent-soft:#fbe8ef;--pink:#f8dfe9;--peach:#faecd9;--mint:#dceee9;--blue:#e5eafa;--gold:#f8edc8;--font:'Times New Roman',Times,serif;--display:'Times New Roman',Times,serif}
:root.dark{--bg:#1d1920;--surface:#29232b;--surface-2:#342b35;--ink:#f8eff3;--muted:#c0aeb8;--line:#493844;--accent:#d982a5;--accent-dark:#f0a9c3;--accent-soft:#49313e;--pink:#4b303d;--peach:#4a3a2e;--mint:#29413b;--blue:#30394d;--gold:#4a4028}
html,body,button,input,textarea,select{font-family:'Times New Roman',Times,serif!important}
.sidebar{background:linear-gradient(180deg,#fff 0%,#fff9fb 100%)}
:root.dark .sidebar{background:var(--surface)}
.card,.stat-card,.deck-card,.mode-card,.path-card{border-radius:22px}
.stats-grid .stat-card{border:0;box-shadow:0 8px 24px rgba(77,62,71,.045)}
.stats-grid .stat-card:nth-child(4n+1){background:#e3efec}.stats-grid .stat-card:nth-child(4n+2){background:#f9e3ec}.stats-grid .stat-card:nth-child(4n+3){background:#fbefc9}.stats-grid .stat-card:nth-child(4n+4){background:#eae4f4}
:root.dark .stats-grid .stat-card{background:var(--surface)}
.deck-card:nth-child(4n+1){background:#e4efec}.deck-card:nth-child(4n+2){background:#fae5ed}.deck-card:nth-child(4n+3){background:#fbefce}.deck-card:nth-child(4n+4){background:#ece6f5}
:root.dark .deck-card{background:var(--surface)}
.mode-card{background:var(--surface);transition:transform .18s,box-shadow .18s;border:1px solid transparent;box-shadow:0 5px 18px rgba(77,62,71,.035)}
.mode-card:nth-child(4n+1){background:#e5f0ed}.mode-card:nth-child(4n+2){background:#fae5ed}.mode-card:nth-child(4n+3){background:#fbf0d0}.mode-card:nth-child(4n){background:#ece6f5}
:root.dark .mode-card{background:var(--surface)}.mode-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.flashcard-study{max-width:1000px!important;padding:0!important;margin:14px auto 30px!important;text-align:left!important}
.flashcard-study>.session-progress{max-width:820px;margin:0 auto!important;padding:0 2px 4px}
.flashcard-study>.progress{height:9px;border-radius:20px;background:#f1e7eb;margin-bottom:18px!important}.flashcard-study>.progress span{background:linear-gradient(90deg,#eab4c9,#d86f9a)}
.flashcard-toolbar{max-width:820px;margin:0 auto 8px;display:flex;align-items:center;justify-content:space-between}.flashcard-kicker{font-size:10px;letter-spacing:1.6px;font-weight:700;color:#9b8290}
.flashcard-bookmark{border:1px solid #f0dce5;background:#fff;color:#b94e79;width:38px;height:38px;border-radius:50%;font-size:20px;cursor:pointer}.flashcard-bookmark.active{background:#f9e3ec;color:#a52c62}
.flashcard-panel{position:relative;max-width:820px;margin:0 auto;padding:clamp(24px,4vw,42px);border:2px solid #efd4df;border-radius:30px;background:linear-gradient(145deg,#fff 0%,#fff9fb 100%);box-shadow:0 14px 35px rgba(100,65,82,.07);min-height:340px}
.flashcard-topline{display:flex;justify-content:space-between;align-items:flex-start;gap:18px}.flashcard-heading{min-width:0}
.flashcard-word{font-family:'Times New Roman',Times,serif!important;font-size:clamp(42px,6vw,58px);font-weight:700;line-height:1.05;letter-spacing:-1px;margin:6px 0;color:#2d1f2b;overflow-wrap:anywhere}
.flashcard-ipa{font-size:19px;font-style:italic;color:#827481}.flashcard-audio{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end}
.flashcard-audio .btn{width:auto;min-width:82px;min-height:0;border-radius:30px;background:#fff;border-color:#f0dce5;color:#8d4566;padding:9px 17px;display:inline-flex;flex-direction:row}
.flashcard-reveal-control{display:flex;align-items:center;gap:12px;margin:26px 0 0;color:#9a8993;font-size:12px}.flashcard-reveal-control .btn{width:auto;min-height:0;padding:10px 22px}.flashcard-back{margin-top:23px}
.flashcard-meaning{font-size:clamp(22px,3vw,29px);font-weight:700;line-height:1.35;color:#c84e80;margin:8px 0}.flashcard-definition{font-size:18px;line-height:1.55;color:#5f5662;margin:5px 0 18px}
.flashcard-example{position:relative;background:#fff;border:1px solid #f1e7ec;border-radius:20px;padding:18px 54px 18px 20px;margin:18px 0 14px;box-shadow:0 5px 18px rgba(70,50,60,.035)}
.flashcard-example-text{font-size:17px;font-weight:700;line-height:1.5;color:#302632}.flashcard-example p{margin:7px 0 0;color:#746a77;font-size:16px;line-height:1.5}
.flashcard-example-audio{position:absolute;right:14px;top:15px;width:36px;height:36px;border-radius:50%;border:1px solid #f0dce5;background:#fff;color:#a24d71;cursor:pointer}
.flashcard-tags{display:flex;flex-wrap:wrap;gap:8px;margin:15px 0 0}.flashcard-chip{display:inline-flex;align-items:center;max-width:100%;padding:8px 13px;border-radius:30px;font-size:13px;line-height:1.25;overflow-wrap:anywhere}
.flashcard-chip.blue{background:#e9e9fb;color:#4a4a88}.flashcard-chip.mint{background:#e5f1df;color:#487247}.flashcard-chip.butter{background:#fbefc9;color:#7a5e2d}.flashcard-chip.lavender{background:#eee8f7;color:#625382}
.flashcard-rate-label{text-align:center;font-size:16px;font-weight:700;margin:24px 0 12px;color:var(--ink)}.flashcard-rating-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;max-width:820px;margin:0 auto}
.flashcard-rating-row .btn{width:auto;min-width:0;min-height:78px;display:flex;flex-direction:column;gap:5px;border:0;border-radius:17px;padding:12px 8px}
.flashcard-rating-row .btn:nth-child(1){background:#f9e3ec;color:#a23d68}.flashcard-rating-row .btn:nth-child(2){background:#faecd9;color:#87501f}.flashcard-rating-row .btn:nth-child(3){background:#dff0ec;color:#286f66}.flashcard-rating-row .btn:nth-child(4){background:#e8efdf;color:#4e793e}
.flashcard-rating-row .btn b{font-size:16px}.flashcard-rating-row .btn small{font-size:12px!important}
.flashcard-navigation{display:flex;align-items:center;justify-content:center;gap:22px;margin:20px auto 0}.flashcard-text-button{border:0;background:transparent;color:var(--ink);font-size:15px;font-weight:700;padding:7px 10px;cursor:pointer}.flashcard-text-button:disabled{opacity:.3;cursor:not-allowed}.flashcard-nav-divider{width:50px;height:1px;background:#ead9e1}.flashcard-shortcuts{text-align:center;font-size:11px;color:var(--muted);margin:9px 0 0}
:root.dark .flashcard-panel{background:linear-gradient(145deg,#302832,#29232b);border-color:#614153}:root.dark .flashcard-word,:root.dark .flashcard-example-text{color:var(--ink)}:root.dark .flashcard-example{background:#352d36;border-color:#594451}:root.dark .flashcard-example p,:root.dark .flashcard-definition{color:#d0c1ca}:root.dark .flashcard-audio .btn,:root.dark .flashcard-example-audio,:root.dark .flashcard-bookmark{background:#392e38;color:#f2b6cd;border-color:#64475a}:root.dark .flashcard-chip{filter:brightness(.78)}
@media(max-width:650px){.flashcard-panel{padding:22px 17px;border-radius:23px}.flashcard-topline{display:block}.flashcard-audio{justify-content:flex-start;margin-top:14px}.flashcard-word{font-size:42px}.flashcard-rating-row{grid-template-columns:repeat(2,minmax(0,1fr))}.flashcard-rating-row .btn{min-height:70px}.flashcard-study{padding:8px 0!important}.flashcard-reveal-control{align-items:flex-start;flex-direction:column}.flashcard-navigation{gap:8px}.flashcard-shortcuts{padding:0 8px;line-height:1.5}}

/* Dashboard bento surfaces */
.dashboard-page .two-col:first-of-type>.card:nth-child(1){background:#e8f1ee;border-color:transparent}
.dashboard-page .two-col:first-of-type>.card:nth-child(2){background:#f9e7ee;border-color:transparent}
.dashboard-page .two-col:last-of-type>.card:nth-child(1){background:#fbf0ce;border-color:transparent}
.dashboard-page .two-col:last-of-type>.card:nth-child(2){background:#eee8f7;border-color:transparent}
.dashboard-page .two-col>.card h3{color:#342b34}
:root.dark .dashboard-page .two-col>.card{background:var(--surface);border-color:var(--line)}
:root.dark .dashboard-page .two-col>.card h3{color:var(--ink)}
.dashboard-page .heat-cell{border-radius:7px}
.dashboard-page .heat-cell[data-v="1"]{background:#f2cedc}.dashboard-page .heat-cell[data-v="2"]{background:#e8a9c1}.dashboard-page .heat-cell[data-v="3"]{background:#d8799d}.dashboard-page .heat-cell[data-v="4"]{background:#b94e79}

.dashboard-bento-a>.card:first-child{background:#e8f1ee;border-color:transparent}.dashboard-bento-a>.card:last-child{background:#f9e7ee;border-color:transparent}.dashboard-bento-b>.card:first-child{background:#fbf0ce;border-color:transparent}.dashboard-bento-b>.card:last-child{background:#eee8f7;border-color:transparent}
:root.dark .dashboard-bento-a>.card,:root.dark .dashboard-bento-b>.card{background:var(--surface);border-color:var(--line)}
