:root{--bg:oklch(98.5% .008 52);--bg-panel:oklch(99.2% .005 52);--bg-muted:oklch(96% .01 52);--bg-hover:oklch(94.5% .012 52);--border:oklch(86% .012 52);--border-strong:oklch(72% .016 50);--text:oklch(30% .028 48);--text-muted:oklch(45% .022 50);--text-dim:oklch(55% .018 52);--accent:oklch(55% .16 45);--accent-hover:oklch(48% .16 42);--accent-fill:oklch(96% .03 50);--accent-2:oklch(42% .08 42);--state-ket:var(--text);--font-mono:"JetBrains Mono", "Fira Code", "SF Mono", ui-monospace, monospace;--font-sans:"Source Sans 3", "Segoe UI", system-ui, sans-serif;--font-display:"Hina Mincho", "Times New Roman", serif;--radius:3px;--ease:cubic-bezier(.16, 1, .3, 1);--spring:cubic-bezier(.34, 1.35, .64, 1)}@keyframes app-enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes bg-drift{0%,to{background-position:0%}50%{background-position:100%}}@keyframes playback-glow{0%,to{text-shadow:0 0 #0000}50%{text-shadow:0 0 12px oklch(55% .16 45/.35)}}@keyframes chart-now-pulse{0%,to{stroke-opacity:.55}50%{stroke-opacity:1}}@keyframes chart-dot-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.18)}}*,:before,:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font-sans);font-synthesis:none;background:linear-gradient(135deg, var(--bg) 0%, oklch(98.2% .012 48) 35%, oklch(98.8% .006 54) 65%, var(--bg) 100%);color:var(--text);-webkit-font-smoothing:antialiased;background-size:220% 220%;font-weight:400;animation:28s ease-in-out infinite bg-drift}.app-enter-item{animation:app-enter .72s var(--ease) both}.app-title.app-enter-item{animation-delay:40ms}.viz-column.app-enter-item{animation-delay:.12s}.sidebar.app-enter-item{animation-delay:.2s}.app{flex-direction:column;height:100%;min-height:100%;display:flex;position:relative}.app-title{z-index:10;text-align:left;pointer-events:none;position:absolute;top:1rem;left:1.25rem}.app-title h1{font-family:var(--font-display);letter-spacing:0;color:var(--accent);margin:0;font-size:3rem;font-weight:600}.app-title .subtitle{color:var(--text-dim);margin:.25rem 0 0;font-size:1rem}.app-body{flex-direction:column;flex:1;min-height:0;display:flex}.app-main{flex:1;grid-template-columns:minmax(0,1fr) minmax(300px,400px);gap:0;height:100%;min-height:0;display:grid}.sidebar{border-left:1px solid var(--border);background:var(--bg-panel);flex-direction:column;gap:0;min-width:0;min-height:0;display:flex;overflow:hidden}.sidebar-body{overscroll-behavior:contain;flex-direction:column;flex:1;gap:0;min-width:0;min-height:0;padding:1rem 1.125rem 1.25rem;display:flex;overflow:hidden auto}.sidebar-tab,.sidebar-backdrop{display:none}.viz-column{flex-direction:column;align-items:stretch;min-width:0;min-height:0;padding:6.25rem 1.25rem 0;display:flex;position:relative}.bloch-sphere-wrap{flex-direction:column;flex:1;width:100%;min-height:0;display:flex;position:relative}.bloch-sphere{flex:1;width:100%;min-height:0;overflow:hidden}.playback{flex-direction:column;flex-shrink:0;align-items:center;display:flex}.playback-bar{justify-content:center;align-items:center;width:100%;padding:.75rem 1.5rem;display:flex}.playback-controls{align-items:center;gap:.5rem;display:flex}.playback-time{font-family:var(--font-mono);color:var(--text-dim);font-variant-numeric:tabular-nums;transition:color .3s var(--ease);padding:.35rem 0 .5rem;font-size:.75rem}.playback.is-playing .playback-time{color:var(--accent);animation:2.4s ease-in-out infinite playback-glow}.playback-github{width:2.25rem;height:2.25rem;color:var(--text-dim);border-radius:var(--radius);transition:color .18s var(--ease);justify-content:center;align-items:center;text-decoration:none;display:flex;position:absolute;bottom:.75rem;right:.75rem}.playback-github:hover{color:var(--accent)}.playback-github:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.icon-btn{border-radius:var(--radius);border:1px solid var(--accent);background:var(--accent);width:2.25rem;height:2.25rem;color:var(--bg);cursor:pointer;transition:background .18s var(--ease), border-color .18s var(--ease), color .18s var(--ease), transform .22s var(--spring), box-shadow .22s var(--ease);justify-content:center;align-items:center;padding:0;display:flex}.icon-btn:hover:not(:disabled){background:var(--accent-hover);border-color:var(--accent-hover);color:var(--bg);transform:translateY(-1px);box-shadow:0 4px 14px oklch(55% .16 45/.22)}.icon-btn:active:not(:disabled){box-shadow:none;transform:translateY(0)scale(.94)}.icon-btn-reset:hover:not(:disabled) .reset-icon{transform:rotate(-90deg)}.icon-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.icon-btn:disabled{opacity:.4;cursor:default}.reset-icon{filter:invert();width:16px;height:16px;transition:transform .35s var(--spring);display:block}.hamiltonian-controls{z-index:1;border-bottom:1px solid var(--border);flex-shrink:0;width:100%;min-width:0;max-width:100%;margin-bottom:1.25rem;padding-bottom:1.25rem;position:relative}.dirac-panel{flex:1;padding-top:.125rem}.panel-header{justify-content:space-between;align-items:center;margin-bottom:.875rem;display:flex}.panel-label{letter-spacing:0;text-transform:none;color:var(--accent);font-size:1rem;font-weight:600}.btn{border-radius:var(--radius);border:1px solid var(--border);background:var(--bg-panel);color:var(--text);cursor:pointer;transition:background .18s var(--ease), border-color .18s var(--ease), color .18s var(--ease), transform .22s var(--spring), box-shadow .22s var(--ease);font-family:inherit;font-size:.8125rem;font-weight:400}.btn:active{transform:scale(.96)}.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn-ghost{background:var(--bg-panel);color:var(--text-muted);padding:.4rem .65rem}.btn-ghost:hover{background:var(--bg-hover);color:var(--text);border-color:var(--border-strong)}.btn-ghost.active{background:var(--accent-fill);border-color:var(--accent);color:var(--accent);transform:translateY(-1px);box-shadow:0 0 0 1px oklch(55% .16 45/.12)}.btn-ghost.state-btn,.btn-ghost.state-btn:hover,.btn-ghost.state-btn.active{color:var(--state-ket)}.slider-group{z-index:1;width:100%;min-width:0;margin-bottom:.875rem;position:relative}.slider-group:last-child{margin-bottom:0}.slider-track-wrap{min-width:0;position:relative}.slider-track{z-index:0;background:var(--bg-muted);border:1px solid var(--border);pointer-events:none;border-radius:1px;height:4px;position:absolute;top:50%;left:0;right:0;overflow:hidden;transform:translateY(-50%)}.slider-track:after{content:"";width:var(--slider-fill,50%);background:linear-gradient(90deg, oklch(96% .03 50/.5), var(--accent-fill));transition:width .22s var(--ease);position:absolute;top:0;bottom:0;left:0}.slider-tick{z-index:1;background:var(--border-strong);pointer-events:none;width:1px;height:10px;position:absolute;top:50%;transform:translate(-50%,-50%)}.slider-label{color:var(--text-muted);justify-content:space-between;margin-bottom:.35rem;font-size:.8125rem;display:flex}.slider-value{font-family:var(--font-mono);color:var(--accent);font-variant-numeric:tabular-nums;text-align:right;min-width:6ch;font-size:.75rem}input[type=range]{appearance:none;z-index:2;cursor:pointer;background:0 0;width:100%;max-width:100%;height:1.25rem;margin:0;padding:0;display:block;position:relative}input[type=range]:focus{outline:none}input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}input[type=range]::-webkit-slider-runnable-track{background:0 0;border:1px solid #0000;border-radius:1px;width:100%;height:4px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent-fill);border:1px solid var(--accent);cursor:grab;width:7px;height:18px;transition:box-shadow .2s var(--ease), transform .2s var(--spring);border-radius:1px;margin-top:-8px}input[type=range]:active::-webkit-slider-thumb{transform:scaleY(1.08);box-shadow:0 0 0 3px oklch(55% .16 45/.18)}input[type=range]::-moz-range-track{background:0 0;border:1px solid #0000;border-radius:1px;width:100%;height:4px}input[type=range]::-moz-range-thumb{background:var(--accent-fill);border:1px solid var(--accent);cursor:grab;width:7px;height:18px;transition:box-shadow .2s var(--ease), transform .2s var(--spring);border-radius:1px}input[type=range]:active::-moz-range-thumb{transform:scaleY(1.08);box-shadow:0 0 0 3px oklch(55% .16 45/.18)}.popover-trigger{border-radius:var(--radius);width:100%;min-width:0;margin-bottom:1.5rem}.popover-trigger .dirac-section{margin-bottom:0}.hamiltonian-controls>.popover-trigger{min-width:0;max-width:100%;margin-bottom:0}.popover-trigger:focus{outline:none}.popover-trigger:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.popover-panel{z-index:20;pointer-events:none;background:var(--bg);width:calc(17.5rem + 50px);color:var(--text);border-radius:var(--radius);box-shadow:0 0 0 1px var(--border-strong), 0 1px 2px oklch(32% .02 48/.06), 0 10px 28px oklch(32% .02 48/.12);position:fixed;overflow:hidden}.popover-panel:has(.hint-pauli-row){width:calc(22.5rem + 50px)}.popover-panel-inner{padding:.7rem .85rem;font-size:.8125rem;line-height:1.5}.popover-panel-inner p{margin:0}.popover-panel-inner p+p{margin-top:.45rem}.popover-panel .katex{font-size:.95em}.bloch-tip-popover{width:max-content;max-width:min(22rem,100vw - 16px)}.bloch-tip-popover.bloch-energy-popover{width:min(22rem,100vw - 16px)}.bloch-tip-popover .katex-display{text-align:left;margin:0!important}.bloch-tip-popover.bloch-energy-popover .katex-display{margin:0 0 .45rem!important}.hint-bloch-tip{font-weight:600}.hint-pauli-row{flex-wrap:wrap;align-items:center;gap:.55rem .85rem;display:flex}.hint-pauli-row .katex{font-size:.88em}@media (prefers-reduced-motion:reduce){body{background:var(--bg);animation:none}.app-enter-item{animation:none}.popover-panel{transition:none!important}.playback.is-playing .playback-time,.prob-chart.is-playing .prob-chart-now,.prob-chart.is-playing .prob-chart-dot-0,.prob-chart.is-playing .prob-chart-dot-1{animation:none}.icon-btn:hover:not(:disabled),.btn-ghost.active{transform:none}.sidebar,.sidebar-backdrop,.sidebar-tab-icon{transition:none!important}.prob-fill{transition:width 80ms linear}}.dirac-section{margin-bottom:1.5rem}.dirac-divided{border-bottom:1px solid var(--border);padding-bottom:1.5rem}.dirac-section:last-child{margin-bottom:0}.section-title{color:var(--accent);text-transform:none;letter-spacing:0;margin:0 0 .5rem;font-size:.9375rem;font-weight:600}.katex-display{min-height:2.75rem;font-size:.95rem;overflow:auto hidden;margin:.35rem 0!important}.math-katex-block .katex-display{text-align:left;margin:.25rem 0!important}.hamiltonian-formula{border-bottom:1px solid var(--border);width:100%;min-width:0;max-width:100%;margin-bottom:1rem;padding:.75rem 0;overflow:auto hidden}.hamiltonian-formula .katex-display{justify-content:center;align-items:center;min-width:0;max-width:100%;min-height:4.25rem;font-size:1rem;display:flex;margin:0!important}.slider-label .katex{font-size:.8125rem}.state-btn .katex{color:inherit;font-size:.875rem}.state-ket .katex{color:var(--state-ket)}.prob-label .katex{font-size:.6875rem}.preset-row,.state-preset-row{flex-wrap:wrap;gap:.4rem;display:flex}.hamiltonian-controls .preset-row{margin-bottom:1rem}.h-preset-btn{white-space:nowrap;padding:.32rem .55rem}.state-btn{width:2.75rem;height:2.5rem;font-family:var(--font-mono);justify-content:center;align-items:center;padding:0;font-size:.8125rem;display:inline-flex}.prob-bars{flex-direction:column;gap:.5rem;display:flex}.prob-row{color:var(--text-muted);grid-template-columns:3.5rem 1fr 3.5rem;align-items:center;gap:.5rem;font-size:.75rem;display:grid}.prob-label{font-family:var(--font-mono);font-size:.6875rem}.prob-track{background:var(--bg-muted);border:1px solid var(--border);border-radius:2px;height:6px;overflow:hidden}.prob-fill{height:100%;transition:width .28s var(--spring);transform-origin:0;border-radius:1px}.prob-fill-0{background:var(--accent)}.prob-fill-1{background:var(--accent-2)}.prob-value{font-family:var(--font-mono);text-align:right;font-variant-numeric:tabular-nums;min-width:4.5ch;font-size:.6875rem}.prob-chart{margin:.75rem 0 0;padding:0}.prob-chart-svg{width:100%;height:8.5rem;display:block;overflow:visible}.prob-chart-grid{stroke:var(--border);stroke-width:1px;fill:none}.prob-chart-axis{stroke:var(--border-strong);stroke-width:1px;fill:none}.prob-chart-tick{stroke:var(--border-strong);stroke-width:1px}.prob-chart-label,.prob-chart-axis-name{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:.625rem}.prob-chart-label{fill:var(--text-dim)}.prob-chart-axis-name{fill:var(--text-muted)}.prob-chart-p0,.prob-chart-p1{fill:none;stroke-width:1.75px;stroke-linejoin:round;stroke-linecap:round;transition:stroke-width .3s var(--ease)}.prob-chart-glow{stroke-width:3.5px;opacity:.22;pointer-events:none}.prob-chart.is-playing .prob-chart-p0,.prob-chart.is-playing .prob-chart-p1{stroke-width:2px}.prob-chart-p0{stroke:var(--accent)}.prob-chart-p1{stroke:var(--accent-2)}.prob-chart-now{stroke:var(--border-strong);stroke-width:1px;stroke-dasharray:2 2;fill:none;transition:stroke .3s var(--ease), stroke-width .3s var(--ease)}.prob-chart.is-playing .prob-chart-now{stroke:var(--accent);stroke-width:1.25px;animation:1.6s ease-in-out infinite chart-now-pulse}.prob-chart-dot-0{fill:var(--accent);stroke:var(--bg-panel);stroke-width:1px;transform-box:fill-box;transform-origin:50%;transition:r .2s var(--spring)}.prob-chart-dot-1{fill:var(--accent-2);stroke:var(--bg-panel);stroke-width:1px;transform-box:fill-box;transform-origin:50%;transition:transform .2s var(--spring)}.prob-chart.is-playing .prob-chart-dot-0,.prob-chart.is-playing .prob-chart-dot-1{animation:1.2s ease-in-out infinite chart-dot-pulse}.prob-chart.is-playing .prob-chart-dot-1{animation-delay:.15s}.teaching-box{background:var(--accent-fill);border:1px solid var(--border);border-radius:var(--radius);transition:background .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);padding:.75rem}.teaching-box:hover{border-color:var(--border-strong);box-shadow:0 6px 20px oklch(55% .16 45/.08)}.teaching-box p{color:var(--text-muted);margin:0;font-size:.8125rem;line-height:1.55}.teaching-box .teaching-readout{border-top:1px solid var(--border);color:var(--text);margin-top:.55rem;padding-top:.5rem}.teaching-box .katex{font-size:1em}@media (width<=1200px){.app-main{grid-template-columns:unset;flex-direction:column;display:flex}.viz-column{flex:1;min-height:0;padding-inline:.5rem}.sidebar.app-enter-item{animation:none}.sidebar{z-index:30;width:min(400px,100%);transition:transform .28s var(--ease);position:fixed;top:0;bottom:0;right:0;overflow:visible;transform:translate(100%)}.sidebar.is-open{transform:translate(0)}.sidebar:focus{outline:none}.sidebar-body{height:100%}.sidebar:not(.is-open) .sidebar-body{visibility:hidden;content-visibility:hidden;pointer-events:none}.sidebar-backdrop{z-index:20;opacity:0;pointer-events:none;transition:opacity .28s var(--ease);background:oklch(30% .028 48/.32);display:block;position:fixed;inset:0}.sidebar-backdrop.is-visible{opacity:1;pointer-events:auto}.sidebar-tab{z-index:1;border:1px solid var(--border);border-radius:var(--radius) 0 0 var(--radius);background:var(--bg-panel);width:1.5rem;height:3rem;color:var(--text-muted);cursor:pointer;touch-action:manipulation;transition:background .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease);border-right:none;justify-content:center;align-items:center;padding:0;display:flex;position:absolute;top:50%;left:0;transform:translate(-100%,-50%)}.sidebar-tab:hover{background:var(--bg-hover);color:var(--accent);border-color:var(--border-strong)}.sidebar-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.sidebar-tab-icon{transition:transform .22s var(--ease);display:block}.sidebar.is-open .sidebar-tab-icon{transform:rotate(180deg)}.playback-bar{flex-wrap:wrap;gap:.75rem;padding:.625rem 1rem}.playback-github{bottom:.625rem;right:.625rem}}