/* ═══ JLPT SAMURAI — Design System ═══ */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;900&family=Noto+Sans+JP:wght@300;400;500;700;900&family=DM+Mono:wght@400;500&display=swap');

:root {
  --bg:#06060a;--surface:#0e0e16;--card:#12121e;--border:#1e1e30;
  --red:#cc2200;--red-glow:rgba(204,34,0,.25);--gold:#d4a017;--gold-glow:rgba(212,160,23,.2);
  --white:#e8e8f0;--muted:#555570;--green:#2ecc71;--orange:#e87b1e;
  --nav-h:64px;--font-head:'Cinzel',serif;--font-body:'Noto Sans JP',sans-serif;--font-mono:'DM Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--white);font-family:var(--font-body);line-height:1.6;min-height:100vh;padding-top:var(--nav-h);overflow-x:hidden}

/* ═══ LOADER ═══ */
#page-loader{position:fixed;inset:0;z-index:9999;background:var(--bg);display:flex;flex-direction:column;align-items:center;justify-content:center;transition:opacity .5s}
#page-loader.hidden{opacity:0;pointer-events:none}
#page-loader .logo{font-family:var(--font-head);font-size:28px;color:var(--red);letter-spacing:4px;margin-bottom:20px}
#page-loader .bar{width:200px;height:3px;background:var(--border);overflow:hidden;border-radius:2px}
#page-loader .bar-fill{height:100%;width:0;background:linear-gradient(90deg,var(--red),var(--gold));animation:loaderFill 1.2s ease forwards}
@keyframes loaderFill{to{width:100%}}

/* ═══ NAVBAR ═══ */
nav.samurai-nav{position:fixed;top:0;left:0;right:0;height:var(--nav-h);background:rgba(6,6,10,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);z-index:1000;display:flex;align-items:center;padding:0 20px;}
.nav-top { display: flex; align-items: center; margin-right: auto; }
.nav-brand{font-family:var(--font-head);font-size:20px;font-weight:700;color:var(--red);letter-spacing:3px;text-decoration:none;display:flex;align-items:center;gap:8px;white-space:nowrap}
.nav-brand span{color:var(--gold);font-size:14px}
.nav-links{display:flex;gap:4px;align-items:center; margin-left: auto;}
.nav-link{padding:8px 16px;font-family:var(--font-head);font-size:12px;color:var(--muted);text-decoration:none;letter-spacing:2px;text-transform:uppercase;border-bottom:2px solid transparent;transition:all .2s;white-space:nowrap}
.nav-link:hover{color:var(--white)}
.nav-link.active{color:var(--red);border-bottom-color:var(--red);text-shadow:0 0 12px var(--red-glow)}
.nav-user-chip{padding:4px 10px;border-radius:20px;background:rgba(204,34,0,0.2);color:var(--white);font-family:var(--font-mono);font-size:11px;cursor:pointer;margin-left:16px;border:1px solid var(--red);transition:all .2s;}
.nav-user-chip:hover{background:var(--red);transform:translateY(-2px);}

/* ═══ SAKURA CANVAS ═══ */
#sakura-canvas{position:fixed;inset:0;z-index:0;pointer-events:none}

/* ═══ PAGE ═══ */
.page-wrap{position:relative;z-index:1;min-height:calc(100vh - var(--nav-h));padding:32px 20px 80px;max-width:1100px;margin:0 auto}
.page-title{font-family:var(--font-head);font-size:clamp(24px,5vw,42px);color:var(--red);letter-spacing:4px;text-transform:uppercase;text-shadow:0 0 30px var(--red-glow);margin-bottom:4px}
.page-sub{font-family:var(--font-mono);font-size:12px;color:var(--muted);letter-spacing:1px;margin-bottom:8px}
.ink-divider{width:100%;height:2px;background:linear-gradient(90deg,transparent,var(--red),var(--gold),var(--red),transparent);opacity:.4;margin:12px 0 28px}

/* ═══ HERO ═══ */
.hero{text-align:center;padding:80px 20px 60px;position:relative}
.hero-title{font-family:var(--font-head);font-size:clamp(36px,8vw,72px);font-weight:900;color:var(--white);letter-spacing:6px;line-height:1.1;text-shadow:0 0 40px var(--red-glow)}
.hero-title .red{color:var(--red)}
.hero-tagline{font-family:var(--font-mono);font-size:clamp(12px,2vw,16px);color:var(--muted);margin-top:16px;letter-spacing:2px}

/* ═══ STATS ROW ═══ */
.stats-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:32px 0}
.stat-card{background:var(--card);border:1px solid var(--border);padding:20px 16px;text-align:center;transition:all .3s}
.stat-card:hover{border-color:var(--red);transform:translateY(-2px)}
.stat-val{font-family:var(--font-head);font-size:28px;font-weight:700;color:var(--gold);letter-spacing:2px}
.stat-lbl{font-family:var(--font-mono);font-size:10px;color:var(--muted);letter-spacing:1px;text-transform:uppercase;margin-top:4px}

