/* Shared practice-shell UI: kept separate from feature scripts so every practice route stays recognisably TITU. */
:root{--ink:#17233d;--ink-2:#334866;--paper:#f7f9fc;--surface:#fff;--wash:#f3f7fd;--line:#e6ebf2;--muted:#64748b;--brand:#2563eb;--brand-dark:#1d4ed8;--brand-soft:#eaf2ff;--green:#16a34a;--green-soft:#eaf8ef;--red:#dc2626;--amber:#d97706;--amber-soft:#fff5e7;--radius:12px;--radius-control:8px;--shadow:0 4px 16px rgba(23,35,61,.05);--max:1180px}
body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",Inter,sans-serif;background:var(--paper);color:var(--ink);line-height:1.5}.shell{background:var(--paper)}.topbar{background:rgba(255,255,255,.94);border-color:var(--line);box-shadow:none}.topbar-inner{height:64px;gap:24px}.brand{font-size:19px}.brand-mark{border-radius:9px;background:var(--brand);box-shadow:none}.nav a{color:var(--muted);font-weight:600}.nav a:hover,.nav a.active{color:var(--brand)}.nav a:after{background:var(--brand)}.ghost,.primary,.soft,.danger{display:inline-flex;align-items:center;justify-content:center;min-height:40px;border-radius:var(--radius-control);box-shadow:none}.primary{background:var(--brand)}.primary:hover{background:var(--brand-dark);box-shadow:none}.soft{background:var(--brand-soft);color:var(--brand-dark)}.container{padding-top:32px}.page-title h1,.section-head h2{color:var(--ink);letter-spacing:-.035em}.section-kicker,.eyebrow,.side-label{color:var(--brand);letter-spacing:.1em}.panel,.stat-card,.category-card,.bank-card,.list-row,.plan,.quiz-card{border-color:var(--line);box-shadow:none;border-radius:var(--radius)}.panel{background:var(--surface)}.category-card:hover,.bank-card:hover,.list-row:hover{border-color:#b9d0f8;box-shadow:var(--shadow);transform:translateY(-1px)}.category-icon,.bank-icon,.bank-hero .big-icon{background:var(--brand-soft);color:var(--brand)}.tag{border-radius:999px}.category-meta,.bank-footer{color:var(--text-muted,#64748b)}.practice-mode{min-height:132px;border-radius:var(--radius);border-color:var(--line);background:#fff;color:var(--ink)}.practice-mode:hover{background:#f6f9ff;border-color:#aac8f6;box-shadow:var(--shadow)}.practice-mode.primary-mode{border-color:var(--brand);background:#f3f7ff}.practice-mode b{color:var(--brand)}.chapter-row{min-height:62px;border-color:var(--line);background:#fff}.chapter-row:hover{border-color:#b9d0f8}.quiz-layout{gap:18px}.quiz-card{padding:28px}.quiz-meta{padding-bottom:14px;border-color:var(--line)}.quiz-stem{font-family:inherit;font-weight:650;font-size:20px;line-height:1.85;color:var(--ink)}.question-images img{cursor:zoom-in;border-radius:10px;border-color:var(--line)}.option{min-height:58px;border-radius:10px;border-color:var(--line);color:var(--ink);font-size:15px}.option:hover{border-color:#9ec0f6;background:#f6f9ff}.option.selected{border-color:var(--brand);background:#eff5ff}.letter{width:32px;height:32px;border-color:#d6e1f0;color:#537196}.selected .letter{background:var(--brand);border-color:var(--brand)}.correct .letter{background:var(--green);border-color:var(--green)}.wrong .letter{background:var(--red);border-color:var(--red)}.explanation{border-left:3px solid var(--brand);border-radius:0 8px 8px 0;background:#f4f8ff}.quiz-actions{border-color:var(--line)}.answer-card{position:sticky;top:84px;height:max-content;border-radius:var(--radius)}.qnum{min-height:34px;border-radius:7px}.qnum.current{background:var(--brand)}.modal-backdrop{background:rgba(15,23,42,.42)}.modal{border-radius:14px;box-shadow:0 12px 40px rgba(15,23,42,.18)}.modal .primary{min-height:44px}.form-group label{color:var(--ink)}.form-group input,.form-group textarea,.form-group select{min-height:44px;border-color:#d8e3f0;border-radius:10px}.form-group input:focus,.form-group textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(37,99,235,.12)}.toast{top:20px;bottom:auto;background:#17233d;border-radius:10px}.toast.error{background:var(--danger)}.learning-summary{display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}.learning-summary>div{padding:20px;border-left:1px solid var(--line)}.learning-summary>div:first-child{border-left:0}.learning-summary span{display:block;color:var(--muted);font-size:13px}.learning-summary strong{display:block;margin-top:7px;font-size:27px;color:var(--ink)}.learning-shortcuts{display:flex;gap:10px;margin-top:16px}.learning-shortcuts .soft{gap:7px}.account-menu{overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}.account-menu a,.account-menu button{display:flex;align-items:center;width:100%;min-height:72px;gap:12px;padding:13px 16px;border:0;border-bottom:1px solid var(--line);background:#fff;color:var(--ink);text-align:left}.account-menu a:last-child,.account-menu button:last-child{border-bottom:0}.account-menu a:hover,.account-menu button:hover{background:#f8fbff}.account-menu>a>span,.account-menu>button>span{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:var(--brand-soft);color:var(--brand)}.account-menu strong,.account-menu p{display:block}.account-menu p{margin:3px 0 0;color:var(--muted);font-size:12px}.account-menu b{margin-left:auto;color:var(--text-muted)}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid rgba(37,99,235,.28);outline-offset:2px}@media(max-width:700px){.shell{padding-bottom:calc(74px + env(safe-area-inset-bottom))}.topbar-inner{height:60px}.nav{display:none}.container{padding:20px 16px 34px}.quiz-layout{display:block}.quiz-card{padding:20px 16px 132px}.quiz-stem{font-size:18px;line-height:1.8}.option{min-height:56px;padding:12px}.answer-card{display:none}.quiz-actions{position:fixed;z-index:30;right:0;bottom:0;left:0;margin:0;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(255,255,255,.98);box-shadow:0 -4px 16px rgba(23,35,61,.08)}.quiz-actions .primary,.quiz-actions .ghost{min-height:48px}.mobile-nav{height:64px;padding-bottom:env(safe-area-inset-bottom);background:rgba(255,255,255,.98);border-color:var(--line);box-shadow:0 -4px 16px rgba(23,35,61,.05)}.mobile-nav a{min-height:48px;color:var(--text-muted)}.mobile-nav a.active{color:var(--brand)}.toast{top:calc(12px + env(safe-area-inset-top));bottom:auto}.learning-summary{grid-template-columns:1fr 1fr}.learning-summary>div{padding:16px}.learning-summary>div:nth-child(3){grid-column:1/-1;border-top:1px solid var(--line);border-left:0}.learning-shortcuts{display:grid;grid-template-columns:1fr 1fr}.learning-shortcuts .primary{grid-column:1/-1}.account-card{align-items:flex-start}.account-card h2{font-size:17px}.account-menu{margin-top:0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.image-preview{position:relative;display:grid;max-width:min(1040px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:12px;border-radius:14px;background:#fff;box-shadow:0 18px 60px rgba(15,23,42,.28)}.image-preview .close{position:absolute;z-index:1;top:18px;right:18px;background:rgba(255,255,255,.96);box-shadow:var(--shadow)}.image-preview img{display:block;max-width:100%;max-height:calc(100dvh - 56px);object-fit:contain}