:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#e5eefc;background:#07111f;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}body{min-width:320px;background:radial-gradient(circle at 10% 0%,rgba(59,130,246,.18),transparent 33rem),radial-gradient(circle at 90% 15%,rgba(168,85,247,.14),transparent 30rem),#07111f}.app-shell{width:min(1120px,100%);margin:0 auto;padding:28px 20px 34px}.topbar{display:flex;align-items:end;justify-content:space-between;gap:16px}.eyebrow{color:#7dd3fc;text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:800}h1,h2,p{margin:0}h1{margin-top:4px;font-size:clamp(30px,5vw,44px);letter-spacing:-.04em}.mode-tabs{margin-top:24px;display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:8px;background:#0f172ab8;border:1px solid rgba(148,163,184,.14);border-radius:18px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.mode-tabs button,.segmented button,.chip-row button{border:0;color:#9fb0c9;background:transparent;border-radius:12px;padding:11px 12px;cursor:pointer;font-weight:750;transition:.18s ease}.mode-tabs button:hover,.segmented button:hover,.chip-row button:hover{color:#fff;background:#94a3b814}.mode-tabs button.active,.segmented button.active,.chip-row button.active{color:#fff;background:linear-gradient(135deg,#2563ebe6,#7c3aede0);box-shadow:0 8px 26px #2563eb33}.controls-panel{margin-top:14px;padding:14px 16px;display:flex;flex-direction:column;gap:12px;border:1px solid rgba(148,163,184,.12);background:#0f172a94;border-radius:18px}.control-row{display:flex;align-items:center;gap:14px}.wrap-row{align-items:flex-start}.control-label{width:94px;flex:0 0 94px;color:#93a4bd;font-size:13px;padding-top:8px}.segmented,.chip-row{display:flex;gap:7px;flex-wrap:wrap}.segmented{padding:4px;border-radius:13px;background:#02061761}.segmented button,.chip-row button{padding:8px 11px;font-size:13px}.toggle-row{display:flex;align-items:center;gap:10px;color:#c6d3e6;cursor:pointer;font-size:14px}.toggle-row input{width:18px;height:18px;accent-color:#6366f1}.study-area{width:min(760px,100%);margin:28px auto 0}.progress-row{display:flex;justify-content:space-between;gap:12px;color:#94a3b8;font-size:13px}.progress-row strong{color:#fff}.progress-track{height:8px;margin-top:10px;background:#94a3b81f;border-radius:999px;overflow:hidden}.progress-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#22c55e,#38bdf8,#8b5cf6);transition:width .3s ease}.swipe-hints{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px;margin:14px 0 10px;color:#64748b;font-size:12px}.swipe-hints span:last-child{text-align:right}.swipe-hints .hot{font-weight:800}.swipe-hints .miss{color:#fb7185}.swipe-hints .know{color:#4ade80}.card-stage{width:min(520px,calc(100vw - 40px));height:min(540px,62vh);min-height:420px;margin:0 auto;perspective:1200px;touch-action:pan-y;-webkit-user-select:none;user-select:none;transition:transform .14s ease-out}.card-stage.dragging{transition:none;cursor:grabbing}.flashcard{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .42s cubic-bezier(.2,.7,.2,1);cursor:pointer}.flashcard.flipped{transform:rotateY(180deg)}.card-face{position:absolute;inset:0;backface-visibility:hidden;border:1px solid rgba(148,163,184,.16);border-radius:30px;overflow:hidden;display:flex;flex-direction:column;background:linear-gradient(160deg,#1e293bf5,#080f1dfa),#0f172a;box-shadow:0 28px 80px #0000005c,inset 0 1px #ffffff08}.card-face:before{content:"";position:absolute;inset:-40% auto auto -20%;width:80%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(56,189,248,.16),transparent 66%);pointer-events:none}.card-back{transform:rotateY(180deg);background:linear-gradient(145deg,#14213a,#0b1325)}.card-badge{align-self:flex-start;margin:22px;padding:7px 10px;border-radius:999px;color:#bae6fd;background:#0ea5e91a;border:1px solid rgba(56,189,248,.18);font-size:12px;font-weight:800}.card-content{position:relative;z-index:1;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:18px 26px 24px}.card-stat{padding:0 22px 20px;text-align:center;color:#64748b;font-size:12px}.kana-pair{display:flex;align-items:center;justify-content:center;gap:clamp(28px,8vw,66px);font-family:Hiragino Sans,Yu Gothic,Noto Sans JP,sans-serif;font-size:clamp(96px,22vw,154px);font-weight:800;line-height:1}.single-kana,.kanji-main{font-family:Hiragino Sans,Yu Gothic,Noto Sans JP,sans-serif;font-size:clamp(150px,34vw,230px);font-weight:800;line-height:.95}.kanji-main{font-size:clamp(165px,36vw,245px)}.word-main{font-family:Hiragino Sans,Yu Gothic,Noto Sans JP,sans-serif;font-size:clamp(54px,13vw,86px);font-weight:800;line-height:1.18}.both-kana-word{display:flex;flex-direction:column;gap:16px}.kanji-word-front{display:flex;flex-direction:column;gap:14px}.kanji-word-front small{color:#94a3b8;font-size:.42em;font-weight:700}.front-romaji{margin-top:24px;color:#7dd3fc;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:22px;font-weight:800}.answer-stack{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%}.romaji-answer{font-size:clamp(64px,16vw,100px);font-weight:900;letter-spacing:-.04em;color:#fff}.mini-kana{font-family:Hiragino Sans,Yu Gothic,sans-serif;font-size:26px;color:#a5b4fc}.uk-answer{font-size:clamp(34px,8vw,54px);font-weight:900;line-height:1.08;color:#fff}.reading-answer{font-family:Hiragino Sans,Yu Gothic,sans-serif;font-size:38px;font-weight:800;color:#c4b5fd}.romaji-small{color:#7dd3fc;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:20px}.kanji-back{font-size:20px;line-height:1.35}.kanji-example{margin-top:8px;font-family:Hiragino Sans,Yu Gothic,sans-serif;font-size:34px;font-weight:800}.kanji-example span{margin-left:9px;font-size:18px;color:#94a3b8;font-weight:600}.example-uk{color:#cbd5e1;font-size:16px}.answer-buttons{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;margin:16px auto 0;width:min(620px,100%)}.answer-button,.primary-button,.ghost-button,.danger-button,.icon-button{border:0;cursor:pointer;font-weight:800;transition:transform .15s ease,filter .15s ease,background .15s ease}.answer-button:active,.primary-button:active,.ghost-button:active,.danger-button:active{transform:translateY(1px) scale(.99)}.answer-button{min-height:50px;border-radius:15px;padding:0 18px}.answer-button.miss{color:#fecdd3;background:#f43f5e29;border:1px solid rgba(251,113,133,.2)}.answer-button.flip{color:#cbd5e1;background:#94a3b81a;border:1px solid rgba(148,163,184,.15)}.answer-button.know{color:#bbf7d0;background:#22c55e29;border:1px solid rgba(74,222,128,.2)}.session-actions{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;margin-top:18px;color:#64748b;font-size:12px;text-align:center}.ghost-button{color:#cbd5e1;background:#94a3b814;border:1px solid rgba(148,163,184,.14);border-radius:12px;padding:10px 13px}.ghost-button:hover{background:#94a3b824;color:#fff}.primary-button{color:#fff;background:linear-gradient(135deg,#2563eb,#7c3aed);padding:12px 18px;border-radius:13px}.danger-button{color:#fecaca;background:#ef44441f;border:1px solid rgba(248,113,113,.16);padding:12px 14px;border-radius:13px}.complete-card{width:min(520px,100%);margin:20px auto 0;padding:54px 30px;text-align:center;border-radius:28px;border:1px solid rgba(74,222,128,.18);background:#0f172ab3}.complete-icon{width:72px;height:72px;display:grid;place-items:center;margin:0 auto 18px;border-radius:50%;background:#22c55e26;color:#4ade80;font-size:34px;font-weight:900}.complete-card h2{font-size:30px}.complete-card p{margin:10px auto 22px;color:#94a3b8;max-width:380px;line-height:1.55}.footer-note{margin-top:34px;text-align:center;color:#526076;font-size:12px}.modal-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:18px;background:#020617b8;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.stats-modal{width:min(860px,100%);max-height:min(760px,92vh);display:flex;flex-direction:column;border-radius:24px;overflow:hidden;background:#0d1728;border:1px solid rgba(148,163,184,.16);box-shadow:0 30px 100px #00000080}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 22px 16px}.modal-header h2{margin-top:4px;font-size:28px}.icon-button{width:40px;height:40px;border-radius:12px;color:#cbd5e1;background:#94a3b814;font-size:24px}.stats-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:0 22px 16px}.stats-summary div{padding:15px;border-radius:15px;background:#1e293ba8;border:1px solid rgba(148,163,184,.09)}.stats-summary strong{display:block;font-size:24px}.stats-summary span{color:#718096;font-size:12px}.stats-table-wrap{overflow:auto;border-top:1px solid rgba(148,163,184,.1);border-bottom:1px solid rgba(148,163,184,.1)}table{width:100%;border-collapse:collapse}th,td{padding:12px 14px;text-align:right;border-bottom:1px solid rgba(148,163,184,.07);font-size:13px}th{position:sticky;top:0;background:#111c2f;color:#74839a;font-size:11px;text-transform:uppercase;letter-spacing:.05em}th:first-child,td:first-child{text-align:left}.symbol-cell{font-family:Hiragino Sans,Yu Gothic,sans-serif;font-size:20px;font-weight:800}.modal-actions{display:flex;justify-content:space-between;gap:10px;padding:16px 22px 20px}@media(max-width:720px){.app-shell{padding:18px 12px 24px}.mode-tabs{grid-template-columns:repeat(3,1fr)}.control-row{align-items:flex-start;flex-direction:column;gap:7px}.control-label{width:auto;flex-basis:auto;padding-top:0}.swipe-hints{grid-template-columns:1fr 1fr}.swipe-hints span:nth-child(2){display:none}.card-stage{width:calc(100vw - 24px);min-height:390px;height:min(510px,62vh)}.card-face{border-radius:24px}.answer-buttons{grid-template-columns:1fr 1fr}.answer-button.flip{grid-column:1 / -1;grid-row:2}.stats-summary{grid-template-columns:1fr 1fr}.stats-modal{max-height:94vh}.modal-actions{flex-direction:column-reverse}}@media(max-width:430px){.topbar{align-items:center}.mode-tabs{grid-template-columns:repeat(2,1fr)}.kana-pair{gap:24px;font-size:92px}.single-kana,.kanji-main{font-size:150px}.card-badge{margin:16px}.card-stat{padding-bottom:16px}}.topbar-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.kana-guide-modal{width:min(1080px,100%);max-height:min(880px,94vh);display:flex;flex-direction:column;border-radius:24px;overflow:hidden;background:#0d1728;border:1px solid rgba(148,163,184,.16);box-shadow:0 30px 100px #00000080}.kana-guide-header{align-items:flex-start;gap:18px}.kana-guide-header p{margin-top:8px;max-width:720px;color:#8da0bb;font-size:14px;line-height:1.5}.kana-guide-tabs{display:flex;gap:8px;padding:0 22px 16px}.kana-guide-tabs button{border:1px solid rgba(148,163,184,.14);border-radius:12px;padding:9px 13px;color:#9fb0c9;background:#94a3b80f;cursor:pointer;font-weight:800}.kana-guide-tabs button.active{color:#fff;background:linear-gradient(135deg,#2563ebeb,#7c3aede6);border-color:transparent}.kana-guide-scroll{overflow:auto;padding:0 22px 22px}.kana-column-heads,.kana-reference-table{min-width:760px;display:grid;grid-template-columns:88px repeat(5,minmax(118px,1fr));gap:8px}.kana-column-heads{position:sticky;top:0;z-index:4;padding:8px 0;background:#0d1728;color:#7dd3fc;text-align:center;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:900}.kana-row-label{min-height:92px;display:grid;place-items:center;border-radius:14px;color:#9fb0c9;background:#02061759;border:1px solid rgba(148,163,184,.08);font-size:13px;font-weight:900}.kana-reference-cell{min-height:92px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border-radius:14px;background:#1e293ba8;border:1px solid rgba(148,163,184,.1)}.kana-reference-cell.empty{background:#0f172a33;border-style:dashed;opacity:.35}.kana-reference-symbols{display:flex;align-items:baseline;gap:11px;font-family:Hiragino Sans,Yu Gothic,Noto Sans JP,sans-serif;font-size:31px;font-weight:850;line-height:1}.kana-reference-symbols span:last-child{color:#c4b5fd}.kana-reference-romaji{color:#7dd3fc;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;font-weight:850}.kana-guide-note{min-width:760px;margin-top:14px;padding:14px 16px;border-radius:14px;color:#9fb0c9;background:#0ea5e90f;border:1px solid rgba(56,189,248,.12);font-size:13px;line-height:1.55}.extended-reference-list{display:flex;flex-direction:column;gap:18px}.extended-reference-group h3{margin:0 0 8px;color:#cbd5e1;font-size:14px}.extended-reference-grid{display:grid;grid-template-columns:repeat(5,minmax(108px,1fr));gap:8px}.kana-guide-actions{align-items:center;color:#718096;font-size:12px}@media(max-width:720px){.topbar{align-items:flex-start}.topbar-actions{max-width:190px}.topbar-actions .ghost-button{padding:9px 10px;font-size:12px}.kana-guide-modal{max-height:96vh}.kana-guide-header{padding:18px 16px 12px}.kana-guide-tabs{padding:0 16px 12px}.kana-guide-scroll{padding:0 16px 16px}.kana-guide-actions{padding:14px 16px 16px}.extended-reference-grid{grid-template-columns:repeat(3,minmax(96px,1fr))}}@media(max-width:430px){.topbar{gap:10px}.topbar-actions{flex-direction:column;align-items:stretch;max-width:150px}.topbar-actions .ghost-button{width:100%}.extended-reference-grid{grid-template-columns:repeat(2,minmax(105px,1fr))}}.kana-vowel-filter button{min-width:44px;text-transform:lowercase}.filter-help{color:#718096;font-size:12px;line-height:1.4}.kana-reference-main{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:0}.kana-reference-cell.has-derivatives{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;padding:8px 7px 8px 9px}.kana-reference-derivatives{display:flex;flex-direction:column;justify-content:center;gap:5px;padding-left:7px;border-left:1px solid rgba(148,163,184,.14)}.kana-reference-derived{display:flex;flex-direction:column;align-items:center;gap:2px;white-space:nowrap}.kana-reference-derived span{font-family:Hiragino Sans,Yu Gothic,Noto Sans JP,sans-serif;color:#f0abfc;font-size:17px;font-weight:850;line-height:1}.kana-reference-derived small{color:#94a3b8;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;font-weight:800}@media(max-width:720px){.filter-help{width:100%;padding-left:0}}.access-shell{min-height:100vh;display:grid;place-items:center;padding:20px}.access-card{width:min(380px,100%);display:flex;flex-direction:column;align-items:stretch;padding:32px;border-radius:24px;background:#0d1728eb;border:1px solid rgba(148,163,184,.14);box-shadow:0 30px 100px #00000073;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.access-mark{width:48px;height:48px;display:grid;place-items:center;margin-bottom:20px;border-radius:14px;color:#bfdbfe;background:#3b82f624;border:1px solid rgba(96,165,250,.18);font-size:18px}.access-card h1{margin:0;font-size:30px}.access-card p{margin:8px 0 22px;color:#8190a8;font-size:14px}.access-input{width:100%;height:52px;padding:0 16px;outline:none;border-radius:14px;color:#e5eefc;background:#0206178c;border:1px solid rgba(148,163,184,.17);transition:border-color .15s ease,box-shadow .15s ease}.access-input:focus{border-color:#60a5fab3;box-shadow:0 0 0 3px #3b82f61f}.access-input.error{border-color:#f87171b3}.access-error{margin-top:9px;color:#fda4af;font-size:12px}.access-submit{width:100%;margin-top:16px}