/*知序 · warm paper and forest green*/
:root {
  color-scheme: light;
  --canvas: #f5f4ed; --paper: #fffefa; --paper-soft: #faf9f3; --paper-tint: #f0efe6;
  --ink: #22342d; --ink-muted: #64736a; --ink-faint: #7e8a81;
  --line: #e5e4d9; --line-strong: #d5d8ca; --green: #21483b; --green-strong: #183c31;
  --green-soft: #e9efe3; --lime: #dceaa8; --lime-soft: #eff4dc;
  --red: #9c493f; --red-soft: #faeeea; --amber: #87602b; --amber-soft: #f7f0df;
  --shadow-soft: 0 2px 8px rgba(35,54,43,.035); --shadow-card: 0 12px 32px rgba(35,54,43,.075);
  --shadow-menu: 0 14px 36px rgba(27,48,37,.16); --sidebar-width: 256px;
  --font-body: -apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei UI","Microsoft YaHei","PingFang SC","Noto Sans CJK SC","Source Han Sans SC",Arial,sans-serif;
  --font-mono: "Cascadia Code","SFMono-Regular",Consolas,"Liberation Mono",monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{min-width:320px;min-height:100%;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{min-width:320px;min-height:100%;margin:0;overflow-x:hidden;color:var(--ink);background:var(--canvas);font:16px/1.6 var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
button,input,select,textarea{font:inherit;-webkit-tap-highlight-color:transparent}
button{color:inherit;line-height:1.35}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(55,105,78,.4);outline-offset:3px}
button:disabled,input:disabled,select:disabled,textarea:disabled{cursor:not-allowed}
a{color:inherit}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.app-frame{min-height:100vh;min-height:100svh}
.sidebar{position:fixed;z-index:20;inset:0 auto 0 0;display:flex;flex-direction:column;width:var(--sidebar-width);min-height:0;padding:26px 17px max(16px,env(safe-area-inset-bottom));overflow-y:auto;border-right:1px solid var(--line);background:#fbfaf5}
.brand{display:inline-flex;align-items:center;gap:12px;width:max-content;max-width:100%;margin:0 0 46px 9px;color:inherit;text-decoration:none}
.brand-mark{display:grid;flex:none;width:35px;height:35px;grid-template:repeat(2,1fr)/repeat(2,1fr);gap:3px;padding:5px;border:1px solid #afbaa9;border-radius:10px;transform:rotate(-4deg)}
.brand-mark span{display:block;border-radius:2px;background:var(--green)}
.brand-mark span:nth-child(2){background:#879a6d}.brand-mark span:nth-child(3){background:#a2b487}.brand-mark span:nth-child(4){background:#d5e89a}
.brand-copy,.auth-brand>div{display:flex;min-width:0;flex-direction:column;gap:1px}
.brand-copy strong,.auth-brand strong{font-size:19px;line-height:1.25;font-weight:700;letter-spacing:.06em}
.brand-copy small,.auth-brand small{color:#77857b;font:12px/1.35 var(--font-mono);letter-spacing:.12em}
.sidebar-caption{margin:0 0 10px;padding:0 13px;color:#808b80;font-size:12px;line-height:1.4;font-weight:650;letter-spacing:.1em}
.primary-nav{display:grid;gap:5px}
.nav-item{display:flex;align-items:center;gap:12px;width:100%;min-height:46px;padding:8px 13px;border:0;border-radius:10px;color:#596b60;background:transparent;text-align:left;cursor:pointer;transition:color .16s,background-color .16s,transform .16s}
.nav-item:hover{color:var(--ink);background:#f0f1e9}.nav-item:active{transform:translateY(1px)}
.nav-item.is-active{color:var(--green-strong);background:#eaf0e3;font-weight:650}
.nav-icon{display:grid;flex:none;width:22px;height:24px;place-items:center;color:#738277;font:19px/1 "Segoe UI Symbol","Apple Symbols",var(--font-body);text-align:center}
.nav-item.is-active .nav-icon{color:var(--green)}
.sidebar-bottom{margin-top:auto;padding-top:14px}
.sidebar-note{display:flex;gap:11px;padding:15px 13px;margin:0 0 11px;border-top:1px solid var(--line)}
.note-dot,.eyebrow-dot{display:block;flex:none;width:8px;height:8px;margin-top:6px;border-radius:50%;background:#a9c45d;box-shadow:0 0 0 3px #edf2dc}
.sidebar-note strong{font-size:13px;line-height:1.45;font-weight:650}
.sidebar-note p{max-width:170px;margin:5px 0 0;color:var(--ink-faint);font-size:13px;line-height:1.6}
.profile-button{display:flex;align-items:center;gap:10px;width:100%;min-height:60px;padding:8px 9px;border:1px solid transparent;border-radius:11px;background:transparent;text-align:left;cursor:pointer;transition:border-color .16s,background-color .16s}
.profile-button:hover{border-color:var(--line);background:var(--paper)}
.avatar,.topbar-avatar{display:grid;flex:none;width:36px;height:36px;place-items:center;border-radius:11px;color:var(--green);background:#e7eddc;font-size:15px;line-height:1;font-weight:700}
.profile-copy{display:grid;min-width:0;gap:3px}.profile-copy strong{overflow:hidden;color:var(--ink);font-size:13px;line-height:1.4;font-weight:650;text-overflow:ellipsis;white-space:nowrap}
.profile-copy small{color:var(--ink-faint);font-size:12px;line-height:1.4}.profile-more{margin-left:auto;color:#758279;font-size:19px;line-height:1;letter-spacing:1px}
.app-main{min-width:0;min-height:100vh;min-height:100svh;margin-left:var(--sidebar-width)}
.is-practice .sidebar,.is-practice .topbar{display:none}.is-practice .app-main{margin-left:0}
.topbar{position:relative;z-index:10;display:flex;align-items:center;gap:20px;height:72px;padding:0 clamp(22px,3.2vw,48px);border-bottom:1px solid rgba(224,225,215,.9);background:rgba(251,250,245,.92)}
.breadcrumb{display:flex;align-items:center;gap:9px;min-width:0;color:#89948b;font-size:13px;line-height:1.4;white-space:nowrap}
.breadcrumb strong{overflow:hidden;color:#42564a;font-weight:650;text-overflow:ellipsis}
.global-search{display:flex;align-items:center;gap:8px;width:min(360px,38vw);min-width:0;height:40px;padding:0 10px;margin-left:auto;border:1px solid #e1e3d9;border-radius:10px;color:#6e7d72;background:var(--paper);transition:border-color .16s,box-shadow .16s}
.global-search:focus-within{border-color:#9daf9c;box-shadow:0 0 0 3px rgba(49,93,68,.09)}
.search-icon{display:grid;flex:none;width:26px;height:28px;place-items:center;padding:0;border:0;color:inherit;background:transparent;font-size:23px;line-height:1;cursor:pointer}
.global-search input{width:100%;min-width:0;height:100%;padding:0;border:0;outline:0;color:var(--ink);background:transparent;font-size:14px;line-height:1.4}
.global-search input::placeholder{color:#8c978d}.global-search kbd{flex:none;padding:2px 5px;border:1px solid #e5e6dd;border-radius:5px;color:#7d887e;background:#fbfaf5;font:12px/1.4 var(--font-mono)}
.topbar-avatar,.mobile-menu{display:none}
.main-content{width:min(100%,1540px);min-width:0;min-height:calc(100vh - 72px);min-height:calc(100svh - 72px);padding:40px clamp(22px,3.2vw,48px) 64px;margin:0 auto;outline:none;animation:page-enter .24s ease both}
.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 0 28px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:#68796d;font:12px/1.4 var(--font-mono);letter-spacing:.09em}
.eyebrow-dot{width:7px;height:7px;margin:0;box-shadow:none}
.page-heading h1{margin:9px 0 7px;font-size:clamp(27px,2.6vw,36px);line-height:1.3;font-weight:650;letter-spacing:-.025em;overflow-wrap:anywhere}
.page-heading p{max-width:68ch;margin:0;color:#66766b;font-size:15px;line-height:1.75}
.date-stamp{flex:none;padding:8px 11px;border:1px solid var(--line);border-radius:9px;color:#68766c;background:rgba(255,254,250,.72);font:12px/1.4 var(--font-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin:0 0 34px}
.stat-card{display:flex;min-width:0;min-height:120px;flex-direction:column;justify-content:space-between;padding:17px 18px 15px;border:1px solid var(--line);border-radius:13px;background:rgba(255,254,250,.88);box-shadow:var(--shadow-soft);transition:border-color .18s,box-shadow .18s,transform .18s}
.stat-card.is-actionable{width:100%;margin:0;color:inherit;font:inherit;text-align:left;cursor:pointer;appearance:none}
.stat-card.is-actionable:focus-visible{outline:3px solid rgba(55,105,78,.4);outline-offset:3px}
.stat-card:hover{border-color:#d4dccd;box-shadow:var(--shadow-card);transform:translateY(-1px)}
.stat-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.stat-label{color:#68786d;font-size:14px;line-height:1.45}
.stat-symbol{display:grid;flex:none;width:29px;height:29px;place-items:center;border-radius:9px;color:#526d59;background:#edf1e6;font:15px/1 "Segoe UI Symbol","Apple Symbols",var(--font-body)}
.stat-value{display:flex;align-items:baseline;gap:6px;margin-top:12px;color:#294539;font-size:27px;line-height:1.1;font-weight:650;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.stat-unit{color:#738176;font-size:13px;line-height:1.4;font-weight:450;letter-spacing:0}.stat-foot{margin-top:6px;color:#738176;font-size:13px;line-height:1.5}
.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:15px;margin:0 0 15px}
.section-heading h2{margin:0;font-size:19px;line-height:1.45;font-weight:650;letter-spacing:-.015em}
.section-heading p{margin:5px 0 0;color:#748177;font-size:14px;line-height:1.6}
.text-link{flex:none;padding:4px 0;border:0;color:#46634d;background:transparent;font-size:14px;line-height:1.4;cursor:pointer}
.text-link:hover{color:var(--green-strong);text-decoration:underline;text-underline-offset:3px}
.bank-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.bank-card{position:relative;min-width:0;min-height:184px;padding:18px;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:var(--paper);box-shadow:var(--shadow-soft);cursor:pointer;transition:transform .18s,box-shadow .18s,border-color .18s}
.bank-card:hover:not(.is-disabled){z-index:1;transform:translateY(-3px);border-color:#bfccb9;box-shadow:var(--shadow-card)}
.bank-card:active:not(.is-disabled){transform:translateY(-1px)}.bank-card.is-disabled{color:#738077;background:#f0f0e9;cursor:not-allowed}
.bank-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.bank-icon{display:grid;flex:none;width:37px;height:37px;place-items:center;border-radius:11px;color:#44624c;background:#edf1e6;font:17px/1 "Segoe UI Symbol","Apple Symbols",var(--font-body)}
.bank-card:nth-child(3n+2) .bank-icon{color:#647048;background:#f0f0e1}.bank-card:nth-child(3n) .bank-icon{color:#3f6859;background:#e9f0e9}
.bank-status{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:5px 8px;border-radius:6px;color:#566c42;background:#eff4df;font-size:12px;line-height:1.4}
.bank-status::before{display:block;flex:none;width:6px;height:6px;border-radius:50%;background:#99b845;content:""}
.is-disabled .bank-status{color:#737e75;background:#e8ebe3}.is-disabled .bank-status::before{background:#a6afa1}
.bank-card h3{max-width:100%;margin:15px 0 6px;font-size:17px;line-height:1.45;font-weight:650;overflow-wrap:anywhere}
.bank-count{color:#6b7a70;font-size:14px;line-height:1.5}.bank-count strong{color:#43594a;font:600 13px/1.4 var(--font-mono);font-variant-numeric:tabular-nums}
.bank-progress,.chapter-progress{height:4px;overflow:hidden;border-radius:999px;background:#e9ece2}.bank-progress{margin-top:14px}
.bank-progress span,.chapter-progress span{display:block;height:100%;border-radius:inherit;background:#9db968}
.bank-card-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:9px;color:#738076;font-size:13px;line-height:1.45}
.bank-arrow{color:#527355;font-size:18px;line-height:1}.bank-card.is-disabled .bank-arrow{color:#8d988d}
.dashboard-lower{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(250px,.85fr);gap:15px;margin-top:28px}
.panel{min-width:0;padding:20px;border:1px solid var(--line);border-radius:14px;background:var(--paper);box-shadow:var(--shadow-soft)}
.panel-header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:17px}
.panel-header h2{margin:0;font-size:17px;line-height:1.5;font-weight:650}.panel-header span{color:#748177;font:12px/1.4 var(--font-mono);font-variant-numeric:tabular-nums}
.continue-row{display:flex;align-items:center;gap:13px;min-width:0}.continue-icon{display:grid;flex:none;width:42px;height:42px;place-items:center;border-radius:12px;color:var(--green);background:#edf2e1;font-size:18px;line-height:1}
.continue-copy{min-width:0}.continue-copy strong{display:block;overflow:hidden;font-size:16px;line-height:1.45;font-weight:650;text-overflow:ellipsis;white-space:nowrap}
.continue-copy small{display:block;margin-top:4px;color:#748177;font-size:13px;line-height:1.5}
.continue-button{flex:none;min-height:38px;padding:0 13px;margin-left:auto;border:1px solid #d9e2cf;border-radius:8px;color:var(--green);background:#f6f8ed;font-size:14px;cursor:pointer;transition:border-color .16s,background-color .16s,transform .16s}
.continue-button:hover{border-color:#bdcdb0;background:var(--lime-soft)}.continue-button:active{transform:translateY(1px)}
.continue-empty{padding:8px 0;color:#68776c;font-size:14px;line-height:1.75}
.focus-panel{position:relative;overflow:hidden;border-color:#dce4ce;background:#edf0e3}
.focus-panel::after{position:absolute;top:-30px;right:-14px;width:132px;height:132px;border:1px solid rgba(69,98,71,.14);border-radius:50%;content:""}
.focus-panel h2,.focus-panel p,.focus-mark{position:relative;z-index:1}
.focus-panel h2{margin:0 0 8px;font-size:16px;line-height:1.45;font-weight:650}
.focus-panel p{max-width:34ch;margin:0;color:#5f7063;font-size:14px;line-height:1.75}
.focus-mark{display:inline-block;padding:5px 8px;margin-top:15px;border-radius:5px;color:#4b6249;background:#dfe9c7;font:12px/1.4 var(--font-mono);letter-spacing:.07em}


.detail-top{margin-bottom:22px}
.back-link{display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:0;margin:0 0 13px;border:0;color:#596f60;background:transparent;font-size:14px;line-height:1.4;cursor:pointer}
.back-link:hover{color:var(--green-strong)}
.detail-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.detail-title-group{display:flex;align-items:center;gap:14px;min-width:0}
.detail-title-group h1{margin:0;font-size:clamp(26px,2.5vw,32px);line-height:1.3;font-weight:650;letter-spacing:-.025em;overflow-wrap:anywhere}
.detail-title-group p{margin:6px 0 0;color:#68786d;font-size:14px;line-height:1.6}
.detail-actions{display:flex;flex:none;flex-wrap:wrap;gap:8px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:42px;padding:8px 15px;border:1px solid transparent;border-radius:9px;font-size:14px;line-height:1.35;font-weight:650;text-align:center;cursor:pointer;transition:color .15s,background-color .15s,border-color .15s,transform .15s,box-shadow .15s}
.button:active:not(:disabled){transform:translateY(1px)}
.button-primary{color:#fbfcf7;background:var(--green)}
.button-primary:hover:not(:disabled){background:#2b5a47;box-shadow:0 3px 9px rgba(33,72,59,.12)}
.button-secondary{border-color:#d8dfd5;color:#41594a;background:var(--paper)}
.button-secondary:hover:not(:disabled){border-color:#b8c9b5;background:#f8faf3}
.button-lime{color:#33452e;background:var(--lime)}.button-lime:hover:not(:disabled){background:#d0e28e}
.button:disabled{opacity:.52}
.detail-summary{display:flex;align-items:center;flex-wrap:wrap;gap:12px 16px;padding:15px 17px;margin-bottom:23px;border:1px solid var(--line);border-radius:11px;background:rgba(255,254,250,.72)}
.summary-item{display:flex;align-items:baseline;gap:6px;color:#68786e;font-size:14px;line-height:1.5}
.summary-item strong{color:#425b49;font:600 13px/1.4 var(--font-mono);font-variant-numeric:tabular-nums}
.summary-divider{width:1px;height:19px;background:var(--line-strong)}
.chapter-list{display:grid;gap:9px;min-width:0}
.chapter-row{display:flex;align-items:center;gap:13px;min-width:0;min-height:72px;padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:var(--paper);transition:border-color .16s,background-color .16s,box-shadow .16s}
.chapter-row:hover{border-color:#c3d0c0;background:#fffffb;box-shadow:var(--shadow-soft)}
.chapter-index{display:grid;flex:none;width:33px;height:33px;place-items:center;border-radius:9px;color:#5d7562;background:#edf1e8;font:12px/1 var(--font-mono);font-variant-numeric:tabular-nums}
.chapter-copy{min-width:0;flex:1 1 auto}
.chapter-copy strong{display:block;overflow:hidden;font-size:15px;line-height:1.45;font-weight:650;text-overflow:ellipsis;white-space:nowrap}
.chapter-copy small{display:block;margin-top:4px;color:#738177;font-size:13px;line-height:1.45}
.chapter-row .button{flex:none;min-height:36px;padding:6px 12px;margin-left:auto}
.chapter-row.is-disabled{color:#6f7a70;background:#f0f0e9}
.chapter-row.is-disabled .chapter-index{color:#778379;background:#e7eae1}.chapter-row.is-disabled .button{opacity:.52}
.chapter-progress{flex:none;width:82px;margin-left:3px}.chapter-progress span{background:#9bb468}
.mode-select{display:inline-flex;flex:none;gap:3px;max-width:100%;padding:3px;border:1px solid #dfe4d8;border-radius:9px;background:#f5f6ef}
.mode-select button{min-width:0;min-height:34px;padding:4px 11px;border:0;border-radius:6px;color:#66766b;background:transparent;font-size:14px;line-height:1.3;cursor:pointer}
.mode-select button.is-active{color:var(--green);background:var(--paper);box-shadow:0 1px 3px rgba(25,46,42,.1);font-weight:650}
.collection-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px;color:#68786d;font-size:14px;line-height:1.5}
.collection-filters{display:flex;align-items:flex-end;flex-wrap:wrap;gap:12px;min-width:0;padding:15px;margin:0 0 16px;border:1px solid var(--line);border-radius:12px;background:rgba(255,254,250,.84)}
.filter-field{display:grid;flex:1 1 190px;min-width:min(100%,160px);gap:5px}
.filter-field>span,.filter-field>label{color:#5e7063;font-size:13px;line-height:1.4;font-weight:600}
.filter-select,.filter-field select{width:100%;min-width:0;min-height:40px;padding:7px 34px 7px 10px;border:1px solid #dce1d6;border-radius:8px;color:var(--ink);background-color:var(--paper);font-size:14px;line-height:1.4}
.collection-list{display:grid;gap:9px;min-width:0}
.collection-item{display:flex;align-items:center;gap:13px;min-width:0;min-height:69px;padding:12px 14px;border:1px solid var(--line);border-radius:11px;background:var(--paper);box-shadow:var(--shadow-soft);transition:border-color .16s,box-shadow .16s}
.collection-item:hover{border-color:#c9d3c3;box-shadow:0 5px 16px rgba(35,54,43,.055)}
.collection-num{display:grid;flex:none;width:34px;height:34px;place-items:center;border-radius:9px;color:#536e5a;background:#edf1e8;font:12px/1 var(--font-mono);font-variant-numeric:tabular-nums}
.collection-copy{flex:1 1 auto;min-width:0}
.collection-copy strong{display:-webkit-box;overflow:hidden;color:#283c31;font-size:15px;line-height:1.55;font-weight:600;overflow-wrap:anywhere;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.collection-copy small{display:block;margin-top:4px;color:#6d7c71;font-size:13px;line-height:1.45}
.collection-item .button{flex:none;margin-left:auto}
.table-scroll{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;border:1px solid var(--line);border-radius:11px;background:var(--paper)}
.table-scroll table{width:100%;min-width:640px;border-collapse:collapse}
.table-scroll th,.table-scroll td{padding:11px 13px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle;line-height:1.5}
.table-scroll th{color:#5d6f62;background:#f5f5ee;font-size:13px;font-weight:650}.table-scroll td{color:#34493b;font-size:14px}
.empty-state{padding:54px 20px;border:1px dashed #d2dacf;border-radius:14px;background:rgba(255,254,250,.68);text-align:center}
.empty-art{display:grid;width:48px;height:48px;place-items:center;margin:0 auto 14px;border-radius:15px;color:#58735c;background:#edf1e5;font-size:21px;line-height:1}
.empty-state h2{margin:0 0 8px;font-size:18px;line-height:1.45;font-weight:650}
.empty-state p{max-width:46ch;margin:0 auto 18px;color:#66766b;font-size:15px;line-height:1.75}
.error-panel{padding:15px 16px;border:1px solid #ecd4cf;border-radius:10px;color:#8c463e;background:#fbefeb;font-size:14px;line-height:1.65;overflow-wrap:anywhere}
.error-panel .button{min-height:38px;margin:10px 0 0}
.inline-notice{padding:11px 13px;margin-bottom:14px;border:1px solid #e8dab9;border-radius:9px;color:#755526;background:#f9f3e4;font-size:14px;line-height:1.6}
.loading-stage{padding-top:11px}
.skeleton{position:relative;overflow:hidden;border-radius:8px;background:#e9ebe1}
.skeleton::after{position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.58),transparent);animation:shimmer 1.55s ease-in-out infinite;content:""}
.loading-heading{width:min(230px,70%);height:38px;margin-bottom:11px}
.loading-copy{width:min(320px,88%);height:15px;margin-bottom:29px}
.stat-skeleton{height:120px;border-radius:13px}
.loading-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.bank-skeleton{height:184px;border-radius:14px}
.practice-page{width:min(100%,1480px);min-width:0;padding:22px clamp(0px,1vw,12px) 18px;margin:0 auto}
.is-practice .main-content{width:min(100%,1520px);padding:20px clamp(16px,3vw,42px) 64px}
.practice-top{display:flex;align-items:center;gap:15px;min-width:0;padding-bottom:16px;border-bottom:1px solid var(--line)}
.practice-close{display:grid;flex:none;width:38px;height:38px;place-items:center;border:1px solid var(--line-strong);border-radius:10px;color:#556b5d;background:var(--paper);font-size:19px;line-height:1;cursor:pointer;transition:color .15s,border-color .15s,background-color .15s}
.practice-close:hover{border-color:#bdcbb9;color:var(--green);background:#f5f8ee}
.practice-meta{min-width:0}.practice-meta strong{display:block;overflow:hidden;font-size:15px;line-height:1.45;font-weight:650;text-overflow:ellipsis;white-space:nowrap}
.practice-meta span{display:block;margin-top:3px;color:#6f7e72;font-size:13px;line-height:1.45}
.practice-count{flex:none;margin-left:auto;color:#5f7064;font:13px/1.4 var(--font-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.practice-count strong{color:var(--green);font-size:15px}
.practice-progress{height:4px;overflow:hidden;margin:0 0 23px;border-radius:999px;background:#e4e8de}
.practice-progress span{display:block;height:100%;border-radius:inherit;background:#9fbb59;transition:width .25s ease}
.practice-grid{display:grid;grid-template-columns:minmax(0,1fr) 228px;align-items:start;gap:18px}
.question-card{min-width:0;padding:clamp(22px,3.3vw,38px);border:1px solid var(--line);border-radius:15px;background:var(--paper);box-shadow:var(--shadow-soft);touch-action:pan-y;animation:page-enter .2s ease both}
.question-card.is-entering-next{animation:question-next .22s ease both}
.question-card.is-entering-previous{animation:question-previous .22s ease both}
.question-card-top{display:flex;align-items:center;gap:9px;min-width:0;margin-bottom:19px}
.question-type{flex:none;padding:5px 8px;border-radius:6px;color:#526b4e;background:#eff3e2;font-size:13px;line-height:1.4}
.question-topic{min-width:0;overflow:hidden;color:#6c7b70;font-size:13px;line-height:1.45;text-overflow:ellipsis;white-space:nowrap}
.favorite-button{display:grid;flex:none;width:38px;height:38px;place-items:center;margin-left:auto;border:1px solid transparent;border-radius:9px;color:#718076;background:transparent;font-size:21px;line-height:1;cursor:pointer;transition:color .15s,border-color .15s,background-color .15s}
.favorite-button:hover{border-color:var(--line);background:#fafaf4}.favorite-button.is-favorite{color:#a35f3d}
.question-card h1{margin:0 0 20px;color:#24392d;font-size:clamp(19px,2vw,23px);line-height:1.72;font-weight:650;letter-spacing:-.012em;overflow-wrap:anywhere}
.question-content{color:#293b30;font-size:17px;line-height:1.9;overflow-wrap:anywhere}
.question-content p{margin:0 0 13px}.question-content p:last-child{margin-bottom:0}
.question-content img,.option-body img,.result-explanation img{display:inline-block;max-width:100%;height:auto;vertical-align:middle;border-radius:8px}
.question-images{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 0}
.question-images img{display:block;max-width:min(100%,620px);max-height:min(55vh,440px);object-fit:contain;border:1px solid var(--line);border-radius:10px;background:white}
.choice-help{margin:23px 0 11px;color:#68786d;font-size:14px;line-height:1.55}
.option-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}.option-list li{min-width:0}
.option-label{display:flex;align-items:flex-start;gap:12px;min-height:56px;padding:14px 15px;border:1px solid #e2e5db;border-radius:10px;background:#fffffb;cursor:pointer;transition:border-color .15s,background-color .15s,box-shadow .15s}
.option-label:hover{border-color:#b9c9b5;background:#fbfcf6}
.option-label.is-readonly{cursor:default;background:#f7f8f1}.option-label.is-readonly:hover{border-color:#e2e5db;background:#f7f8f1}
.option-label.is-selected{border-color:#77937a;background:#f0f5e7;box-shadow:inset 0 0 0 1px #77937a}
.option-label.is-correct{border-color:#9ab66a;background:#eff4df}.option-label.is-wrong{border-color:#d29b91;background:#fbefeb}
.option-label input{flex:none;width:17px;height:17px;margin:3px 0 0;accent-color:#4d7454}
.option-letter{display:inline-flex;flex:none;align-items:center;justify-content:center;width:21px;min-height:25px;color:#68776c;font:13px/1.4 var(--font-mono);font-variant-numeric:tabular-nums}
.option-body{min-width:0;color:#34463a;font-size:16px;line-height:1.75;overflow-wrap:anywhere}
.option-body p{margin:0 0 6px}.option-body p:last-child{margin-bottom:0}
.answer-actions{display:flex;align-items:center;flex-wrap:wrap;gap:11px;margin-top:22px}
.answer-hint{color:#68786d;font-size:13px;line-height:1.55}
.answer-result{padding:16px 17px;margin-top:19px;border:1px solid #dce6c6;border-radius:10px;color:#4b6244;background:#f3f6e7}
.answer-result.is-wrong{border-color:#ecd1ca;color:#85463e;background:#fbefeb}
.answer-result-head{margin-bottom:8px;font-size:16px;line-height:1.45;font-weight:700}
.answer-result p{margin:0 0 8px;font-size:15px;line-height:1.65}.result-label{font-weight:650}
.result-explanation{color:#465a4b;font-size:16px;line-height:1.8;overflow-wrap:anywhere}
.answer-result.is-wrong .result-explanation{color:#6f4942}
.readonly-options{margin-top:4px}.subjective-box{margin-top:21px}
.subjective-box>p{margin:0 0 12px;color:#55685b;font-size:15px;line-height:1.75}
.subjective-actions,.subjective-grade{display:flex;flex-wrap:wrap;gap:9px;margin-top:13px}


.navigator{position:sticky;top:20px;min-width:0;padding:16px;border:1px solid var(--line);border-radius:13px;background:var(--paper);box-shadow:var(--shadow-soft)}
.navigator-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}
.navigator-head strong{font-size:14px;line-height:1.45;font-weight:650}.navigator-head span{color:#68776c;font:12px/1.4 var(--font-mono);font-variant-numeric:tabular-nums}
.question-map{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;max-height:min(48vh,420px);overflow:auto;padding:2px 3px 4px 2px;overscroll-behavior:contain}
.question-map button{min-width:0;min-height:34px;aspect-ratio:1;border:1px solid #e2e6dc;border-radius:7px;color:#617267;background:#fafbf6;font:12px/1 var(--font-mono);font-variant-numeric:tabular-nums;cursor:pointer;transition:border-color .15s,color .15s,background-color .15s}
.question-map button:hover{border-color:#a8bba5;color:var(--green)}
.question-map button.is-current{border-color:var(--green);color:#fffefa;background:var(--green)}
.question-map button.is-visited:not(.is-current){border-color:#d6e2b7;color:#526844;background:#eff4e0}
.navigator-legend{display:flex;flex-wrap:wrap;gap:10px;padding-top:11px;margin-top:13px;border-top:1px solid var(--line);color:#68786d;font-size:12px;line-height:1.45}
.legend-item{display:flex;align-items:center;gap:6px}.legend-square{display:block;flex:none;width:8px;height:8px;border-radius:2px;background:#dfe5dc}.legend-square.visited{background:#d6e2b7}
.practice-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:17px}
.practice-nav .button{min-width:110px}
.toast-region{position:fixed;z-index:80;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));display:grid;gap:9px;max-width:calc(100vw - 32px);pointer-events:none}
.toast{max-width:min(380px,calc(100vw - 32px));padding:12px 15px;border:1px solid #d6e1cb;border-radius:10px;color:#3f5a46;background:#fffef9;box-shadow:var(--shadow-menu);font-size:14px;line-height:1.5;overflow-wrap:anywhere;animation:toast-in .2s ease both}
.toast.is-error{border-color:#ebd1ca;color:#85463e;background:#fff9f7}
.account-menu{position:fixed;z-index:50;top:80px;right:clamp(14px,3.2vw,48px);left:auto;bottom:auto;width:min(240px,calc(100vw - 28px));padding:8px;border:1px solid var(--line);border-radius:12px;background:var(--paper);box-shadow:var(--shadow-menu);animation:menu-enter .15s ease both}
.account-menu-user{display:flex;align-items:center;gap:10px;min-width:0;padding:9px;color:var(--ink);font-size:14px;line-height:1.45;font-weight:650;overflow-wrap:anywhere}
.avatar-small{width:30px;height:30px;border-radius:9px;font-size:13px}
.account-menu button{display:flex;align-items:center;gap:9px;width:100%;min-height:42px;padding:9px;border:0;border-radius:8px;color:#874a40;background:transparent;text-align:left;font-size:14px;cursor:pointer}
.account-menu button:hover{background:#faf0ec}
.auth-screen{position:fixed;z-index:100;inset:0;display:grid;grid-template-columns:minmax(300px,.95fr) minmax(0,1.05fr);align-items:stretch;min-width:320px;min-height:100vh;min-height:100svh;overflow:auto;overscroll-behavior-y:contain;color:var(--ink);background:#fbfaf5}
.auth-aside{position:relative;display:flex;min-height:max(100vh,620px);min-height:max(100svh,620px);flex-direction:column;justify-content:space-between;padding:42px clamp(34px,6vw,90px);overflow:hidden;color:#f4f6ec;background:#1d4134}
.auth-aside::before,.auth-aside::after{position:absolute;border:1px solid rgba(227,239,203,.13);border-radius:50%;content:""}
.auth-aside::before{right:-120px;bottom:10%;width:400px;height:400px}.auth-aside::after{right:-24px;bottom:19%;width:274px;height:274px}
.auth-brand{position:relative;z-index:1;display:flex;align-items:center;gap:12px}
.auth-brand strong{color:#f5f7ef}.auth-brand small{color:#b5c3ad}
.brand-mark-large{width:39px;height:39px;border-color:rgba(229,238,218,.4)}
.brand-mark-large span:first-child{background:#eff5dc}.brand-mark-large span:nth-child(2){background:#84a17b}
.brand-mark-large span:nth-child(3){background:#a9bf7e}.brand-mark-large span:nth-child(4){background:var(--lime)}
.auth-message{position:relative;z-index:1;max-width:470px;padding:50px 0;margin:auto 0}
.auth-message .eyebrow{color:#bfccb8}.auth-message .eyebrow-dot{background:var(--lime)}
.auth-message h1{margin:24px 0 16px;color:#f3f5ec;font-size:clamp(34px,4vw,54px);line-height:1.38;font-weight:550;letter-spacing:-.035em}
.auth-message p{max-width:40ch;margin:0;color:#c3cfbf;font-size:16px;line-height:1.8}
.auth-aside-foot{position:relative;z-index:1;display:flex;justify-content:space-between;gap:15px;color:#bdcaba;font:12px/1.45 var(--font-mono);letter-spacing:.06em}
.auth-main{display:grid;min-width:0;min-height:max(100vh,620px);min-height:max(100svh,620px);place-items:center;padding:44px 28px}
.auth-card{width:min(100%,390px)}
.auth-kicker{color:#68796e;font:13px/1.45 var(--font-mono);letter-spacing:.06em}
.auth-card h2{margin:11px 0 8px;color:var(--ink);font-size:30px;line-height:1.35;font-weight:650;letter-spacing:-.025em}
.auth-intro{margin:0 0 28px;color:#68776c;font-size:15px;line-height:1.7}
.field-label{display:block;margin:17px 0 8px;color:#506356;font-size:15px;line-height:1.45;font-weight:650}
.text-field{display:block;width:100%;min-width:0;min-height:46px;padding:9px 12px;border:1px solid #d9dfd4;border-radius:9px;color:var(--ink);background:#fffefa;font-size:16px;line-height:1.45;transition:border-color .15s,box-shadow .15s,background-color .15s}
.text-field:focus{border-color:#8da58e;outline:0;background:white;box-shadow:0 0 0 3px rgba(55,105,78,.1)}
.text-field::placeholder{color:#89948a}select.text-field{padding-right:34px}textarea.text-field{min-height:120px;resize:vertical}
.form-error{padding:10px 11px;margin-top:14px;border:1px solid #ecd2cc;border-radius:8px;color:#88483f;background:#fbefeb;font-size:14px;line-height:1.55;overflow-wrap:anywhere}
.login-submit{width:100%;min-height:48px;margin-top:24px;font-size:15px}
.login-submit span:last-child{margin-left:auto;font-size:18px;line-height:1;font-weight:450}.login-submit span:first-child{margin:0 auto}
.login-submit.is-loading{opacity:.76;pointer-events:none}
.auth-footnote{display:flex;align-items:flex-start;justify-content:center;gap:7px;margin:18px 0 0;color:#728076;font-size:13px;line-height:1.55;text-align:center}
.lock-icon{flex:none;color:#71866f;font-size:14px;line-height:1.5}
.sidebar-scrim{position:fixed;z-index:19;inset:0;background:rgba(25,42,32,.34);animation:scrim-in .16s ease both}
/* Admin pages use the same form and action language as the learner workspace. */
.admin-management{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);align-items:start;gap:16px;min-width:0}
.admin-form,.admin-users{min-width:0;padding:20px;border:1px solid var(--line);border-radius:13px;background:var(--paper);box-shadow:var(--shadow-soft)}
.admin-form{display:grid;gap:11px}.admin-form .field-label{margin:2px 0 -4px}.admin-form .text-field{width:100%}
.admin-form .button{justify-self:start;margin-top:4px}
.admin-form-status{padding:10px 12px;margin:0;border:1px solid #e8dab9;border-radius:8px;color:#755526;background:var(--amber-soft);font-size:14px;line-height:1.55;overflow-wrap:anywhere}
.admin-form-status.is-error{border-color:#ecd2cc;color:#88483f;background:var(--red-soft)}
.admin-form-status.is-success{border-color:#d9e5c6;color:#486044;background:#f0f5e5}
.admin-users{display:grid;gap:9px}.admin-users>:first-child{margin-top:0}
.admin-user-row{display:flex;align-items:center;gap:12px;min-width:0;padding:12px;border:1px solid #e8e8df;border-radius:10px;background:#fffefa}
.admin-user-identity{display:grid;flex:1 1 auto;min-width:0;gap:3px}
.admin-user-name{color:#2c4334;font-size:15px;line-height:1.45;font-weight:650;overflow-wrap:anywhere}
.admin-user-role{color:#68796e;font-size:13px;line-height:1.45}.admin-user-role.is-admin{color:#596f45;font-weight:650}
.admin-user-row .button,.admin-user-row button{flex:none}
@keyframes shimmer{100%{transform:translateX(100%)}}
@keyframes page-enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@keyframes question-next{from{opacity:.55;transform:translateX(14px)}to{opacity:1;transform:translateX(0)}}
@keyframes question-previous{from{opacity:.55;transform:translateX(-14px)}to{opacity:1;transform:translateX(0)}}
@keyframes toast-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes menu-enter{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@keyframes scrim-in{from{opacity:0}to{opacity:1}}


@media (min-width:1600px){
  .topbar,.main-content{padding-right:54px;padding-left:54px}
  .practice-grid{grid-template-columns:minmax(0,1fr) 248px;gap:22px}
}
@media (max-width:1180px){
  .stats-grid,.loading-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bank-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-lower{grid-template-columns:minmax(0,1.3fr) minmax(220px,.9fr)}
  .admin-management{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:900px){
  :root{--sidebar-width:248px}
  .sidebar{z-index:30;width:min(280px,calc(100vw - 54px));transform:translateX(-102%);transition:transform .22s ease;box-shadow:none}
  body.sidebar-open .sidebar{transform:translateX(0);box-shadow:12px 0 40px rgba(19,42,34,.15)}
  body.sidebar-open .sidebar-scrim:not([hidden]){display:block}
  .app-main{margin-left:0}
  .topbar{height:64px;gap:11px;padding:0 18px}
  .mobile-menu{display:grid;flex:none;width:38px;height:38px;place-items:center;border:1px solid var(--line);border-radius:9px;color:#52685a;background:var(--paper);cursor:pointer}
  .menu-lines{position:relative;display:block;width:16px;height:2px;border-radius:2px;background:#52685a}
  .menu-lines::before,.menu-lines::after{position:absolute;left:0;width:16px;height:2px;border-radius:2px;background:#52685a;content:""}
  .menu-lines::before{top:-5px}.menu-lines::after{top:5px}
  .breadcrumb{font-size:14px}
  .global-search{width:min(300px,42vw)}
  .topbar-avatar{display:grid;width:36px;height:36px;border:1px solid transparent;cursor:pointer}
  .topbar-avatar:hover{border-color:#d5ddce}
  .main-content{min-height:calc(100vh - 64px);min-height:calc(100svh - 64px);padding:31px 24px 54px}
  .is-practice .main-content{padding:14px 22px calc(44px + env(safe-area-inset-bottom))}
  .practice-page{padding-top:10px}
  .practice-grid{grid-template-columns:minmax(0,1fr)}
  .navigator{position:static;order:2}
  .question-map{grid-template-columns:repeat(auto-fill,minmax(36px,1fr));max-height:210px}
  .question-map button{min-height:36px}
  .practice-nav{position:sticky;z-index:6;bottom:0;padding:12px 0 max(12px,env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(245,244,237,0),var(--canvas) 28%)}
  .auth-screen{grid-template-columns:minmax(0,1fr)}
  .auth-aside{display:none}
  .auth-main{min-height:max(100vh,560px);min-height:max(100svh,560px);padding:34px 24px}
}
@media (max-width:600px){
  .topbar{gap:9px;padding:0 13px}
  .global-search{flex:1 1 auto;width:auto;max-width:none;height:39px;padding:0 7px}
  .global-search kbd{display:none}.search-icon{width:24px}
  .main-content{padding:26px 16px 46px}
  .page-heading{align-items:flex-start;margin-bottom:22px}
  .page-heading h1{font-size:28px}.page-heading p{font-size:15px}.date-stamp{display:none}
  .stats-grid{gap:10px;margin-bottom:28px}
  .stat-card{min-height:112px;padding:14px}
  .stat-label,.stat-foot{font-size:13px}.stat-value{font-size:25px}
  .bank-grid{gap:10px}.bank-card{min-height:174px;padding:14px}
  .bank-card h3{margin-top:13px;font-size:16px}.bank-status{padding:4px 6px;font-size:12px}
  .dashboard-lower{grid-template-columns:minmax(0,1fr);gap:11px;margin-top:22px}
  .panel{padding:17px}
  .detail-heading{align-items:flex-start;flex-direction:column;gap:15px}
  .detail-title-group h1{font-size:27px}
  .detail-actions{width:100%}.detail-actions .button{flex:1 1 auto}
  .detail-summary{gap:10px 12px;padding:12px}.summary-divider{display:none}
  .chapter-row{flex-wrap:wrap;gap:10px;padding:12px}
  .chapter-copy{flex:1 1 calc(100% - 50px)}.chapter-copy strong{white-space:normal}
  .chapter-progress{display:none}.chapter-row .button{margin-left:43px}
  .mode-select{max-width:100%}.mode-select button{min-width:0;padding-right:9px;padding-left:9px}
  .collection-filters{gap:10px;padding:12px}
  .filter-field{flex-basis:calc(50% - 5px);min-width:min(100%,140px)}
  .collection-item{align-items:flex-start;flex-wrap:wrap;gap:10px;padding:12px}
  .collection-copy{flex:1 1 calc(100% - 48px)}
  .collection-item .button{min-height:38px;margin-left:44px}
  .empty-state{padding:42px 16px}
  .is-practice .main-content{padding:10px 12px calc(40px + env(safe-area-inset-bottom))}
  .practice-page{padding-top:5px}.practice-top{gap:10px;padding-bottom:12px}
  .practice-close{width:36px;height:36px}
  .practice-meta strong{font-size:14px}.practice-meta span{font-size:12px}
  .practice-count{font-size:12px}.practice-count strong{font-size:14px}
  .practice-progress{margin-bottom:15px}
  .question-card{padding:19px 16px;border-radius:13px}
  .question-card h1{font-size:19px;line-height:1.7}
  .question-content{font-size:16px;line-height:1.85}
  .option-label{gap:9px;padding:12px}.option-body{font-size:16px}
  .navigator{padding:14px}
  .question-map{grid-template-columns:repeat(auto-fill,minmax(34px,1fr));max-height:185px}
  .question-map button{min-height:34px}
  .practice-nav{gap:9px}
  .practice-nav .button{flex:1 1 0;min-width:0}
  .auth-main{min-height:max(100vh,520px);min-height:max(100svh,520px);padding:30px 22px}
  .auth-card h2{font-size:28px}
  .account-menu{top:70px;right:12px}
  .admin-form,.admin-users{padding:15px}
  .admin-user-row{flex-wrap:wrap;gap:8px;padding:11px}
  .admin-user-row .button,.admin-user-row button{min-height:38px}
  .toast-region{right:12px;bottom:max(12px,env(safe-area-inset-bottom))}
}
@media (max-width:380px){
  .topbar{gap:7px;padding:0 10px}
  .breadcrumb{flex:none;max-width:73px}.breadcrumb>span{display:none}
  .main-content{padding-right:13px;padding-left:13px}
  .stats-grid{gap:8px}.stat-card{min-height:105px;padding:12px 11px}
  .stat-label,.stat-foot{font-size:12px}
  .bank-grid{gap:8px}.bank-card{min-height:170px;padding:12px 11px}
  .bank-icon{width:32px;height:32px}.bank-card h3{font-size:15px}
  .bank-count,.bank-card-foot{font-size:12px}.bank-count strong{font-size:12px}
  .is-practice .main-content{padding-right:9px;padding-left:9px}
  .question-card{padding:16px 13px}.question-card-top{gap:7px}
  .question-type,.question-topic{font-size:12px}
  .practice-top{gap:8px}.practice-count{font-size:11px}
  .filter-field{flex-basis:100%}
  .mode-select button{font-size:13px}
  .auth-main{padding-right:18px;padding-left:18px}
}
@media (max-height:540px) and (min-width:901px){
  .auth-screen{align-items:start}
  .auth-aside{min-height:620px}
  .auth-main{min-height:620px;place-items:start center;padding-top:38px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}


/* Additional wrappers emitted by the live admin and collection renderers. */
.admin-users-panel{min-width:0;padding:20px;border:1px solid var(--line);border-radius:13px;background:var(--paper);box-shadow:var(--shadow-soft)}
.admin-users-panel>h2{margin:0 0 5px;color:#2d4536;font-size:18px;line-height:1.45;font-weight:650}
.admin-users-panel>p{margin:0 0 16px;color:#68796e;font-size:14px;line-height:1.65}
.admin-users{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
.admin-form-heading h2{margin:0 0 5px;color:#2d4536;font-size:18px;line-height:1.45;font-weight:650}
.admin-form-heading p{margin:0;color:#68796e;font-size:14px;line-height:1.65}
.admin-users-empty{padding:18px 14px;margin:0;border:1px dashed #d5dccf;border-radius:9px;color:#68796e;background:#fafbf5;font-size:14px;line-height:1.6}
.book-review-button,.chapter-review-button{min-height:42px;white-space:normal}
.collection-filters>.button{flex:none;min-height:40px}
@media(max-width:600px){
  .admin-users-panel{padding:15px}
  .collection-filters>.button{width:100%}
  .book-review-button,.chapter-review-button{flex:1 1 100%}
}


/* Keep imported question media and unusually wide tables inside their card. */
.question-content table,.option-body table,.result-explanation table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse;overscroll-behavior-inline:contain}
.question-content pre,.option-body pre,.result-explanation pre{max-width:100%;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere}
.question-content iframe,.question-content video,.option-body iframe,.option-body video{max-width:100%}
@media(max-width:600px){
  .question-images img{max-height:45vh}
}


@media(max-width:380px){
  .topbar{gap:6px;padding-right:8px;padding-left:8px}
  .mobile-menu{width:44px;height:44px}
  .topbar-avatar{flex:none;width:44px;height:44px}
  .breadcrumb{flex:0 1 auto;min-width:0;max-width:68px}
  .breadcrumb strong{min-width:0}
  .global-search{flex:1 1 44px;min-width:44px}
}

.chapter-copy strong{white-space:normal;text-overflow:clip;overflow-wrap:anywhere}