*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#f5f5f3;--surface:#fff;--border:#0000001a;--text:#1a1a18;--muted:#6b6b67;--accent:#1d9e75;--accent-d:#0f6e56}[data-theme=dark]{--bg:#1a1a18;--surface:#242422;--border:#ffffff1a;--text:#e8e8e4;--muted:#888780;--accent:#1d9e75;--accent-d:#0f6e56}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:system-ui,sans-serif;transition:background .2s,color .2s}.app{flex-direction:column;min-height:100vh;display:flex}.topbar{z-index:100;background:var(--surface);border-bottom:.5px solid var(--border);justify-content:space-between;align-items:center;height:52px;padding:0 20px;transition:background .2s;display:flex;position:sticky;top:0}.topbar-left{align-items:center;gap:12px;display:flex}.logo{color:var(--text);font-size:15px;font-weight:600}.page-label{color:var(--muted);font-size:13px}.topbar-right{align-items:center;gap:8px;display:flex}.theme-toggle{border:.5px solid var(--border);cursor:pointer;color:var(--text);background:0 0;border-radius:8px;padding:6px 8px;font-size:15px;line-height:1;transition:background .15s}.theme-toggle:hover{background:var(--bg)}.hamburger{border:.5px solid var(--border);cursor:pointer;background:0 0;border-radius:8px;flex-direction:column;gap:5px;padding:8px;display:flex}.hamburger span{background:var(--text);border-radius:2px;width:18px;height:1.5px;transition:all .25s;display:block}.hamburger.open span:first-child{transform:rotate(45deg)translate(4.5px,4.5px)}.hamburger.open span:nth-child(2){opacity:0}.hamburger.open span:nth-child(3){transform:rotate(-45deg)translate(4.5px,-4.5px)}.side-menu{background:var(--surface);border-left:.5px solid var(--border);z-index:99;width:260px;padding:12px 0;transition:transform .3s cubic-bezier(.4,0,.2,1),background .2s;position:fixed;top:52px;bottom:0;right:0;overflow-y:auto;transform:translate(100%)}.side-menu.open{transform:translate(0)}.menu-section{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;padding:8px 20px 4px;font-size:11px;font-weight:600}.menu-item{cursor:pointer;color:var(--text);border-left:2px solid #0000;align-items:center;gap:10px;padding:10px 20px;font-size:14px;transition:background .15s,border-color .15s;display:flex}.menu-item:hover{background:var(--bg)}.menu-item.active{border-left-color:var(--accent);background:var(--bg)}.overlay{z-index:98;background:#0003;position:fixed;inset:52px 0 0}.content{flex:1;padding:20px}.page-title{color:var(--text);margin-bottom:16px;font-size:18px;font-weight:600}.widget-grid{flex-wrap:wrap;gap:12px;display:flex}.widget{background:var(--surface);border:.5px solid var(--border);border-radius:12px;padding:16px;transition:background .2s,border-color .15s}.widget:hover{border-color:#0003}[data-theme=dark] .widget:hover{border-color:#fff3}.widget-header{justify-content:space-between;align-items:center;gap:8px;margin-bottom:12px;display:flex}.widget-header-right{align-items:center;gap:6px;display:flex}.widget-title{color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-size:11px;font-weight:600}.badge{border-radius:20px;padding:2px 8px;font-size:11px}.badge-live{color:#3b6d11;background:#eaf3de}.badge-api{color:#185fa5;background:#e6f1fb}.badge-manual{color:#5f5e5a;background:#f1efe8}[data-theme=dark] .badge-live{color:#9fe1cb;background:#1a2e12}[data-theme=dark] .badge-api{color:#85b7eb;background:#0d1e2e}[data-theme=dark] .badge-manual{color:#888780;background:#2a2a28}.widget-remove{color:var(--muted);cursor:pointer;opacity:.4;background:0 0;border:none;padding:0;font-size:18px;line-height:1;transition:opacity .15s}.widget-remove:hover{opacity:1}.mini-input{background:var(--bg);border:.5px solid var(--border);color:var(--text);border-radius:8px;flex:1;min-width:0;padding:8px 10px;font-family:inherit;font-size:13px;transition:border-color .15s,background .2s}.mini-input:focus{border-color:var(--accent);outline:none}.mini-btn{background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:8px;width:100%;padding:8px 14px;font-family:inherit;font-size:13px;transition:background .15s}.mini-btn:hover:not(:disabled){background:var(--accent-d)}.mini-btn:disabled{opacity:.5;cursor:not-allowed}.input-row{gap:8px;display:flex}
