:root{--bg:#f6f8fb;--card:#fff;--ink:#182334;--muted:#667085;--primary:#0f766e;--primary2:#115e59;--soft:#e7f5f3;--line:#e6e9ef;--danger:#b42318;--gold:#e68a2e}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Tahoma,Arial,sans-serif}.topbar{position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:12px 24px}.brand{font-weight:800}.brand span{background:var(--primary);color:#fff;border-radius:10px;padding:5px 8px;margin-left:8px}.topbar nav{display:flex;gap:10px;flex-wrap:wrap}.topbar a{color:var(--ink);text-decoration:none;padding:8px 10px;border-radius:10px}.topbar a:hover{background:var(--soft)}.container{max-width:1350px;margin:0 auto;padding:24px}.hero,.panel,.login-card,.quiz{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:24px;box-shadow:0 12px 30px rgba(16,24,40,.05)}.hero h1{margin:0 0 10px;font-size:30px}.muted{color:var(--muted)}.stats{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:14px;margin:18px 0}.stats div{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px}.stats b{display:block;font-size:30px;color:var(--primary)}.stats span{color:var(--muted);line-height:1.7}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.btn,button{border:0;background:var(--primary);color:#fff;text-decoration:none;padding:12px 18px;border-radius:14px;cursor:pointer;font-weight:700}.btn.secondary,button.secondary{background:var(--gold)}.btn.soft,button.soft{background:#e9eef5;color:var(--ink)}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff;font-family:inherit}textarea{min-height:90px}.login-body{min-height:100vh;display:grid;place-items:center;background:linear-gradient(135deg,#eefcf9,#f7f2e9)}.login-card{width:min(430px,92vw)}.login-card h1{margin-top:0}.login-card label{display:block;margin:14px 0 6px}.login-card button{width:100%;margin:16px 0}.alert{background:#fff1f0;color:var(--danger);padding:10px;border-radius:12px}.filters{display:grid;grid-template-columns:2fr 1fr 1fr;gap:10px}.page-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-top:16px}.page-card{display:block;background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;text-decoration:none;color:var(--ink);transition:.15s}.page-card:hover{transform:translateY(-3px);box-shadow:0 16px 35px rgba(16,24,40,.08)}.page-card img{width:100%;height:260px;object-fit:cover;object-position:top;background:#eee}.page-card div{padding:12px}.tag{display:inline-block;background:var(--soft);color:var(--primary2);border-radius:999px;padding:5px 10px;font-size:13px}.reader-layout{display:grid;grid-template-columns:330px 1fr;gap:18px}.side-panel{background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px;align-self:start;position:sticky;top:80px;max-height:calc(100vh - 100px);overflow:auto}.inline-form{display:inline-block;margin:4px}.note-form{margin-top:12px}.note{background:#f8fafc;border:1px solid var(--line);border-radius:14px;padding:12px;margin:10px 0;line-height:1.8}.reader-main{min-width:0}.reader-toolbar{display:flex;gap:8px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:18px;padding:10px;margin-bottom:10px}.viewer{position:relative;background:#d9dee7;border:1px solid var(--line);border-radius:20px;overflow:auto;height:calc(100vh - 150px);text-align:center}.viewer img{transform-origin:top center;max-width:100%;height:auto;user-select:none}.hotspot{position:absolute;display:grid;place-items:center;text-decoration:none;background:rgba(15,118,110,.22);border:2px solid rgba(15,118,110,.75);color:#fff;font-weight:700;border-radius:10px}.hotspot:hover{background:rgba(15,118,110,.38)}#selection{position:absolute;border:2px dashed #f97316;background:rgba(249,115,22,.14);display:none;pointer-events:none}.modal{position:fixed;inset:0;background:rgba(15,23,42,.55);z-index:50;display:grid;place-items:center;padding:20px}.modal.hidden{display:none}.modal-card{background:#fff;border-radius:22px;padding:24px;width:min(720px,96vw);max-height:92vh;overflow:auto}.options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.chips{display:flex;gap:8px;flex-wrap:wrap}.chips a{background:var(--soft);padding:8px 12px;border-radius:999px;text-decoration:none;color:var(--primary2)}.quiz-list{display:grid;gap:16px}.quiz h2{line-height:1.8}.choice{display:grid;grid-template-columns:52px 1fr;gap:10px;align-items:center;border:1px solid var(--line);border-radius:14px;margin:8px 0;padding:8px}.choice button{height:42px;padding:0}.feedback{margin-top:12px;padding:12px;border-radius:14px;display:none}.feedback.ok{display:block;background:#ecfdf3;color:#027a48}.feedback.bad{display:block;background:#fff1f0;color:#b42318}.empty{text-align:center}@media(max-width:900px){.topbar{display:block}.topbar nav{margin-top:10px}.stats{grid-template-columns:repeat(2,1fr)}.filters{grid-template-columns:1fr}.reader-layout{grid-template-columns:1fr}.side-panel{position:static;max-height:none}.viewer{height:72vh}.page-card img{height:210px}}
.exam-hero{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;background:linear-gradient(135deg,#ffffff,#edf7f5);border:1px solid var(--line);border-radius:26px;padding:28px;margin-bottom:18px}.eyebrow{color:var(--primary);font-weight:800;margin:0 0 8px}.exam-actions{display:flex;gap:10px;flex-wrap:wrap}.mode-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.mode-card{display:block;background:#fff;border:1px solid var(--line);border-radius:20px;padding:18px;text-decoration:none;color:var(--ink)}.mode-card b{display:block;font-size:20px;margin-bottom:8px}.mode-card span{color:var(--muted);line-height:1.8}.page-grid.compact{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}.page-grid.compact .page-card img{height:190px}.exam-shell{display:grid;grid-template-columns:280px 1fr;gap:18px;align-items:start}.exam-info{position:sticky;top:88px;background:#fff;border:1px solid var(--line);border-radius:24px;padding:18px;box-shadow:0 12px 30px rgba(16,24,40,.05)}.exam-logo{width:64px;height:64px;display:grid;place-items:center;background:var(--primary);color:#fff;border-radius:18px;font-size:24px;font-weight:900}.meter{height:12px;background:#edf2f7;border-radius:99px;overflow:hidden;margin:16px 0}.meter span{display:block;height:100%;width:0;background:var(--primary);transition:.2s}.exam-stat{display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:16px;padding:12px;margin:10px 0}.exam-stat b{font-size:23px;color:var(--primary)}.exam-stat span{color:var(--muted)}.full{display:block;text-align:center}.admin-hint{background:#fff7ed;color:#9a3412;border-radius:16px;padding:12px;line-height:1.8}.exam-main{min-width:0}.exam-topline{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--line);border-radius:22px;padding:14px 18px;margin-bottom:12px}.mini-actions{display:flex;gap:8px}.question-card-real{background:#fff;border:1px solid var(--line);border-radius:26px;padding:18px;box-shadow:0 16px 42px rgba(16,24,40,.07)}.crop-box{position:relative;overflow:hidden;background:#f1f5f9;border:1px solid var(--line);border-radius:22px;margin:auto;max-width:860px;min-height:220px}.crop-box img{display:block;max-width:none;height:auto;transform-origin:top right;user-select:none}.choices-real{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px auto;max-width:860px}.choices-real button{height:64px;font-size:25px;border-radius:18px;background:#f8fafc;color:var(--ink);border:2px solid var(--line)}.choices-real button:hover{border-color:var(--primary);background:var(--soft)}.feedback-real{max-width:860px;margin:12px auto 0;padding:16px;border-radius:18px;line-height:1.9}.feedback-real.ok{background:#ecfdf3;color:#027a48}.feedback-real.bad{background:#fff1f0;color:#b42318}.feedback-real.wait{background:#fffbeb;color:#92400e}.solution-box{max-width:860px;margin:12px auto;background:#f8fafc;border:1px solid var(--line);border-radius:18px;padding:16px;line-height:1.9}.explain-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}.admin-answer-box{margin-top:14px;background:#fff;border:1px dashed var(--primary);border-radius:22px;padding:18px}.admin-answer-box label{display:block;margin-top:10px;margin-bottom:6px}.hidden{display:none!important}.lesson-text{max-width:860px;margin:12px auto;padding:18px;background:#f8fafc;border-radius:18px;line-height:2}@media(max-width:950px){.exam-hero,.exam-shell{grid-template-columns:1fr}.exam-info{position:static}.mode-grid{grid-template-columns:1fr}.choices-real{grid-template-columns:repeat(2,1fr)}.exam-topline{display:block}.mini-actions{margin-top:10px}}
.text-question{background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:18px;margin-bottom:14px;line-height:2;font-size:18px;white-space:normal}
.text-question h3{margin:0 0 8px;color:#0f766e;font-size:16px}.text-question p{margin:0}.hidden{display:none!important}
.crop-box.native-crop{background:none!important;min-height:180px;height:auto;display:flex;align-items:center;justify-content:center;padding:10px}.crop-box.native-crop img{opacity:1!important;max-width:100%;height:auto;border-radius:12px;box-shadow:0 6px 18px rgba(15,23,42,.08)}
.choices-real{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:18px}.choices-real button{min-height:62px;border:1px solid #d8dee6;background:#fff;border-radius:14px;font-size:18px;display:flex;gap:10px;align-items:center;justify-content:center;cursor:pointer}.choices-real button:hover{border-color:#0f766e;background:#ecfdf5}.choices-real button b{font-size:22px;color:#0f766e}.choices-real button span{font-size:16px;color:#111827}
.extract-status{font-size:13px;color:#7c2d12;background:#fff7ed;border-radius:12px;padding:10px;margin-top:10px;line-height:1.7}.ok-note{font-size:13px;color:#065f46;background:#ecfdf5;border-radius:12px;padding:10px;line-height:1.7}.btn.full{width:100%;display:block;text-align:center;margin-top:8px}
.feedback-real.wait{background:#fffbeb;border-color:#f59e0b;color:#92400e}
@media(max-width:900px){.choices-real{grid-template-columns:1fr 1fr}.text-question{font-size:16px}.exam-shell{display:block}.exam-info{margin-bottom:16px}}