:root{--indigo: #534AB7;--indigo-hover: #6C63D6;--teal: #1D9E75;--teal-hover: #17876A;--charcoal: #12131A;--steel: #8A8F9E;--cloud: #F5F6F8;--white: #ffffff;--border: #E4E5EA;--glass-backdrop: linear-gradient(135deg, #534AB7, #1D9E75);--glass-bg: rgba(255, 255, 255, .16);--glass-border: rgba(255, 255, 255, .3);--glass-blur: 10px;--radius-pill: 20px;--radius-panel: 18px}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--white);background:var(--glass-backdrop);background-attachment:fixed;min-height:100vh}.app{max-width:1100px;margin:0 auto;padding:24px 20px}.glass{background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--glass-border);border-radius:var(--radius-panel);overflow:hidden}.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.22);gap:12px;flex-wrap:wrap}.brand{display:flex;align-items:center;gap:8px}.brand-name{font-weight:500;font-size:16px}.brand-slash{color:#ffffff8c;font-size:14px}.name-input{background:transparent;border:1px solid transparent;border-radius:8px;color:#ffffffe6;font-size:14px;padding:4px 8px;width:160px}.name-input:hover{border-color:#ffffff40}.name-input:focus{outline:none;border-color:#ffffff80;background:#ffffff1a}.badge{font-size:11px;padding:2px 9px;border-radius:var(--radius-pill);background:#ffffff40}.badge-locked{background:#12131a8c}.toolbar{display:flex;gap:8px;flex-wrap:wrap}.btn{font-size:13px;padding:8px 14px;border-radius:var(--radius-pill);border:1px solid rgba(255,255,255,.5);background:transparent;color:var(--white);cursor:pointer}.btn:hover{background:#ffffff1f}.btn-primary{background:var(--white);color:var(--indigo);border-color:transparent;font-weight:500}.btn-primary:hover{background:#eee}.btn:disabled{opacity:.5;cursor:not-allowed}.field{padding:9px 12px;background:#fff3;border:1px solid rgba(255,255,255,.35);border-radius:12px;color:var(--white);font-size:14px}.field::placeholder{color:#ffffffb3}.panes{display:flex;min-height:420px}.pane-list{width:210px;border-right:1px solid rgba(255,255,255,.22);padding:12px}.pane-main{flex:1;padding:16px;display:flex;flex-direction:column}.pane-details{width:200px;border-left:1px solid rgba(255,255,255,.22);padding:14px}.pane-label{font-size:11px;color:#ffffffa6;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}.list-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;color:#ffffffd9;font-size:13px;margin-bottom:4px;cursor:pointer;border:0;width:100%;text-align:left;background:transparent}.list-item:hover{background:#ffffff24}.list-item.active{background:#ffffff47;color:var(--white)}.preview{flex:1;background:#ffffff24;border:1px dashed rgba(255,255,255,.4);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#ffffffbf;font-size:13px;overflow:auto;padding:12px}.preview img{max-width:100%;max-height:360px;border-radius:8px}.preview iframe{width:100%;height:360px;border:0;border-radius:8px;background:#fff}.preview pre{margin:0;width:100%;white-space:pre-wrap;word-break:break-word;color:var(--white);font-family:ui-monospace,Menlo,monospace;font-size:13px}.editor{flex:1;display:flex;flex-direction:column;gap:10px}.editor-title{font-weight:500}.editor-body{flex:1;min-height:300px;resize:none;font-family:system-ui,sans-serif;line-height:1.6}.kind-tag{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:5px;background:#ffffff40;font-size:10px;font-weight:500;flex:none}.detail-row{font-size:13px;line-height:1.9}.detail-actions{margin-top:14px;display:flex;flex-direction:column;gap:8px}.empty{padding:60px 24px;text-align:center}.empty h1{font-size:24px;font-weight:500;margin:14px 0 6px}.empty p{color:#fffc;margin:0 0 22px;font-size:14px}.empty-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.status{padding:10px 16px;font-size:13px;color:#ffffffe6}.status.error{color:#ffd9d9}.drop-hint{margin-top:16px;font-size:12px;color:#fff9}.drop-hint code,.empty code{background:#ffffff2e;padding:1px 6px;border-radius:5px}.app.dragging .glass{outline:2px dashed rgba(255,255,255,.6);outline-offset:4px}.drop-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:500;color:#fff;background:#12131a59;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none}