.debug-panel{background:var(--debug-panel-bg,#1a1a1ae6);-webkit-backdrop-filter:blur(12px);width:340px;max-width:calc(90vw - 24px);max-height:calc(100vh - 80px);color:var(--debug-panel-text,#e0e0e0);border:1px solid var(--debug-panel-border,#333);z-index:10000;opacity:0;pointer-events:none;border-radius:12px;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;font-size:13px;line-height:1.5;transition:transform .25s cubic-bezier(.4,0,.2,1),opacity .25s;position:fixed;top:12px;right:12px;overflow-y:auto;transform:translate(calc(100% + 24px));box-shadow:0 8px 32px #0006}.debug-panel.visible{opacity:1;pointer-events:auto;transform:translate(0)}.debug-panel-docked{width:100%;max-width:none;height:auto;max-height:none;box-shadow:none;border:none;border-radius:0;position:relative;opacity:1!important;pointer-events:auto!important;transform:none!important}.debug-panel-close{color:#888;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:20px;line-height:1;transition:color .15s,background .15s;position:absolute;top:10px;right:10px}.debug-panel-close:hover{color:#fff;background:#ffffff1a}.debug-panel-toggle{background:var(--debug-toggle-bg,#333);color:#ccc;cursor:pointer;z-index:10001;opacity:.7;border:1px solid #555;border-radius:20px;padding:8px 16px;font-size:12px;font-weight:600;transition:all .2s;position:fixed;bottom:16px;right:16px;box-shadow:0 2px 8px #0000004d}.debug-panel-toggle:hover{opacity:1;transform:translateY(-1px);box-shadow:0 4px 12px #0006}.debug-panel-toggle:active{transform:translateY(0)}.debug-panel-toggle.active{background:var(--debug-toggle-active,#444);color:#fff;opacity:1;border-color:#2196f3}.debug-panel-toggle.has-scenario{color:#a5d6a7;opacity:1;background:#1b5e20;border-color:#4caf50}.debug-form{flex-direction:column;gap:20px;display:flex}.debug-form-title{color:var(--debug-title-color,#fff);margin:0 0 4px;font-size:15px;font-weight:600}.debug-form-description{color:var(--debug-description-color,#aaa);margin:0 0 12px;font-size:12px;line-height:1.5}.debug-form-columns{flex-direction:column;gap:16px;display:flex}.debug-form-column{flex-direction:column;gap:12px;display:flex}.debug-form-column-label{text-transform:uppercase;letter-spacing:.5px;color:var(--debug-column-label-color,#999);border-bottom:1px solid var(--debug-border-color,#333);margin:0 0 4px;padding-bottom:6px;font-size:12px;font-weight:600}.debug-form-field{flex-direction:column;gap:6px;display:flex}.debug-form-label{color:var(--debug-label-color,#ccc);font-size:13px;font-weight:500;display:block}.debug-form-label.required:after{content:" *";color:var(--debug-required-color,#f44336)}.debug-form-input,.debug-form-select,.debug-form-textarea{background:var(--debug-input-bg,#2a2a2a);border:1px solid var(--debug-input-border,#3a3a3a);color:var(--debug-input-text,#e0e0e0);box-sizing:border-box;border-radius:4px;width:100%;padding:8px 12px;font-family:inherit;font-size:13px;transition:border-color .2s,background-color .2s}.debug-form-input:focus,.debug-form-select:focus,.debug-form-textarea:focus{border-color:var(--debug-input-focus,#2196f3);background:var(--debug-input-focus-bg,#333);outline:none}.debug-form-input:disabled,.debug-form-select:disabled,.debug-form-textarea:disabled{opacity:.5;cursor:not-allowed}.debug-form-input::placeholder,.debug-form-textarea::placeholder{color:var(--debug-placeholder-color,#666)}.debug-form-select{cursor:pointer}.debug-form-select option{background:var(--debug-option-bg,#2a2a2a);color:var(--debug-option-text,#e0e0e0)}.debug-form-select option:disabled{color:var(--debug-option-disabled,#666);font-style:italic}.debug-form-label-checkbox{cursor:pointer;flex-direction:row;align-items:center;gap:8px;display:flex}.debug-form-checkbox{cursor:pointer;width:18px;height:18px;accent-color:var(--debug-checkbox-accent,#2196f3)}.debug-form-label-checkbox span{color:var(--debug-label-color,#ccc);font-size:13px}.debug-form-textarea{resize:vertical;min-height:80px;font-family:Courier New,monospace}.debug-form-help{color:var(--debug-help-color,#888);margin-top:2px;font-size:12px;font-style:italic}.debug-form-field.has-error .debug-form-input,.debug-form-field.has-error .debug-form-select,.debug-form-field.has-error .debug-form-textarea{border-color:var(--debug-error-border,#f44336)}.debug-form-error{color:var(--debug-error-text,#f44336);margin-top:4px;font-size:12px}.debug-form-actions{border-top:1px solid var(--debug-border-color,#333);gap:12px;margin-top:16px;padding-top:16px;display:flex}.debug-form-submit,.debug-form-reset{cursor:pointer;border:none;border-radius:4px;flex:1;padding:10px 20px;font-size:13px;font-weight:600;transition:all .2s}.debug-form-submit{background:var(--debug-submit-bg,#4caf50);color:#fff}.debug-form-submit:hover{background:var(--debug-submit-hover,#45a049);transform:translateY(-1px);box-shadow:0 2px 8px #4caf5066}.debug-form-reset{background:var(--debug-reset-bg,#757575);color:#fff}.debug-form-reset:hover{background:var(--debug-reset-hover,#616161);transform:translateY(-1px);box-shadow:0 2px 8px #75757566}.debug-form-submit:active,.debug-form-reset:active{transform:translateY(0)}.debug-panel::-webkit-scrollbar{width:8px}.debug-panel::-webkit-scrollbar-track{background:var(--debug-scrollbar-track,#1a1a1a)}.debug-panel::-webkit-scrollbar-thumb{background:var(--debug-scrollbar-thumb,#444);border-radius:4px}.debug-panel::-webkit-scrollbar-thumb:hover{background:var(--debug-scrollbar-thumb-hover,#555)}@media (width<=768px){.debug-panel{width:calc(100vw - 24px);max-height:60vh;top:auto;bottom:52px;right:12px}.debug-panel-toggle{padding:6px 12px;font-size:11px;bottom:8px;right:8px}}.debug-panel-status{color:#a5d6a7;background:#1b5e2033;border:1px solid #4caf5044;border-radius:6px;align-items:center;gap:8px;margin-top:12px;padding:8px 12px;font-size:12px;display:flex}.debug-panel-status.inactive{color:#888;background:#42424233;border-color:#5554}.debug-form-checkbox:focus,.debug-form-submit:focus,.debug-form-reset:focus{outline:2px solid var(--debug-input-focus,#2196f3);outline-offset:2px}body{user-select:none;background-color:color-mix(in oklab, var(--brand-primary,black) 70%, black);width:100svw;height:100svh;margin:0;transition:opacity .35s ease-in-out;overflow:hidden}body.fade-out{opacity:0;pointer-events:none}iframe{border:none}#demo-badge{z-index:10002;pointer-events:none;color:#fff;letter-spacing:.18em;text-transform:uppercase;backdrop-filter:blur(12px);background:#000000d1;border:1px solid #ffffff26;border-radius:999px;padding:5px 16px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:.7rem;font-weight:700;position:fixed;top:16px;left:50%;transform:translate(-50%);box-shadow:0 2px 12px #0006,inset 0 1px #ffffff14}#alert-modal{color:#fff;backdrop-filter:blur(20px);border-radius:20px;min-width:350px;max-width:480px;padding:32px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;overflow:hidden;border:none!important}#alert-modal[open]{margin:auto;position:fixed;inset:0;&.error{background:linear-gradient(135deg,#1a1a2e 0%,#2d1b3d 50%,#16213e 100%);box-shadow:0 32px 64px #0009,0 0 0 1px #ff4f4f4d,inset 0 1px #ffffff1a;&:before{content:"";background:linear-gradient(90deg,#0000,#ff4f4fcc,#0000);height:2px;position:absolute;top:0;left:0;right:0}& #alert-content{& h4{background:linear-gradient(135deg,#ff6b6b,#ffa8a8);-webkit-text-fill-color:transparent;background-clip:text}& button{background:linear-gradient(135deg,#ff4757 0%,#ff3838 50%,#ff2f2f 100%);box-shadow:0 8px 24px #ff475766,inset 0 1px #fff3;&:hover{background:linear-gradient(135deg,#ff3742 0%,#ff2f2f 50%,#ff1e1e 100%);box-shadow:0 16px 40px #ff475799,inset 0 1px #ffffff4d}&:active{box-shadow:0 6px 20px #ff475780}}}}&.warning{background:linear-gradient(135deg,#1a1a2e 0%,#3d2d1b 50%,#3e2116 100%);box-shadow:0 32px 64px #0009,0 0 0 1px #ffc14f4d,inset 0 1px #ffffff1a;&:before{content:"";background:linear-gradient(90deg,#0000,#ffc14fcc,#0000);height:2px;position:absolute;top:0;left:0;right:0}& #alert-content{& h4{background:linear-gradient(135deg,#ffb347,#ffc870);-webkit-text-fill-color:transparent;background-clip:text}& button{background:linear-gradient(135deg,#ff9f43 0%,#ff8c38 50%,#ff7f2f 100%);box-shadow:0 8px 24px #ff9f4366,inset 0 1px #fff3;&:hover{background:linear-gradient(135deg,#ff8c42 0%,#ff7f2f 50%,#ff6f1e 100%);box-shadow:0 16px 40px #ff9f4399,inset 0 1px #ffffff4d}&:active{box-shadow:0 6px 20px #ff9f4380}}}}& #alert-content{flex-direction:column;gap:20px;display:flex;& h4{text-align:center;letter-spacing:-.02em;margin:0 0 8px;font-size:1.5rem;font-weight:700}& p{text-align:center;opacity:.95;color:#ffffffe6;margin:0;font-size:1rem;line-height:1.5}& button{cursor:pointer;color:#fff;border:none;border-radius:12px;outline:none;margin-top:12px;padding:14px 24px;font-size:1rem;font-weight:600;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;&:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .6s;position:absolute;top:0;left:-100%}&:hover:before{left:100%}&:hover{transform:translateY(-2px)scale(1.02)}&:active{transform:translateY(-1px)scale(1.01)}}}}