/* ═══ CARDS GRID ═══ */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin:24px 0}
.lesson-card{background:var(--card);border:1px solid var(--border);padding:24px 16px;text-align:center;cursor:pointer;transition:all .3s;position:relative;overflow:hidden;text-decoration:none;color:var(--white)}
.lesson-card:hover{border-color:var(--red);transform:translateY(-3px);box-shadow:0 8px 30px rgba(204,34,0,.15)}
.lesson-card.locked{opacity:.4;cursor:not-allowed;pointer-events:none}
.lesson-card .lc-num{font-family:var(--font-head);font-size:32px;font-weight:900;color:var(--red);letter-spacing:2px}
.lesson-card .lc-label{font-family:var(--font-mono);font-size:10px;color:var(--muted);letter-spacing:1px;margin-top:4px}
.lesson-card .lc-count{font-family:var(--font-mono);font-size:11px;color:var(--gold);margin-top:8px}
.lesson-card .lc-badge{position:absolute;top:8px;right:8px;font-size:14px}
.progress-ring{width:50px;height:50px;margin:8px auto 0}
.progress-ring circle{fill:none;stroke-width:3}
.progress-ring .ring-bg{stroke:var(--border)}
.progress-ring .ring-fg{stroke:var(--red);stroke-linecap:round;transform:rotate(-90deg);transform-origin:center;transition:stroke-dashoffset .8s ease}

/* ═══ TABS ═══ */
.tab-row{display:flex;gap:4px;margin-bottom:24px;border-bottom:1px solid var(--border);padding-bottom:0;overflow-x:auto}
.tab-btn{padding:10px 20px;font-family:var(--font-head);font-size:13px;color:var(--muted);background:none;border:none;cursor:pointer;letter-spacing:2px;text-transform:uppercase;border-bottom:2px solid transparent;transition:all .2s;white-space:nowrap}
.tab-btn:hover{color:var(--white)}
.tab-btn.active{color:var(--red);border-bottom-color:var(--red)}
.tab-panel{display:none;animation:fadeIn .3s ease}
.tab-panel.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* ═══ SEARCH ═══ */
.search-bar{width:100%;padding:12px 16px;background:var(--card);border:1px solid var(--border);color:var(--white);font-family:var(--font-body);font-size:14px;outline:none;margin-bottom:16px;transition:border-color .2s}
.search-bar:focus{border-color:var(--red)}
.search-bar::placeholder{color:var(--muted)}

/* ═══ WORD TABLE ═══ */
.word-table{width:100%;border-collapse:collapse}
.word-table th{font-family:var(--font-mono);font-size:10px;color:var(--muted);padding:10px 12px;text-align:left;border-bottom:1px solid var(--border);letter-spacing:1px;text-transform:uppercase;background:rgba(0,0,0,.3)}
.word-table td{padding:12px;border-bottom:1px solid rgba(30,30,48,.5);vertical-align:middle}
.word-table tr{animation:fadeIn .3s ease both}
.word-table tr:hover td{background:rgba(204,34,0,.03)}
.jp-cell{font-size:clamp(16px,2.5vw,20px);font-weight:700;color:var(--gold);text-shadow:0 0 8px var(--gold-glow)}
.bn-cell{color:var(--white);font-size:14px}
.num-cell{font-family:var(--font-mono);font-size:11px;color:var(--muted);width:36px}
.mastery-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle}

