:root{--green:#0e3b1f;--green2:#14532d;--gold:#c9a86a;--gold2:#b8934f;--bg:#f7f7f5;--card:#ffffff;--text:#1a1a1a;--muted:#6b7280;--border:#e5e7eb;--radius:16px}
*{box-sizing:border-box}body{font-family:'Inter',system-ui,sans-serif;background:var(--bg);color:var(--text)}
.sidebar{width:260px;height:100vh;height:100dvh;background:linear-gradient(180deg,var(--green),#0a2a16);color:#fff;position:fixed;left:0;top:0;z-index:1040;transition:.3s;display:flex;flex-direction:column;overflow:hidden}
.sidebar .brand{padding:22px 20px;font-weight:800;letter-spacing:.5px;display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.08)}
.sidebar .brand i{color:var(--gold)}
.sidebar a.nav-link{color:rgba(255,255,255,.85);padding:11px 18px;border-radius:10px;margin:4px 10px;display:flex;align-items:center;gap:10px}
.sidebar a.nav-link.active,.sidebar a.nav-link:hover{background:rgba(255,255,255,.10);color:#fff}
.main{margin-left:260px;min-height:100vh}
.topbar{background:#fff;border-bottom:1px solid var(--border);padding:14px 24px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:10}
.card-premium{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 6px 24px rgba(0,0,0,.05)}
.btn-gold{background:var(--gold);border:none;color:#1a1a1a;font-weight:600}.btn-gold:hover{background:var(--gold2)}
.btn-green{background:var(--green);color:#fff}.btn-green:hover{background:var(--green2);color:#fff}
.stat-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px}
.table thead th{font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);border-bottom:2px solid var(--border)}
.badge-gold{background:rgba(201,168,106,.15);color:#8a6d2b;border:1px solid rgba(201,168,106,.3)}
.drag-handle{cursor:grab;color:#9ca3af}
@media(max-width:992px){.sidebar{transform:translateX(-100%);width:280px;box-shadow:4px 0 20px rgba(0,0,0,.3)}.sidebar.show{transform:none}.main{margin-left:0}.topbar{padding:10px 14px;flex-wrap:wrap;gap:8px}}
.sidebar{overflow:hidden}
.sidebar .flex-grow-1{scrollbar-width:thin; scrollbar-color:rgba(255,255,255,.2) transparent}
.sidebar .flex-grow-1::-webkit-scrollbar{width:5px}
.sidebar .flex-grow-1::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:10px}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);backdrop-filter:blur(2px);z-index:1039}
.sidebar-overlay.show{display:block}
@media(max-width:768px){
  .card-premium{border-radius:12px}
  .table-responsive{font-size:13px}
  .builder{flex-direction:column !important;height:auto !important;min-height:100vh}
  .builder .left, .builder .right{width:100% !important;max-height:40vh;overflow:auto}
  .builder .center{order:-1;min-height:42vh;padding:8px}
  #canvasWrap{transform-origin:top center}
  .presentation-stage{border-radius:8px}
}
.canvas-wrap{overflow:auto;background:#e9ecef;padding:20px;border-radius:12px}
.tpl-canvas{box-shadow:0 20px 60px rgba(0,0,0,.25);border-radius:8px}
.presentation-stage{position:relative;aspect-ratio:16/9;background:#0f3d1f;border-radius:12px;overflow:hidden}
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(1200px 600px at 20% -10%,#1a5c2a 0%,transparent 60%),linear-gradient(180deg,#0e3b1f,#07150c);padding:24px}
.login-card{max-width:420px;width:100%;background:#fff;border-radius:20px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.3)}