/* ═══════════════════ DEV LOG PANEL ═══════════════════ */
#devlog-panel{position:fixed;bottom:16px;right:16px;width:520px;height:392px;background:#0a0c10;border:1px solid rgba(var(--cyan-rgb),.2);border-radius:10px;z-index:9999;display:none;flex-direction:column;font-family:'Share Tech Mono',monospace;font-size:12px!important;color:#c8ccd0;box-shadow:0 8px 32px rgba(0,0,0,.6),0 0 1px rgba(var(--cyan-rgb),.3);overflow:hidden;min-width:320px;min-height:200px;resize:both;direction:ltr;text-align:left}
#devlog-panel *{font-size:inherit}
#devlog-panel button,#devlog-panel input{font-size:inherit!important}
#devlog-panel.visible{display:flex}

/* Header */
.dl-hdr{display:flex;align-items:center;justify-content:space-between;padding:6px 10px;background:linear-gradient(180deg,#12151c,#0d1017);border-bottom:1px solid rgba(var(--cyan-rgb),.12);cursor:move;user-select:none;flex-shrink:0}
.dl-title{font-family:'Orbitron',sans-serif;font-size:9px;color:var(--cyan,var(--cyan));letter-spacing:2px;font-weight:700;display:flex;align-items:center;gap:6px}
.dl-title-dot{width:6px;height:6px;border-radius:50%;background:var(--green);flex-shrink:0}
.dl-title-dot.off{background:#555}
.dl-btns{display:flex;align-items:center;gap:4px}
.dl-btn{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:#8a8f98;font-size:10px;padding:2px 6px;border-radius:4px;cursor:pointer;font-family:inherit;transition:all .15s}
.dl-btn:hover{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.2)}
.dl-btn.active{background:rgba(var(--cyan-rgb),.12);color:var(--cyan);border-color:rgba(var(--cyan-rgb),.3)}

/* Toolbar */
.dl-toolbar{display:flex;align-items:center;gap:4px;padding:4px 8px;background:#0c0e14;border-bottom:1px solid rgba(255,255,255,.04);flex-shrink:0;flex-wrap:wrap}
.dl-filter{font-size:9px;padding:2px 7px;border-radius:3px;cursor:pointer;border:1px solid transparent;font-family:inherit;transition:all .15s;background:transparent;color:#666}
.dl-filter:hover{color:#aaa}
.dl-filter.active{border-color:rgba(255,255,255,.15);color:#ddd;background:rgba(255,255,255,.06)}
.dl-filter[data-f="error"].active{color:#ff4d6a;border-color:rgba(255,77,106,.3);background:rgba(255,77,106,.08)}
.dl-filter[data-f="warn"].active{color:#ffa726;border-color:rgba(255,167,38,.3);background:rgba(255,167,38,.08)}
.dl-filter[data-f="info"].active{color:#4fc3f7;border-color:rgba(79,195,247,.3);background:rgba(79,195,247,.08)}
.dl-filter[data-f="ai"].active{color:#ce93d8;border-color:rgba(206,147,216,.3);background:rgba(206,147,216,.08)}
.dl-filter[data-f="http"].active{color:#81c784;border-color:rgba(129,199,132,.3);background:rgba(129,199,132,.08)}
.dl-filter[data-f="php"].active{color:#90a4ae;border-color:rgba(144,164,174,.3);background:rgba(144,164,174,.08)}
.dl-search{background:#0a0c10;border:1px solid rgba(255,255,255,.08);color:#ccc;font-size:10px!important;padding:2px 6px;border-radius:3px;font-family:inherit;width:100px;outline:none;margin-inline-start:auto;direction:ltr;text-align:left}
.dl-search:focus{border-color:rgba(var(--cyan-rgb),.3)}

/* Body */
.dl-body{flex:1;overflow-y:auto;overflow-x:hidden;padding:4px 0;direction:ltr;text-align:left;scroll-behavior:smooth}
.dl-body::-webkit-scrollbar{width:4px}
.dl-body::-webkit-scrollbar-track{background:transparent}
.dl-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.1);border-radius:2px}

/* Log Entry */
.dl-entry{padding:2px 10px;font-size:inherit;line-height:1.5;border-bottom:1px solid rgba(255,255,255,.02);display:flex;gap:8px;align-items:flex-start;direction:ltr;text-align:left}
.dl-entry:hover{background:rgba(255,255,255,.02)}
.dl-copy{background:none;border:none;cursor:pointer;font-size:10px;padding:0 2px;opacity:0;transition:opacity .15s;flex-shrink:0;line-height:1}
.dl-entry:hover .dl-copy{opacity:.5}
.dl-copy:hover{opacity:1!important}
.dl-ts{color:#555;font-size:10px;flex-shrink:0;min-width:80px}
.dl-lvl{font-size:9px;font-weight:700;letter-spacing:.5px;flex-shrink:0;min-width:44px;text-align:center;padding:0 4px;border-radius:2px}
.dl-lvl.info{color:#4fc3f7;background:rgba(79,195,247,.08)}
.dl-lvl.warn{color:#ffa726;background:rgba(255,167,38,.08)}
.dl-lvl.error{color:#ff4d6a;background:rgba(255,77,106,.1)}
.dl-lvl.ai{color:#ce93d8;background:rgba(206,147,216,.08)}
.dl-lvl.http{color:#81c784;background:rgba(129,199,132,.08)}
.dl-lvl.php{color:#90a4ae;background:rgba(144,164,174,.08)}
.dl-lvl.perf{color:#ffd54f;background:rgba(255,213,79,.08)}
.dl-msg{flex:1;word-break:break-word;color:#c8ccd0}
.dl-msg b{color:#fff;font-weight:600}
.dl-msg .dl-dim{color:#666}
.dl-msg .dl-hi{color:var(--cyan)}
.dl-msg .dl-err{color:#ff4d6a}
.dl-msg .dl-ok{color:#66f0a8}
.dl-msg .dl-tok{color:#ce93d8}
.dl-msg .dl-ms{color:#ffa726}

/* AI detail block */
.dl-ai-detail{margin-top:2px;padding:4px 8px;background:rgba(206,147,216,.04);border:1px solid rgba(206,147,216,.1);border-radius:4px;font-size:10px;line-height:1.6;color:#999}
.dl-ai-detail span{margin-right:10px}

/* Footer */
.dl-footer{display:flex;align-items:center;justify-content:space-between;padding:3px 10px;background:#0c0e14;border-top:1px solid rgba(255,255,255,.04);font-size:9px;color:#555;flex-shrink:0}

/* Toggle switch for settings */
.dl-toggle{position:relative;display:inline-block;width:38px;height:20px;cursor:pointer;flex-shrink:0}
.dl-toggle input{opacity:0;width:0;height:0;position:absolute}
.dl-toggle-track{position:absolute;inset:0;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:20px;transition:all .25s}
.dl-toggle-thumb{position:absolute;top:2px;left:2px;width:14px;height:14px;background:#666;border-radius:50%;transition:all .25s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.dl-toggle input:checked+.dl-toggle-track{background:rgba(var(--cyan-rgb),.15);border-color:rgba(var(--cyan-rgb),.4)}
.dl-toggle input:checked+.dl-toggle-track .dl-toggle-thumb{left:20px;background:var(--cyan);box-shadow:0 0 8px rgba(var(--cyan-rgb),.4)}