/* Optics-specific layer on top of the shared obsidian laboratory theme. */
body.tool-optics-lab {
    --spectrum-cyan: #69f5e7;
    --spectrum-violet: #a78bfa;
    --spectrum-rose: #f187c8;
    --spectrum-gold: #f8d477;
}

body.tool-optics-lab .header-icon {
    border-radius: 50% 8px 50% 8px;
    background: conic-gradient(from 210deg,rgba(105,245,231,.12),rgba(167,139,250,.22),rgba(241,135,200,.12),rgba(105,245,231,.12));
}

body.tool-optics-lab .canvas-area { min-width: 0; width: 100%; }
body.tool-optics-lab .canvas-container {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-width: 0;
    overflow: hidden;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
    padding: 0 !important;
}

body.tool-optics-lab .canvas-container .canvas-header { width: auto; flex: 0 0 auto; }
body.tool-optics-lab .canvas-container > canvas {
    display: block;
    align-self: center;
    box-sizing: border-box;
    width: min(100%, 760px) !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 18px !important;
    background:
        radial-gradient(circle at 50% 45%,rgba(69,48,126,.16),transparent 55%),
        linear-gradient(145deg,#090912,#050509) !important;
    border: 1px solid rgba(167,139,250,.24) !important;
    border-radius: 16px 4px 16px 4px !important;
    box-shadow: inset 0 0 80px rgba(0,0,0,.58),0 0 55px rgba(105,245,231,.07) !important;
}

body.tool-optics-lab .canvas-container::after {
    content: "SPECTRAL FIELD";
    align-self: center;
    margin: -8px 0 14px;
    color: rgba(167,139,250,.42);
    font: 600 .58rem/1 ui-monospace,SFMono-Regular,monospace;
    letter-spacing: .24em;
}

body.tool-optics-lab .stats-bar { position: relative; }
body.tool-optics-lab .stats-bar::after {
    content:""; position:absolute; inset:auto 12% -1px; height:1px;
    background:linear-gradient(90deg,transparent,var(--spectrum-cyan),var(--spectrum-violet),var(--spectrum-rose),transparent);
    opacity:.55;
}

body.tool-optics-lab .info-panel,
body.tool-optics-lab .results-panel,
body.tool-optics-lab .intensity-panel,
body.tool-optics-lab .status-panel {
    color:var(--text-secondary);
    background:linear-gradient(145deg,rgba(20,19,35,.94),rgba(9,9,16,.94)) !important;
    border-color:rgba(167,139,250,.16) !important;
    box-shadow:0 20px 55px rgba(0,0,0,.24);
}

body.tool-optics-lab .value-display,
body.tool-optics-lab .value-badge,
body.tool-optics-lab .stat-value { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; }

@media (max-width: 900px) {
    body.tool-optics-lab .canvas-area { order:1; }
    body.tool-optics-lab .options-sidebar { order:2; }
}

@media (max-width: 620px) {
    body.tool-optics-lab .canvas-container > canvas {
        width: calc(100% - 12px) !important;
        margin: 6px !important;
        border-radius:12px 3px 12px 3px !important;
    }
    body.tool-optics-lab .canvas-container::after { margin:5px 0 10px; }
}