:root{--bg:#0f172a;--panel:#111827f2;--muted:#94a3b8;--text:#e5e7eb;--accent:#38bdf8;--brand:#a7f3d0}
body.hc{--bg:#000;--panel:#000000e6;--muted:#bdbdbd;--text:#fff;--accent:#00e5ff;--brand:#fff}
/* Tema claro */
body.theme-light:not(.hc){--bg:#f8fafc;--panel:#ffffffee;--muted:#475569;--text:#0f172a;--accent:#0ea5e9;--brand:#0f766e}
.cnt9-lab-root{color:var(--text)}
.lab-wrap{max-width:1200px;margin:20px auto;padding:0 16px;color:var(--text);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Helvetica Neue,Arial}
.badge{font-size:12px;color:#0b1220;background:linear-gradient(135deg,var(--accent),#7dd3fc);padding:2px 8px;border-radius:999px;font-weight:800}
.panel{background:var(--panel);border:1px solid #1f2937;backdrop-filter: blur(6px);border-radius:16px;box-shadow: 0 10px 40px rgba(0,0,0,.35)}
.grid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
.display{position:relative;padding:16px}
.toolbar{display:grid;grid-template-columns: repeat(12, minmax(0,1fr)); gap:8px; align-items:center; margin-bottom:12px}
.toolbar label{font-size:12px;color:var(--muted);grid-column: span 2}
.toolbar select{grid-column: span 4}
.toolbar .wide{grid-column: span 6}
select, button, .btnLink{background:#0b1220;color:var(--text);border:1px solid #202b3a;border-radius:12px;padding:10px 12px;font-size:14px;transition:.2s border-color,.2s transform,.2s background;outline:none;text-decoration:none;display:inline-block}
button:hover, select:hover, .btnLink:hover{border-color:#2f4158}
button:active, .btnLink:active{transform: translateY(1px)}
.soft{background:#0b1220;border:1px dashed #2b3748}
.toggle.active{border-color:var(--accent); box-shadow:0 0 0 2px #0ea5e980 inset}
.no-select{user-select:none}
canvas{width:100%; height:460px; display:block; border-radius:12px; background:#0b1220; border:1px solid #1f2937}
.writer{padding:16px; display:flex; flex-direction:column; gap:10px}
textarea{min-height:260px; resize:vertical; background:#0b1220; color:var(--text); border:1px solid #1f2937; border-radius:12px; padding:12px; font:16px/1.6 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace}
.stats{display:grid; grid-template-columns: repeat(3, 1fr); gap:10px}
.stat{background:#0b1220; border:1px solid #1f2937; border-radius:12px; padding:10px 12px}
.stat b{display:block; font-size:22px}
.muted{color:var(--muted)}
.footer{display:flex; justify-content:space-between; align-items:center; padding:12px 16px; border-top:1px solid #1f2937}
.hint{font-size:12px; color:var(--muted)}
.brand{font-size:12px; color:var(--brand); opacity:.95; font-weight:600}
.pill{display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; border:1px solid #2b3748; background:#0b1220; font-size:12px}
.toast{position:fixed; top:14px; right:14px; display:flex; flex-direction:column; gap:8px; z-index:9999}
.toast .t{background:#0b1220; border:1px solid #1f2937; padding:10px 12px; border-radius:12px; box-shadow: 0 6px 24px rgba(0,0,0,.35)}
.modal{position:fixed; inset:0; background:rgba(0,0,0,.6); display:none; align-items:center; justify-content:center; z-index:10000}
.modal.show{display:flex}
.card{background:#0b1220; border:1px solid #1f2937; border-radius:16px; padding:16px; width:min(1040px,94vw)}
#charts{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:8px 0}
#charts canvas{width:100%; height:160px; background:#0b1220; border:1px solid #1f2937; border-radius:12px}
@media (max-width: 980px){ .grid{grid-template-columns:1fr} canvas{height:420px} .toolbar label{grid-column: span 3} .toolbar select{grid-column: span 9} #charts{grid-template-columns:1fr} }
@media (max-width: 640px){ canvas{height:320px} textarea{min-height:200px} .footer{flex-direction:column; align-items:flex-start; gap:6px} #btnTheme,#btnProjector,#btnFullscreen{display:none} }
/* Mini-menu */
.menu{position:relative; display:inline-block}
.menu-btn{background:#0b1220;border:1px solid #202b3a;border-radius:12px;padding:10px 12px}
.menu-panel{position:absolute; right:0; top:100%; margin-top:6px; background:var(--panel); border:1px solid #1f2937; border-radius:12px; padding:10px; width:260px; display:none; z-index:12000; box-shadow:0 10px 40px rgba(0,0,0,.35)}
.menu-panel.show{display:block}
.menu-panel .row{display:flex; align-items:center; justify-content:space-between; gap:8px; margin:6px 0}
.menu-panel label{font-size:12px; color:var(--muted)}
.menu-panel .seg{display:flex; gap:6px}
.menu-panel .seg button{padding:6px 8px; font-size:12px}
