@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500&display=swap";
:root{--bg:#0e0e12;--surface:#141418;--surface-2:#1a1a20;--surface-3:#202028;--border:#ffffff12;--border-mid:#ffffff21;--text-1:#e4e2ec;--text-2:#7c7a90;--text-3:#48465a;--accent:#9575e0;--accent-soft:#9575e01f;--gold:#d4954a;--gold-soft:#d4954a1a;--danger:#c06060;--danger-soft:#c060601a;--mono:"JetBrains Mono", monospace;--font:"Inter", system-ui, sans-serif;--radius:8px;--radius-sm:5px;--panel-w:280px;--header-h:58px}[data-theme=light]{--bg:#f2f1ed;--surface:#faf9f7;--surface-2:#f0efe9;--surface-3:#e8e6de;--border:#00000014;--border-mid:#00000026;--text-1:#1c1b24;--text-2:#6a6878;--text-3:#a8a6b5;--accent:#6d3ec2;--accent-soft:#6d3ec214;--gold:#b86820;--gold-soft:#b8682014;--danger:#a84040;--danger-soft:#a8404014}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;overflow:hidden}body{font-family:var(--font);background:var(--bg);color:var(--text-1);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:14px;line-height:1.5;transition:background .3s,color .3s}:root body:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(120% 60% at 50% -10%,#9575e00f 0%,#0000 60%);position:fixed;inset:0}.app-shell{z-index:1;flex-direction:column;width:100vw;height:100vh;display:flex;position:relative}.app-header{height:var(--header-h);background:var(--surface);border-bottom:1px solid var(--border);z-index:20;flex-shrink:0;justify-content:space-between;align-items:center;padding:0 18px;transition:background .3s,border-color .3s;display:flex}.header-brand{align-items:center;gap:10px;display:flex}.header-logo{filter:drop-shadow(0 2px 8px #7f00ff26);flex-shrink:0;width:32px;height:32px;display:block}.header-title{color:var(--text-1);letter-spacing:-.01em;font-size:.875rem;font-weight:600;transition:color .3s}.header-subtitle{color:var(--text-3);margin-top:1px;font-size:.7rem;transition:color .3s}.header-actions{align-items:center;gap:8px;display:flex}.theme-toggle{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface-2);width:34px;height:34px;color:var(--text-2);cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;font-size:15px;transition:all .2s;display:flex}.theme-toggle:hover{background:var(--surface-3);border-color:var(--border-mid);color:var(--text-1)}.qubit-control{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);align-items:center;gap:7px;height:34px;padding:0 12px;transition:background .3s,border-color .3s;display:flex}.qubit-control label{color:var(--text-3);font-size:.72rem;font-weight:500}.count-btn{border:1px solid var(--border);width:22px;height:22px;color:var(--text-2);cursor:pointer;background:0 0;border-radius:4px;justify-content:center;align-items:center;font-size:1rem;line-height:1;transition:all .15s;display:flex}.count-btn:hover:not(:disabled){background:var(--surface-3);border-color:var(--border-mid);color:var(--text-1)}.count-btn:disabled{opacity:.25;cursor:not-allowed}.count-num{color:var(--text-1);text-align:center;min-width:14px;font-size:.85rem;font-weight:600}.app-body{flex:1;min-height:0;display:flex}.canvas-wrap{flex:1;min-width:0;position:relative}.panel{width:var(--panel-w);background:var(--surface);border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;transition:background .3s,border-color .3s;display:flex;overflow:hidden auto}.panel-right{border-right:none;border-left:1px solid var(--border)}.panel-section{border-bottom:1px solid var(--border);padding:16px 15px;transition:border-color .3s}.panel-section:last-child{border-bottom:none}.section-title{color:var(--text-3);text-transform:uppercase;letter-spacing:.1em;margin-bottom:11px;font-size:.66rem;font-weight:600;transition:color .3s}.state-info-block{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:8px;padding:11px 12px;transition:background .3s,border-color .3s}.state-label{color:var(--text-3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px;font-size:.66rem}.dirac-notation{font-family:var(--mono);color:var(--accent);word-break:break-word;font-size:.8rem;line-height:1.6;transition:color .3s}.qubit-row{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);align-items:center;gap:9px;margin-bottom:5px;padding:8px 10px;transition:background .2s,border-color .2s;display:flex}.qubit-row:hover{border-color:var(--border-mid)}.qubit-color-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.qubit-stats{flex:1;min-width:0}.qubit-stat-name{color:var(--text-2);margin-bottom:1px;font-size:.7rem;transition:color .3s}.qubit-stat-val{font-family:var(--mono);color:var(--text-1);font-size:.73rem;transition:color .3s}.purity-bar{background:var(--border);border-radius:2px;height:3px;margin-top:5px;overflow:hidden}.purity-fill{opacity:.85;border-radius:2px;height:100%;transition:width .5s cubic-bezier(.4,0,.2,1)}.prob-bar-wrap{flex-direction:column;gap:5px;display:flex}.prob-row{align-items:center;gap:8px;display:flex}.prob-label{font-family:var(--mono);color:var(--text-2);min-width:38px;font-size:.72rem;transition:color .3s}.prob-track{background:var(--border);border-radius:2px;flex:1;height:4px;overflow:hidden}.prob-fill{background:var(--accent);opacity:.75;border-radius:2px;height:100%;transition:width .4s cubic-bezier(.4,0,.2,1),background .3s}.prob-pct{font-family:var(--mono);color:var(--text-3);text-align:right;min-width:38px;font-size:.7rem;transition:color .3s}.target-selector{flex-wrap:wrap;gap:5px;display:flex}.target-chip{border:1px solid var(--border);color:var(--text-2);font-size:.76rem;font-family:var(--font);cursor:pointer;background:0 0;border-radius:20px;padding:4px 13px;font-weight:500;transition:all .15s}.target-chip:hover{border-color:var(--border-mid);color:var(--text-1)}.target-chip.active{background:var(--accent-soft);color:var(--accent);border-color:#9575e066}[data-theme=light] .target-chip.active{border-color:#6d3ec259}.gate-grid{grid-template-columns:1fr 1fr 1fr;gap:5px;display:grid}.gate-btn{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface-2);height:50px;color:var(--text-1);font-family:var(--font);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:2px;transition:all .15s;display:flex}.gate-btn:hover{background:var(--surface-3);border-color:var(--border-mid);transform:translateY(-1px);box-shadow:0 3px 10px #0003}[data-theme=light] .gate-btn:hover{box-shadow:0 3px 10px #0000001a}.gate-btn:active{transform:translateY(0)}.gate-btn:hover .gate-name{color:var(--gold)}.gate-name{font-family:var(--mono);color:var(--text-1);font-size:.95rem;font-weight:500;line-height:1;transition:color .15s}.gate-desc{color:var(--text-3);letter-spacing:.02em;font-size:.58rem;transition:color .15s}.gate-btn:hover .gate-desc{color:var(--text-2)}.gate-btn-wide{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface-2);width:100%;height:34px;color:var(--text-2);font-family:var(--font);cursor:pointer;justify-content:center;align-items:center;margin-bottom:5px;font-size:.76rem;transition:all .15s;display:flex}.gate-btn-wide:hover{background:var(--surface-3);border-color:var(--border-mid);color:var(--text-1)}.rotation-group{margin-bottom:13px}.rotation-label{color:var(--text-2);justify-content:space-between;align-items:center;margin-bottom:6px;font-size:.76rem;transition:color .3s;display:flex}.rotation-value{font-family:var(--mono);color:var(--text-1);font-size:.73rem;transition:color .3s}input[type=range]{appearance:none;background:var(--border);cursor:pointer;border-radius:2px;outline:none;width:100%;height:3px;transition:background .3s}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--text-1);border:2px solid var(--surface);cursor:pointer;border-radius:50%;width:13px;height:13px;transition:background .15s,transform .15s;box-shadow:0 1px 4px #0000004d}input[type=range]::-webkit-slider-thumb:hover{background:var(--gold);transform:scale(1.15)}.eq-writer{flex-direction:column;gap:6px;display:flex}.eq-toolbar{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);flex-wrap:wrap;gap:3px;padding:6px;transition:background .3s,border-color .3s;display:flex}.eq-sym-btn{color:var(--text-2);font-family:var(--mono);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:3px;padding:3px 6px;font-size:.73rem;transition:all .12s}.eq-sym-btn:hover{background:var(--surface-3);border-color:var(--border);color:var(--accent)}.eq-input{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-1);font-family:var(--mono);resize:none;outline:none;padding:8px 10px;font-size:.78rem;line-height:1.5;transition:border-color .2s,background .3s,color .3s}.eq-input:focus{border-color:#9575e073}.eq-input::placeholder{color:var(--text-3)}.mini-action-btn{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface-3);height:26px;color:var(--text-2);font-family:var(--font);cursor:pointer;margin-top:9px;padding:0 9px;font-size:.7rem;transition:all .15s}.mini-action-btn:hover{border-color:var(--border-mid);color:var(--text-1)}.amplitude-editor{max-height:210px;margin-bottom:8px;padding-right:2px;overflow-y:auto}.amp-row{grid-template-columns:48px minmax(0,1fr) minmax(0,1fr) 10px;align-items:center;gap:5px;margin-bottom:5px;display:grid}.amp-basis{font-family:var(--mono);color:var(--text-2);font-size:.7rem}.amp-input{border:1px solid var(--border);background:var(--surface-2);min-width:0;height:28px;color:var(--text-1);font-family:var(--mono);border-radius:4px;outline:none;padding:0 6px;font-size:.72rem}.amp-input:focus{border-color:#9575e073}.amp-imag-label{font-family:var(--mono);color:var(--text-3);font-size:.72rem}.state-input-error{color:var(--danger);margin:0 0 8px;font-size:.7rem;line-height:1.35}.saved-notes{max-height:180px;margin-top:10px;padding-right:2px;overflow-y:auto}.saved-note{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);margin-bottom:7px;padding:8px 9px}.saved-note-source{color:var(--accent);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px;font-size:.62rem;font-weight:600}.saved-note-body{color:var(--text-1);font-family:var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;font-size:.72rem;line-height:1.45}.btn{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface-2);height:32px;color:var(--text-2);font-family:var(--font);cursor:pointer;white-space:nowrap;justify-content:center;align-items:center;gap:6px;padding:0 13px;font-size:.78rem;font-weight:500;transition:all .15s;display:inline-flex}.btn:hover{background:var(--surface-3);border-color:var(--border-mid);color:var(--text-1)}.btn-danger{color:var(--danger);border-color:#c060604d}.btn-danger:hover{background:var(--danger-soft);border-color:#c060608c}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-mid);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#9696b44d}.panel-toggle-btn,.panel-overlay{display:none}@media (max-width:900px){.app-header{height:auto;min-height:var(--header-h);flex-wrap:wrap;gap:8px;padding:8px 12px}.header-actions{flex-wrap:wrap;justify-content:flex-end}.app-body{position:relative;overflow-x:hidden}.canvas-wrap{flex:1;width:100%;min-height:400px}.panel-overlay.visible{-webkit-backdrop-filter:blur(3px);z-index:40;background:#0006;transition:opacity .3s;display:block;position:absolute;inset:0}[data-theme=light] .panel-overlay.visible{background:#fff6}.panel{z-index:50;width:320px;max-width:85vw;height:100%;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .3s;position:absolute;top:0;bottom:0;box-shadow:0 0 20px #00000080}[data-theme=light] .panel{box-shadow:0 0 20px #0000001a}.panel-left{border-right:1px solid var(--border);left:0;transform:translate(-100%)}.panel-left.open{transform:translate(0)}.panel-right{border-left:1px solid var(--border);right:0;transform:translate(100%)}.panel-right.open{transform:translate(0)}.panel-toggle-btn{z-index:30;border:1px solid var(--border);-webkit-backdrop-filter:blur(8px);height:40px;color:var(--text-1);font-family:var(--font);cursor:pointer;background:#141418a6;border-radius:20px;justify-content:center;align-items:center;padding:0 16px;font-size:.8rem;font-weight:500;transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .3s,background .3s;display:flex;position:absolute;top:15px;box-shadow:0 4px 12px #00000040}[data-theme=light] .panel-toggle-btn{background:#faf9f7bf;box-shadow:0 4px 12px #0000001a}.panel-toggle-btn:hover{background:var(--surface-3)}.panel-toggle-btn.left-toggle{left:15px}.panel-toggle-btn.right-toggle{right:15px}.panel-toggle-btn.hidden{opacity:0;pointer-events:none;transform:scale(.9)}}