:root{--deep-space:#0a0f14;--navy-eclipse:#0f1923;--horizon-cyan:#00a8cb;--pure-white:#fff;--slate:#64748b;--moon-gray:#d1d5db;--bg-primary:var(--deep-space);--bg-card:var(--navy-eclipse);--accent:var(--horizon-cyan);--text-primary:var(--pure-white);--text-secondary:var(--slate);--warning:#f59e0b;--danger:#ef4444;--success:#22c55e;--font-headline:"Aldrich", "Poppins", sans-serif;--font-body:"Inter", "Lato", sans-serif;--ws-header-height:52px;--panel-header-height:30px;--card-radius:6px;--btn-radius:4px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:var(--font-body);color:var(--text-primary);background:var(--bg-primary);-webkit-font-smoothing:antialiased;flex-direction:column;font-size:14px;display:flex;overflow:hidden}.hidden{display:none!important}#ws-header{height:var(--ws-header-height);background:var(--bg-card);border-bottom:1px solid #00a8cb40;flex-shrink:0;justify-content:space-between;align-items:center;padding:0 16px;display:flex}.ws-header-left{align-items:center;gap:12px;display:flex}.ws-logo{width:auto;height:28px}.ws-titles{flex-direction:column;line-height:1.2;display:flex}.ws-title{font-family:var(--font-headline);letter-spacing:1.5px;color:var(--text-primary);font-size:14px}.ws-subtitle{font-family:var(--font-body);letter-spacing:2px;color:var(--accent);font-size:9px;font-weight:500}.ws-header-right{gap:8px;display:flex}.ws-btn{color:var(--text-primary);border-radius:var(--btn-radius);font-family:var(--font-body);letter-spacing:1px;cursor:pointer;background:0 0;border:1px solid #64748b80;align-items:center;gap:6px;padding:7px 14px;font-size:11px;font-weight:500;transition:border-color .2s,background .2s;display:inline-flex}.ws-btn:hover{border-color:var(--accent)}.ws-btn-primary{color:var(--accent);background:#00a8cb1f;border-color:#00a8cb80}.ws-btn-primary:hover{background:#00a8cb38}.ws-btn:disabled{opacity:.5;cursor:wait}.ws-btn i{font-size:14px}#replay-strip{background:var(--bg-card);border-bottom:1px solid #00a8cb40;flex-shrink:0;align-items:center;gap:12px;padding:8px 16px;display:flex}#replay-strip.hidden{display:none}.rs-btn{width:30px;height:30px;color:var(--text-primary);border-radius:var(--btn-radius);cursor:pointer;background:0 0;border:1px solid #64748b80;justify-content:center;align-items:center;transition:border-color .2s;display:inline-flex}.rs-btn:hover{border-color:var(--accent)}.rs-btn i{font-size:15px}#rs-exit-btn:hover{border-color:var(--danger);color:var(--danger)}#rs-scrubber{cursor:pointer;flex:1;padding:8px 0}.rs-track{background:#64748b59;border-radius:2px;height:4px;position:relative}#rs-fill{background:var(--accent);border-radius:2px;width:0;position:absolute;top:0;bottom:0;left:0}#rs-thumb{background:var(--accent);border-radius:50%;width:12px;height:12px;position:absolute;top:50%;left:0;transform:translate(-50%,-50%);box-shadow:0 0 8px #00a8cb80}#rs-time{font-family:var(--font-headline);letter-spacing:1px;color:var(--text-primary);text-align:center;min-width:64px;font-size:11px}#rs-speed{background:var(--bg-primary);color:var(--text-primary);border-radius:var(--btn-radius);font-family:var(--font-body);letter-spacing:1px;cursor:pointer;border:1px solid #64748b80;padding:6px 8px;font-size:11px}#replay-btn.rs-live{border-color:var(--accent);color:var(--accent)}body.kiosk #replay-strip{display:none}#ws-main{flex:1;padding:8px;position:relative;overflow-y:auto}.grid-stack-item-content{background:var(--bg-card);border-radius:var(--card-radius);border:1px solid #64748b40;transition:border-color .2s;overflow:hidden}.grid-stack-item-content:hover{border-color:#00a8cb66}.ws-panel{flex-direction:column;height:100%;display:flex}.panel-header{height:var(--panel-header-height);cursor:grab;-webkit-user-select:none;user-select:none;background:#0a0f14b3;border-bottom:1px solid #00a8cb33;flex-shrink:0;align-items:center;gap:8px;padding:0 8px;display:flex}.panel-header:active{cursor:grabbing}.panel-view-badge{font-family:var(--font-body);letter-spacing:1px;color:var(--accent);border:1px solid #00a8cb66;border-radius:999px;flex-shrink:0;align-items:center;gap:4px;padding:1px 8px;font-size:9px;font-weight:700;display:inline-flex}.panel-name{font-family:var(--font-headline);letter-spacing:1px;color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:11px;overflow:hidden}.panel-actions{flex-shrink:0;gap:2px;display:flex}.panel-btn{color:var(--text-secondary);cursor:pointer;border-radius:var(--btn-radius);background:0 0;border:none;padding:3px 5px;font-size:13px;line-height:1;transition:color .2s,background .2s}.panel-btn:hover{color:var(--text-primary);background:#64748b33}.panel-btn-close:hover{color:var(--danger)}.panel-frame{background:var(--bg-primary);border:none;flex:1;width:100%}body.grid-interacting .panel-frame{pointer-events:none}.grid-stack-item.panel-maximized{z-index:500;padding:0;width:auto!important;height:auto!important;position:fixed!important;inset:0!important;transform:none!important}.grid-stack-item.panel-maximized .grid-stack-item-content{border-radius:0;inset:0!important}body.has-maximized #ws-main{overflow:hidden}#auth-gate{z-index:900;background:var(--bg-primary);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:24px;display:flex;position:fixed;inset:0}.gate-logo{width:auto;height:44px;margin-bottom:6px}#auth-gate h2{font-family:var(--font-headline);letter-spacing:2.5px;color:var(--text-primary);font-size:18px}#auth-gate p{max-width:420px;color:var(--text-secondary);font-size:13px;line-height:1.6}#auth-gate a{text-decoration:none}#ws-account{border-left:1px solid #64748b59;align-items:center;gap:8px;padding-left:10px;display:flex}#ws-account.hidden{display:none}#ws-user-email{color:var(--text-secondary);text-overflow:ellipsis;white-space:nowrap;max-width:180px;font-size:11px;overflow:hidden}#layouts-wrap{position:relative}#layouts-menu{background:var(--bg-card);border-radius:var(--card-radius);z-index:800;border:1px solid #00a8cb59;flex-direction:column;gap:8px;width:260px;padding:10px;display:flex;position:absolute;top:calc(100% + 6px);right:0;box-shadow:0 8px 30px #00000080}.lm-save-row{gap:6px;display:flex}.lm-save-row input{background:var(--bg-primary);min-width:0;color:var(--text-primary);border-radius:var(--btn-radius);font-family:var(--font-body);border:1px solid #64748b80;flex:1;padding:7px 9px;font-size:12px}.lm-save-row input:focus{border-color:var(--accent);outline:none}#layouts-list{flex-direction:column;gap:4px;max-height:240px;display:flex;overflow-y:auto}.lm-row{border-radius:var(--btn-radius);cursor:pointer;border:1px solid #0000;justify-content:space-between;align-items:center;gap:6px;padding:7px 9px;display:flex}.lm-row:hover{background:#00a8cb14;border-color:#00a8cb4d}.lm-row.active{border-color:#00a8cb80}.lm-name{color:var(--text-primary);text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.lm-empty{color:var(--text-secondary);text-align:center;padding:8px 0;font-size:11px}#phone-backdrop{z-index:750;background:#0a0f14cc;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#phone-preview{flex-direction:column;align-items:center;gap:10px;max-height:100vh;padding:16px;display:flex}.phone-topbar{font-family:var(--font-headline);letter-spacing:1.5px;color:var(--text-primary);align-items:center;gap:16px;font-size:11px;display:flex}.phone-frame{background:var(--bg-primary);border:3px solid #1e293b;border-radius:28px;width:390px;height:min(78vh,800px);overflow:hidden;box-shadow:0 0 40px #00a8cb26}.phone-frame iframe{border:none;width:100%;height:100%}.phone-note{max-width:390px;color:var(--text-secondary);text-align:center;font-size:11px;line-height:1.5}#kiosk-brand{z-index:550;border-radius:var(--card-radius);pointer-events:none;background:#0a0f14d1;border:1px solid #00a8cb4d;align-items:center;gap:10px;padding:6px 12px;display:flex;position:fixed;top:10px;left:12px}#kiosk-brand img{width:auto;height:22px}.kb-text{flex-direction:column;line-height:1.2;display:flex}.kb-title{font-family:var(--font-headline);letter-spacing:1.5px;color:var(--text-primary);font-size:11px}.kb-sub{letter-spacing:2px;color:var(--accent);font-size:8px;font-weight:700}body.kiosk #ws-header,body.kiosk .panel-header{display:none}body.kiosk #ws-main{padding:0}body.kiosk .grid-stack-item-content{border-color:#64748b26;border-radius:0}#kiosk-hint{color:var(--text-primary);z-index:600;pointer-events:none;background:#0f1923eb;border:1px solid #00a8cb66;border-radius:999px;padding:8px 20px;font-size:12px;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}#empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:24px;display:flex;position:absolute;inset:0}.empty-logo{opacity:.6;width:auto;height:48px;margin-bottom:4px}#empty-state h2{font-family:var(--font-headline);letter-spacing:2px;color:var(--text-primary);font-size:18px}#empty-state p{max-width:420px;color:var(--text-secondary);font-size:13px;line-height:1.6}#modal-backdrop{z-index:700;background:#0a0f14bf;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#add-modal{background:var(--bg-card);border-radius:var(--card-radius);border:1px solid #00a8cb59;width:400px;max-width:calc(100vw - 32px);box-shadow:0 0 30px #00a8cb26}.modal-header{border-bottom:1px solid #64748b40;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.modal-title{font-family:var(--font-headline);letter-spacing:1.5px;font-size:13px}.modal-close{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;font-size:16px}.modal-close:hover{color:var(--text-primary)}.modal-body{flex-direction:column;gap:8px;padding:16px;display:flex}.modal-label{letter-spacing:1.5px;color:var(--text-secondary);margin-top:6px;font-size:9px;font-weight:700}.modal-label:first-child{margin-top:0}.modal-select,.modal-input{background:var(--bg-primary);width:100%;color:var(--text-primary);border-radius:var(--btn-radius);font-family:var(--font-body);border:1px solid #64748b80;padding:9px 10px;font-size:12px}.modal-select:focus,.modal-input:focus{border-color:var(--accent);outline:none}.view-picker{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.view-option{background:var(--bg-primary);color:var(--text-secondary);border-radius:var(--btn-radius);font-family:var(--font-body);letter-spacing:1px;cursor:pointer;border:1px solid #64748b80;justify-content:center;align-items:center;gap:6px;padding:9px 0;font-size:10px;font-weight:700;transition:color .2s,border-color .2s,background .2s;display:flex}.view-option:hover{border-color:var(--accent)}.view-option.active{color:var(--accent);border-color:var(--accent);background:#00a8cb1a}.modal-error{color:var(--danger);font-size:11px}.modal-footer{border-top:1px solid #64748b40;justify-content:flex-end;gap:8px;padding:12px 16px;display:flex}