:root{--ink:#111827;--muted:#667085;--line:#e5e9f0;--bg:#f4f6f9;--panel:#fff;--primary:#4f6df5;--green:#0b9f6e;--red:#d84d57;--amber:#d48a18;--shadow:0 14px 45px rgba(17,24,39,.08);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);font-size:16px}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg)}button,input,textarea,select{font:inherit}button{cursor:pointer}.hidden{display:none!important}
.app-shell{display:grid;grid-template-columns:236px 1fr;min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;background:#111827;color:#fff;padding:24px 16px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;align-items:center;gap:12px;font-weight:750;font-size:1.06rem;margin:0 8px 34px}.brand-mark{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:#111827;color:white;font-size:1.5rem;font-weight:850;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}.brand-mark:after{content:"";position:absolute;width:9px;height:9px;border-radius:50%;background:#6ee7b7;transform:translate(17px,-17px)}.brand-mark.small{width:34px;height:34px;border-radius:10px;font-size:1rem;background:#273244;position:relative}.brand-mark.small:after{width:6px;height:6px;transform:translate(11px,-11px)}
nav{display:grid;gap:7px}.nav-item{width:100%;display:flex;align-items:center;gap:12px;color:#cbd3df;background:transparent;border:0;border-radius:11px;padding:11px 13px;text-align:left}.nav-item:hover,.nav-item.active{color:#fff;background:#273244}.nav-item span{font-size:1.15rem;width:20px;text-align:center}.nav-item.muted{color:#8994a5}.sidebar-bottom{margin-top:auto;display:grid;gap:5px}
.workspace{min-width:0;padding:0 38px 48px}.topbar{height:104px;display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--line);margin-bottom:28px}.topbar h1{font-size:1.55rem;margin:0 0 4px}.topbar p{margin:0;color:var(--muted);font-size:.91rem}.topbar .primary{margin-left:auto}.primary,.secondary,.danger,.text-button,.icon-button{border:0;border-radius:10px;padding:11px 16px;font-weight:700}.primary{background:var(--ink);color:#fff;box-shadow:0 4px 14px rgba(17,24,39,.12)}.primary:hover{background:#253049}.secondary{background:#eef1f5;color:var(--ink)}.danger{background:#fff0f1;color:var(--red)}.text-button{background:transparent;color:var(--muted);padding:6px}.icon-button{width:38px;height:38px;padding:0;background:#eef1f5;font-size:1.35rem}.wide{width:100%}
.summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:24px}.metric{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:18px}.metric span{display:block;color:var(--muted);font-size:.84rem;margin-bottom:8px}.metric strong{font-size:1.65rem;line-height:1}.metric small{display:block;margin-top:8px;color:#8a94a3}
.deck-grid{display:grid;grid-template-columns:repeat(3,minmax(250px,1fr));gap:16px}.deck-card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:17px;padding:20px;overflow:hidden;transition:.2s transform,.2s box-shadow}.deck-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--deck-color)}.deck-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.deck-card-head{display:flex;justify-content:space-between;gap:10px}.deck-card h2{font-size:1.1rem;margin:0 0 7px}.deck-card p{min-height:40px;color:var(--muted);font-size:.9rem;margin:0}.menu-button{border:0;background:transparent;font-size:1.3rem;color:var(--muted);padding:0 3px}.deck-numbers{display:flex;gap:18px;margin:22px 0}.deck-numbers span{font-size:.76rem;color:var(--muted)}.deck-numbers strong{display:block;color:var(--ink);font-size:1.16rem;margin-bottom:2px}.deck-actions{display:flex;gap:8px}.deck-actions button:first-child{flex:1}.secondary.study-disabled{opacity:.5;pointer-events:none}
.empty{padding:70px 20px;text-align:center;color:var(--muted)}.empty h2{color:var(--ink);margin:15px 0 8px}.empty p{margin:0 0 20px}.empty-icon,.done-ring{margin:auto;display:grid;place-items:center;width:66px;height:66px;border-radius:22px;background:#e7ebff;color:var(--primary);font-size:1.5rem;font-weight:850}.done-ring{border-radius:50%;background:#dff8ee;color:var(--green)}
.toolbar-row{display:grid;grid-template-columns:220px 1fr auto auto;gap:10px;margin-bottom:18px}.toolbar-row input,.toolbar-row select,label input,label textarea,label select{width:100%;border:1px solid #d9dee8;border-radius:10px;background:white;padding:11px 12px;color:var(--ink);outline:none}.toolbar-row input:focus,.toolbar-row select:focus,label input:focus,label textarea:focus,label select:focus,.editor:focus{border-color:#8095f7;box-shadow:0 0 0 3px rgba(79,109,245,.12)}
.cards-table-wrap{overflow:auto;background:white;border:1px solid var(--line);border-radius:12px}.cards-table{width:100%;min-width:1050px;border-collapse:collapse;table-layout:fixed}.cards-table th,.cards-table td{border-bottom:1px solid var(--line);padding:7px 9px;text-align:left;font-size:.78rem;vertical-align:middle}.cards-table th{position:sticky;top:0;z-index:1;background:#f7f8fa;color:var(--muted);font-weight:700;padding:0;cursor:grab;user-select:none}.cards-table th:active{cursor:grabbing}.cards-table .col-lapse_count{width:72px}.cards-table .col-interval_days{width:100px}.cards-table .col-review_count{width:86px}.cards-table .col-tags{width:130px}.cards-table .col-card_number{width:70px}.cards-table .col-front_html,.cards-table .col-back_html{width:240px}.cards-table .col-status{width:115px}.cards-table th.dragging{opacity:.45}.cards-table th.drag-over{box-shadow:inset 3px 0 0 var(--primary);background:#e9edff}.cards-table tbody tr:last-child td{border-bottom:0}.cards-table tbody tr:hover{background:#f7f9ff}.cards-table tbody tr:focus{outline:2px solid #8095f7;outline-offset:-2px}.cards-table .numeric{font-variant-numeric:tabular-nums;text-align:right}.cards-table .card-number{color:var(--primary);font-weight:750}.cards-table .snippet{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sort-button{display:flex;align-items:center;gap:5px;width:100%;padding:8px 9px;border:0;background:transparent;color:inherit;font:inherit;font-weight:inherit;text-align:left}.sort-button:hover,.sort-button.active{color:var(--ink);background:#eef1f5}.drag-grip{font-size:.65rem;color:#adb5c2;letter-spacing:-3px}.column-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sort-arrow{min-width:9px;margin-left:auto;font-size:.58rem;color:var(--primary)}.table-tag{display:inline-block;max-width:115px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;border-radius:99px;background:#eef1f5;padding:2px 6px;color:#596476}.status-badge{display:inline-block;border-radius:99px;padding:3px 7px;font-size:.71rem;font-weight:700;white-space:nowrap}.status-badge.new{background:#e9edff;color:#415bc4}.status-badge.learning{background:#e7f7f0;color:#08734f}.status-badge.suspended{background:#f0f1f3;color:#697386}.context-menu{position:fixed;z-index:100;min-width:220px;padding:6px;background:white;border:1px solid var(--line);border-radius:10px;box-shadow:0 18px 45px rgba(17,24,39,.2)}.context-menu button{display:block;width:100%;border:0;border-radius:7px;background:transparent;padding:8px 10px;text-align:left;font-size:.84rem;color:var(--ink)}.context-menu button:hover{background:#eef1f5}.context-menu .context-danger{color:var(--red)}.context-separator{height:1px;background:var(--line);margin:5px 3px}.image-context-menu{width:250px;padding:11px}.image-context-menu label{display:flex;justify-content:space-between;font-size:.8rem;font-weight:700}.image-context-menu>input{width:100%;margin:10px 0 7px}.image-size-presets{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.image-size-presets button{text-align:center;padding:6px 3px}.editor img{max-width:100%;height:auto;cursor:context-menu}
.panel{background:white;border:1px solid var(--line);border-radius:16px;padding:20px;margin-bottom:16px}.panel h2{font-size:1.05rem;margin:0 0 5px}.panel p{font-size:.85rem;color:var(--muted);margin:0}.panel-head{display:flex;justify-content:space-between;margin-bottom:18px}.rating-panel{display:grid;grid-template-columns:190px 1fr;gap:28px;align-items:center}.bar-row{display:grid;grid-template-columns:75px 1fr 40px;gap:10px;align-items:center;margin:10px 0;font-size:.84rem}.bar{height:9px;background:#edf0f4;border-radius:99px;overflow:hidden}.bar i{display:block;height:100%;border-radius:99px}.bar i.hard{background:#e66b73}.bar i.normal{background:#6680f6}.bar i.easy{background:#2db184}.difficult-row{display:flex;justify-content:space-between;gap:18px;padding:12px 0;border-top:1px solid var(--line)}.difficult-row:first-child{border-top:0}.difficult-row .snippet{max-width:75%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.difficult-row span{color:var(--red);font-size:.82rem}
.settings-panel{display:grid;gap:24px;max-width:760px}.switch-row{display:flex;align-items:flex-start;gap:12px;border-top:1px solid var(--line);padding-top:20px}.switch-row input{width:20px;height:20px;margin-top:2px}.switch-row span{display:grid;gap:5px}.switch-row small{color:var(--muted);line-height:1.45}
.study-view{max-width:820px;margin:0 auto}.study-top{display:flex;align-items:center;justify-content:space-between;color:var(--muted);margin-bottom:16px}.study-card{background:white;border:1px solid var(--line);border-radius:22px;min-height:360px;padding:40px;box-shadow:0 18px 60px rgba(17,24,39,.06)}.study-label{text-transform:uppercase;letter-spacing:.12em;color:#98a1ae;font-size:.71rem;font-weight:800}.card-content{font-size:1.32rem;line-height:1.62;margin-top:22px}.card-content img,.card-content video{max-width:100%;max-height:360px;border-radius:12px}.card-content audio{width:100%}.divider{height:1px;background:var(--line);margin:34px 0}.reveal-button{display:block;min-width:220px;margin:22px auto}.rating-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.rate{border:1px solid var(--line);border-radius:13px;background:white;padding:13px}.rate strong,.rate span{display:block}.rate span{font-size:.74rem;color:var(--muted);margin-top:3px}.rate.hard:hover{border-color:#e66b73;background:#fff7f8}.rate.normal:hover{border-color:#6680f6;background:#f7f8ff}.rate.easy:hover{border-color:#2db184;background:#f5fffb}
dialog{border:0;padding:0;border-radius:18px;width:min(520px,calc(100vw - 30px));box-shadow:0 26px 90px rgba(17,24,39,.25)}dialog::backdrop{background:rgba(11,18,31,.48);backdrop-filter:blur(3px)}.card-dialog{width:min(760px,calc(100vw - 30px));max-height:92vh}.modal-form{padding:24px;display:grid;gap:15px;max-height:92vh;overflow:auto}.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}.modal-head h2{margin:0;font-size:1.25rem}.modal-head p{margin:5px 0 0;color:var(--muted);font-size:.84rem}.modal-form label{display:grid;gap:7px;font-size:.84rem;font-weight:700}.modal-form label.check-row{display:flex;align-items:center;gap:9px;font-weight:600}.check-row input{width:auto}.import-note{margin:0;color:var(--muted);font-size:.8rem;line-height:1.5}.import-status{display:grid;gap:5px;padding:12px;border-radius:10px;background:#eaf8f2;color:#08734f;font-size:.84rem}.import-status.error{background:#fff0f1;color:var(--red)}.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:5px}.action-spacer{flex:1}.editor-shell{border:1px solid #d9dee8;border-radius:11px;overflow:hidden}.editor-toolbar{display:flex;gap:3px;align-items:center;padding:7px;background:#f5f7fa;border-bottom:1px solid #e4e8ef}.editor-toolbar button{border:0;background:white;border-radius:7px;min-width:34px;padding:6px 8px}.editor-toolbar input{width:34px;height:30px;padding:2px;border:0;background:transparent}.editor{min-height:105px;padding:12px;background:white;outline:0;line-height:1.55}.toast{position:fixed;right:24px;bottom:24px;z-index:50;background:#111827;color:white;border-radius:11px;padding:12px 16px;opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}.form-error{min-height:20px;color:var(--red);font-size:.83rem}.login-shell{min-height:100vh;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 20% 15%,#dde5ff,transparent 30%),radial-gradient(circle at 80% 85%,#d8f7eb,transparent 30%),#f3f5f8}.login-card{width:min(390px,100%);padding:34px;background:white;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}.login-card .brand-mark{position:relative;margin-bottom:22px}.login-card h1{margin:0;font-size:1.65rem}.login-card>p{color:var(--muted);margin:7px 0 26px}.login-card label{display:grid;gap:7px;margin:14px 0;font-size:.85rem;font-weight:700}.mobile-only{display:none}
@media(max-width:960px){.deck-grid{grid-template-columns:repeat(2,minmax(220px,1fr))}.summary-grid{grid-template-columns:repeat(2,1fr)}.workspace{padding:0 22px 40px}}
@media(max-width:720px){.app-shell{display:block}.sidebar{position:fixed;left:-255px;width:236px;transition:.2s left;box-shadow:12px 0 40px rgba(0,0,0,.18)}.sidebar.open{left:0}.workspace{padding:0 14px 90px}.topbar{height:84px;margin-bottom:20px}.topbar h1{font-size:1.25rem}.topbar p{display:none}.topbar .primary{font-size:0;padding:10px 12px}.topbar .primary:after{content:"＋";font-size:1.25rem}.mobile-only{display:block}.summary-grid{grid-template-columns:repeat(2,1fr);gap:9px}.metric{padding:14px}.metric strong{font-size:1.35rem}.metric small{display:none}.deck-grid{grid-template-columns:1fr}.toolbar-row{grid-template-columns:1fr auto}.toolbar-row select{grid-column:1/-1}.cards-table th,.cards-table td{padding-top:6px;padding-bottom:6px}.rating-panel{grid-template-columns:1fr}.study-card{min-height:330px;padding:25px 22px}.rating-buttons{gap:6px}.rate{padding:11px 5px}.rate span{display:none}.card-content{font-size:1.15rem}.modal-form{padding:18px}.toast{left:14px;right:14px;bottom:20px;text-align:center}}
.card-dialog{overflow:visible}
.deck-dialog{width:min(650px,calc(100vw - 30px))}.deck-options{border:1px solid var(--line);border-radius:12px;padding:15px}.deck-options legend{padding:0 7px;font-size:.88rem;font-weight:800}.option-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.option-grid small{color:var(--muted);font-weight:400;line-height:1.35}.fsrs-note{margin:14px 0 0;padding:11px;border-radius:9px;background:#f1f4ff;color:#4b5872;font-size:.79rem;line-height:1.45}
@media(max-width:600px){.option-grid{grid-template-columns:1fr}}