/* ═══ ROMAJI BOX ═══ */
.roma-box{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border:2px solid var(--gold);background:var(--card);cursor:pointer;font-family:var(--font-mono);font-size:12px;color:var(--muted);transition:all .25s;user-select:none;min-width:100px;letter-spacing:.5px}
.roma-box:hover{border-color:var(--red);color:var(--white);transform:scale(1.03);box-shadow:0 0 12px var(--red-glow)}
.roma-box.revealed{border-color:var(--green);color:var(--green);cursor:default;box-shadow:0 0 8px rgba(46,204,113,.15)}
.roma-box.revealed:hover{transform:none}

/* ═══ AUDIO BUTTON ═══ */
.speak-btn{width:34px;height:34px;border-radius:50%;border:2px solid var(--border);background:var(--card);color:var(--gold);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;font-size:14px;transition:all .2s}
.speak-btn:hover{border-color:var(--red);background:rgba(204,34,0,.1);transform:scale(1.1)}
.speak-btn.playing{border-color:var(--green);animation:pulse .5s ease infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.15)}}

/* ═══ FILTER CHIPS ═══ */
.chip-row{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.chip{padding:6px 14px;border:1px solid var(--border);background:var(--card);color:var(--muted);cursor:pointer;font-family:var(--font-mono);font-size:10px;letter-spacing:.5px;transition:all .2s;text-transform:uppercase}
.chip.active{border-color:var(--red);color:var(--red);background:rgba(204,34,0,.08)}
.chip:hover:not(.active){border-color:#333;color:var(--white)}

/* ═══ 3D FLASHCARD ═══ */
.fc-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.fc-info{font-family:var(--font-mono);font-size:12px;color:var(--muted);margin-right:auto}
.fc-progress{width:100%;height:3px;background:var(--border);margin-bottom:20px;overflow:hidden;border-radius:2px}
.fc-fill{height:100%;background:linear-gradient(90deg,var(--red),var(--gold));transition:width .4s;border-radius:2px}
.card-wrap{perspective:1200px;width:100%;max-width:600px;margin:0 auto 20px;height:300px;cursor:pointer}
.card-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.4,0,.2,1);will-change:transform}
.card-inner.flipped{transform:rotateY(180deg)}
.card-face{position:absolute;inset:0;background:var(--card);border:1px solid var(--border);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px;backface-visibility:hidden}
.card-front{border-top:3px solid var(--red)}
.card-back{transform:rotateY(180deg);border-top:3px solid var(--green)}
.fc-jp{font-size:clamp(30px,6vw,52px);font-weight:900;color:var(--gold);line-height:1;text-shadow:0 0 20px var(--gold-glow)}
.fc-roma{font-family:var(--font-mono);font-size:13px;color:var(--muted);margin-top:8px;letter-spacing:2px}
.fc-hint{font-size:10px;color:#222;font-family:var(--font-mono);margin-top:16px;letter-spacing:2px;text-transform:uppercase}
.fc-bn{font-size:clamp(18px,3vw,26px);font-weight:700;color:var(--green);text-align:center}
.fc-mn{font-size:12px;color:var(--muted);line-height:1.7;border-left:3px solid var(--red);padding-left:12px;text-align:left;max-width:420px;margin-top:10px}
.fc-ex{font-size:11px;color:var(--muted);margin-top:8px;font-style:italic;text-align:left;width:100%;max-width:420px}
.fc-rating{display:none;justify-content:center;gap:8px;margin-top:12px;flex-wrap:wrap}
.fc-rating.visible{display:flex}
.fc-nav{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}

/* ═══ BUTTONS ═══ */
.btn{padding:10px 22px;border:1px solid var(--border);background:var(--card);color:var(--muted);cursor:pointer;font-family:var(--font-head);font-size:12px;letter-spacing:1px;transition:all .2s;text-transform:uppercase;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.btn:hover{border-color:var(--red);color:var(--white);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.3)}
.btn:active{transform:translateY(0)}
.btn-primary{border-color:var(--red);color:var(--red);background:rgba(204,34,0,.06)}
.btn-primary:hover{background:rgba(204,34,0,.15);box-shadow:0 0 20px var(--red-glow)}
.btn-green{border-color:var(--green);color:var(--green)}
.btn-green:hover{background:rgba(46,204,113,.1)}
.btn:disabled{opacity:.3;cursor:not-allowed;transform:none!important}

.rate-btn{padding:8px 18px;border:1px solid var(--border);background:none;cursor:pointer;font-family:var(--font-head);font-size:12px;letter-spacing:1px;transition:all .2s;text-transform:uppercase}
.rate-btn.again{border-color:var(--red);color:var(--red)}.rate-btn.again:hover{background:rgba(204,34,0,.1)}
.rate-btn.hard{border-color:var(--orange);color:var(--orange)}.rate-btn.hard:hover{background:rgba(232,123,30,.1)}
.rate-btn.good{border-color:var(--gold);color:var(--gold)}.rate-btn.good:hover{background:rgba(212,160,23,.1)}
.rate-btn.easy{border-color:var(--green);color:var(--green)}.rate-btn.easy:hover{background:rgba(46,204,113,.1)}

/* ═══ QUIZ ═══ */
.quiz-setup{text-align:center;padding:28px 16px}
.quiz-opts{display:flex;flex-direction:column;gap:14px;max-width:500px;margin:0 auto 24px;text-align:left}
.quiz-opt-group label{font-family:var(--font-mono);font-size:10px;color:var(--muted);display:block;margin-bottom:7px;letter-spacing:1px;text-transform:uppercase}
.radio-row{display:flex;gap:6px;flex-wrap:wrap}
.radio-chip{padding:6px 14px;border:1px solid var(--border);background:var(--card);color:var(--muted);cursor:pointer;font-family:var(--font-head);font-size:12px;letter-spacing:.5px;transition:all .2s;user-select:none;text-transform:uppercase}
.radio-chip.sel{border-color:var(--red);color:var(--red);background:rgba(204,34,0,.08)}
.radio-chip:hover:not(.sel){border-color:#333;color:var(--white)}
.qz-progress-bar{width:100%;height:3px;background:var(--border);margin-bottom:20px;overflow:hidden;border-radius:2px}
.qz-prog-fill{height:100%;background:linear-gradient(90deg,var(--red),var(--gold));transition:width .3s;border-radius:2px}
.qz-question{background:var(--card);border:1px solid var(--border);border-top:3px solid var(--red);padding:28px;text-align:center;margin-bottom:14px}
.qz-prompt{font-size:10px;color:var(--muted);font-family:var(--font-mono);margin-bottom:14px;letter-spacing:2px;text-transform:uppercase}
.qz-word{font-size:clamp(24px,5vw,44px);font-weight:900;color:var(--gold);line-height:1.1;text-shadow:0 0 14px var(--gold-glow)}
.qz-options{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.qz-opt{padding:14px 12px;border:1px solid var(--border);background:var(--card);color:var(--white);cursor:pointer;font-size:13px;transition:all .2s;text-align:center;line-height:1.5}
.qz-opt:hover:not(:disabled){border-color:var(--red);color:var(--red);background:rgba(204,34,0,.04)}
.qz-opt.correct{border-color:var(--green)!important;background:rgba(46,204,113,.1)!important;color:var(--green)!important}
.qz-opt.wrong{border-color:var(--red)!important;background:rgba(204,34,0,.1)!important;color:#f66!important;animation:shake .3s}
.qz-opt:disabled{cursor:not-allowed}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.qz-feedback{font-size:12px;color:var(--muted);line-height:1.8;padding:12px 14px;background:rgba(0,0,0,.3);border-left:3px solid var(--green);display:none;font-family:var(--font-mono)}
.qz-feedback.show{display:block}

/* ═══ QUIZ RESULT ═══ */
.quiz-result{text-align:center;padding:28px 16px;max-width:560px;margin:0 auto}
.result-grade{font-family:var(--font-head);font-size:clamp(60px,12vw,90px);font-weight:900;line-height:1;letter-spacing:4px;animation:gradeIn .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes gradeIn{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
.result-label{font-size:12px;color:var(--muted);font-family:var(--font-mono);margin:8px 0}
.result-msg{font-family:var(--font-mono);font-size:13px;color:var(--white);margin-bottom:20px}
.result-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin:16px 0}
.result-stat{background:var(--card);border:1px solid var(--border);padding:14px;text-align:center}
.result-stat-val{font-family:var(--font-head);font-size:26px;font-weight:700;letter-spacing:1px}
.result-stat-lbl{font-size:10px;color:var(--muted);font-family:var(--font-mono);margin-top:2px;letter-spacing:1px;text-transform:uppercase}
.wrong-list{margin-top:20px;text-align:left}
.wrong-list h4{font-family:var(--font-mono);font-size:10px;color:var(--red);margin-bottom:10px;letter-spacing:1px;text-transform:uppercase}
.wrong-item{display:flex;align-items:center;gap:12px;padding:10px 12px;background:var(--card);border:1px solid rgba(204,34,0,.15);margin-bottom:6px}
.wrong-jp{color:var(--gold);font-weight:700;font-size:16px;min-width:120px}
.wrong-bn{color:var(--muted);font-size:13px}

/* ═══ SLASH ANIMATION ═══ */
.slash-overlay{position:fixed;top:-50%;left:-10%;width:120%;height:200%;background:linear-gradient(135deg,transparent 45%,rgba(204,34,0,.6) 49%,rgba(204,34,0,.8) 50%,rgba(204,34,0,.6) 51%,transparent 55%);z-index:9998;pointer-events:none;transform:translateX(-120%);will-change:transform;animation:slashAcross .35s ease-out forwards}
@keyframes slashAcross{to{transform:translateX(120%);opacity:0}}

/* ═══ KANJI DETAIL PANEL ═══ */
.kanji-panel{position:fixed;top:0;right:-420px;width:400px;height:100vh;background:var(--surface);border-left:1px solid var(--border);z-index:1001;padding:28px 24px;overflow-y:auto;transition:right .4s cubic-bezier(.4,0,.2,1);will-change:right}
.kanji-panel.open{right:0}
.kanji-panel .kp-char{font-size:120px;text-align:center;color:var(--red);text-shadow:0 0 40px var(--red-glow);line-height:1;margin:20px 0}
.kanji-panel .kp-close{position:absolute;top:12px;right:16px;background:none;border:none;color:var(--muted);font-size:24px;cursor:pointer}
.panel-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1000;opacity:0;pointer-events:none;transition:opacity .3s}
.panel-overlay.open{opacity:1;pointer-events:auto}

/* ═══ REVIEW CALENDAR ═══ */
.cal-row{display:flex;gap:4px;margin:12px 0}
.cal-day{width:28px;height:28px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:9px;color:var(--muted)}
.cal-day.studied{background:var(--green);color:#000}
.cal-day.missed{background:var(--border)}

/* ═══ SESSION TIMER ═══ */
.session-timer{position:fixed;top:72px;right:16px;font-family:var(--font-mono);font-size:11px;color:var(--muted);z-index:100;background:var(--card);border:1px solid var(--border);padding:4px 10px;border-radius:4px}

/* ═══ COMING SOON ═══ */
.coming-soon{text-align:center;padding:120px 20px}
.coming-soon .cs-kanji{font-size:clamp(80px,20vw,160px);color:var(--red);text-shadow:0 0 60px var(--red-glow);line-height:1}
.coming-soon .cs-title{font-family:var(--font-head);font-size:clamp(24px,5vw,40px);color:var(--white);letter-spacing:4px;margin:16px 0 8px}
.coming-soon .cs-msg{color:var(--muted);font-size:14px;max-width:500px;margin:0 auto 24px}
.coming-soon .cs-timer{font-family:var(--font-mono);font-size:18px;color:var(--gold);letter-spacing:2px;margin:20px 0}

/* ═══ LIGHTBOX ═══ */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:9000;display:none;align-items:center;justify-content:center;cursor:pointer}
.lightbox.open{display:flex}
.lightbox img{max-width:90%;max-height:80vh;border:2px solid var(--border);object-fit:contain}

/* ═══ FOOTER ═══ */
.samurai-footer{text-align:center;padding:40px 20px;font-family:var(--font-mono);font-size:11px;color:var(--muted);border-top:1px solid var(--border);margin-top:60px}

/* ═══ GUIDE MODAL ═══ */
.guide-modal { position: fixed; inset: 0; background: rgba(0,0,0,0.85); z-index: 9999; display: none; align-items: center; justify-content: center; backdrop-filter: blur(5px); }
.guide-modal.open { display: flex; animation: fadeIn 0.3s ease; }
.guide-content { background: var(--bg); border: 1px solid var(--red); width: 90%; max-width: 600px; max-height: 85vh; border-radius: 8px; overflow-y: auto; position: relative; box-shadow: 0 0 30px rgba(204,34,0,0.3); }
.guide-header { position: sticky; top: 0; background: rgba(10,10,5,0.95); border-bottom: 1px solid var(--border); padding: 20px; display: flex; justify-content: space-between; align-items: center; z-index: 10; backdrop-filter: blur(10px); }
.guide-title { font-family: var(--font-head); font-size: 22px; color: var(--gold); letter-spacing: 2px; margin: 0; }
.guide-close { background: none; border: none; color: var(--muted); font-size: 28px; cursor: pointer; transition: color 0.2s; padding: 0; line-height: 1; }
.guide-close:hover { color: var(--red); }
.guide-body { padding: 20px 24px 40px; font-size: 14px; line-height: 1.6; color: var(--white); }
.guide-section { margin-bottom: 24px; padding-bottom: 24px; border-bottom: 1px solid rgba(255,255,255,0.05); }
.guide-section:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }
.guide-section h3 { font-family: var(--font-head); font-size: 16px; color: var(--red); margin-bottom: 12px; letter-spacing: 1px; }
.guide-section p { margin-bottom: 10px; color: var(--muted); }
.guide-section ul { margin: 0; padding-left: 20px; color: var(--muted); }
.guide-section li { margin-bottom: 6px; }
.guide-section strong { color: var(--white); }

/* ═══ RESPONSIVE ═══ */
@media(max-width:768px){
  .qz-options{grid-template-columns:1fr}
  .result-grid{grid-template-columns:1fr 1fr}
  .kanji-panel{width:100%;right:-100%}
  .cards-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
}
@media(max-width:480px){
  .page-wrap{padding:20px 12px 60px}
  .hero{padding:50px 12px 40px}
  .stats-row{grid-template-columns:1fr 1fr}
  .word-table .roma-cell{display:none}
  .word-table th:nth-child(3){display:none}
}

/* ═══ SCROLLBAR ═══ */
::-webkit-scrollbar{width:4px}
::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
::-webkit-scrollbar-track{background:var(--bg)}

/* ═══ MOBILE RESPONSIVE TWEAKS ═══ */
@media (max-width: 600px) {
  body { padding-top: 100px; }
  nav.samurai-nav { height: auto; flex-direction: column; align-items: stretch; padding: 10px 15px 0; }
  .nav-top { justify-content: space-between; margin-bottom: 8px; width: 100%; margin-right: 0; }
  .nav-brand { font-size: 18px; }
  .nav-links { overflow-x: auto; width: 100%; justify-content: flex-start; margin-left: 0; padding-bottom: 8px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .nav-links::-webkit-scrollbar { display: none; }
  .nav-link { padding: 8px 12px; font-size: 11px; letter-spacing: 1px; }
  
  .lesson-grid { grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 12px; }
  .lesson-card { padding: 15px 10px; }
  .lesson-card h2 { font-size: 20px; }
  .lesson-tabs { gap: 5px; flex-wrap: wrap; margin-bottom: 20px; }
  .tab-btn { padding: 10px 5px; font-size: 11px; flex: 1; text-align: center; }
  .flashcard-container { height: 260px; perspective: 800px; }
  .flashcard-ja { font-size: 32px; }
  .flashcard-romaji { font-size: 16px; }
  .quiz-card { padding: 20px; }
  .quiz-question { font-size: 30px; }
  .quiz-option { padding: 12px; font-size: 14px; }
  .word-list { display: block; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
  .word-list th, .word-list td { padding: 8px; font-size: 13px; }
  .nav-user-chip { font-size: 10px; padding: 4px 8px; margin-left: 0; }
  .main-content { padding: 15px; }
}