:root{--bg: #EDE9E3;--panel: #F6F3EE;--card: #FBF9F6;--field: #F1ECE4;--border: #E3DBCE;--border-strong: #D6CBB9;--text: #2B2622;--text-dim: #6B6158;--text-muted: #8B8578;--faint: #B5AD9F;--gold: #C0762B;--gold-light: #D9A05C;--gold-deep: #A75F22;--gold-dim: rgba(192, 118, 43, .1);--green: #4A7C59;--amber: #C08A2B;--red: #B3452F;--indigo: #8C5A73;--radius: 16px;--font-display: "Playfair Display", Georgia, serif;--font-body: "Poppins", "Helvetica Neue", sans-serif;--font-mono: "JetBrains Mono", monospace}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font-body);font-variant-numeric:lining-nums;min-height:100vh;width:100%;overflow:hidden;position:relative;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}h1,h2,h3,h4{font-family:var(--font-display);font-weight:500;color:var(--text)}code,kbd,samp,pre{font-family:var(--font-mono)}button,input,select,textarea{font-family:inherit}::placeholder{color:var(--faint);opacity:1}::selection{background:#c0762b38;color:var(--text)}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold)!important;box-shadow:0 0 0 3px var(--gold-dim)}input[type=date],input[type=time],input[type=datetime-local]{color-scheme:light}@media (max-width: 960px){body{overflow:auto}}.page{padding:32px 40px;max-width:1300px;margin:0 auto;width:100%;box-sizing:border-box}@media (max-width: 960px){.page{padding:20px 22px}}@media (max-width: 600px){.page{padding:14px}}.r-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--min, 240px),1fr));gap:var(--gap, 16px)}.r-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}.r-table-scroll table{min-width:720px}.r-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px}@media (max-width: 960px){.hide-compact{display:none!important}}@media (min-width: 961px){.show-compact{display:none!important}}@media (max-width: 600px){.r-title{font-size:1.45rem!important}.r-subtitle{font-size:.74rem!important}}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#2b262224;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#2b262242}header{position:absolute;top:20px;left:20px;right:360px;display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border:1px solid var(--border);border-radius:var(--radius);background:var(--panel);box-shadow:0 10px 30px -18px #2b26222e;z-index:50}header h1{font-size:1.15rem;font-weight:600;letter-spacing:.02em;color:var(--text)}.header-meta{font-size:.8rem;font-weight:400;color:var(--text-dim);letter-spacing:.05em;display:flex;align-items:center;gap:15px}.header-ts{font-size:.75rem;color:var(--text);opacity:.8}.search-box{background:var(--field);border:1px solid var(--border);color:var(--text);padding:8px 14px;font-family:var(--font-body);font-size:.8rem;outline:none;border-radius:10px;width:220px;transition:border-color .2s}.body{width:100%;height:100%;position:relative}.floor-wrap{position:absolute;left:155px;right:355px;top:116px;bottom:24px;display:flex;flex-direction:column;padding:0;gap:16px;z-index:10}#floorplan{flex:1;width:100%;background:transparent;overflow:hidden}.room-rect{cursor:pointer;transition:fill .2s,filter .2s}.room-rect:hover{filter:brightness(1.15)}.timeline-wrap{position:absolute;top:110px;left:24px;bottom:24px;width:120px;z-index:100;display:flex;flex-direction:column;align-items:stretch;gap:16px;pointer-events:none}.mode-toggle{background:var(--panel);border:1px solid var(--border);border-radius:12px;height:40px;display:flex;padding:4px;pointer-events:auto;box-shadow:0 2px 6px #2b26220f}.mode-btn{flex:1;border:none;background:transparent;color:var(--text-dim);font-size:.72rem;font-weight:600;letter-spacing:.08em;border-radius:8px;cursor:pointer;transition:all .2s}.mode-btn.active{background:var(--gold-dim);color:var(--text)}.mode-btn.active.live{color:var(--gold)}.mode-btn.active.history{color:var(--text)}.timeline-island{background:var(--panel);border:1px solid var(--border);border-radius:20px;padding:16px 12px;flex:1;display:flex;flex-direction:column;position:relative;pointer-events:auto;opacity:.5;transition:opacity .3s;overflow:hidden}.timeline-island.active{opacity:1}.slider-area{flex:1;display:flex;flex-direction:row;gap:6px;min-height:0;position:relative}.time-markers{display:flex;flex-direction:column;justify-content:space-between;width:38px;flex-shrink:0;pointer-events:none;padding:6px 0}.marker{font-size:9px;color:var(--text-muted);font-family:var(--font-mono);text-align:right;line-height:1}.marker.hour{color:var(--text-dim)}.vslider-wrap{flex:1;display:flex;justify-content:center;align-items:stretch;position:relative;padding:6px 0;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none}.vtrack{position:absolute;left:50%;transform:translate(-50%);top:6px;bottom:6px;width:6px;background:#2b262214;border-radius:3px;pointer-events:none;overflow:visible}.vtrack-fill{position:absolute;bottom:0;left:0;right:0;background:#c0762b59;border-radius:3px;transition:height .05s;pointer-events:none}.vtrack-future{position:absolute;top:0;left:0;right:0;background:repeating-linear-gradient(-45deg,rgba(179,69,47,.2) 0px,rgba(179,69,47,.2) 2px,transparent 2px,transparent 6px);border-radius:3px 3px 0 0;transition:height .3s;pointer-events:none;display:none}.vthumb{position:absolute;left:50%;transform:translate(-50%) translateY(50%);width:20px;height:20px;background:var(--gold);border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 4px #c0762b2e,0 2px 6px #2b262233;pointer-events:none;z-index:10}.ruler-tick{position:absolute;right:100%;margin-right:4px;background:#2b262226;height:1px;transform:translateY(50%)}.ruler-tick.hour{width:10px;background:#2b262259}.ruler-tick.half{width:5px}.ruler-label{position:absolute;right:100%;margin-right:18px;transform:translateY(50%);font-size:9px;color:var(--text-muted);font-family:var(--font-mono);line-height:1}.session-highlight{position:absolute;left:0;right:0;background:var(--gold);opacity:.45;border-radius:2px;pointer-events:none}.date-picker-wrap{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:8px;display:flex;align-items:center;justify-content:center;pointer-events:auto}.date-picker-wrap input[type=date]{background:transparent;border:none;color:var(--text);font-family:inherit;font-size:.75rem;outline:none;cursor:pointer;width:100%;text-align:center}.replay-badge{position:absolute;top:110px;left:160px;background:var(--gold);color:#fff;padding:6px 14px;border-radius:999px;font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;z-index:90;box-shadow:0 8px 20px -8px #a75f228c}.current-playback-time{position:absolute;top:142px;left:160px;font-size:1.8rem;font-weight:600;color:var(--text);z-index:90;font-family:var(--font-mono);letter-spacing:-.02em}.right{position:absolute;top:24px;right:24px;bottom:24px;width:320px;display:flex;flex-direction:column;gap:24px;z-index:50;pointer-events:none}.panel-section,.log-wrap{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 10px 30px -18px #2b26222e;display:flex;flex-direction:column;flex-shrink:0;pointer-events:auto}.panel-section{padding:20px}.section-title{font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);margin-bottom:16px}.host-list{display:flex;flex-direction:column;gap:12px}.host-row{display:flex;align-items:center;gap:12px;font-size:.8rem}.host-indicator{width:10px;height:10px;border-radius:50%;flex-shrink:0;transition:background .4s,box-shadow .4s}.host-indicator.online{background:var(--gold);box-shadow:0 0 0 3px var(--gold-dim);animation:hpulse 2s ease-in-out infinite}.host-indicator.offline{background:var(--red);box-shadow:0 0 0 3px #b3452f1f}@keyframes hpulse{0%,to{opacity:1}50%{opacity:.4}}.device-list-panel{display:flex;flex-direction:column;gap:8px;max-height:280px;overflow-y:auto;padding-right:4px}.device-list-panel::-webkit-scrollbar{width:4px}.device-list-panel::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.device-row{border:1px solid var(--border);padding:5px 14px 5px 2px;background:var(--card);position:relative;overflow:hidden;transition:opacity .4s,background .2s;border-radius:10px;display:flex;flex-direction:column;justify-content:center;min-height:40px}.device-row:hover{background:#f9f2e7}.device-row.lost{opacity:.4}.device-row .accent{position:absolute;left:2px;top:4px;bottom:4px;width:4px;border-radius:4px}.device-title-row{display:flex;align-items:center;gap:8px;margin-left:14px;margin-right:46px;white-space:nowrap;overflow:hidden}.device-row-name{font-size:.85rem;font-weight:600;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.device-row-rssi{font-size:.65rem;color:var(--text);opacity:.6}.device-row-room{font-size:.7rem;color:var(--text-dim);margin-top:2px;margin-left:14px}.device-conf{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:.85rem;font-weight:700}.log-wrap{flex:1;overflow:hidden;display:flex;flex-direction:column}.log-title{font-size:.66rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);padding:20px 20px 12px;border-bottom:1px solid var(--border);flex-shrink:0}.log-entries{flex:1;overflow-y:auto;padding:8px 20px 20px}.log-entries::-webkit-scrollbar{width:4px}.log-entries::-webkit-scrollbar-thumb{background:#2b262224;border-radius:2px}.log-entry{font-size:.75rem;line-height:1.6;border-bottom:1px solid var(--border);padding:8px 0}.log-entry.move{color:var(--text)}.log-entry.appear{color:var(--green)}.log-entry.info{color:var(--text-dim)}.log-ts{color:var(--text-dim);margin-right:8px}@keyframes logflash{0%{background:#c0762b1f}to{background:transparent}}.log-entry.new{animation:logflash 1s ease-out}.device-node{cursor:pointer}.device-node .device-label-el{opacity:0;transition:opacity .2s ease-in-out;pointer-events:none}.device-node:hover .device-label-el{opacity:1}@keyframes slideDown{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes pulseRed{0%,to{box-shadow:0 12px 40px -12px #b3452f40,0 0 0 1px #b3452f26}50%{box-shadow:0 12px 40px -12px #b3452f73,0 0 0 3px #b3452f38}}@keyframes pulseAmber{0%,to{box-shadow:0 8px 28px -12px #c08a2b33,0 0 0 1px #c08a2b1f}50%{box-shadow:0 8px 28px -12px #c08a2b66,0 0 0 3px #c08a2b33}}@keyframes blink{0%,to{opacity:1}50%{opacity:.3}}@keyframes pulseGold{0%,to{box-shadow:0 0 0 2px #c0762b24}50%{box-shadow:0 0 0 5px #c0762b3d}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}