:root{--bg:#050b12;--panel:#0a1521;--panel2:#0d1b2a;--line:#203448;--text:#edf6ff;--muted:#8ea5b9;--accent:#17c7e8;--accent2:#0f91c2;--ok:#2dd477;--bad:#ff5b62;--bone:#e7dfcf}
*{box-sizing:border-box}html,body{height:100%;margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial;background:var(--bg);color:var(--text)}button,input{font:inherit}.app{height:100%;display:grid;grid-template-columns:245px minmax(0,1fr) 310px;overflow:hidden}.side{background:linear-gradient(180deg,#091522,#07111b);padding:18px;overflow:auto}.left{border-right:1px solid var(--line)}.right{border-left:1px solid var(--line)}
.brand{display:flex;gap:11px;align-items:center;margin-bottom:20px}.logo{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent2));display:grid;place-items:center;color:#021017;font-weight:900;font-size:19px;box-shadow:0 8px 30px #0fb6dc28}.logo img{width:100%;height:100%;object-fit:cover;border-radius:11px}.brand h1{font-size:17px;margin:0}.brand small{display:block;color:var(--muted);margin-top:2px}.label{font-size:10px;color:var(--muted);letter-spacing:.14em;text-transform:uppercase;margin:16px 0 8px}.stack{display:grid;gap:7px}.btn{width:100%;text-align:left;border:1px solid var(--line);background:#0b1a29;color:var(--text);padding:9px 11px;border-radius:10px;cursor:pointer;transition:.15s}.btn:hover{border-color:#2e536e}.btn.active{border-color:#168aab;background:#0c2a3a;color:#d8faff}.btn.small{padding:7px 9px;font-size:12px}.action{text-align:center;background:#0c2735;border-color:#176277}.viewer{position:relative;min-width:0;background:radial-gradient(circle at 50% 38%,#14273b 0,#06101a 64%)}#canvas{width:100%;height:100%;display:block;outline:none}.topbar{position:absolute;z-index:5;left:16px;right:16px;top:15px;display:flex;gap:9px;pointer-events:none}.search{position:relative;flex:1;max-width:520px;pointer-events:auto}.search input{width:100%;background:#081522e8;border:1px solid var(--line);color:var(--text);padding:12px 14px;border-radius:12px;outline:none;backdrop-filter:blur(8px)}.search input:focus{border-color:#1aa9c9}.results{display:none;position:absolute;top:48px;left:0;right:0;max-height:330px;overflow:auto;background:#091624f7;border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 45px #0008}.result{padding:10px 12px;border-bottom:1px solid #17283a;cursor:pointer}.result:hover{background:#10263a}.result b{display:block;font-size:13px}.result span{font-size:11px;color:var(--muted)}.views{display:flex;gap:5px;pointer-events:auto}.views button{border:1px solid var(--line);background:#081522e8;color:#dcecf8;border-radius:10px;padding:9px 10px;cursor:pointer}.hint{position:absolute;left:16px;bottom:15px;font-size:11px;color:#91a8ba;background:#06111cc9;border:1px solid #182b3d;padding:7px 9px;border-radius:9px}.status{position:absolute;inset:0;display:grid;place-items:center;z-index:15;background:radial-gradient(circle at 50% 40%,#10263b,#050b12);transition:.35s}.status.hide{opacity:0;pointer-events:none}.loader{text-align:center;max-width:360px}.spinner{width:46px;height:46px;border-radius:50%;border:3px solid #1c3449;border-top-color:var(--accent);margin:0 auto 14px;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loader strong{display:block;font-size:17px}.loader p{color:var(--muted);font-size:12px;line-height:1.55}.progress{height:4px;background:#142638;border-radius:99px;overflow:hidden;margin-top:12px}.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--accent2),var(--accent));transition:.2s}.quizbox{position:absolute;z-index:6;top:74px;left:50%;transform:translateX(-50%);min-width:330px;max-width:580px;text-align:center;background:#081522eb;border:1px solid var(--line);border-radius:14px;padding:13px 17px;display:none;backdrop-filter:blur(8px)}.quizbox .q{font-weight:750}.quizbox .feedback{min-height:18px;margin-top:5px;font-size:12px}.card{background:linear-gradient(180deg,#0d1d2c,#091623);border:1px solid var(--line);border-radius:14px;padding:15px;margin-bottom:13px}.eyebrow{text-transform:uppercase;font-size:10px;letter-spacing:.13em;color:var(--accent)}.name{font-size:20px;font-weight:800;line-height:1.15;margin:7px 0 5px}.latin{color:#c0d0df;font-style:italic}.raw{color:#72889d;font-size:10px;margin-top:8px;word-break:break-word}.meta{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:13px}.meta>div{background:#08131f;border:1px solid #172a3c;border-radius:9px;padding:8px}.meta small{display:block;color:var(--muted);font-size:9px}.meta b{font-size:11px}.empty{color:var(--muted);font-size:13px;line-height:1.5}.legend{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:11px;margin-top:8px}.dot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px #17c7e899}.credit{font-size:10px;line-height:1.45;color:#678095;margin-top:16px}.pill{display:inline-block;padding:4px 7px;border-radius:99px;background:#0b2634;border:1px solid #175068;color:#bceffc;font-size:10px;margin-top:10px}.toggle{display:flex;gap:7px;align-items:center;color:#b8c8d6;font-size:12px;margin:9px 0}.toggle input{accent-color:var(--accent)}.detail-actions{display:grid;gap:8px;margin-top:12px}.encyclopedia-btn{display:block;width:100%;margin-top:10px;text-align:center;text-decoration:none;border:1px solid #2a5970;background:#0b2130;color:#e7f6ff;padding:10px 12px;border-radius:10px;font-size:12px;font-weight:700;transition:.15s}.encyclopedia-btn:hover{border-color:#38a6c5;background:#0d2a3b}.encyclopedia-btn:focus{outline:2px solid var(--accent);outline-offset:2px}.detail-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;border:1px solid #24657a;background:#0a2632;border-radius:999px;font-size:10px;color:#bdeffc}.structure-list{display:grid;gap:6px;margin-top:12px}.structure-item{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid #183044;background:#071522;border-radius:9px;font-size:11px}.structure-item i{width:9px;height:9px;border-radius:50%;background:#f2bd4e;box-shadow:0 0 10px #f2bd4e66;flex:0 0 auto}.detail-banner{position:absolute;z-index:6;left:50%;transform:translateX(-50%);bottom:16px;display:none;gap:8px;align-items:center;background:#071522e8;border:1px solid #24516a;border-radius:12px;padding:8px 10px;backdrop-filter:blur(8px)}.detail-banner button{border:1px solid #2a5970;background:#0c2735;color:#e7f6ff;border-radius:8px;padding:7px 10px;cursor:pointer}.detail-banner strong{font-size:12px}.markerLabel{position:absolute;pointer-events:none;z-index:7;padding:4px 7px;border-radius:7px;background:#071522e8;border:1px solid #8a6a2b;color:#ffe6a5;font-size:10px;white-space:nowrap;transform:translate(-50%,-130%);display:none}.annotation-layer{position:absolute;inset:0;pointer-events:none;z-index:8}.annotation-tag{position:absolute;transform:translate(-50%,-50%);display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgba(25,25,25,.52);border:2px solid rgba(255,255,255,.78);color:#fff;font-weight:800;font-size:12px;box-shadow:0 2px 12px rgba(0,0,0,.38);pointer-events:auto;cursor:pointer;padding:0;backdrop-filter:blur(1px)}.annotation-tag.active{background:rgba(23,199,232,.82);border-color:#fff;color:#041218;box-shadow:0 0 0 2px rgba(23,199,232,.28),0 4px 16px rgba(0,0,0,.45)}.annotation-tag.wrong{background:rgba(255,91,98,.85);border-color:#fff;color:#fff}.quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.quiz-option{border:1px solid var(--line);background:#0b1a29;color:var(--text);padding:9px 10px;border-radius:10px;cursor:pointer;text-align:left}.quiz-option:hover{border-color:#2e536e;background:#0c2031}.modal{position:absolute;inset:0;display:none;align-items:center;justify-content:center;z-index:20;background:#02070dbf;backdrop-filter:blur(6px)}.modal.show{display:flex}.modal-card{width:min(520px,calc(100% - 24px));max-height:calc(100% - 24px);overflow:auto;background:linear-gradient(180deg,#0d1d2c,#091623);border:1px solid var(--line);border-radius:16px;padding:18px 18px 16px;box-shadow:0 25px 70px #0008}.modal-card h3{margin:0 0 6px;font-size:18px}.modal-card p{margin:0 0 12px;color:var(--muted);font-size:13px;line-height:1.5}.modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 14px}.check{display:flex;gap:8px;align-items:center;padding:9px 10px;border:1px solid #183044;background:#071522;border-radius:10px;font-size:12px}.check input{accent-color:var(--accent)}.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:14px}.modal-actions button{border:1px solid var(--line);background:#0b1a29;color:var(--text);padding:10px 12px;border-radius:10px;cursor:pointer}.modal-actions .primary{background:#0c2735;border-color:#176277}.radio-stack{display:grid;gap:8px;margin-top:8px}.radio-card{display:flex;gap:10px;align-items:flex-start;padding:10px 11px;border:1px solid #183044;background:#071522;border-radius:10px;font-size:12px}.radio-card small{display:block;color:var(--muted);margin-top:3px}.marker-hot{cursor:pointer}.structure-item{cursor:pointer;transition:.15s}.structure-item:hover{border-color:#3c617b;background:#0a1d2c}.structure-item.active{border-color:#f2bd4e;box-shadow:0 0 0 1px #f2bd4e55 inset;background:#0d2434}.num-badge{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#f2bd4e;color:#141414;font-weight:800;font-size:11px;box-shadow:0 0 10px #f2bd4e55;flex:0 0 auto}.structure-item .txt{display:block;min-width:0}.structure-item .txt b{display:block}.structure-item .txt span{color:var(--muted)}.detail-focus{margin-top:12px;padding:10px 11px;border:1px solid #2b5367;background:#0a1d2c;border-radius:12px}.detail-focus small{display:block;color:#8bb0c4;font-size:10px;text-transform:uppercase;letter-spacing:.12em}.detail-focus b{display:block;margin-top:6px;font-size:16px;color:#fff}.detail-focus span{display:block;margin-top:3px;color:#b9d3e4;font-size:13px}
@media(max-width:950px){.app{grid-template-columns:200px 1fr}.right{position:absolute;right:10px;bottom:10px;width:290px;max-height:45vh;border:1px solid var(--line);border-radius:14px;z-index:10}.views{display:none}.annotation-tag{width:26px;height:26px;font-size:11px}}
@media(max-width:680px){.app{display:block}.viewer{height:100%}.left{position:absolute;z-index:9;left:7px;top:67px;width:145px;max-height:53vh;border:1px solid var(--line);border-radius:13px;padding:9px}.brand{display:none}.label{margin:7px 0}.btn{font-size:11px;padding:6px 8px}.search{margin-left:150px}.right{left:7px;right:7px;width:auto}.hint{display:none}.quizbox{top:62px;left:auto;right:7px;transform:none;width:calc(100% - 164px);min-width:0;font-size:12px}.quiz-options{grid-template-columns:1fr}.modal-grid{grid-template-columns:1fr}.modal-card{padding:14px}.annotation-tag{width:24px;height:24px;font-size:10px}}

.detail2d{position:absolute;inset:0;z-index:4;display:none;flex-direction:column;align-items:center;justify-content:center;padding:68px 24px 72px;background:radial-gradient(circle at 50% 38%,#182532 0,#080d13 70%);overflow:hidden}
.viewer.detail-mode #canvas,.viewer.detail-mode .topbar,.viewer.detail-mode .hint,.viewer.detail-mode .views{display:none!important}
.viewer.detail-mode .detail2d{display:flex}
.detail2d-head{position:absolute;top:14px;left:16px;right:16px;z-index:3;display:flex;align-items:center;justify-content:center;gap:8px;pointer-events:none}
.detail2d-views{display:flex;gap:7px;flex-wrap:wrap;justify-content:center;pointer-events:auto}
.detail2d-views button{border:1px solid #324a5c;background:#0a1722;color:#dceaf4;border-radius:9px;padding:8px 11px;cursor:pointer}
.detail2d-views button.active{border-color:#17c7e8;background:#0b2a39;color:#e8fbff}
.detail2d-stage{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:0}
.detail2d-imagebox{position:relative;display:inline-block;max-width:100%;max-height:100%;line-height:0}
.detail2d-image{display:block;max-width:min(72vw,720px);max-height:calc(100vh - 170px);width:auto;height:auto;object-fit:contain;filter:contrast(1.03);border-radius:7px}
.detail2d-markerlayer{position:absolute;inset:0;pointer-events:none}
.detail2d-marker{position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;border:2px solid rgba(255,255,255,.92);background:rgba(30,30,30,.68);color:#fff;font-weight:800;font-size:12px;display:grid;place-items:center;cursor:pointer;pointer-events:auto;box-shadow:0 2px 10px rgba(0,0,0,.45);transition:.14s}
.detail2d-marker:hover{transform:translate(-50%,-50%) scale(1.12);background:rgba(50,50,50,.88)}
.detail2d-marker.active{background:#17c7e8;color:#05141b;border-color:#fff;box-shadow:0 0 0 3px rgba(23,199,232,.22),0 2px 12px #0008}
.detail2d-marker.wrong{background:#ff5b62;color:#fff}
.detail2d-caption{position:absolute;left:18px;bottom:18px;max-width:min(440px,calc(100% - 36px));background:#07131ee8;border:1px solid #29465a;border-radius:12px;padding:10px 13px;line-height:1.35;display:none;z-index:4}
.detail2d-caption.show{display:block}
.detail2d-caption b{display:block;font-size:15px;color:#fff}
.detail2d-caption span{display:block;font-size:12px;color:#a9c1d2;margin-top:2px}
.detail2d-source{position:absolute;right:16px;bottom:16px;font-size:9px;color:#6f8798;background:#07131eaa;border:1px solid #1c3140;border-radius:8px;padding:5px 7px;z-index:2}
@media(max-width:950px){.detail2d{padding:62px 12px 68px}.detail2d-image{max-width:82vw;max-height:calc(100vh - 160px)}}
@media(max-width:680px){.detail2d{padding:58px 8px 70px}.detail2d-image{max-width:94vw;max-height:calc(100vh - 145px)}.detail2d-marker{width:27px;height:27px;font-size:11px}.detail2d-caption{left:8px;bottom:62px;max-width:calc(100% - 16px)}.detail2d-source{display:none}}


/* ===== Hauptmenü / Fachbereiche ===== */
.main-menu{position:fixed;inset:0;z-index:100;display:grid;align-items:start;justify-items:center;background:radial-gradient(circle at 50% 30%,#15314a 0,#07111b 55%,#03070c 100%);padding:28px;overflow-y:auto;overflow-x:hidden}
.menu-shell{width:min(980px,100%);text-align:center;margin:0 auto;min-height:max-content}.menu-mark{width:66px;height:66px;border-radius:20px;margin:0 auto 18px;display:grid;place-items:center;background:#071421;overflow:hidden;box-shadow:0 18px 60px #0baed744}.menu-mark img{width:100%;height:100%;object-fit:cover}.menu-shell h1{font-size:clamp(30px,5vw,54px);margin:0;letter-spacing:-.035em}.menu-shell>p{color:#9eb5c7;max-width:650px;margin:12px auto 28px;line-height:1.55}.menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;text-align:left}.menu-card{border:1px solid #244157;background:linear-gradient(180deg,#0d1e2d,#08131f);border-radius:20px;padding:22px;cursor:pointer;color:#edf6ff;transition:.18s;min-height:210px;box-shadow:0 20px 50px #0004}.menu-card:hover{transform:translateY(-3px);border-color:#2f7996;background:linear-gradient(180deg,#10283a,#091927)}.menu-icon{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;background:#0c3041;border:1px solid #1b637a;font-size:24px;margin-bottom:18px}.menu-card h2{margin:0 0 7px;font-size:22px}.menu-card p{color:#92aabc;font-size:13px;line-height:1.55;margin:0 0 16px}.menu-go{font-size:12px;color:#b9f3ff;font-weight:750}.menu-footer{color:#5f788b;font-size:11px;margin-top:22px}
.quiz-dashboard{margin-top:26px;text-align:left;border-top:1px solid #1c3346;padding-top:22px}.quiz-dashboard-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:10px}.quiz-dashboard-head h2{margin:0;font-size:20px}.quiz-dashboard-head p{margin:4px 0 0;color:#829bae;font-size:12px}.quiz-dashboard-sync{font-size:10px;color:#6f899d}.quiz-progress-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.quiz-progress-card{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid #1e3a4e;background:#071522;border-radius:15px;padding:12px;cursor:pointer;color:#eaf5fd;transition:.15s;min-width:0}.quiz-progress-card:hover{border-color:#2c7892;background:#0a1e2d;transform:translateY(-1px)}.quiz-progress-ring{--p:0;width:52px;height:52px;border-radius:50%;flex:0 0 52px;background:conic-gradient(#16c7e8 calc(var(--p)*1%),#132638 0);display:grid;place-items:center;position:relative}.quiz-progress-ring:after{content:"";position:absolute;inset:5px;border-radius:50%;background:#071522}.quiz-progress-ring b{position:relative;z-index:1;font-size:11px}.quiz-progress-copy{min-width:0;flex:1}.quiz-progress-copy strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quiz-progress-copy span{display:block;color:#8ba3b6;font-size:10px;margin-top:3px}.quiz-progress-copy .due{color:#ffd67c}.quiz-progress-icon{font-size:17px;flex:0 0 auto}.quiz-progress-empty{grid-column:1/-1;color:#7891a5;font-size:12px;padding:8px 0}.quiz-dashboard-toggle{display:inline-flex;gap:4px;padding:4px;background:#06111c;border:1px solid #193347;border-radius:12px;margin:0 0 13px}.quiz-dashboard-toggle button{border:0;background:transparent;color:#809bad;padding:7px 11px;border-radius:8px;cursor:pointer;font-size:11px;font-weight:700}.quiz-dashboard-toggle button.active{background:#0d2a3a;color:#dffaff;box-shadow:inset 0 0 0 1px #176277}.quiz-exclude-actions{display:flex;gap:7px;margin:7px 0 10px}.quiz-exclude-actions button{border:1px solid #24475d;background:#091a28;color:#cfe2ef;padding:7px 9px;border-radius:9px;cursor:pointer;font-size:11px}.quiz-exclude-actions button:hover{border-color:#32809a;background:#0c2534}.main-menu{overflow:auto}.menu-shell{padding:30px 0 40px}
@media(max-width:900px){.quiz-progress-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.quiz-progress-grid{grid-template-columns:1fr}.quiz-dashboard-head{align-items:flex-start;flex-direction:column}.quiz-progress-ring{width:46px;height:46px;flex-basis:46px}}

.home-btn{width:100%;border:1px solid #234156;background:#081824;color:#cfe5f4;border-radius:10px;padding:8px 10px;cursor:pointer;margin-bottom:12px;text-align:left}.home-btn:hover{border-color:#3a718c;background:#0b2130}
/* ===== Cytologie ===== */
.cyto-app{position:fixed;inset:0;z-index:80;display:none;grid-template-columns:245px minmax(0,1fr) 310px;background:#050b12;color:var(--text);overflow:hidden}.cyto-side{background:linear-gradient(180deg,#091522,#07111b);padding:18px;overflow:auto}.cyto-left{border-right:1px solid var(--line)}.cyto-right{border-left:1px solid var(--line)}.cyto-viewer{position:relative;min-width:0;background:radial-gradient(circle at 50% 42%,#173146 0,#07131e 65%,#04090f 100%)}#cellCanvas{width:100%;height:100%;display:block;outline:none}.cyto-top{position:absolute;left:16px;top:16px;z-index:4;background:#071522d9;border:1px solid #203448;border-radius:12px;padding:9px 12px;backdrop-filter:blur(8px)}.cyto-top b{display:block;font-size:13px}.cyto-top span{display:block;font-size:10px;color:#8ea5b9;margin-top:2px}.cyto-hint{position:absolute;left:16px;bottom:15px;font-size:11px;color:#91a8ba;background:#06111cc9;border:1px solid #182b3d;padding:7px 9px;border-radius:9px}.organelle-list{display:grid;gap:6px}.organelle-btn{width:100%;text-align:left;border:1px solid #193247;background:#081622;color:#dceaf5;border-radius:9px;padding:8px 10px;cursor:pointer;font-size:11px}.organelle-btn:hover,.organelle-btn.active{border-color:#17a4c4;background:#0b2636;color:#e9fbff}.cell-info-title{font-size:21px;font-weight:850;margin:7px 0 4px}.cell-info-de{font-size:14px;color:#b6cad9}.cell-function{margin-top:12px;padding:10px 11px;border:1px solid #193248;background:#071522;border-radius:10px;color:#a9bfd0;font-size:12px;line-height:1.5}
.muscle-uafi{display:grid;gap:8px;margin-top:12px}.muscle-uafi-item{padding:10px 11px;border:1px solid #193248;background:#071522;border-radius:10px;color:#a9bfd0;font-size:11px;line-height:1.5}.muscle-uafi-item b{display:block;color:#e7f5ff;font-size:11px;margin-bottom:4px}.muscle-uafi-letter{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:6px;background:#0b3140;border:1px solid #1b7086;color:#bdeffc;font-weight:900;margin-right:6px;vertical-align:-4px}
.cyto-legend-swatch{width:10px;height:10px;border-radius:50%;display:inline-block;margin-right:7px;vertical-align:-1px;background:#17c7e8;box-shadow:0 0 10px #17c7e888}

.cyto-detail3d{position:absolute;inset:0;z-index:20;display:none;flex-direction:column;background:radial-gradient(circle at 50% 42%,#173146 0,#07131e 65%,#04090f 100%)}
.cyto-detail3d.show{display:flex}
#mitoCanvas,#nucleusCanvas{width:100%;height:100%;display:block;outline:none;flex:1 1 auto}
.cyto-detail-head{position:absolute;top:16px;left:16px;right:16px;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none}
.cyto-detail-title{background:#071522d9;border:1px solid #203448;border-radius:12px;padding:10px 12px;backdrop-filter:blur(8px);pointer-events:auto}
.cyto-detail-title b{display:block;font-size:13px}.cyto-detail-title span{display:block;font-size:10px;color:#8ea5b9;margin-top:2px}
.cyto-detail-head button{pointer-events:auto;border:1px solid #234156;background:#081824;color:#cfe5f4;border-radius:10px;padding:8px 10px;cursor:pointer}
.cyto-detail-head button:hover{border-color:#3a718c;background:#0b2130}

.cyto-detail-actions{display:flex;gap:8px;align-items:center;pointer-events:auto}
.cyto-detail-switch{display:flex;gap:5px;padding:4px;border:1px solid #203448;background:#06111bd9;border-radius:11px;backdrop-filter:blur(8px)}
.cyto-detail-switch button{border:0;background:transparent;color:#9fb3c2;border-radius:7px;padding:7px 10px;cursor:pointer;font-size:11px;font-weight:700}
.cyto-detail-switch button:hover{background:#0b2130;color:#e8f8ff}
.cyto-detail-switch button.active{background:#0d3041;color:#e9fbff;box-shadow:inset 0 0 0 1px #1f718b}
.mito-2d-view{display:none;position:absolute;inset:0 320px 0 0;align-items:center;justify-content:center;padding:76px 24px 42px;overflow:auto;background:radial-gradient(circle at 50% 42%,#173146 0,#07131e 65%,#04090f 100%)}
.mito-2d-view.show{display:flex}
.mito-2d-frame{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:0}
.mito-2d-frame img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:12px;box-shadow:0 18px 50px #0003;background:#fff;padding:12px;border:1px solid #d7dfe7}
.cyto-detail3d.mode-2d #mitoCanvas,.cyto-detail3d.mode-2d .cyto-detail-hint{display:none!important}
.cyto-detail3d.mode-2d .mito-2d-view{display:flex}
@media(max-width:980px){.mito-2d-view{inset:0;padding:74px 16px calc(36vh + 22px)}}

.cyto-detail-hint{position:absolute;left:16px;bottom:15px;z-index:4;font-size:11px;color:#91a8ba;background:#06111cc9;border:1px solid #182b3d;padding:7px 9px;border-radius:9px}
.cyto-detail-status{position:absolute;inset:0;display:grid;place-items:center;z-index:3;background:radial-gradient(circle at 50% 40%,#10263b,#050b12);transition:.3s}
.cyto-detail-status.hide{opacity:0;pointer-events:none}
.cyto-detail-card{text-align:center;max-width:340px;padding:20px}.cyto-detail-card strong{display:block;font-size:18px;margin-bottom:8px}.cyto-detail-card p{margin:0;color:#9ab0c1;font-size:13px;line-height:1.5}
.cyto-detail-card .spinner{margin-bottom:14px}
.detail-open #cellCanvas,.detail-open .cyto-top,.detail-open .cyto-hint{display:none!important}

.cyto-detail3d{padding-right:320px}
.cyto-detail-info{position:absolute;top:72px;right:16px;bottom:16px;width:288px;z-index:4;border:1px solid #1b3345;background:linear-gradient(180deg,#071421ee,#08111ce8);border-radius:14px;padding:14px;overflow:auto;backdrop-filter:blur(8px);box-shadow:0 16px 40px #0005}
.cyto-detail-info .eyebrow{font-size:11px;color:#8ca2b4;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}
.cyto-detail-info h3{margin:0 0 6px;font-size:22px;line-height:1.1}.cyto-detail-info p{margin:0 0 12px;color:#a9bfd0;font-size:12px;line-height:1.55}
.cardio-detail3d{position:absolute;inset:0;z-index:20;display:none;flex-direction:column;background:radial-gradient(circle at 50% 42%,#173146 0,#07131e 65%,#04090f 100%);padding-right:320px}.cardio-detail3d.show{display:flex}.cardio-detail3d.mode-2d #heartCanvas,.cardio-detail3d.mode-2d .cardio-detail-hint{display:none!important}.cardio-detail-head{position:absolute;top:16px;left:16px;right:16px;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none}.cardio-detail-title{display:flex;flex-direction:column;gap:3px;background:#071421d8;border:1px solid #1b3345;border-radius:12px;padding:10px 12px;backdrop-filter:blur(8px)}.cardio-detail-title b{font-size:15px}.cardio-detail-title span{font-size:11px;color:#a8bfd0}.cardio-detail-actions{display:flex;gap:8px;pointer-events:auto;flex-wrap:wrap;justify-content:flex-end}.cardio-detail-head button{pointer-events:auto;border:1px solid #234156;background:#081824;color:#cfe5f4;border-radius:10px;padding:8px 10px;cursor:pointer}.cardio-detail-head button:hover{border-color:#3a718c;background:#0b2130}.cardio-detail-head button.active{border-color:#17c7e8;background:#0b2a39;color:#e8fbff}.cardio-detail-info{position:absolute;top:72px;right:16px;bottom:16px;width:288px;z-index:5;border:1px solid #1b3345;background:linear-gradient(180deg,#071421ee,#08111ce8);border-radius:14px;padding:14px;overflow:auto;backdrop-filter:blur(8px);box-shadow:0 16px 40px #0005}.cardio-detail-info .eyebrow{font-size:11px;color:#8ca2b4;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}.cardio-detail-info h3{margin:0 0 6px;font-size:22px;line-height:1.1}.cardio-detail-info p{margin:0 0 12px;color:#a9bfd0;font-size:12px;line-height:1.55}.cardio-detail-hint{position:absolute;left:16px;bottom:15px;z-index:5;font-size:11px;color:#91a8ba;background:#06111cc9;border:1px solid #182b3d;padding:7px 9px;border-radius:9px}.cardio-detail-status{position:absolute;inset:0;display:grid;place-items:center;z-index:4;background:radial-gradient(circle at 50% 40%,#10263b,#050b12);transition:.3s}.cardio-detail-status.hide{opacity:0;pointer-events:none}.heart-2d-view{display:none;position:absolute;inset:0 320px 0 0;z-index:2;align-items:center;justify-content:center;padding:88px 22px 34px;overflow:auto;background:radial-gradient(circle at 50% 42%,#173146 0,#07131e 65%,#04090f 100%)}.heart-cross-view{display:none;position:absolute;inset:72px 320px 0 0;z-index:3;background:#050a0f}.cardio-detail3d.mode-cross #heartCanvas{display:none!important}.cardio-detail3d.mode-cross .heart-cross-view{display:block}.heart-cross-view iframe{width:100%;height:100%;border:0;background:#050a0f}.heart-cross-credit{position:absolute;left:14px;bottom:12px;z-index:4;padding:7px 10px;border-radius:9px;border:1px solid #233c50;background:#06111cd9;color:#9fb7c8;font-size:10px;pointer-events:none}.heart-2d-css-switch{display:grid!important;grid-template-columns:auto auto;grid-template-rows:auto 1fr;gap:10px;justify-content:center;align-items:start}.heart-2d-radio{position:absolute;opacity:0;pointer-events:none}.heart-2d-css-switch>label{grid-row:1;border:1px solid #234156;background:#081824;color:#cfe5f4;border-radius:10px;padding:8px 16px;cursor:pointer;text-align:center;min-width:130px;user-select:none}.heart-2d-css-switch>label:hover{border-color:#3a718c;background:#0b2130}#heart2dAnatomyRadio:checked+label,#heart2dFlowRadio:checked+label{border-color:#17c7e8;background:#0b2a39;color:#e8fbff}.heart-2d-panels{grid-column:1 / -1;grid-row:2;width:min(100%,1000px);display:block}.heart-2d-panel{display:none;width:100%;align-items:center;justify-content:center;flex-direction:column;gap:10px}.heart-2d-panel img{display:block;max-width:100%;max-height:calc(100vh - 180px);width:auto;height:auto;object-fit:contain;border-radius:14px;box-shadow:0 16px 50px #0005;background:#fff;padding:10px;border:1px solid #d9e3ea}#heart2dAnatomyRadio:checked~.heart-2d-panels .heart-2d-panel-anatomy{display:flex!important}#heart2dFlowRadio:checked~.heart-2d-panels .heart-2d-panel-flow{display:flex!important}.heart-2d-panel-flow img{max-height:calc(100vh - 220px)}@media(max-width:980px){.heart-cross-view{inset:72px 0 38vh 0}.heart-cross-credit{bottom:8px}.heart-2d-css-switch{grid-template-columns:1fr 1fr}.heart-2d-css-switch>label{min-width:0}}.cardio-detail3d.mode-2d .heart-2d-view{display:flex}.heart-2d-wrap{display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:flex-start;min-height:100%;width:100%}.heart-2d-tabs{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.heart-2d-tabs button{border:1px solid #234156;background:#081824;color:#cfe5f4;border-radius:10px;padding:8px 12px;cursor:pointer}.heart-2d-tabs button.active{border-color:#17c7e8;background:#0b2a39;color:#e8fbff}.heart-2d-imgbox{width:100%;display:flex;align-items:center;justify-content:center;position:relative}.heart-2d-imgbox img{display:block;max-width:min(100%,960px);max-height:calc(100vh - 170px);width:auto;height:auto;object-fit:contain;border-radius:14px;box-shadow:0 16px 50px #0005;background:#fff;padding:12px;border:1px solid #d9e3ea}.heart-2d-imgbox img.hidden{display:none!important}.heart-flow-legend{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;font-size:11px;color:#c8d8e3}.heart-flow-legend span{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid #28455a;border-radius:999px;background:#071725}.heart-flow-legend i{display:inline-block;width:11px;height:11px;border-radius:50%}.heart-flow-legend i.blue{background:#6b8cff}.heart-flow-legend i.red{background:#ff6b72}@media(max-width:980px){.cardio-detail3d{padding-right:0}.cardio-detail-info{top:auto;left:10px;right:10px;bottom:10px;width:auto;max-height:36vh}.heart-2d-view{inset:0;padding:82px 12px calc(38vh + 22px)}}
.cyto-struct-list{display:grid;gap:6px;margin-top:12px}.cyto-struct-btn{width:100%;text-align:left;border:1px solid #193247;background:#081622;color:#dceaf5;border-radius:9px;padding:8px 10px;cursor:pointer;font-size:12px;display:flex;align-items:center;gap:8px}.cyto-struct-btn:hover,.cyto-struct-btn.active{border-color:#17a4c4;background:#0b2636;color:#e9fbff}.mito-swatch{width:10px;height:10px;border-radius:999px;display:inline-block;flex:0 0 auto;box-shadow:0 0 0 1px #ffffff22, 0 0 10px currentColor}
.cyto-detail-note{padding:10px 11px;border:1px solid #193248;background:#071522;border-radius:10px;color:#9cb2c3;font-size:12px;line-height:1.5}
@media(max-width:980px){.cyto-detail3d{padding-right:0}.cyto-detail-info{top:auto;left:10px;right:10px;bottom:10px;width:auto;max-height:36vh}}


@media(max-width:900px){.menu-grid{grid-template-columns:1fr}.cyto-app{grid-template-columns:190px 1fr}.cyto-right{position:absolute;right:8px;bottom:8px;width:280px;max-height:43vh;border:1px solid var(--line);border-radius:14px;z-index:10}.cyto-side{padding:12px}}
@media(max-width:650px){.main-menu{padding:14px}.menu-card{min-height:0}.cyto-app{display:none;grid-template-columns:1fr}.cyto-left{position:absolute;z-index:12;left:7px;top:7px;width:148px;max-height:46vh;border:1px solid var(--line);border-radius:12px}.cyto-left .brand{display:none}.cyto-right{left:7px;right:7px;width:auto}.cyto-hint{display:none}}


.lung-detail3d{position:absolute;inset:0;z-index:25;display:none;flex-direction:column;background:radial-gradient(circle at 50% 42%,#1b2a36 0,#0a1118 72%,#04090f 100%);padding-right:320px}.lung-detail3d.show{display:flex}.lung-detail3d.mode-2d #lungDetailCanvas,.lung-detail3d.mode-2d .lung-detail-hint{display:none!important}.lung-detail3d.mode-real #lungDetailCanvas{display:none!important}.lung-real-view{display:none;position:absolute;inset:72px 320px 0 0;z-index:3;background:#05090d}.lung-detail3d.mode-real .lung-real-view{display:block}.lung-real-view iframe{width:100%;height:100%;border:0;background:#05090d}.lung-real-credit{position:absolute;left:14px;bottom:12px;z-index:4;padding:7px 10px;border-radius:9px;border:1px solid #233c50;background:#06111cdd;color:#a6bdcc;font-size:10px;pointer-events:none}.lung-real-badge{position:absolute;left:14px;top:12px;z-index:4;padding:7px 10px;border-radius:9px;background:#071827dd;border:1px solid #2b526a;color:#dff5ff;font-size:11px;pointer-events:none}@media(max-width:980px){.lung-real-view{inset:72px 0 38vh 0}}.lung-detail-head{position:absolute;top:16px;left:16px;right:16px;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none}.lung-detail-title{display:flex;flex-direction:column;gap:3px;background:#071421d8;border:1px solid #1b3345;border-radius:12px;padding:10px 12px;backdrop-filter:blur(8px)}.lung-detail-title b{font-size:15px}.lung-detail-title span{font-size:11px;color:#a8bfd0}.lung-detail-actions{display:flex;gap:8px;pointer-events:auto;flex-wrap:wrap;justify-content:flex-end}.lung-detail-head button{pointer-events:auto;border:1px solid #234156;background:#081824;color:#cfe5f4;border-radius:10px;padding:8px 10px;cursor:pointer}.lung-detail-head button:hover{border-color:#3a718c;background:#0b2130}.lung-detail-head button.active{border-color:#17c7e8;background:#0b2a39;color:#e8fbff}.lung-detail-info{position:absolute;top:72px;right:16px;bottom:16px;width:288px;z-index:5;border:1px solid #1b3345;background:linear-gradient(180deg,#071421ee,#08111ce8);border-radius:14px;padding:14px;overflow:auto;backdrop-filter:blur(8px);box-shadow:0 16px 40px #0005}.lung-detail-info .eyebrow{font-size:11px;color:#8ca2b4;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}.lung-detail-info h3{margin:0 0 6px;font-size:22px;line-height:1.1}.lung-detail-info p{margin:0 0 12px;color:#a9bfd0;font-size:12px;line-height:1.55}.lung-detail-hint{position:absolute;left:16px;bottom:15px;z-index:5;font-size:11px;color:#91a8ba;background:#06111cc9;border:1px solid #182b3d;padding:7px 9px;border-radius:9px}.lung-detail-status{position:absolute;inset:0;display:grid;place-items:center;z-index:4;background:radial-gradient(circle at 50% 40%,#10263b,#050b12);transition:.3s}.lung-detail-status.hide{opacity:0;pointer-events:none}.lung-2d-view{display:none;position:absolute;inset:0 320px 0 0;z-index:2;align-items:center;justify-content:center;padding:88px 22px 34px;overflow:auto;background:radial-gradient(circle at 50% 42%,#173146 0,#07131e 65%,#04090f 100%)}.lung-detail3d.mode-2d .lung-2d-view{display:flex}.lung-2d-frame{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.lung-2d-frame img{display:block;max-width:min(100%,980px);max-height:calc(100vh - 170px);width:auto;height:auto;object-fit:contain;border-radius:14px;box-shadow:0 16px 50px #0005;background:#fff;padding:12px;border:1px solid #d9e3ea}@media(max-width:980px){.lung-detail3d{padding-right:0}.lung-detail-info{top:auto;left:10px;right:10px;bottom:10px;width:auto;max-height:36vh}.lung-2d-view{inset:0;padding:82px 12px calc(38vh + 22px)}}


/* ===== Cor anatomy account / Supabase auth ===== */
.auth-screen{position:fixed;inset:0;z-index:1000;display:none;place-items:center;padding:22px;background:radial-gradient(circle at 50% 26%,#17364f 0,#07111b 52%,#03070c 100%)}
.auth-screen.show{display:grid}.auth-shell{width:min(430px,100%);background:linear-gradient(180deg,#0d1d2c,#08131f);border:1px solid #244157;border-radius:22px;padding:26px;box-shadow:0 30px 90px #0009}.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:20px}.auth-heart{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;font-size:31px;background:#101c29;border:1px solid #304b61;box-shadow:0 14px 40px #0005}.auth-brand h1{margin:0;font-size:25px}.auth-brand p{margin:3px 0 0;color:var(--muted);font-size:12px}.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:4px;background:#07121d;border:1px solid #182b3c;border-radius:12px;margin-bottom:18px}.auth-tab{border:0;border-radius:9px;padding:9px;background:transparent;color:#90a8bb;cursor:pointer}.auth-tab.active{background:#0e2b3b;color:#e9fbff;box-shadow:inset 0 0 0 1px #24627a}.auth-form{display:grid;gap:12px}.auth-field{display:grid;gap:6px;text-align:left}.auth-field span{font-size:11px;color:#9fb3c3}.auth-field input{width:100%;border:1px solid #203a4f;background:#06111c;color:#edf6ff;border-radius:10px;padding:11px 12px;outline:none}.auth-field input:focus{border-color:#1ba8c8;box-shadow:0 0 0 3px #17c7e811}.auth-primary{border:1px solid #1986a2;background:linear-gradient(180deg,#0e536a,#0a3548);color:#effcff;border-radius:11px;padding:11px 13px;font-weight:750;cursor:pointer}.auth-primary:hover{border-color:#27bad9}.auth-secondary{border:1px solid #243b4e;background:#0a1724;color:#d9e9f5;border-radius:11px;padding:10px 12px;cursor:pointer}.auth-link{border:0;background:none;color:#8fdcf0;padding:3px;cursor:pointer;font-size:12px}.auth-link:hover{text-decoration:underline}.auth-row{display:flex;justify-content:space-between;gap:12px;align-items:center}.auth-message{min-height:36px;border-radius:10px;padding:9px 10px;font-size:11px;line-height:1.45;color:#a8bdcc;background:#07131f;border:1px solid #172b3d;display:none}.auth-message.show{display:block}.auth-message.error{color:#ffd1d3;border-color:#65343a;background:#201015}.auth-message.ok{color:#c8ffe0;border-color:#24583e;background:#092016}.auth-note{margin-top:14px;color:#667f92;font-size:10px;line-height:1.5;text-align:center}.account-dock{position:absolute;right:18px;top:18px;z-index:3;display:flex;align-items:center;gap:8px}.account-btn{display:flex;align-items:center;gap:8px;border:1px solid #29495f;background:#081522e8;color:#e8f5ff;border-radius:999px;padding:8px 11px;cursor:pointer;backdrop-filter:blur(8px)}.account-btn:hover{border-color:#3a7590}.account-avatar{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#0d3b4d;color:#bff4ff;font-size:12px;font-weight:800}.account-copy{display:grid;text-align:left;line-height:1.15}.account-copy b{font-size:11px;max-width:185px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-copy small{color:#80a0b5;font-size:9px}.account-menu{position:absolute;right:0;top:46px;width:270px;padding:12px;border:1px solid #29495f;background:#07131ff5;border-radius:14px;box-shadow:0 18px 55px #0009;text-align:left;display:none}.account-menu.show{display:block}.account-menu .email{font-size:12px;word-break:break-all}.account-menu .plan{display:inline-block;margin:8px 0 12px;padding:4px 8px;border:1px solid #1b5b72;border-radius:99px;background:#0b2938;color:#bff1ff;font-size:9px;font-weight:800;letter-spacing:.08em}.account-menu button{width:100%;border:1px solid #223c50;background:#0a1926;color:#dceaf5;border-radius:9px;padding:9px 10px;cursor:pointer}.account-menu button+button{margin-top:7px}.account-menu .danger{border-color:#5b3338;color:#ffd2d5}.auth-mini-loader{width:16px;height:16px;border:2px solid #1f3c50;border-top-color:#22c4e4;border-radius:50%;display:inline-block;vertical-align:-3px;margin-right:7px;animation:spin 1s linear infinite}.auth-hidden{display:none!important}@media(max-width:650px){.auth-shell{padding:20px}.account-dock{right:10px;top:10px}.account-copy b{max-width:120px}}




/* ===== Freemium / Premium UI ===== */
.menu-card{position:relative;overflow:hidden}.tier-badge{position:absolute;top:14px;right:14px;display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;z-index:2}.tier-badge.free{border:1px solid #246d58;background:#0a2b22;color:#bff7dc}.tier-badge.premium{border:1px solid #7b6327;background:linear-gradient(180deg,#30270e,#1a170b);color:#ffe49a;box-shadow:0 5px 18px #0005}.menu-card.premium-locked{border-color:#4b452d}.menu-card.premium-locked:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0,transparent 62%,rgba(255,206,90,.045) 100%);pointer-events:none}.menu-card.premium-locked .menu-go{color:#e5c96f}.menu-card.premium-unlocked{border-color:#35604e}.menu-card.premium-unlocked .tier-badge.premium{border-color:#2a7658;background:#0b3024;color:#c9ffe3}.freemium-strip{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 18px;padding:13px 15px;border:1px solid #21445a;background:linear-gradient(100deg,#081a29,#0b2230);border-radius:15px;text-align:left}.freemium-strip-copy{min-width:0}.freemium-strip-copy b{display:block;font-size:12px}.freemium-strip-copy span{display:block;margin-top:3px;color:#88a6b9;font-size:10px;line-height:1.35}.freemium-strip button{flex:0 0 auto;border:1px solid #846c2d;background:linear-gradient(180deg,#3a2f10,#211b0c);color:#ffe7a3;border-radius:10px;padding:9px 12px;font-size:11px;font-weight:800;cursor:pointer}.freemium-strip button:hover{border-color:#c49b3b;background:#453712}.account-menu .upgrade-account-btn{border-color:#80692e;background:linear-gradient(180deg,#342b12,#1b170c);color:#ffe5a0}.account-menu .dev-access-btn{border-color:#31546a;background:linear-gradient(180deg,#0b2433,#071925);color:#aeeeff}.account-menu .dev-access-btn:hover{border-color:#27a8c8;background:#0b2b3d}.account-menu .dev-access-btn.dev-active{border-color:#3d8064;background:linear-gradient(180deg,#0c3528,#082218);color:#caffdf;box-shadow:inset 0 0 0 1px #2d6a51}.account-menu .dev-access-btn small{display:block;margin-top:3px;color:#6f93a8;font-size:8px;font-weight:500;line-height:1.25}.account-menu .dev-access-btn.dev-active small{color:#8cc8aa}.account-menu .plan.premium-plan{border-color:#32785b;background:#0a2b21;color:#caffdf}.account-menu .plan.free-plan{border-color:#1b5b72;background:#0b2938;color:#bff1ff}.premium-modal{position:fixed;inset:0;z-index:1100;display:none;align-items:center;justify-content:center;padding:18px;background:#02070dd8;backdrop-filter:blur(9px)}.premium-modal.show{display:flex}.premium-card{width:min(570px,100%);max-height:calc(100vh - 36px);overflow:auto;border:1px solid #3e5261;background:linear-gradient(180deg,#101e2b,#07131f 72%);border-radius:22px;padding:22px;box-shadow:0 30px 95px #000b;text-align:left}.premium-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}.premium-kicker{display:inline-flex;align-items:center;gap:7px;padding:5px 9px;border:1px solid #80692e;background:#2b230f;border-radius:999px;color:#ffe4a0;font-size:9px;font-weight:900;letter-spacing:.1em}.premium-head h2{margin:10px 0 6px;font-size:27px;letter-spacing:-.025em}.premium-head p{margin:0;color:#91a8ba;font-size:12px;line-height:1.55}.premium-close{border:1px solid #29495f;background:#081522;color:#dcebf6;border-radius:10px;padding:8px 10px;cursor:pointer}.premium-price{margin:18px 0 14px;padding:15px;border:1px solid #5f512a;background:linear-gradient(110deg,#1f1b0d,#101c24);border-radius:15px}.premium-price strong{font-size:26px;color:#fff0bd}.premium-price span{display:block;margin-top:3px;color:#9cafbd;font-size:10px}.premium-benefits{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:13px 0 17px}.premium-benefit{display:flex;gap:9px;align-items:flex-start;border:1px solid #1c3446;background:#071522;border-radius:11px;padding:10px;font-size:11px;color:#bfd1dd;line-height:1.4}.premium-benefit i{font-style:normal;color:#ffd977;font-weight:900}.premium-actions{display:grid;gap:8px}.premium-secondary{border:1px solid #29495f;background:#091824;color:#d8e9f4;border-radius:11px;padding:10px 12px;cursor:pointer}.premium-note{margin-top:10px;color:#647f92;font-size:9px;line-height:1.45;text-align:center}.premium-status{display:none;margin-top:10px;border:1px solid #66562e;background:#211c0d;color:#f5dda0;border-radius:10px;padding:9px 10px;font-size:10px;line-height:1.45}.premium-status.show{display:block}@media(max-width:650px){.freemium-strip{align-items:flex-start;flex-direction:column}.freemium-strip button{width:100%}.premium-benefits{grid-template-columns:1fr}.premium-card{padding:17px}.tier-badge{top:10px;right:10px}}

/* ===== Settings / language ===== */
.settings-btn{width:42px;height:42px;border-radius:50%;border:1px solid #29495f;background:#081522e8;color:#e8f5ff;display:grid;place-items:center;font-size:19px;cursor:pointer;backdrop-filter:blur(8px);transition:.15s}.settings-btn:hover{border-color:#3a7590;background:#0b2030;transform:rotate(8deg)}
.settings-modal{position:fixed;inset:0;z-index:180;display:none;align-items:center;justify-content:center;background:#02070dc9;backdrop-filter:blur(7px);padding:18px}.settings-modal.show{display:flex}.settings-card{width:min(470px,100%);background:linear-gradient(180deg,#0d1d2c,#08131f);border:1px solid #29495f;border-radius:20px;padding:20px;box-shadow:0 28px 85px #000a;text-align:left}.settings-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}.settings-head h2{margin:0;font-size:21px}.settings-close{border:1px solid #29495f;background:#081522;color:#dcebf6;border-radius:9px;padding:7px 10px;cursor:pointer}.settings-section{padding:14px;border:1px solid #1d3447;background:#071522;border-radius:14px}.settings-section h3{margin:0 0 5px;font-size:14px}.settings-section p{margin:0 0 12px;color:#839caf;font-size:11px;line-height:1.5}.language-options{display:grid;grid-template-columns:1fr 1fr;gap:9px}.language-option{border:1px solid #24475d;background:#091a28;color:#dcebf6;border-radius:11px;padding:11px 12px;cursor:pointer;text-align:center;font-weight:700}.language-option.active{border-color:#17c7e8;background:#0c2a3a;color:#e8fcff;box-shadow:0 0 0 1px #17c7e844 inset}.settings-note{margin-top:12px;color:#637e92;font-size:10px;line-height:1.5}
.heart-quiz-target-note{color:#ffe57a!important;font-weight:800!important;text-shadow:0 0 12px #ffb000aa}
@media(max-width:650px){.settings-btn{width:38px;height:38px}.language-options{grid-template-columns:1fr}}


/* ===== Dissection Mode · Stage 1 ===== */
.dissection-layer-list{display:grid;gap:8px}.dissection-layer-row{border:1px solid #1c3446;background:#091722;border-radius:12px;padding:9px}.dissection-layer-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}.dissection-layer-head b{font-size:12px}.dissection-layer-head small{font-size:10px;color:#7792a6}.dissection-layer-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.dissection-layer-actions button{border:1px solid #203c50;background:#07131e;color:#a9c3d4;border-radius:8px;padding:6px 4px;font-size:10px;cursor:pointer}.dissection-layer-actions button.active{border-color:#19c4e6;background:#0a2b3b;color:#eaffff}.dissection-layer-actions button:hover{background:#0c2231}.dissection-region-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.dissection-region-grid button{border:1px solid #1f3b50;background:#081620;color:#adc2d1;border-radius:9px;padding:8px 6px;font-size:11px;cursor:pointer}.dissection-region-grid button.active{background:#0b3041;border-color:#1cc6e8;color:#effdff}.dissection-info-layer{display:inline-flex;align-items:center;gap:6px;border:1px solid #29475b;background:#091b29;border-radius:999px;padding:4px 8px;font-size:10px;color:#b7ccda;margin-bottom:10px}.dissection-info-layer i{width:8px;height:8px;border-radius:50%;display:inline-block}.dissection-loading-layers{margin-top:10px;display:grid;gap:4px;font-size:10px;color:#8199aa}.dissection-loading-layers span.done{color:#7fc8a3}.dissection-loading-layers span.error{color:#e9a0a6}



/* ===== Presentation / Hide UI mode ===== */
#corUiToggleBtn,#corUiRestoreBtn{position:fixed;z-index:9998;border:1px solid #28556d;background:#081824e8;color:#dff6ff;border-radius:10px;padding:8px 11px;font:700 11px/1.2 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial;cursor:pointer;backdrop-filter:blur(8px);box-shadow:0 8px 28px #0007;transition:.15s}
#corUiToggleBtn{right:16px;bottom:16px;display:none}
#corUiRestoreBtn{right:14px;top:14px;display:none;opacity:.72;padding:7px 9px}
#corUiToggleBtn:hover,#corUiRestoreBtn:hover{border-color:#17c7e8;background:#0b2a3a;color:#fff;opacity:1}
body.cor-ui-hidden #corUiToggleBtn{display:none!important}
body.cor-ui-hidden #corUiRestoreBtn{display:block!important}
body.cor-ui-hidden .app{grid-template-columns:minmax(0,1fr)!important}
body.cor-ui-hidden .app>.side,
body.cor-ui-hidden .app>.left,
body.cor-ui-hidden .app>.right,
body.cor-ui-hidden .app .topbar,
body.cor-ui-hidden .app .hint,
body.cor-ui-hidden .app .quizbox,
body.cor-ui-hidden .app .detail-banner,
body.cor-ui-hidden .app .annotation-layer,
body.cor-ui-hidden .app .markerLabel,
body.cor-ui-hidden .app .detail2d-head,
body.cor-ui-hidden .app .detail2d-caption,
body.cor-ui-hidden .app .detail2d-source,
body.cor-ui-hidden .app .modal:not(.status){display:none!important}
body.cor-ui-hidden .app>.viewer{grid-column:1!important;width:100%!important;height:100%!important}
body.cor-ui-hidden .cyto-app{grid-template-columns:minmax(0,1fr)!important}
body.cor-ui-hidden .cyto-app .cyto-side,
body.cor-ui-hidden .cyto-app .cyto-left,
body.cor-ui-hidden .cyto-app .cyto-right,
body.cor-ui-hidden .cyto-app .cyto-top,
body.cor-ui-hidden .cyto-app .cyto-hint,
body.cor-ui-hidden .cyto-app .cyto-detail-head,
body.cor-ui-hidden .cyto-app .cyto-detail-info,
body.cor-ui-hidden .cyto-app .cyto-detail-hint{display:none!important}
body.cor-ui-hidden .cyto-app .cyto-viewer{grid-column:1!important;width:100%!important;height:100%!important}
body.cor-ui-hidden .cyto-detail3d{padding-right:0!important}
body.cor-ui-hidden .mito-2d-view{inset:0!important;padding:20px!important}
body.cor-ui-hidden .main-menu,
body.cor-ui-hidden .auth-screen{display:none!important}

/* ===== Legal notice / Impressum ===== */
.legal-dock{position:fixed;left:14px;bottom:12px;z-index:145;display:flex;gap:7px;align-items:center}
.legal-link{border:1px solid #203f54;background:#071522dc;color:#8fb4c8;border-radius:9px;padding:7px 10px;font-size:10px;line-height:1;cursor:pointer;backdrop-filter:blur(8px);transition:.15s}
.legal-link:hover{border-color:#2c7892;color:#dcf8ff;background:#0a1e2d}
.legal-modal{position:fixed;inset:0;z-index:180;display:none;align-items:center;justify-content:center;padding:18px;background:#02070dd9;backdrop-filter:blur(7px)}
.legal-modal.show{display:flex}
.legal-card{width:min(620px,100%);max-height:min(760px,calc(100vh - 36px));overflow:auto;background:linear-gradient(180deg,#0d1d2c,#08131f);border:1px solid #28475d;border-radius:18px;padding:20px;box-shadow:0 30px 90px #000a;text-align:left}
.legal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding-bottom:14px;border-bottom:1px solid #1b3346}
.legal-head h2{margin:4px 0 0;font-size:24px}
.legal-close{flex:0 0 auto;border:1px solid #29495f;background:#091927;color:#dcecf7;border-radius:9px;padding:8px 10px;cursor:pointer}
.legal-close:hover{border-color:#3a7590;background:#0b2130}
.legal-section{padding:15px 0;border-bottom:1px solid #162c3d}
.legal-section:last-of-type{border-bottom:0}
.legal-section h3{margin:0 0 8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#76dcef}
.legal-section p{margin:0;color:#b7cad8;font-size:13px;line-height:1.65}
.legal-section a{color:#8ee8f7;text-decoration:none}
.legal-section a:hover{text-decoration:underline}
.legal-note{margin-top:13px;padding:10px 11px;border:1px solid #1b3d51;background:#071522;border-radius:10px;color:#728da0;font-size:10px;line-height:1.55}
body.cor-ui-hidden .legal-dock{display:none!important}
@media(max-width:650px){.legal-dock{left:8px;bottom:8px}.legal-card{padding:16px}.legal-head h2{font-size:21px}}


/* Skeleton quiz: skip action */
.skeleton-quiz-actions{display:none;justify-content:center;margin-top:9px}.skeleton-quiz-actions.show{display:flex}.skeleton-skip-btn{border:1px solid #2a5970;background:#0b2130;color:#dff7ff;border-radius:9px;padding:7px 13px;cursor:pointer;font-size:11px;font-weight:750}.skeleton-skip-btn:hover{border-color:#17c7e8;background:#0d2a3b}.skeleton-skip-btn:focus{outline:2px solid var(--accent);outline-offset:2px}


/* ===== Mobile responsive layout v1.11 ===== */
.mobile-ui-controls{display:none}
.mobile-panel-backdrop{display:none}
.mobile-orientation-note{display:none}
@media(max-width:820px){
 html,body{width:100%;height:100%;overflow:hidden;overscroll-behavior:none}
 body{min-width:0}
 .app,.cyto-app{position:fixed!important;inset:0!important;width:100%!important;height:100dvh!important;display:block;overflow:hidden}
 .app[style*="display:none"],.cyto-app[style*="display:none"]{display:none!important}
 .app>.viewer,.cyto-app>.cyto-viewer{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-width:0!important}
 .app canvas,.cyto-app canvas{touch-action:none}

 /* Off-canvas sidebars: same content as desktop, no compressed miniature layout */
 .app>.side,.cyto-app>.cyto-side{
   position:fixed!important;top:0!important;bottom:0!important;z-index:120!important;
   width:min(86vw,320px)!important;max-width:320px!important;height:100dvh!important;
   padding:16px!important;overflow-y:auto!important;overflow-x:hidden!important;
   border:1px solid #27465b!important;background:linear-gradient(180deg,#091522,#07111b)!important;
   box-shadow:0 24px 70px #000c!important;transition:transform .22s ease!important;
   display:block!important
 }
 .app>.left,.cyto-app>.cyto-left{left:0!important;right:auto!important;transform:translateX(-104%)}
 .app>.right,.cyto-app>.cyto-right{right:0!important;left:auto!important;transform:translateX(104%)}
 body.mobile-left-open .app:not([style*="display:none"])>.left,
 body.mobile-left-open .cyto-app:not([style*="display:none"])>.cyto-left{transform:translateX(0)}
 body.mobile-right-open .app:not([style*="display:none"])>.right,
 body.mobile-right-open .cyto-app:not([style*="display:none"])>.cyto-right{transform:translateX(0)}

 .mobile-panel-backdrop{position:fixed;inset:0;z-index:110;background:#02070d99;backdrop-filter:blur(3px)}
 body.mobile-left-open .mobile-panel-backdrop,body.mobile-right-open .mobile-panel-backdrop{display:block}
 .mobile-ui-controls{position:fixed;z-index:130;left:10px;right:10px;top:max(10px,env(safe-area-inset-top));display:none;justify-content:space-between;pointer-events:none}
 body.mobile-anatomy-active:not(.cor-ui-hidden) .mobile-ui-controls{display:flex}
 .mobile-ui-controls button{pointer-events:auto;border:1px solid #2a5970;background:#071522e8;color:#e7f6ff;border-radius:11px;padding:9px 12px;min-width:44px;min-height:42px;font-weight:800;font-size:12px;box-shadow:0 8px 28px #0008;backdrop-filter:blur(8px)}
 .mobile-ui-controls button:active{background:#0d2a3b;border-color:#17c7e8}

 /* Search/top controls stay usable and clear of the mobile panel buttons */
 .app .topbar{left:62px!important;right:62px!important;top:max(10px,env(safe-area-inset-top))!important;gap:6px!important}
 .app .search{margin-left:0!important;max-width:none!important;min-width:0!important}
 .app .search input{padding:10px 11px!important;font-size:13px!important}
 .app .views{display:none!important}
 .app .results{max-height:42vh!important}
 .hint,.cyto-hint{display:none!important}

 /* Quiz remains centered and readable */
 .quizbox{top:64px!important;left:10px!important;right:10px!important;transform:none!important;width:auto!important;min-width:0!important;max-width:none!important;padding:11px 12px!important;font-size:12px!important}
 .quiz-options{grid-template-columns:1fr!important;gap:6px!important}
 .quiz-option{padding:9px 10px!important}
 .modal,.settings-modal,.premium-modal,.legal-modal{padding:10px!important}
 .modal-card,.settings-card,.premium-card,.legal-card{width:100%!important;max-height:calc(100dvh - 20px)!important;border-radius:16px!important}
 .modal-grid,.premium-benefits,.language-options{grid-template-columns:1fr!important}

 /* 2D detail plates use almost all mobile screen */
 .detail2d{padding:62px 8px 58px!important}
 .detail2d-image{max-width:96vw!important;max-height:calc(100dvh - 130px)!important}
 .detail2d-head{top:max(8px,env(safe-area-inset-top))!important;left:58px!important;right:58px!important}
 .detail2d-views{gap:5px!important}
 .detail2d-views button{padding:7px 9px!important;font-size:11px!important}
 .detail2d-caption{left:8px!important;right:8px!important;bottom:56px!important;max-width:none!important}

 /* Cytology detail layouts */
 .cyto-detail3d,.cardio-detail3d{padding-right:0!important}
 .cyto-detail-info{top:auto!important;left:8px!important;right:8px!important;bottom:8px!important;width:auto!important;max-height:34vh!important}
 .mito-2d-view{inset:0!important;padding:70px 10px 38vh!important}

 #corUiToggleBtn{right:10px!important;bottom:max(10px,env(safe-area-inset-bottom))!important}
 .legal-dock{left:8px!important;bottom:max(8px,env(safe-area-inset-bottom))!important}
}
@media(max-width:820px) and (orientation:portrait){
 .mobile-orientation-note{position:fixed;z-index:105;left:50%;bottom:max(64px,calc(env(safe-area-inset-bottom) + 64px));transform:translateX(-50%);display:none;max-width:86vw;border:1px solid #29495f;background:#071522e8;color:#9fb7c8;border-radius:10px;padding:7px 10px;font-size:10px;text-align:center;pointer-events:none;backdrop-filter:blur(8px)}
 body.mobile-anatomy-active:not(.cor-ui-hidden) .mobile-orientation-note{display:block}
}


/* ===== Mobile crisp panel fix v1.11.1 ===== */
@media(max-width:820px){
  /* Do not blur the anatomy UI itself. On iOS/Safari backdrop-filter on the
     full-screen overlay can be composited above fixed off-canvas panels. */
  .mobile-panel-backdrop{
    background:rgba(2,7,13,.72)!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }

  /* Side panels must render as fully opaque, sharp UI layers. */
  .app>.side,
  .cyto-app>.cyto-side{
    background:#08131f!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    filter:none!important;
    opacity:1!important;
    -webkit-font-smoothing:antialiased;
    transform-style:flat!important;
  }

  .app>.side *,
  .cyto-app>.cyto-side *{
    filter:none!important;
    -webkit-filter:none!important;
  }

  /* Remove glass blur from navigation/info controls inside the mobile UI. */
  .app>.side .btn,
  .app>.side .home-btn,
  .app>.side .card,
  .cyto-app>.cyto-side .btn,
  .cyto-app>.cyto-side .home-btn,
  .cyto-app>.cyto-side .card{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }

  /* Mobile panel trigger buttons should also stay crisp. */
  .mobile-ui-controls button{
    background:#071522!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
}

@media(max-width:650px){
 .main-menu{padding:16px 10px 80px!important;align-items:start!important;overflow-y:auto!important}
 .menu-shell{padding:14px 0 30px!important;width:100%!important}
 .menu-mark{width:54px!important;height:54px!important;margin-bottom:12px!important}
 .menu-shell h1{font-size:34px!important}
 .menu-shell>p{font-size:13px!important;margin:9px auto 18px!important;padding:0 6px!important}
 .menu-grid{grid-template-columns:1fr!important;gap:10px!important}
 .menu-card{min-height:0!important;padding:16px!important;border-radius:15px!important}
 .menu-icon{width:42px!important;height:42px!important;margin-bottom:11px!important}
 .menu-card h2{font-size:18px!important}
 .menu-card p{font-size:12px!important;margin-bottom:10px!important}
 .quiz-dashboard{margin-top:18px!important;padding-top:16px!important}
 .quiz-progress-grid{grid-template-columns:1fr!important}
 .account-dock{top:8px!important;right:8px!important}
 .account-copy{display:none!important}
 .account-btn{padding:4px!important;border-radius:50%!important}
 .auth-screen{padding:10px!important;overflow:auto!important}
 .auth-shell{width:100%!important;max-width:460px!important;margin:auto!important}
}