/* Mathicians portal: MOBIS shell, readable learning content. */
:root{--navy:#071b35;--navy-soft:#0d294d;--blue:#075cbd;--cyan:#22a9e0;--ink:#152033;--muted:#677387;--line:#dbe2ea;--surface:#f3f6f9;--sidebar:264px;font-family:"Segoe UI","Noto Sans KR",Arial,sans-serif;color:var(--ink);font-size:14px}
*{box-sizing:border-box}body{margin:0;background:var(--surface)}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,summary,input,select{touch-action:manipulation}button,summary{cursor:pointer}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}input:focus,select:focus{outline:2px solid #075cbd55;outline-offset:1px}
.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);padding:26px 18px 18px;display:flex;flex-direction:column;background:var(--navy);color:white;z-index:40;transition:width .2s}
.sidebar-top{display:flex;align-items:center;gap:8px;min-height:36px}.brand{display:flex;align-items:center;gap:10px;min-width:0}.brand strong{font-size:20px;letter-spacing:-.6px}.brand-mark{display:grid;place-items:center;width:32px;height:32px;border-radius:5px;color:white;background:var(--blue);font-size:21px;font-weight:800}.menu-toggle{width:32px;height:34px;flex-shrink:0;border:1px solid #b2c3d34d;border-radius:4px;background:#ffffff0c;color:inherit;font-size:24px}.sidebar-toggle{margin-left:auto}.sidebar-site{margin:22px -18px 18px;padding:16px 20px;border-block:1px solid #ffffff14;color:#aebed0;font-size:13px}
.side-nav{flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#29496d transparent}.side-nav>a{display:flex;gap:12px;align-items:center;min-height:44px;margin:4px 0;padding:10px 12px;border-radius:5px;color:#aebed0}.side-nav>a.active,.side-nav>a:hover{background:var(--navy-soft);color:white}.side-nav>a.active{box-shadow:inset 3px 0 var(--cyan)}.nav-icon{width:22px;flex-shrink:0;text-align:center;color:#8eacce;font-size:21px}.nav-label{font-size:14px;font-weight:600}.nav-caption{margin:26px 12px 10px;color:#8194aa;font-size:12px}
.nav-tree summary{display:flex;align-items:center;justify-content:space-between;gap:8px;list-style:none;padding:10px 12px;color:#b8c9dc;font-size:13px;border-radius:4px}.nav-tree summary::-webkit-details-marker{display:none}.nav-tree summary:after{content:"›";transform:rotate(0);font-size:17px}.nav-tree details[open]>summary:after,.nav-tree[open]>summary:after{transform:rotate(90deg)}.nav-tree summary:hover{background:var(--navy-soft)}.school-tree{margin-left:8px}.course-tree{margin-left:10px}.unit-link{display:block;padding:9px 10px 9px 20px;color:#9db3ca;font-size:12px;line-height:1.5;border-left:1px solid #28405a;margin-left:12px}.unit-link.active,.unit-link:hover{background:var(--navy-soft);color:#fff}.unit-link.active{border-left:2px solid var(--cyan)}.expand-curriculum{display:none}
.sidebar-user{display:flex;align-items:center;gap:10px;padding-top:16px;margin-top:16px;border-top:1px solid #ffffff20}.avatar{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;border-radius:50%;background:var(--blue);font-weight:700}.sidebar-user>div{min-width:0;flex:1}.sidebar-user strong{display:block;overflow-wrap:anywhere;font-size:13px}.sidebar-user small{display:block;margin-top:4px;color:#9bb0c7;font-size:12px}.sidebar-user button{border:0;background:none;color:white;font-size:20px}
.app-shell{margin-left:var(--sidebar);min-height:100vh;transition:margin .2s}.app-header{height:66px;padding:0 32px;display:flex;align-items:center;gap:16px;background:white;border-bottom:1px solid var(--line)}.global-search{display:flex;align-items:center;gap:8px;width:min(520px,75%);height:38px;border:1px solid var(--line);border-radius:5px;background:#f8fafb}.global-search>span{padding-left:12px;font-size:22px;color:var(--muted)}.global-search input{width:100%;min-width:0;border:0;background:transparent;padding:8px;font-size:13px}.global-search button{align-self:stretch;border:0;border-left:1px solid var(--line);background:#edf5fc;color:var(--blue);padding:0 13px;white-space:nowrap}.header-date{margin-left:auto;font-size:12px;color:var(--muted)}.app-content{max-width:1600px;margin:auto;padding:32px clamp(20px,3vw,46px) 56px}.mobile-toggle,.menu-backdrop{display:none}
.page-heading,.page-header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.page-heading h1,.page-header h1{font-size:28px;letter-spacing:-.8px;margin:0}.page-heading p,.page-header p{font-size:13px;color:var(--muted);margin:8px 0 0}.eyebrow{display:none}.heading-actions{display:flex;gap:8px}.admin-button,.secondary-button,.solid-button,.button{display:inline-flex;align-items:center;justify-content:center;min-height:39px;padding:9px 15px;border:1px solid var(--blue);border-radius:4px;color:#fff;background:var(--blue);font-size:13px;font-weight:600;cursor:pointer}.secondary-button{border-color:var(--line);color:var(--ink);background:white}.metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(160px,100%),1fr));gap:14px;margin-bottom:26px}.metric-card{min-width:0;display:flex;gap:12px;padding:20px 16px;border:1px solid var(--line);border-top:3px solid var(--blue);border-radius:6px;background:white}.metric-icon{display:grid;place-items:center;width:32px;height:32px;flex-shrink:0;border-radius:5px;background:#eaf3fd;color:var(--blue);font-size:18px}.metric-icon.green{background:#e4f5ed;color:#237c55}.metric-icon.red{background:#fdeaea;color:#ad3333}.metric-icon.amber{background:#fff4df;color:#a26b14}.metric-icon.violet{background:#f0edfc;color:#6953bb}.metric-card p{margin:0 0 10px;color:var(--muted);font-size:12px}.metric-card strong{display:block;font-size:29px}.metric-card small{display:block;margin-top:6px;color:var(--muted);font-size:12px}
.command-header{display:flex;justify-content:space-between;align-items:center;margin:28px 0 14px}.command-header h2{font-size:20px;margin:0}.command-header>span{font-size:12px;color:var(--muted)}.panel-kicker{display:none}.module-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:15px}.module-card{min-width:0;padding:20px;border:1px solid var(--line);border-top:3px solid var(--blue);border-radius:6px;background:white;display:flex;flex-direction:column}.module-card.high{border-top-color:#7258b1}.module-card:hover{border-color:#86add4;box-shadow:0 4px 14px #1520330b}.module-card header{display:flex;align-items:center;gap:10px}.module-card header>span{width:32px;height:32px;display:grid;place-items:center;border-radius:5px;color:var(--blue);background:#eaf3fd}.module-card header>b{font-size:15px;flex:1}.module-card header>i{font-style:normal;font-size:12px;color:var(--blue)}.module-card>h2{font-size:27px;margin:18px 0 4px}.module-card>p{font-size:12px;color:var(--muted);margin:0 0 18px}.module-card footer{display:flex;gap:12px;justify-content:space-between;margin-top:auto;padding-top:12px;border-top:1px solid #edf0f3;font-size:12px;line-height:1.6}.module-card footer strong{color:#358060;white-space:nowrap}.module-card footer span{color:var(--muted);overflow-wrap:anywhere}
.grid-panel,.panel,.question-card,.answer-result,.auth-card{border:1px solid var(--line);border-radius:6px;background:white;min-width:0}.grid-toolbar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:18px}.grid-toolbar p{margin:0;font-size:13px}.grid-search{display:flex;align-items:center;flex:1;min-width:190px;height:38px;border:1px solid var(--line);border-radius:4px}.grid-search>span{padding-left:10px}.grid-search input{width:100%;min-width:0;padding:8px;border:0;font-size:13px}.grid-search button{height:100%;padding:0 14px;border:0;color:white;background:var(--blue);white-space:nowrap}.grid-search a{padding:0 10px;white-space:nowrap}.course-filter{max-width:100%;height:38px;padding:0 10px;border:1px solid var(--line);border-radius:4px;background:white}.table-wrap{overflow-x:auto}.data-table{width:100%;border-collapse:collapse;font-size:13px}.data-table th{padding:12px 14px;background:#f7f9fb;color:#65758b;font-size:12px;text-align:left;white-space:nowrap}.data-table td{padding:15px 14px;border-top:1px solid #edf0f3;line-height:1.6}.data-table td strong,.data-table td small{display:block}.data-table td small{margin-top:4px;color:var(--muted);font-size:12px}.data-table tbody tr:hover{background:#f8fbfe}.data-table a{color:var(--blue);font-weight:600}.status,.difficulty{display:inline-block;padding:3px 8px;border-radius:4px;background:#edf5fc;color:var(--blue);font-size:12px;white-space:nowrap}.mono{font-family:Consolas,monospace;font-size:12px}.empty-state{text-align:center;padding:36px!important;color:var(--muted);font-size:13px}.empty-state strong{display:block;margin-bottom:12px}.empty-state a{color:var(--blue)}
.problem-breadcrumb{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:20px;color:var(--muted);font-size:13px}.problem-breadcrumb a{color:var(--blue)}.solve-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;max-width:1050px}.solve-layout:has(.answer-result){grid-template-columns:minmax(0,1fr) minmax(240px,.45fr)}.question-card{padding:28px}.question-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.question-card h1{font-size:24px;margin:25px 0}.question-body{font-size:18px;line-height:1.9;overflow-wrap:anywhere}.answer-form{margin-top:28px}.answer-form fieldset{padding:0;margin:0;border:0;display:grid;gap:10px}.choice{display:flex;align-items:center;gap:12px;padding:15px;border:1px solid var(--line);border-radius:5px;cursor:pointer}.choice:has(input:checked){border-color:var(--blue);background:#edf5fc}.choice input{accent-color:var(--blue)}.choice>span{color:var(--muted)}.choice b{font-size:16px;font-weight:500}.answer-form>input{width:100%;min-height:44px;border:1px solid var(--line);padding:10px}.full,.wide{width:100%;margin-top:18px}.answer-result{padding:24px;align-self:start;font-size:15px;line-height:1.8}.answer-result.correct>strong{color:#237c55}.answer-result.incorrect>strong{color:#ad3333}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:20px}.stats article{padding:22px;border:1px solid var(--line);border-top:3px solid var(--blue);border-radius:6px;background:white}.stats span{display:block;color:var(--muted);margin-bottom:10px}.stats strong{font-size:30px}.stats small{margin-left:5px}.dashboard-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:20px}.panel{padding:22px}.panel-head{display:flex;justify-content:space-between;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--line)}.panel-head h2{font-size:18px;margin:0}.panel-head span{font-size:12px;color:var(--muted)}.progress-row{display:grid;grid-template-columns:minmax(0,1fr) 100px 44px;align-items:center;gap:12px;padding:18px 0;border-bottom:1px solid #edf0f3;font-size:13px}.progress-row small,.wrong-row small{display:block;color:var(--muted);font-size:12px;margin-top:5px}.progress-bar{height:6px;border-radius:5px;background:#e8edf2}.progress-bar i{display:block;height:100%;background:var(--blue);border-radius:inherit}.wrong-row{display:flex;justify-content:space-between;padding:16px 0;border-bottom:1px solid #edf0f3;font-size:13px}
.auth-shell{display:grid;place-items:center;min-height:70vh}.auth-card{width:min(460px,100%);padding:32px}.auth-card h1{margin:0;font-size:26px}.auth-card>p{color:var(--muted)}.auth-card form{display:grid;gap:8px;margin-top:24px}.auth-card label{margin-top:10px;font-weight:600}.auth-card input{width:100%;height:44px;border:1px solid var(--line);border-radius:4px;padding:10px}.auth-card small{font-size:12px;color:var(--muted);line-height:1.7}.form-error{color:#ad3333}.flash-message{padding:14px;background:#e9f7f0;color:#20734f;margin-bottom:20px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@media(min-width:801px){.sidebar-collapsed{--sidebar:76px}.sidebar-collapsed .sidebar{padding-inline:14px}.sidebar-collapsed .brand,.sidebar-collapsed .sidebar-site,.sidebar-collapsed .nav-label,.sidebar-collapsed .curriculum-menu,.sidebar-collapsed .sidebar-user>div,.sidebar-collapsed .sidebar-user form{display:none}.sidebar-collapsed .sidebar-toggle{margin:auto}.sidebar-collapsed .side-nav{margin-top:24px}.sidebar-collapsed .side-nav>a{justify-content:center;padding:10px 0}.sidebar-collapsed .expand-curriculum{display:block;width:100%;padding:10px;border:0;background:transparent;color:#aebed0;font-size:22px}.sidebar-collapsed .sidebar-user{justify-content:center}}
@media(max-width:1100px){.dashboard-layout{grid-template-columns:1fr}.solve-layout:has(.answer-result){grid-template-columns:1fr}.metric-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:800px){.sidebar{transform:translateX(-100%);width:264px;transition:transform .2s}.menu-open .sidebar{transform:none}.menu-open{overflow:hidden}.menu-open .menu-backdrop{display:block;position:fixed;inset:0;background:#071b3580;border:0;z-index:30}.app-shell{margin-left:0}.mobile-toggle{display:block;color:var(--ink);font-size:20px}.app-header{padding:0 18px;gap:12px}.global-search{width:100%}.header-date{display:none}.app-content{padding:24px 18px 40px}.page-heading h1,.page-header h1{font-size:24px}.page-heading,.page-header{flex-wrap:wrap}.data-table{min-width:740px}}
@media(max-width:520px){.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric-card{padding:15px 12px;gap:8px}.metric-icon{display:none}.stats{grid-template-columns:1fr}.module-grid{grid-template-columns:1fr}.command-header>span{display:none}.grid-search{min-width:100%}.course-filter{width:100%}.question-card,.auth-card{padding:22px}.progress-row{grid-template-columns:minmax(0,1fr) 44px}.progress-bar{grid-column:1/-1;grid-row:2}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}


.practice-shell{max-width:820px;margin:0 auto}.practice-heading{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:26px;color:var(--muted)}.practice-heading a{color:var(--blue)}.practice-progress{display:grid;gap:12px;margin-bottom:24px;font-weight:600}.practice-progress progress{width:100%;height:14px;accent-color:#218553}.practice-feedback{padding:20px;border-radius:8px;margin:24px 0;line-height:1.8;overflow-wrap:anywhere}.practice-feedback h2{margin:0;font-size:21px}.practice-feedback.is-correct{background:#e7f5ed;border:1px solid #8ac8a3;color:#175737}.practice-feedback.is-incorrect{background:#fff4e5;border:1px solid #e6bf83;color:#704608}.practice-next{margin-top:22px}.practice-shell .solid-button{min-height:48px;font-size:16px}.practice-shell .choice:has(input:checked){border-color:var(--blue);background:#edf5fc}.practice-shell .katex-display{overflow:auto}.practice-complete{text-align:center}.practice-label{color:#237c55;font-weight:700}.practice-scores{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:30px 0}.practice-scores div{background:var(--surface);border-radius:8px;padding:20px 8px}.practice-scores strong,.practice-scores span{display:block}.practice-scores strong{font-size:26px;margin-bottom:8px}.practice-scores span{font-size:12px;color:var(--muted)}.practice-complete .secondary-button{margin-top:14px}.practice-launch{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 24px}.practice-launch>span{font-size:13px;color:var(--muted)}
@media(max-width:520px){.practice-scores{grid-template-columns:1fr}.practice-heading{font-size:12px}.practice-shell .question-card{padding:20px 16px}}
.auth-layout{display:grid;grid-template-columns:minmax(300px,42%) 1fr;min-height:100vh}
.auth-brand{padding:48px;display:flex;flex-direction:column;justify-content:space-between;color:white;background:var(--navy)}
.auth-brand h1{font-size:38px}.auth-brand p,.auth-brand small{color:#9db3ca}
.auth-main{display:grid;place-items:center;padding:32px}
.lesson-tabs{display:flex;gap:24px;border-bottom:1px solid var(--line);margin-bottom:22px}
.lesson-tabs a{padding:12px 0;color:var(--blue);font-weight:600}
.lesson-tabs span{background:#eaf3fd;padding:2px 7px;border-radius:10px}
.lesson-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;align-items:start}
.lesson-copy{margin-bottom:20px;line-height:1.9;font-size:16px;overflow-wrap:anywhere;scroll-margin-top:20px}
.lesson-goal{margin-top:20px;padding:16px;background:#edf5fc;border-left:3px solid var(--blue)}
.lesson-goal p{margin:6px 0}.lesson-copy .katex-display{overflow-x:auto;overflow-y:hidden}
@media(max-width:1100px){.lesson-layout{grid-template-columns:minmax(0,1fr)}}
@media(max-width:800px){.auth-layout{grid-template-columns:1fr}.auth-brand{padding:24px}.auth-brand>div,.auth-brand>small{display:none}.auth-main{padding:24px 18px}.auth-card{width:100%}}

