@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');

:root{
  --bg:#07111f;
  --bg-2:#0b1630;
  --surface:rgba(255,255,255,.085);
  --surface-2:rgba(255,255,255,.12);
  --surface-3:rgba(255,255,255,.17);
  --stroke:rgba(255,255,255,.14);
  --stroke-strong:rgba(255,255,255,.24);
  --text:#f7fbff;
  --muted:#9caec8;
  --primary:#7c8cff;
  --primary-2:#a77bff;
  --cyan:#5ee7f7;
  --green:#66e4a5;
  --yellow:#ffd86b;
  --red:#ff7b8f;
  --shadow:0 22px 80px rgba(0,0,0,.32);
  --radius-xl:28px;
  --radius-lg:20px;
  --radius-md:14px;
  --sidebar:264px;
  --blur:26px;
}

[data-theme="light"]{
  --bg:#eaf1ff;
  --bg-2:#dfe9ff;
  --surface:rgba(255,255,255,.50);
  --surface-2:rgba(255,255,255,.66);
  --surface-3:rgba(255,255,255,.82);
  --stroke:rgba(68,82,120,.14);
  --stroke-strong:rgba(68,82,120,.22);
  --text:#15203a;
  --muted:#64708a;
  --shadow:0 22px 80px rgba(77,94,138,.18);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  background:
    radial-gradient(circle at 12% 8%, rgba(89,219,255,.18), transparent 30%),
    radial-gradient(circle at 88% 2%, rgba(159,91,255,.22), transparent 28%),
    radial-gradient(circle at 75% 88%, rgba(77,120,255,.14), transparent 26%),
    linear-gradient(145deg,var(--bg),var(--bg-2));
  font:14px/1.55 'DM Sans',system-ui,sans-serif;
  min-height:100vh;
  overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:42px 42px;mask-image:linear-gradient(to bottom,black,transparent 75%);
}
button,input,select,textarea{font:inherit}
a{color:inherit;text-decoration:none}
svg{display:block}

/* liquid glass primitive */
.glass{
  position:relative;
  background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.055));
  border:1px solid var(--stroke);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),var(--shadow);
  backdrop-filter:blur(var(--blur)) saturate(145%);
  -webkit-backdrop-filter:blur(var(--blur)) saturate(145%);
}
.glass::after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(120deg,rgba(255,255,255,.14),transparent 28%,transparent 72%,rgba(255,255,255,.045));
  opacity:.75;
}
.glass-soft{background:var(--surface);border:1px solid var(--stroke);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}

.app-shell{display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr);min-height:100vh;padding:18px;gap:18px}
.sidebar{height:calc(100vh - 36px);position:sticky;top:18px;border-radius:var(--radius-xl);padding:18px;display:flex;flex-direction:column;z-index:20}
.brand{display:flex;align-items:center;gap:11px;padding:4px 7px 18px;font-family:Manrope,sans-serif;font-weight:800;font-size:19px;letter-spacing:-.5px}
.brand-mark{width:35px;height:35px;border-radius:12px;background:linear-gradient(135deg,#84f0ff,#8b7aff 58%,#ff95d5);box-shadow:inset 0 1px 2px rgba(255,255,255,.75),0 8px 25px rgba(112,121,255,.28);position:relative}
.brand-mark::before{content:"";position:absolute;inset:7px 8px 9px;border-radius:8px;background:rgba(255,255,255,.36);filter:blur(.2px);transform:rotate(-9deg)}
.brand small{color:var(--muted);font:600 10px 'DM Sans';letter-spacing:.14em;text-transform:uppercase;margin-left:auto}
.nav-label{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);padding:14px 12px 8px}
.nav{display:grid;gap:4px}.nav-item{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:13px;color:var(--muted);font-weight:600;transition:.2s ease}.nav-item svg{width:18px;height:18px}.nav-item:hover{background:var(--surface);color:var(--text);transform:translateX(2px)}.nav-item.active{background:linear-gradient(135deg,rgba(124,140,255,.24),rgba(94,231,247,.10));color:var(--text);border:1px solid rgba(147,162,255,.16)}
.nav-badge{margin-left:auto;min-width:23px;height:20px;padding:0 7px;border-radius:999px;background:rgba(124,140,255,.20);color:#c9d0ff;font-size:10px;display:grid;place-items:center}
.sidebar-footer{margin-top:auto;padding-top:14px}.mini-profile{display:flex;align-items:center;gap:10px;padding:10px;border-radius:16px;background:var(--surface);border:1px solid var(--stroke)}
.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#5ee7f7,#8b7aff);color:white;font-weight:800;box-shadow:inset 0 1px 2px rgba(255,255,255,.45)}
.avatar.sm{width:30px;height:30px;font-size:11px}.avatar.lg{width:84px;height:84px;font-size:24px;border:3px solid rgba(255,255,255,.14)}
.mini-profile strong{display:block;font-size:12px}.mini-profile span{font-size:10px;color:var(--muted)}

.main{min-width:0}.topbar{height:64px;border-radius:20px;padding:0 16px 0 20px;display:flex;align-items:center;gap:12px;position:sticky;top:18px;z-index:15;margin-bottom:18px}.page-title{font-family:Manrope;font-weight:800;font-size:17px;letter-spacing:-.35px}.crumb{color:var(--muted);font-size:12px}.topbar-spacer{flex:1}.icon-btn,.btn{border:1px solid var(--stroke);color:var(--text);background:var(--surface);cursor:pointer;transition:.2s ease;position:relative;z-index:1}.icon-btn{width:38px;height:38px;border-radius:12px;display:grid;place-items:center}.icon-btn:hover,.btn:hover{background:var(--surface-2);border-color:var(--stroke-strong);transform:translateY(-1px)}.icon-btn svg{width:17px;height:17px}.mobile-menu{display:none}
.search{display:flex;align-items:center;gap:8px;width:min(320px,35vw);height:38px;padding:0 12px;border:1px solid var(--stroke);border-radius:12px;background:rgba(255,255,255,.05)}.search svg{width:16px;color:var(--muted)}.search input{width:100%;background:none;border:0;outline:0;color:var(--text)}.search input::placeholder{color:var(--muted)}

.content{display:grid;gap:18px}.hero{border-radius:var(--radius-xl);padding:28px;overflow:hidden;min-height:205px;display:grid;grid-template-columns:1.3fr .7fr;align-items:center}.hero h1{font:800 clamp(28px,4vw,48px)/1.02 Manrope;margin:0 0 10px;letter-spacing:-2px}.hero p{max-width:680px;color:var(--muted);font-size:15px;margin:0 0 20px}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:#cdd5ff;font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}.eyebrow::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 6px rgba(94,231,247,.08)}
.hero-orb{width:190px;aspect-ratio:1;margin:auto;border-radius:46% 54% 58% 42% / 53% 40% 60% 47%;background:linear-gradient(135deg,rgba(94,231,247,.78),rgba(124,140,255,.72) 50%,rgba(255,132,206,.68));filter:saturate(120%);box-shadow:inset 18px 18px 45px rgba(255,255,255,.30),inset -20px -16px 40px rgba(40,20,100,.20),0 30px 80px rgba(98,118,255,.35);animation:float 8s ease-in-out infinite;position:relative}.hero-orb::after{content:"";position:absolute;width:42%;height:25%;left:18%;top:14%;border-radius:50%;background:rgba(255,255,255,.36);filter:blur(8px);transform:rotate(-20deg)}
@keyframes float{50%{transform:translateY(-10px) rotate(4deg);border-radius:56% 44% 43% 57% / 42% 60% 40% 58%}}

.grid{display:grid;gap:18px}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.span-2{grid-column:span 2}.card{border-radius:var(--radius-lg);padding:18px;min-width:0}.card-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}.card-title{font:700 14px Manrope}.card-subtitle{color:var(--muted);font-size:11px;margin-top:3px}.stat{padding:18px}.stat-row{display:flex;align-items:center;justify-content:space-between}.stat-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(124,140,255,.24),rgba(94,231,247,.11));border:1px solid rgba(160,170,255,.17)}.stat-icon svg{width:19px}.stat-value{font:800 28px Manrope;letter-spacing:-1px;margin:16px 0 4px}.stat-label{color:var(--muted);font-size:12px}.delta{font-size:11px;font-weight:700}.delta.up{color:var(--green)}.delta.down{color:var(--red)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 13px;border-radius:12px;font-weight:700;font-size:12px}.btn svg{width:15px;height:15px}.btn-primary{background:linear-gradient(135deg,rgba(124,140,255,.95),rgba(158,111,255,.85));border-color:rgba(189,190,255,.34);box-shadow:0 10px 28px rgba(105,106,255,.25)}.btn-primary:hover{filter:brightness(1.08)}.btn-danger{background:rgba(255,123,143,.15);color:#ffb4c0;border-color:rgba(255,123,143,.24)}.btn-success{background:rgba(102,228,165,.14);color:#98f2c6;border-color:rgba(102,228,165,.24)}.btn-ghost{background:transparent}.btn-sm{padding:6px 9px;border-radius:9px;font-size:10px}.btn-lg{padding:12px 17px;border-radius:14px;font-size:13px}

.badge{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:5px 8px;border-radius:999px;font-size:10px;font-weight:800;border:1px solid var(--stroke);background:var(--surface)}.badge::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}.badge-primary{color:#bdc5ff;background:rgba(124,140,255,.12)}.badge-success{color:#8bf1bd;background:rgba(102,228,165,.10)}.badge-warning{color:#ffe292;background:rgba(255,216,107,.10)}.badge-danger{color:#ffa1b0;background:rgba(255,123,143,.10)}.badge-neutral{color:#b7c3d6}

.progress{height:7px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}.progress>span{height:100%;display:block;border-radius:inherit;background:linear-gradient(90deg,var(--cyan),var(--primary));box-shadow:0 0 18px rgba(94,231,247,.30)}

.chart-wrap{height:230px;position:relative}.chart-wrap canvas{width:100%!important;height:100%!important}.legend{display:flex;gap:15px;align-items:center;flex-wrap:wrap;color:var(--muted);font-size:10px}.legend span{display:flex;align-items:center;gap:5px}.legend i{width:7px;height:7px;border-radius:50%;background:var(--primary)}.legend span:nth-child(2) i{background:var(--cyan)}

.table-toolbar{display:flex;gap:10px;justify-content:space-between;align-items:center;margin-bottom:13px;flex-wrap:wrap}.table-search{display:flex;align-items:center;gap:7px;background:var(--surface);border:1px solid var(--stroke);height:36px;padding:0 10px;border-radius:11px;min-width:220px}.table-search input{background:none;border:0;outline:none;color:var(--text);width:100%}.table-search svg{width:14px;color:var(--muted)}
.table-wrap{overflow:auto;border:1px solid var(--stroke);border-radius:15px}.data-table{width:100%;border-collapse:collapse;min-width:760px}.data-table th,.data-table td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--stroke);vertical-align:middle}.data-table th{font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);background:rgba(255,255,255,.035);cursor:pointer;user-select:none}.data-table tr:last-child td{border-bottom:0}.data-table tbody tr{transition:.18s ease}.data-table tbody tr:hover{background:rgba(255,255,255,.045)}.user-cell{display:flex;align-items:center;gap:9px}.user-cell strong{display:block;font-size:12px}.user-cell span{font-size:10px;color:var(--muted)}.actions{display:flex;gap:5px}.pagination{display:flex;justify-content:space-between;align-items:center;margin-top:13px;color:var(--muted);font-size:11px}.pager{display:flex;gap:5px}.page-btn{width:30px;height:30px;border-radius:9px;border:1px solid var(--stroke);background:var(--surface);color:var(--muted);cursor:pointer}.page-btn.active{background:rgba(124,140,255,.22);color:var(--text);border-color:rgba(124,140,255,.3)}

.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.field{display:grid;gap:7px}.field.full{grid-column:1/-1}.field label{font-weight:700;font-size:11px}.input,.select,.textarea{width:100%;border:1px solid var(--stroke);border-radius:12px;background:rgba(255,255,255,.055);color:var(--text);outline:none;padding:10px 11px;transition:.2s}.input:focus,.select:focus,.textarea:focus{border-color:rgba(124,140,255,.55);box-shadow:0 0 0 3px rgba(124,140,255,.09);background:rgba(255,255,255,.075)}.textarea{min-height:110px;resize:vertical}.select option{background:#10182b;color:#fff}.help{color:var(--muted);font-size:10px}.check-row{display:flex;align-items:flex-start;gap:9px}.checkbox{appearance:none;width:17px;height:17px;min-width:17px;border:1px solid var(--stroke-strong);border-radius:5px;background:var(--surface);display:grid;place-content:center;cursor:pointer}.checkbox:checked{background:var(--primary);border-color:transparent}.checkbox:checked::after{content:"✓";font-size:11px;color:white;font-weight:800}.switch{width:39px;height:22px;border-radius:99px;background:rgba(255,255,255,.12);border:1px solid var(--stroke);position:relative;cursor:pointer;transition:.2s}.switch::after{content:"";position:absolute;width:16px;height:16px;left:2px;top:2px;border-radius:50%;background:#d7e1ef;transition:.2s}.switch.on{background:linear-gradient(135deg,var(--primary),var(--primary-2))}.switch.on::after{left:19px;background:white}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--stroke)}.setting-row:last-child{border-bottom:0}.setting-row strong{font-size:12px;display:block}.setting-row span{font-size:10px;color:var(--muted)}

.tabs{display:flex;gap:5px;padding:5px;background:var(--surface);border:1px solid var(--stroke);border-radius:13px;width:max-content;max-width:100%;overflow:auto}.tab{border:0;color:var(--muted);background:none;padding:7px 12px;border-radius:9px;font-weight:700;font-size:11px;cursor:pointer;white-space:nowrap}.tab.active{background:var(--surface-2);color:var(--text);box-shadow:inset 0 1px rgba(255,255,255,.09)}.tab-pane{display:none}.tab-pane.active{display:block;animation:fadein .22s ease}@keyframes fadein{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}

.alert{display:flex;gap:11px;padding:13px 14px;border-radius:14px;border:1px solid var(--stroke);background:var(--surface);margin-bottom:10px}.alert-icon{width:28px;height:28px;min-width:28px;border-radius:9px;display:grid;place-items:center}.alert strong{display:block;font-size:11px}.alert p{color:var(--muted);font-size:10px;margin:2px 0 0}.alert.info .alert-icon{background:rgba(124,140,255,.15);color:#b9c0ff}.alert.success .alert-icon{background:rgba(102,228,165,.13);color:#90efbd}.alert.warning .alert-icon{background:rgba(255,216,107,.13);color:#ffdf82}.alert.danger .alert-icon{background:rgba(255,123,143,.13);color:#ff9bab}

.dropdown{position:relative;display:inline-block}.dropdown-menu{position:absolute;right:0;top:calc(100% + 7px);width:190px;border-radius:13px;padding:6px;z-index:80;display:none}.dropdown.open .dropdown-menu{display:grid;animation:pop .15s ease}.dropdown-item{padding:8px 9px;border-radius:8px;color:var(--muted);font-size:11px;cursor:pointer}.dropdown-item:hover{background:var(--surface-2);color:var(--text)}.dropdown-sep{height:1px;background:var(--stroke);margin:4px}
@keyframes pop{from{opacity:0;transform:scale(.97) translateY(-3px)}to{opacity:1;transform:none}}

.modal-backdrop,.drawer-backdrop{position:fixed;inset:0;background:rgba(2,7,18,.50);backdrop-filter:blur(6px);z-index:90;opacity:0;visibility:hidden;transition:.2s}.modal-backdrop.show,.drawer-backdrop.show{opacity:1;visibility:visible}.modal{width:min(500px,calc(100vw - 28px));position:absolute;left:50%;top:50%;transform:translate(-50%,-46%) scale(.97);border-radius:22px;padding:20px;transition:.22s}.modal-backdrop.show .modal{transform:translate(-50%,-50%) scale(1)}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.drawer{position:absolute;right:0;top:0;height:100%;width:min(420px,90vw);padding:22px;border-radius:24px 0 0 24px;transform:translateX(105%);transition:.25s}.drawer-backdrop.show .drawer{transform:none}

.toast-stack{position:fixed;right:18px;bottom:18px;display:grid;gap:8px;z-index:120;width:min(350px,calc(100vw - 36px))}.toast{border-radius:15px;padding:12px 13px;display:flex;align-items:flex-start;gap:10px;animation:toastIn .28s ease}.toast.out{animation:toastOut .25s ease forwards}.toast .toast-dot{width:9px;height:9px;border-radius:50%;margin-top:5px;background:var(--cyan);box-shadow:0 0 0 5px rgba(94,231,247,.09)}.toast.success .toast-dot{background:var(--green)}.toast.warning .toast-dot{background:var(--yellow)}.toast.danger .toast-dot{background:var(--red)}.toast strong{display:block;font-size:11px}.toast span{display:block;color:var(--muted);font-size:10px;margin-top:2px}.toast-close{margin-left:auto;border:0;background:none;color:var(--muted);cursor:pointer}@keyframes toastIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}@keyframes toastOut{to{opacity:0;transform:translateX(15px)}}

.accordion-item{border-bottom:1px solid var(--stroke)}.accordion-item:last-child{border-bottom:0}.accordion-head{display:flex;justify-content:space-between;gap:12px;padding:14px 2px;cursor:pointer;font-weight:700;font-size:12px}.accordion-content{max-height:0;overflow:hidden;color:var(--muted);font-size:11px;transition:max-height .25s ease}.accordion-item.open .accordion-content{max-height:150px}.accordion-content>div{padding:0 2px 15px}

.timeline{display:grid;gap:0}.timeline-item{display:grid;grid-template-columns:26px 1fr;gap:10px}.timeline-mark{position:relative}.timeline-mark::before{content:"";position:absolute;left:12px;top:18px;bottom:-8px;width:1px;background:var(--stroke)}.timeline-item:last-child .timeline-mark::before{display:none}.timeline-dot{width:10px;height:10px;border-radius:50%;background:var(--primary);margin:5px 0 0 8px;box-shadow:0 0 0 4px rgba(124,140,255,.08)}.timeline-content{padding-bottom:15px}.timeline-content strong{font-size:11px}.timeline-content p{margin:2px 0;color:var(--muted);font-size:10px}.timeline-content time{color:var(--muted);font-size:9px}

.upload{border:1px dashed var(--stroke-strong);border-radius:16px;padding:26px;text-align:center;background:rgba(255,255,255,.025);cursor:pointer;transition:.2s}.upload:hover{background:var(--surface);border-color:rgba(124,140,255,.4)}.upload svg{width:25px;margin:0 auto 9px;color:var(--muted)}.upload strong{font-size:12px}.upload p{font-size:10px;color:var(--muted);margin:4px 0 0}
.skeleton{background:linear-gradient(90deg,rgba(255,255,255,.05),rgba(255,255,255,.11),rgba(255,255,255,.05));background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:8px}@keyframes shimmer{to{background-position:-200% 0}}

.profile-cover{height:190px;border-radius:22px;background:radial-gradient(circle at 20% 30%,rgba(94,231,247,.45),transparent 30%),radial-gradient(circle at 75% 25%,rgba(255,132,206,.28),transparent 27%),linear-gradient(135deg,#273462,#1a2250 45%,#161c3c);position:relative;overflow:hidden}.profile-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.08),transparent 40%)}.profile-head{display:flex;align-items:flex-end;gap:16px;margin:-42px 20px 0;position:relative;z-index:2}.profile-meta{padding-bottom:5px}.profile-meta h2{font:800 20px Manrope;margin:0}.profile-meta p{color:var(--muted);margin:2px 0 0;font-size:11px}.profile-actions{margin-left:auto;padding-bottom:6px;display:flex;gap:7px}

.auth-shell{min-height:100vh;display:grid;place-items:center;padding:24px;position:relative}.auth-card{width:min(430px,100%);border-radius:28px;padding:28px}.auth-brand{justify-content:center;padding-bottom:24px}.auth-card h1{text-align:center;font:800 25px Manrope;margin:0 0 7px;letter-spacing:-.7px}.auth-card>.subtitle{text-align:center;color:var(--muted);font-size:11px;margin:0 0 22px}.auth-sep{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:9px;margin:16px 0}.auth-sep::before,.auth-sep::after{content:"";height:1px;background:var(--stroke);flex:1}.social-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.auth-foot{text-align:center;color:var(--muted);font-size:10px;margin-top:18px}.auth-foot a{color:#c7ceff;font-weight:700}

.kbd{display:inline-flex;align-items:center;height:22px;padding:0 7px;border-radius:6px;background:var(--surface);border:1px solid var(--stroke);box-shadow:inset 0 -1px rgba(0,0,0,.18);font:700 9px monospace;color:var(--muted)}
.color-dot{width:26px;height:26px;border-radius:9px;border:2px solid rgba(255,255,255,.15);cursor:pointer}.color-dot:nth-child(1){background:#7c8cff}.color-dot:nth-child(2){background:#5ee7f7}.color-dot:nth-child(3){background:#d177ff}.color-dot:nth-child(4){background:#63dfa0}.color-dot:nth-child(5){background:#ff9b6b}

.demo-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.section-title{font:800 20px Manrope;margin:5px 0 2px;letter-spacing:-.5px}.section-copy{color:var(--muted);margin:0 0 16px;font-size:12px}.component-section{border-radius:22px;padding:20px}.component-section+.component-section{margin-top:18px}.component-section h3{font:800 14px Manrope;margin:0 0 14px}.component-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.mini-card{padding:14px;border-radius:15px;background:var(--surface);border:1px solid var(--stroke)}

@media(max-width:1100px){.grid-4{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}.hero{grid-template-columns:1fr}.hero-orb{display:none}}
@media(max-width:850px){.app-shell{grid-template-columns:1fr;padding:10px}.sidebar{position:fixed;left:10px;top:10px;bottom:10px;height:auto;width:260px;transform:translateX(-110%);transition:.25s;z-index:100}.sidebar.open{transform:none}.mobile-menu{display:grid}.topbar{top:10px;margin-bottom:10px}.search{display:none}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.span-2{grid-column:auto}.form-grid,.component-grid{grid-template-columns:1fr}.profile-head{align-items:center;flex-wrap:wrap}.profile-actions{width:100%;margin:0}.hero{padding:22px}.content{gap:10px}}
@media(max-width:520px){.topbar{padding:0 10px}.crumb{display:none}.card,.component-section{padding:14px}.hero h1{font-size:30px}.profile-cover{height:140px}.profile-head{margin:-35px 12px 0}.social-row{grid-template-columns:1fr}.modal-actions{flex-direction:column-reverse}.modal-actions .btn{width:100%}.table-toolbar>*{width:100%}.table-search{min-width:0}.tabs{width:100%}}

/* --- Liquiddy extended app modules --- */
.metric-strip{display:flex;gap:10px;flex-wrap:wrap}.metric-pill{padding:9px 12px;border-radius:12px;background:var(--surface);border:1px solid var(--stroke);min-width:120px}.metric-pill strong{display:block;font:800 16px Manrope}.metric-pill span{font-size:10px;color:var(--muted)}

.kanban{display:grid;grid-template-columns:repeat(4,minmax(250px,1fr));gap:14px;overflow:auto;padding-bottom:5px}.kanban-col{min-height:510px;padding:12px;border-radius:18px;background:rgba(255,255,255,.035);border:1px solid var(--stroke)}.kanban-head{display:flex;align-items:center;justify-content:space-between;padding:4px 3px 12px}.kanban-head strong{font:800 12px Manrope}.kanban-count{min-width:22px;height:22px;padding:0 7px;border-radius:99px;display:grid;place-items:center;background:var(--surface);border:1px solid var(--stroke);font-size:9px;color:var(--muted)}.kanban-list{display:grid;gap:9px;min-height:440px}.task-card{padding:13px;border-radius:15px;background:linear-gradient(145deg,var(--surface-2),var(--surface));border:1px solid var(--stroke);box-shadow:0 10px 30px rgba(0,0,0,.09);cursor:grab;transition:.18s}.task-card:active{cursor:grabbing}.task-card.dragging{opacity:.42;transform:rotate(1.5deg) scale(.98)}.kanban-list.drag-over{outline:2px dashed rgba(124,140,255,.42);outline-offset:4px;border-radius:12px}.task-labels{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:9px}.task-tag{font-size:8px;text-transform:uppercase;letter-spacing:.08em;font-weight:800;padding:4px 6px;border-radius:7px;background:rgba(124,140,255,.13);color:#cbd1ff}.task-card h4{font:700 12px Manrope;margin:0 0 5px}.task-card p{font-size:10px;color:var(--muted);margin:0 0 12px}.task-meta{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:9px}.task-meta .avatar{margin-left:auto}.task-progress{height:4px;margin:10px 0;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden}.task-progress span{display:block;height:100%;background:linear-gradient(90deg,var(--cyan),var(--primary));border-radius:inherit}

.calendar-shell{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:18px}.calendar-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.calendar-title{font:800 18px Manrope;min-width:160px}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);border:1px solid var(--stroke);border-radius:16px;overflow:hidden}.cal-weekday{padding:9px;text-align:center;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.08em;background:rgba(255,255,255,.035);border-right:1px solid var(--stroke)}.cal-day{min-height:104px;padding:8px;border-right:1px solid var(--stroke);border-top:1px solid var(--stroke);position:relative}.cal-day:nth-child(7n){border-right:0}.cal-day.muted{opacity:.35}.cal-date{font-size:10px;font-weight:800}.cal-day.today .cal-date{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:white}.cal-event{margin-top:6px;padding:5px 6px;border-radius:7px;background:rgba(124,140,255,.14);border-left:2px solid var(--primary);font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cal-event.cyan{background:rgba(94,231,247,.10);border-color:var(--cyan)}.cal-event.green{background:rgba(102,228,165,.10);border-color:var(--green)}.agenda{display:grid;gap:10px}.agenda-item{display:grid;grid-template-columns:42px 1fr;gap:10px;padding:10px;border-radius:13px;background:var(--surface);border:1px solid var(--stroke)}.agenda-time{font:800 10px Manrope;color:#cad1ff}.agenda-item strong{font-size:10px;display:block}.agenda-item span{font-size:9px;color:var(--muted)}

.notification-list{display:grid;gap:8px}.notification-item{display:grid;grid-template-columns:40px 1fr auto;gap:11px;align-items:start;padding:13px;border-radius:15px;border:1px solid var(--stroke);background:var(--surface);transition:.18s}.notification-item.unread{background:linear-gradient(135deg,rgba(124,140,255,.12),var(--surface));border-color:rgba(124,140,255,.20)}.notification-item.hidden{display:none}.notification-icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(124,140,255,.13);color:#cbd1ff}.notification-icon svg{width:17px}.notification-copy strong{display:block;font-size:11px}.notification-copy p{margin:2px 0 4px;color:var(--muted);font-size:10px}.notification-copy time{font-size:9px;color:var(--muted)}.unread-dot{width:8px;height:8px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 4px rgba(94,231,247,.08);margin-top:6px}

.pricing-toggle{display:flex;align-items:center;justify-content:center;gap:10px;margin:4px 0 20px}.pricing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.price-card{padding:22px;border-radius:22px}.price-card.featured{border-color:rgba(124,140,255,.42);transform:translateY(-5px);box-shadow:0 24px 70px rgba(93,93,255,.18)}.price-name{font:800 15px Manrope}.price-copy{font-size:10px;color:var(--muted);min-height:36px;margin:5px 0 17px}.price{font:800 34px Manrope;letter-spacing:-1.5px}.price small{font:500 10px DM Sans;color:var(--muted);letter-spacing:0}.price-feature{display:flex;gap:8px;padding:8px 0;font-size:10px;color:var(--muted)}.price-feature::before{content:'✓';color:var(--green);font-weight:800}.price-card .btn{width:100%;margin-top:14px}

.file-toolbar{display:flex;gap:9px;justify-content:space-between;align-items:center;flex-wrap:wrap}.file-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:15px}.file-grid.list-view{grid-template-columns:1fr}.file-card{padding:14px;border-radius:16px;background:var(--surface);border:1px solid var(--stroke);position:relative;transition:.18s}.file-card:hover{transform:translateY(-2px);background:var(--surface-2)}.file-grid.list-view .file-card{display:grid;grid-template-columns:42px 1fr auto;gap:12px;align-items:center}.file-icon{width:43px;height:43px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(124,140,255,.20),rgba(94,231,247,.09));font:800 10px Manrope;color:#cbd1ff}.file-card h4{font:700 11px Manrope;margin:12px 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-grid.list-view h4{margin:0}.file-card p{margin:0;color:var(--muted);font-size:9px}.file-card .file-more{position:absolute;right:9px;top:9px}.file-grid.list-view .file-more{position:static}.folder-card .file-icon{color:#ffe79a;background:rgba(255,216,107,.10)}

.invoice{max-width:980px;margin:auto}.invoice-head{display:flex;justify-content:space-between;gap:24px;align-items:flex-start}.invoice-brand{font:800 24px Manrope}.invoice-meta{text-align:right;color:var(--muted);font-size:10px}.invoice-meta strong{color:var(--text);font-size:12px}.invoice-addresses{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:26px 0}.invoice-addresses strong{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:6px}.invoice-addresses div{font-size:11px}.invoice-table{width:100%;border-collapse:collapse}.invoice-table th,.invoice-table td{padding:12px;border-bottom:1px solid var(--stroke);font-size:10px;text-align:left}.invoice-table th{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:8px}.invoice-table th:last-child,.invoice-table td:last-child{text-align:right}.invoice-summary{margin-left:auto;width:min(330px,100%);padding-top:15px}.invoice-summary div{display:flex;justify-content:space-between;padding:7px 0;color:var(--muted);font-size:10px}.invoice-summary .total{color:var(--text);font:800 15px Manrope;border-top:1px solid var(--stroke);margin-top:5px;padding-top:12px}

.analytics-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:18px}.donut{width:180px;aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--primary) 0 46%,var(--cyan) 46% 72%,var(--green) 72% 89%,rgba(255,255,255,.10) 89%);margin:18px auto;position:relative}.donut::after{content:'89%';position:absolute;inset:28px;border-radius:50%;background:linear-gradient(145deg,var(--bg-2),var(--bg));display:grid;place-items:center;font:800 22px Manrope;box-shadow:inset 0 0 30px rgba(255,255,255,.03)}.bar-list{display:grid;gap:12px}.bar-row{display:grid;grid-template-columns:110px 1fr 42px;gap:10px;align-items:center;font-size:9px}.bar-row span:first-child{color:var(--muted)}.bar-track{height:8px;border-radius:99px;background:rgba(255,255,255,.06);overflow:hidden}.bar-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--primary),var(--cyan))}.geo-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--stroke);font-size:10px}.geo-row:last-child{border-bottom:0}.geo-row span{color:var(--muted)}

.activity-feed{display:grid;gap:0}.activity-row{display:grid;grid-template-columns:38px 1fr auto;gap:11px;padding:13px 0;border-bottom:1px solid var(--stroke)}.activity-row:last-child{border-bottom:0}.activity-copy strong{font-size:11px}.activity-copy p{margin:2px 0;color:var(--muted);font-size:10px}.activity-row time{color:var(--muted);font-size:9px;white-space:nowrap}.activity-filter.active{background:rgba(124,140,255,.18);color:var(--text)}

@media(max-width:1100px){.calendar-shell,.analytics-grid{grid-template-columns:1fr}.pricing-grid{grid-template-columns:1fr}.price-card.featured{transform:none}.file-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.calendar-grid{min-width:720px}.calendar-scroll{overflow:auto}.file-grid{grid-template-columns:1fr}.invoice-head,.invoice-addresses{grid-template-columns:1fr;display:grid}.invoice-meta{text-align:left}.activity-row{grid-template-columns:38px 1fr}.activity-row time{grid-column:2}.kanban{grid-template-columns:repeat(4,280px)}}
@media print{body{background:#fff;color:#111}.app-shell>.sidebar,.topbar,.no-print{display:none!important}.app-shell{display:block;padding:0}.glass{background:#fff!important;border-color:#ddd!important;box-shadow:none!important;backdrop-filter:none!important}.main{width:100%}.invoice{max-width:none}.content{display:block}}

.chat-layout{display:grid;grid-template-columns:280px minmax(0,1fr);min-height:620px;padding:0;overflow:hidden}.chat-list{border-right:1px solid var(--stroke);padding:14px}.chat-person{display:flex;align-items:center;gap:9px;padding:10px;border-radius:13px;cursor:pointer}.chat-person:hover,.chat-person.active{background:var(--surface-2)}.chat-person strong{display:block;font-size:10px}.chat-person span{font-size:9px;color:var(--muted)}.chat-person time{margin-left:auto;font-size:8px;color:var(--muted)}.chat-main{display:grid;grid-template-rows:auto 1fr auto;min-width:0}.chat-head{padding:14px 17px;border-bottom:1px solid var(--stroke);display:flex;align-items:center;gap:10px}.chat-head strong{font-size:11px}.chat-head span{font-size:9px;color:var(--green)}.messages{padding:18px;display:flex;flex-direction:column;gap:10px;overflow:auto;max-height:500px}.message{max-width:72%;padding:10px 12px;border-radius:14px 14px 14px 4px;background:var(--surface-2);font-size:10px}.message.me{align-self:flex-end;border-radius:14px 14px 4px 14px;background:linear-gradient(135deg,rgba(124,140,255,.55),rgba(158,111,255,.38))}.message time{display:block;font-size:8px;color:var(--muted);margin-top:4px}.chat-compose{display:flex;gap:8px;padding:13px;border-top:1px solid var(--stroke)}.chat-compose .input{flex:1}

.marketing-body{padding:18px}.marketing-nav{max-width:1180px;margin:auto;border-radius:18px;height:66px;padding:0 18px;display:flex;align-items:center;gap:22px;position:sticky;top:18px;z-index:20}.marketing-links{display:flex;gap:18px;margin-left:auto;color:var(--muted);font-size:11px;font-weight:700}.marketing-hero{max-width:1180px;margin:18px auto 0;min-height:580px;border-radius:30px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;padding:54px;overflow:hidden}.marketing-hero h1{font:800 clamp(42px,6vw,78px)/.95 Manrope;letter-spacing:-4px;margin:0 0 20px}.marketing-hero p{font-size:15px;color:var(--muted);max-width:590px}.marketing-visual{height:380px;position:relative}.floating-panel{position:absolute;border-radius:20px;padding:15px}.floating-panel.one{width:78%;left:4%;top:14%;transform:rotate(-4deg)}.floating-panel.two{width:68%;right:0;bottom:10%;transform:rotate(5deg)}.marketing-section{max-width:1180px;margin:18px auto;padding:34px;border-radius:26px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.feature-box{padding:20px;border-radius:18px;background:var(--surface);border:1px solid var(--stroke)}.feature-box h3{font:800 13px Manrope;margin:10px 0 5px}.feature-box p{margin:0;color:var(--muted);font-size:10px}.feature-icon{width:38px;height:38px;border-radius:12px;background:rgba(124,140,255,.14);display:grid;place-items:center}.feature-icon svg{width:18px}
@media(max-width:850px){.chat-layout{grid-template-columns:1fr}.chat-list{display:none}.marketing-links{display:none}.marketing-hero{grid-template-columns:1fr;padding:30px;min-height:auto}.marketing-visual{height:310px}.feature-grid{grid-template-columns:1fr}.marketing-hero h1{letter-spacing:-2.5px}}

/* =========================================================
   Liquiddy SDK + interaction layer
   Added as a non-invasive CSS/JS extension. No page markup required.
   ========================================================= */
.sdk-trigger{height:38px;padding:0 12px;border-radius:12px;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.sdk-trigger svg{width:15px;height:15px}.sdk-trigger .sdk-key{font-size:9px;color:var(--muted);padding:2px 5px;border:1px solid var(--stroke);border-radius:6px;background:rgba(255,255,255,.04)}
.sdk-overlay{position:fixed;inset:0;z-index:180;background:rgba(2,7,18,.56);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;visibility:hidden;transition:.22s ease;padding:18px;display:grid;place-items:center}
.sdk-overlay.show{opacity:1;visibility:visible}.sdk-panel{width:min(1120px,100%);height:min(780px,calc(100vh - 36px));border-radius:26px;overflow:hidden;display:grid;grid-template-rows:auto 1fr;transform:translateY(10px) scale(.985);transition:.24s ease}
.sdk-overlay.show .sdk-panel{transform:none}.sdk-head{display:flex;align-items:center;gap:12px;padding:15px 17px;border-bottom:1px solid var(--stroke);z-index:2}.sdk-head-mark{width:35px;height:35px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(94,231,247,.20),rgba(124,140,255,.30));border:1px solid var(--stroke)}.sdk-head-mark svg{width:18px}.sdk-head strong{font:800 13px Manrope;display:block}.sdk-head span{display:block;color:var(--muted);font-size:9px}.sdk-head .sdk-search{margin-left:auto;width:min(280px,35vw);height:36px;display:flex;align-items:center;gap:8px;padding:0 10px;background:var(--surface);border:1px solid var(--stroke);border-radius:11px}.sdk-search input{width:100%;border:0;outline:0;background:none;color:var(--text);font-size:11px}.sdk-search svg{width:14px;color:var(--muted)}
.sdk-body{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:0}.sdk-nav{padding:12px;border-right:1px solid var(--stroke);overflow:auto}.sdk-nav-label{font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:8px 9px 6px}.sdk-nav button{width:100%;display:flex;align-items:center;gap:9px;text-align:left;border:0;background:none;color:var(--muted);border-radius:10px;padding:8px 9px;font-size:10px;font-weight:700;cursor:pointer;transition:.18s}.sdk-nav button:hover{color:var(--text);background:var(--surface)}.sdk-nav button.active{color:var(--text);background:linear-gradient(135deg,rgba(124,140,255,.20),rgba(94,231,247,.08));box-shadow:inset 0 0 0 1px rgba(124,140,255,.18)}.sdk-nav button i{width:7px;height:7px;border-radius:50%;background:var(--stroke-strong)}.sdk-nav button.active i{background:var(--cyan);box-shadow:0 0 0 4px rgba(94,231,247,.08)}
.sdk-content{overflow:auto;padding:24px}.sdk-doc{display:none;max-width:820px;margin:0 auto}.sdk-doc.active{display:block;animation:fadein .2s ease}.sdk-kicker{font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#bfc8ff}.sdk-doc h2{font:800 27px/1.1 Manrope;margin:8px 0 8px;letter-spacing:-.8px}.sdk-doc>p{color:var(--muted);font-size:12px;max-width:680px;margin:0 0 20px}.sdk-block{padding:16px;border:1px solid var(--stroke);border-radius:16px;background:rgba(255,255,255,.035);margin:12px 0}.sdk-block h3{font:800 12px Manrope;margin:0 0 6px}.sdk-block p{font-size:10px;color:var(--muted);margin:0 0 10px}.sdk-props{display:grid;grid-template-columns:150px 1fr;gap:0;border:1px solid var(--stroke);border-radius:12px;overflow:hidden;margin-top:10px}.sdk-props code,.sdk-props span{padding:8px 10px;border-bottom:1px solid var(--stroke);font-size:9px}.sdk-props code{color:#c8d0ff;background:rgba(124,140,255,.06)}.sdk-props span{color:var(--muted)}.sdk-props>*:nth-last-child(-n+2){border-bottom:0}
.sdk-code{position:relative;margin-top:10px;border:1px solid var(--stroke);border-radius:13px;background:rgba(3,8,20,.42);overflow:auto}.sdk-code pre{margin:0;padding:14px 46px 14px 14px;white-space:pre;tab-size:2;color:#dce5f4;font:9.5px/1.7 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.sdk-copy{position:absolute;right:7px;top:7px;border:1px solid var(--stroke);border-radius:8px;background:var(--surface-2);color:var(--muted);padding:5px 7px;font-size:8px;font-weight:800;cursor:pointer}.sdk-copy:hover{color:var(--text)}.sdk-tip{display:flex;gap:9px;padding:11px 12px;border-radius:12px;background:rgba(94,231,247,.065);border:1px solid rgba(94,231,247,.13);color:var(--muted);font-size:9.5px}.sdk-tip strong{color:var(--text)}.sdk-live{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px}.sdk-no-results{display:none;text-align:center;padding:50px 20px;color:var(--muted);font-size:11px}.sdk-empty .sdk-no-results{display:block}.sdk-empty .sdk-doc{display:none!important}

/* Canvas chart hover system */
.chart-wrap canvas[data-liquiddy-chart]{cursor:crosshair;touch-action:pan-y}.chart-hover-line{position:absolute;top:14px;bottom:18px;width:1px;pointer-events:none;background:linear-gradient(to bottom,transparent,rgba(205,215,255,.35) 16%,rgba(205,215,255,.35) 84%,transparent);opacity:0;transform:translateX(-.5px);transition:opacity .12s}.chart-wrap.is-hovering .chart-hover-line{opacity:1}.chart-tooltip{position:absolute;z-index:4;min-width:142px;pointer-events:none;padding:9px 10px;border-radius:12px;border:1px solid var(--stroke-strong);background:linear-gradient(145deg,rgba(15,25,47,.90),rgba(8,16,32,.84));box-shadow:0 12px 36px rgba(0,0,0,.30);backdrop-filter:blur(16px) saturate(150%);-webkit-backdrop-filter:blur(16px) saturate(150%);opacity:0;transform:translateY(4px) scale(.98);transition:opacity .12s,transform .12s;color:#f7fbff}.chart-wrap.is-hovering .chart-tooltip{opacity:1;transform:none}.chart-tooltip-label{font-size:8px;text-transform:uppercase;letter-spacing:.1em;color:#93a3bc;margin-bottom:5px}.chart-tooltip-row{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:9px;padding:2px 0}.chart-tooltip-row span{display:flex;align-items:center;gap:6px;color:#cbd6e7}.chart-tooltip-row i{width:6px;height:6px;border-radius:50%}.chart-tooltip-row strong{font:800 10px Manrope;color:#fff}
[data-theme="light"] .chart-tooltip{background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(239,245,255,.91));color:#15203a;box-shadow:0 12px 36px rgba(70,86,130,.18)}[data-theme="light"] .chart-tooltip-row strong{color:#15203a}[data-theme="light"] .chart-tooltip-row span{color:#59667c}

/* Calendar drag/drop + range selection */
.cal-event{cursor:grab;user-select:none;transition:transform .16s ease,opacity .16s ease,box-shadow .16s ease,border-color .16s ease}.cal-event:active{cursor:grabbing}.cal-event.cal-dragging{opacity:.42;transform:scale(.96)}.cal-day.cal-drop-target{background:rgba(124,140,255,.10);box-shadow:inset 0 0 0 2px rgba(124,140,255,.26)}.cal-day.cal-range{background:linear-gradient(145deg,rgba(94,231,247,.09),rgba(124,140,255,.08));box-shadow:inset 0 0 0 1px rgba(94,231,247,.16)}.cal-day.cal-range-start,.cal-day.cal-range-end{background:linear-gradient(145deg,rgba(94,231,247,.17),rgba(124,140,255,.14));box-shadow:inset 0 0 0 2px rgba(94,231,247,.25)}.cal-day.cal-range-selecting{cursor:cell}.cal-event.cal-just-moved{animation:calMoved .42s ease}@keyframes calMoved{0%{transform:scale(.92);filter:brightness(1.25)}60%{transform:scale(1.035)}100%{transform:none}}
.calendar-hint{display:inline-flex;align-items:center;gap:6px;font-size:9px;color:var(--muted);padding:6px 8px;border-radius:9px;background:var(--surface);border:1px solid var(--stroke)}.calendar-hint::before{content:"↔";font-size:11px;color:var(--cyan)}

@media(max-width:850px){.sdk-trigger .sdk-key{display:none}.sdk-trigger{width:38px;padding:0;justify-content:center}.sdk-trigger .sdk-label{display:none}.sdk-panel{height:calc(100vh - 20px)}.sdk-overlay{padding:10px}.sdk-body{grid-template-columns:1fr}.sdk-nav{display:flex;overflow:auto;border-right:0;border-bottom:1px solid var(--stroke);padding:8px}.sdk-nav-label{display:none}.sdk-nav button{width:auto;white-space:nowrap}.sdk-content{padding:18px}.sdk-head .sdk-search{display:none}.sdk-props{grid-template-columns:110px 1fr}}
@media(max-width:520px){.sdk-doc h2{font-size:22px}.sdk-content{padding:14px}.sdk-code pre{font-size:8.5px}.sdk-head{padding:11px}.sdk-head>div:nth-child(2) span{display:none}}

/* =========================================================
   v2.2 Light-mode parity + Commerce preview
   Stronger light surfaces prevent a dark backdrop from bleeding
   through while keeping the same liquid-glass character.
   ========================================================= */
:root{
  --semantic-primary:#bdc5ff;
  --semantic-success:#8bf1bd;
  --semantic-warning:#ffe292;
  --semantic-danger:#ffa1b0;
  --semantic-info:#9feaf4;
  --overlay:rgba(2,7,18,.50);
  --code-bg:rgba(3,8,20,.72);
}
[data-theme="light"]{
  --surface:rgba(255,255,255,.72);
  --surface-2:rgba(255,255,255,.88);
  --surface-3:rgba(255,255,255,.96);
  --stroke:rgba(47,63,101,.17);
  --stroke-strong:rgba(47,63,101,.28);
  --muted:#53617a;
  --semantic-primary:#4656c9;
  --semantic-success:#16734a;
  --semantic-warning:#835600;
  --semantic-danger:#b42343;
  --semantic-info:#087083;
  --overlay:rgba(39,50,73,.24);
  --code-bg:#10192c;
}
[data-theme="light"] body::before{
  background-image:linear-gradient(rgba(49,67,105,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(49,67,105,.035) 1px,transparent 1px);
}
[data-theme="light"] .glass{
  background:linear-gradient(145deg,rgba(255,255,255,.91),rgba(240,246,255,.78));
  border-color:rgba(63,80,120,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 22px 72px rgba(71,88,129,.16);
}
[data-theme="light"] .glass::after{
  background:linear-gradient(120deg,rgba(255,255,255,.78),transparent 30%,transparent 70%,rgba(122,143,191,.06));
  opacity:.62;
}
[data-theme="light"] .glass-soft{background:rgba(255,255,255,.72);border-color:var(--stroke)}
[data-theme="light"] .modal-backdrop,
[data-theme="light"] .drawer-backdrop{background:var(--overlay)}
[data-theme="light"] .modal,
[data-theme="light"] .drawer,
[data-theme="light"] .sdk-panel{background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(239,245,255,.96));box-shadow:0 28px 90px rgba(45,59,94,.24),inset 0 1px rgba(255,255,255,1)}
[data-theme="light"] .modal .alert{background:rgba(247,250,255,.94)}
[data-theme="light"] .search,
[data-theme="light"] .table-search,
[data-theme="light"] .input,
[data-theme="light"] .select,
[data-theme="light"] .textarea{background:rgba(255,255,255,.72)}
[data-theme="light"] .input:focus,
[data-theme="light"] .select:focus,
[data-theme="light"] .textarea:focus{background:#fff}
[data-theme="light"] .select option{background:#fff;color:#15203a}
[data-theme="light"] .data-table th{background:rgba(72,91,133,.055)}
[data-theme="light"] .data-table tbody tr:hover{background:rgba(92,112,163,.07)}
[data-theme="light"] .progress,
[data-theme="light"] .bar-track{background:rgba(56,75,115,.10)}
[data-theme="light"] .switch{background:rgba(55,72,108,.14)}
[data-theme="light"] .switch::after{background:#fff;box-shadow:0 1px 4px rgba(39,52,84,.22)}
[data-theme="light"] .tab.active{box-shadow:inset 0 1px rgba(255,255,255,.95),0 4px 12px rgba(57,75,116,.08)}
[data-theme="light"] .sdk-overlay{background:rgba(39,50,73,.28)}
[data-theme="light"] .sdk-block{background:rgba(80,99,141,.035)}
[data-theme="light"] .sdk-code{background:var(--code-bg)}
[data-theme="light"] .sdk-code pre{color:#e7edfa}
[data-theme="light"] .sdk-kicker{color:#4a59c9}
[data-theme="light"] .sdk-props code{color:#4656c9;background:rgba(70,86,201,.06)}
[data-theme="light"] .chart-hover-line{background:linear-gradient(to bottom,transparent,rgba(63,79,117,.28) 16%,rgba(63,79,117,.28) 84%,transparent)}

/* semantic text must remain readable in both themes */
.badge-primary{color:var(--semantic-primary)}
.badge-success{color:var(--semantic-success)}
.badge-warning{color:var(--semantic-warning)}
.badge-danger{color:var(--semantic-danger)}
.btn-primary{color:#fff}
.btn-success{color:var(--semantic-success)}
.btn-danger{color:var(--semantic-danger)}
.alert.info .alert-icon{color:var(--semantic-primary)}
.alert.success .alert-icon{color:var(--semantic-success)}
.alert.warning .alert-icon{color:var(--semantic-warning)}
.alert.danger .alert-icon{color:var(--semantic-danger)}
[data-theme="light"] .btn-primary{color:#fff;background:linear-gradient(135deg,#6572e8,#875ee0);border-color:rgba(72,79,181,.26)}
[data-theme="light"] .btn-success{background:rgba(33,143,91,.10);border-color:rgba(33,143,91,.22)}
[data-theme="light"] .btn-danger{background:rgba(190,42,70,.085);border-color:rgba(190,42,70,.20)}
[data-theme="light"] .badge-primary{background:rgba(70,86,201,.09)}
[data-theme="light"] .badge-success{background:rgba(22,115,74,.08)}
[data-theme="light"] .badge-warning{background:rgba(131,86,0,.08)}
[data-theme="light"] .badge-danger{background:rgba(180,35,67,.08)}
[data-theme="light"] .eyebrow{color:#4452b8}
[data-theme="light"] .nav-badge{color:#4554bd;background:rgba(69,84,189,.09)}
[data-theme="light"] .message.me{color:#fff;background:linear-gradient(135deg,#6572e8,#875ee0)}
[data-theme="light"] .message.me time{color:rgba(255,255,255,.76)}

/* Toast readability parity */
.toast{isolation:isolate}.toast> *{position:relative;z-index:1}.toast strong{display:block;font-size:11px}.toast span{display:block;color:var(--muted);font-size:9px;margin-top:2px}.toast-close{color:var(--muted)}
[data-theme="light"] .toast.glass{background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(240,246,255,.96));box-shadow:0 16px 44px rgba(54,70,108,.20),inset 0 1px #fff}

/* =========================================================
   Commerce Preview
   ========================================================= */
.store-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.store-toolbar .table-search{flex:1;min-width:230px}.store-toolbar .select{width:auto;min-width:150px;height:38px;padding-top:0;padding-bottom:0}.store-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.store-kpi{padding:15px;border-radius:16px;background:var(--surface);border:1px solid var(--stroke)}.store-kpi span{display:block;color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.08em}.store-kpi strong{display:block;font:800 20px Manrope;margin-top:5px;letter-spacing:-.6px}
.product-list{display:grid;gap:10px}.product-row{display:grid;grid-template-columns:72px minmax(190px,1fr) 140px 110px 115px auto;align-items:center;gap:14px;padding:11px;border-radius:17px;border:1px solid var(--stroke);background:var(--surface);transition:.18s ease}.product-row:hover{background:var(--surface-2);border-color:var(--stroke-strong);transform:translateY(-1px)}.product-thumb{width:72px;height:72px;border-radius:14px;overflow:hidden;border:1px solid var(--stroke);background:var(--surface-2)}.product-thumb img{width:100%;height:100%;object-fit:cover;display:block}.product-copy{min-width:0}.product-copy strong{display:block;font:800 12px Manrope;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-copy p{margin:3px 0 0;color:var(--muted);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-meta-label{display:block;color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:3px}.product-meta-value{font-size:10px;font-weight:700}.product-price{font:800 15px Manrope}.product-actions{display:flex;gap:6px;justify-content:flex-end}.store-empty{display:none;padding:34px;text-align:center;color:var(--muted);border:1px dashed var(--stroke);border-radius:16px}.product-list.is-empty .store-empty{display:block}.product-list.is-empty .product-row{display:none}

/* Full-screen product viewer */
.product-viewer{position:fixed;inset:0;z-index:210;opacity:0;visibility:hidden;transition:.24s ease;background:rgba(2,7,18,.68);backdrop-filter:blur(12px) saturate(125%);-webkit-backdrop-filter:blur(12px) saturate(125%);padding:18px;overflow:auto}.product-viewer.show{opacity:1;visibility:visible}.product-view-shell{width:min(1240px,100%);min-height:calc(100vh - 36px);margin:auto;border-radius:28px;display:grid;grid-template-rows:auto 1fr;overflow:hidden;transform:translateY(10px) scale(.985);transition:.25s ease}.product-viewer.show .product-view-shell{transform:none}.product-view-head{height:66px;padding:0 18px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--stroke);position:relative;z-index:3}.product-view-head .brand{padding:0}.product-view-head .product-view-spacer{flex:1}.product-view-main{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);min-height:0}.product-gallery{padding:22px;border-right:1px solid var(--stroke);display:grid;grid-template-rows:minmax(390px,1fr) auto;gap:12px}.product-hero-image{border-radius:22px;overflow:hidden;border:1px solid var(--stroke);background:linear-gradient(145deg,var(--surface),var(--surface-2));display:grid;place-items:center;min-height:390px}.product-hero-image img{width:100%;height:100%;object-fit:cover;display:block}.product-thumbs{display:flex;gap:9px;overflow:auto}.product-thumb-btn{width:74px;height:58px;flex:0 0 auto;border-radius:11px;padding:0;overflow:hidden;border:1px solid var(--stroke);background:var(--surface);cursor:pointer}.product-thumb-btn.active{border-color:rgba(124,140,255,.65);box-shadow:0 0 0 2px rgba(124,140,255,.12)}.product-thumb-btn img{width:100%;height:100%;object-fit:cover}.product-details{padding:34px;overflow:auto}.product-breadcrumb{font-size:9px;color:var(--muted);margin-bottom:18px}.product-detail-badges{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:13px}.product-details h1{font:800 clamp(30px,4vw,48px)/1.02 Manrope;letter-spacing:-1.8px;margin:0 0 10px}.product-rating{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:10px}.product-stars{color:#f3b526;letter-spacing:1px}.product-detail-price{display:flex;align-items:end;gap:9px;margin:22px 0}.product-detail-price strong{font:800 32px Manrope;letter-spacing:-1px}.product-detail-price del{color:var(--muted);font-size:12px;margin-bottom:5px}.product-description{color:var(--muted);font-size:12px;line-height:1.75;margin:0 0 20px}.product-features{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 23px;padding:0;list-style:none}.product-features li{padding:9px 10px;border-radius:11px;background:var(--surface);border:1px solid var(--stroke);font-size:9px;font-weight:700}.product-option-block{padding:16px 0;border-top:1px solid var(--stroke)}.product-option-head{display:flex;justify-content:space-between;align-items:center;font-size:10px;font-weight:800;margin-bottom:10px}.swatches{display:flex;gap:8px}.swatch{width:30px;height:30px;border-radius:50%;border:4px solid transparent;outline:1px solid var(--stroke);cursor:pointer}.swatch.active{outline:2px solid var(--primary);outline-offset:2px}.quantity{display:inline-grid;grid-template-columns:34px 42px 34px;height:36px;border:1px solid var(--stroke);border-radius:11px;overflow:hidden}.quantity button{border:0;background:var(--surface);color:var(--text);cursor:pointer;font-weight:800}.quantity span{display:grid;place-items:center;border-inline:1px solid var(--stroke);font-size:10px;font-weight:800}.product-buy-row{display:grid;grid-template-columns:auto 1fr 1fr;gap:8px;margin-top:12px}.product-buy-row .btn{min-height:42px}.product-assurance{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px}.assurance{padding:10px;border-radius:11px;background:var(--surface);border:1px solid var(--stroke);font-size:8px;color:var(--muted);text-align:center}.assurance strong{display:block;color:var(--text);font-size:9px;margin-bottom:2px}
[data-theme="light"] .product-viewer{background:rgba(43,55,80,.28)}
[data-theme="light"] .product-view-shell{background:linear-gradient(145deg,rgba(255,255,255,.99),rgba(238,245,255,.97));box-shadow:0 34px 100px rgba(48,63,98,.26)}

/* Cart drawer */
.cart-count{position:absolute;right:-5px;top:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:999px;background:var(--red);color:#fff;font-size:8px;font-weight:800;display:grid;place-items:center;border:2px solid var(--bg)}.cart-items{display:grid;gap:9px;margin-top:14px}.cart-item{display:grid;grid-template-columns:52px 1fr auto;gap:9px;align-items:center;padding:8px;border-radius:13px;background:var(--surface);border:1px solid var(--stroke)}.cart-item img{width:52px;height:52px;border-radius:10px;object-fit:cover}.cart-item strong{display:block;font-size:9px}.cart-item span{color:var(--muted);font-size:8px}.cart-item button{border:0;background:none;color:var(--muted);cursor:pointer;font-size:16px}.cart-total{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding-top:14px;border-top:1px solid var(--stroke)}.cart-total span{color:var(--muted);font-size:10px}.cart-total strong{font:800 18px Manrope}.cart-empty{padding:28px 8px;text-align:center;color:var(--muted);font-size:10px}

@media(max-width:1050px){.product-row{grid-template-columns:64px minmax(180px,1fr) 110px 100px auto}.product-row .product-stock{display:none}.store-summary{grid-template-columns:repeat(2,1fr)}.product-view-main{grid-template-columns:1fr}.product-gallery{border-right:0;border-bottom:1px solid var(--stroke);grid-template-rows:minmax(330px,55vh) auto}.product-details{overflow:visible}}
@media(max-width:700px){.product-row{grid-template-columns:58px 1fr auto;padding:9px}.product-thumb{width:58px;height:58px}.product-row .product-category,.product-row .product-stock,.product-row .product-sold{display:none}.product-price{text-align:right}.product-actions{grid-column:2/-1}.product-actions .btn{flex:1}.store-summary{grid-template-columns:1fr 1fr}.product-viewer{padding:8px}.product-view-shell{min-height:calc(100vh - 16px);border-radius:20px}.product-view-head{height:58px;padding:0 11px}.product-gallery{padding:12px;grid-template-rows:minmax(280px,48vh) auto}.product-hero-image{min-height:280px}.product-details{padding:22px 16px}.product-features{grid-template-columns:1fr}.product-buy-row{grid-template-columns:auto 1fr}.product-buy-row [data-buy-now]{grid-column:1/-1}.product-assurance{grid-template-columns:1fr}.store-toolbar .select{flex:1}.store-toolbar .table-search{flex-basis:100%}}
#commerceCart.drawer-backdrop{z-index:230}
[data-theme="light"] .cart-count{border-color:#f7fbff}
button:disabled{pointer-events:none}
/* Additional light-mode contrast normalization for legacy modules */
[data-theme="light"] .auth-foot a,
[data-theme="light"] .task-tag,
[data-theme="light"] .agenda-time,
[data-theme="light"] .notification-icon,
[data-theme="light"] .file-icon{color:#4656c9}
[data-theme="light"] .folder-card .file-icon{color:#815700}
[data-theme="light"] .kanban-col{background:rgba(255,255,255,.42)}
[data-theme="light"] .task-progress{background:rgba(56,75,115,.10)}
[data-theme="light"] .cal-weekday{background:rgba(72,91,133,.055)}
[data-theme="light"] .cal-event{background:rgba(70,86,201,.09);color:#28335c}
[data-theme="light"] .cal-event.cyan{background:rgba(8,112,131,.08)}
[data-theme="light"] .cal-event.green{background:rgba(22,115,74,.08)}
[data-theme="light"] .notification-item.unread{background:linear-gradient(135deg,rgba(70,86,201,.08),rgba(255,255,255,.76))}
[data-theme="light"] .upload{background:rgba(255,255,255,.34)}
[data-theme="light"] .skeleton{background:linear-gradient(90deg,rgba(72,91,133,.06),rgba(72,91,133,.14),rgba(72,91,133,.06));background-size:200% 100%}
[data-theme="light"] .donut::after{background:linear-gradient(145deg,#eef4ff,#e5eeff);box-shadow:inset 0 0 28px rgba(65,84,126,.05)}
[data-theme="light"] .color-dot{border-color:rgba(47,63,101,.18)}
[data-theme="light"] .kbd{box-shadow:inset 0 -1px rgba(47,63,101,.12)}
[data-theme="light"] .badge-neutral{color:#53617a}
[data-theme="light"] .delta.up,
[data-theme="light"] .chat-head span,
[data-theme="light"] .price-feature::before{color:var(--semantic-success)}
[data-theme="light"] .delta.down{color:var(--semantic-danger)}
[data-theme="light"] .product-stars{color:#a96a00}

/* ==========================================================
   Sidebar height safety / compact laptop mode
   Keeps every navigation item inside the liquid-glass panel.
   ========================================================== */
.sidebar{
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.sidebar::-webkit-scrollbar{width:0;height:0}
.sidebar .nav-item{flex-shrink:0}
.sidebar .nav-label,.sidebar .brand,.sidebar .sidebar-footer{flex-shrink:0}

/* Short desktop/laptop viewports: preserve the full menu without overflow. */
@media (min-width:851px) and (max-height:1050px){
  .sidebar{padding:13px 14px}
  .brand{padding:2px 7px 10px;font-size:17px}
  .brand-mark{width:31px;height:31px;border-radius:10px}
  .brand small{font-size:8px}
  .nav{gap:2px}
  .nav-label{padding:8px 12px 4px;font-size:8.5px}
  .nav-item{gap:10px;padding:7px 11px;border-radius:11px;font-size:13px}
  .nav-item svg{width:16px;height:16px}
  .nav-badge{min-width:21px;height:18px;padding:0 6px;font-size:9px}
  .sidebar-footer{padding-top:8px}
  .mini-profile{padding:8px;border-radius:13px}
  .mini-profile .avatar{width:31px;height:31px}
  .mini-profile strong{font-size:10px}
  .mini-profile span{font-size:8px}
}

/* Very short screens still remain usable: compact further, then scroll internally. */
@media (min-width:851px) and (max-height:760px){
  .sidebar{padding:10px 12px}
  .brand{padding-bottom:7px}
  .brand-mark{width:28px;height:28px}
  .nav-label{padding:6px 10px 3px;font-size:8px}
  .nav-item{padding:6px 10px;font-size:12px}
  .sidebar-footer{padding-top:6px}
}

/* Mobile drawer can contain an arbitrarily long menu without leaking below screen. */
@media(max-width:850px){
  .sidebar{overflow-y:auto;overflow-x:hidden}
}

/* =========================================================
   Liquiddy 3.0 — wide layouts, commerce flow and SDK studio
   ========================================================= */
.wide-shell{min-height:100vh;padding:18px}.wide-nav{max-width:1440px;margin:0 auto 18px;height:68px;border-radius:22px;padding:0 18px;display:flex;align-items:center;gap:18px;position:sticky;top:18px;z-index:50}.wide-nav .brand{padding:0;margin-right:8px}.wide-nav-links{display:flex;align-items:center;gap:4px}.wide-nav-links a{padding:9px 12px;border-radius:11px;color:var(--muted);font-size:11px;font-weight:700;transition:.18s}.wide-nav-links a:hover,.wide-nav-links a.active{background:var(--surface-2);color:var(--text)}.wide-nav-spacer{flex:1}.wide-nav-actions{display:flex;align-items:center;gap:8px}.wide-page{max-width:1440px;margin:0 auto;display:grid;gap:18px}.wide-hero{border-radius:30px;padding:38px;min-height:300px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);align-items:center;overflow:hidden}.wide-hero h1{font:800 clamp(38px,6vw,72px)/.96 Manrope;margin:0 0 16px;letter-spacing:-3.2px}.wide-hero p{max-width:690px;color:var(--muted);font-size:15px}.wide-hero-visual{min-height:230px;position:relative}.wide-orb{position:absolute;width:210px;aspect-ratio:1;border-radius:44% 56% 59% 41%/48% 42% 58% 52%;right:9%;top:8%;background:linear-gradient(135deg,rgba(94,231,247,.86),rgba(124,140,255,.74) 48%,rgba(255,135,208,.68));box-shadow:inset 20px 18px 38px rgba(255,255,255,.32),0 34px 100px rgba(96,114,255,.34);animation:float 8s ease-in-out infinite}.wide-mini-card{position:absolute;border-radius:18px;padding:15px;width:205px;right:44%;bottom:4%;z-index:2}.wide-mini-card strong{display:block;font:800 21px Manrope}.wide-mini-card span{font-size:9px;color:var(--muted)}
.nav-mobile-toggle{display:none}.wide-nav-menu{display:contents}

/* top navigation dashboard */
.topnav-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.topnav-kpi{padding:19px;border-radius:19px}.topnav-kpi .kpi-top{display:flex;align-items:center;justify-content:space-between}.topnav-kpi small{color:var(--muted);font-size:9px;text-transform:uppercase;letter-spacing:.09em}.topnav-kpi strong{display:block;font:800 27px Manrope;margin-top:10px}.topnav-workgrid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,.7fr);gap:18px}.topnav-projects{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.project-tile{border-radius:18px;padding:16px;background:var(--surface);border:1px solid var(--stroke);min-height:160px;display:flex;flex-direction:column}.project-tile:hover{background:var(--surface-2);transform:translateY(-2px);transition:.18s}.project-tile .project-icon{width:39px;height:39px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(124,140,255,.28),rgba(94,231,247,.10));font-weight:800}.project-tile h3{font:800 13px Manrope;margin:18px 0 3px}.project-tile p{font-size:9px;color:var(--muted);margin:0}.project-tile footer{display:flex;align-items:center;margin-top:auto;padding-top:16px}.avatar-stack{display:flex}.avatar-stack .avatar{width:26px;height:26px;font-size:8px;margin-left:-6px;border:2px solid var(--bg-2)}.avatar-stack .avatar:first-child{margin-left:0}.project-tile footer span{margin-left:auto;color:var(--muted);font-size:9px}

/* public storefront */
.storefront-body{padding-bottom:40px}.storefront-hero{border-radius:30px;padding:36px;display:grid;grid-template-columns:1fr .8fr;min-height:360px;align-items:center;overflow:hidden}.storefront-hero h1{font:800 clamp(40px,6vw,78px)/.94 Manrope;letter-spacing:-3.6px;margin:0 0 16px}.storefront-hero p{max-width:590px;color:var(--muted);font-size:15px}.storefront-showpiece{height:300px;position:relative;display:grid;place-items:center}.storefront-showpiece img{width:min(330px,90%);height:min(330px,90%);object-fit:contain;filter:drop-shadow(0 34px 55px rgba(65,75,150,.32));animation:float 7s ease-in-out infinite}.storefront-chipbar{display:flex;gap:8px;overflow:auto;padding:2px}.category-chip{border:1px solid var(--stroke);background:var(--surface);color:var(--muted);border-radius:999px;padding:9px 14px;white-space:nowrap;font-size:10px;font-weight:800;cursor:pointer}.category-chip.active,.category-chip:hover{background:var(--surface-2);color:var(--text);border-color:var(--stroke-strong)}.storefront-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.storefront-toolbar .table-search{flex:1;min-width:250px}.storefront-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.shop-card{border-radius:21px;padding:12px;overflow:hidden;transition:.2s}.shop-card:hover{transform:translateY(-3px);border-color:var(--stroke-strong)}.shop-media{height:270px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(145deg,var(--surface-2),var(--surface));position:relative;overflow:hidden}.shop-media img{width:88%;height:88%;object-fit:contain;transition:.25s}.shop-card:hover .shop-media img{transform:scale(1.035)}.shop-wish{position:absolute;right:11px;top:11px;width:35px;height:35px;border-radius:11px;border:1px solid var(--stroke);background:var(--surface-2);color:var(--text);display:grid;place-items:center;cursor:pointer;z-index:2}.shop-wish.active{color:#ff8aa3;background:rgba(255,123,143,.13)}.shop-wish svg{width:16px}.shop-compare{position:absolute;left:11px;top:11px}.shop-copy{padding:15px 4px 4px}.shop-copy-top{display:flex;gap:12px;align-items:flex-start}.shop-copy h3{font:800 14px Manrope;margin:0}.shop-copy p{font-size:9.5px;color:var(--muted);margin:4px 0 0}.shop-copy-price{margin-left:auto;text-align:right;font:800 16px Manrope}.shop-actions{display:flex;gap:7px;margin-top:13px}.shop-actions .btn:first-child{flex:1}.compare-dock{position:fixed;left:50%;bottom:22px;transform:translate(-50%,20px);z-index:120;width:min(700px,calc(100% - 28px));border-radius:20px;padding:11px 13px;display:flex;align-items:center;gap:10px;opacity:0;visibility:hidden;transition:.2s}.compare-dock.show{opacity:1;visibility:visible;transform:translate(-50%,0)}.compare-items{display:flex;gap:7px;flex:1;overflow:auto}.compare-pill{display:flex;align-items:center;gap:7px;padding:6px 8px;border-radius:11px;background:var(--surface);border:1px solid var(--stroke);font-size:9px;font-weight:700;white-space:nowrap}.compare-pill img{width:28px;height:28px;border-radius:8px}.compare-pill button{border:0;background:none;color:var(--muted);cursor:pointer}.wishlist-count{min-width:18px;height:18px;border-radius:999px;display:inline-grid;place-items:center;background:rgba(255,123,143,.18);font-size:8px;color:#ff9caf}

/* checkout */
.checkout-shell{min-height:100vh;padding:18px}.checkout-nav{max-width:1240px;margin:0 auto 18px;height:66px;border-radius:21px;padding:0 17px;display:flex;align-items:center;gap:12px}.checkout-nav .brand{padding:0}.checkout-progress{margin-left:auto;display:flex;align-items:center;gap:7px;color:var(--muted);font-size:9px;font-weight:700}.checkout-progress span{display:flex;align-items:center;gap:6px}.checkout-progress i{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-style:normal;border:1px solid var(--stroke);background:var(--surface)}.checkout-progress .active{color:var(--text)}.checkout-progress .active i{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:white;border-color:transparent}.checkout-layout{max-width:1240px;margin:auto;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(330px,.65fr);gap:18px;align-items:start}.checkout-panel{border-radius:24px;padding:22px}.checkout-section{padding:0 0 21px;margin-bottom:21px;border-bottom:1px solid var(--stroke)}.checkout-section:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}.checkout-section-head{display:flex;align-items:center;gap:11px;margin-bottom:15px}.checkout-step{width:29px;height:29px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(124,140,255,.28),rgba(94,231,247,.10));font:800 11px Manrope}.checkout-section h2{font:800 15px Manrope;margin:0}.checkout-section p{color:var(--muted);font-size:9px;margin:2px 0 0}.shipping-options,.payment-options{display:grid;gap:8px}.choice-card{display:flex;align-items:center;gap:11px;padding:12px;border:1px solid var(--stroke);border-radius:14px;background:var(--surface);cursor:pointer;transition:.18s}.choice-card:hover{background:var(--surface-2)}.choice-card.active{border-color:rgba(124,140,255,.48);box-shadow:0 0 0 3px rgba(124,140,255,.07);background:rgba(124,140,255,.10)}.choice-radio{width:17px;height:17px;border-radius:50%;border:1px solid var(--stroke-strong);display:grid;place-items:center}.choice-card.active .choice-radio::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--primary)}.choice-card strong{font-size:10px}.choice-card span{display:block;color:var(--muted);font-size:9px}.choice-price{margin-left:auto!important;color:var(--text)!important;font-weight:800!important}.checkout-summary{position:sticky;top:18px;border-radius:24px;padding:20px}.checkout-items{display:grid;gap:11px;margin:15px 0}.checkout-item{display:grid;grid-template-columns:54px 1fr auto;gap:10px;align-items:center}.checkout-item img{width:54px;height:54px;border-radius:13px;background:var(--surface);border:1px solid var(--stroke)}.checkout-item strong{display:block;font-size:10px}.checkout-item span{color:var(--muted);font-size:9px}.checkout-item-price{font:800 11px Manrope}.checkout-totals{display:grid;gap:9px;padding-top:14px;border-top:1px solid var(--stroke)}.checkout-total-row{display:flex;justify-content:space-between;color:var(--muted);font-size:10px}.checkout-total-row strong{color:var(--text)}.checkout-total-row.grand{font:800 14px Manrope;color:var(--text);padding-top:9px;border-top:1px solid var(--stroke)}.promo-row{display:flex;gap:7px;margin:13px 0}.promo-row .input{flex:1}.field-error{font-size:9px;color:var(--red);display:none}.field.invalid .input,.field.invalid .select{border-color:rgba(255,123,143,.55);box-shadow:0 0 0 3px rgba(255,123,143,.07)}.field.invalid .field-error{display:block}.checkout-success{position:fixed;inset:0;z-index:260;background:rgba(2,7,18,.65);backdrop-filter:blur(12px);display:grid;place-items:center;padding:18px;opacity:0;visibility:hidden;transition:.2s}.checkout-success.show{opacity:1;visibility:visible}.checkout-success-card{width:min(500px,100%);border-radius:28px;padding:30px;text-align:center}.success-mark{width:72px;height:72px;margin:0 auto 18px;border-radius:24px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(102,228,165,.30),rgba(94,231,247,.15));font-size:30px}.checkout-success-card h2{font:800 27px Manrope;margin:0 0 8px}.checkout-success-card p{color:var(--muted);font-size:11px}.order-number{display:inline-flex;margin:13px 0;padding:8px 12px;border:1px solid var(--stroke);background:var(--surface);border-radius:11px;font:800 11px ui-monospace,monospace}

/* orders + inventory admin */
.order-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.order-stat{padding:16px;border-radius:17px}.order-stat span{display:block;font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.order-stat strong{display:block;font:800 22px Manrope;margin-top:5px}.order-customer{display:flex;align-items:center;gap:8px}.order-customer .avatar{width:30px;height:30px;font-size:9px}.status-filter{display:flex;gap:6px;overflow:auto}.status-filter button{white-space:nowrap}.order-drawer-detail{display:grid;gap:12px}.order-meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.order-meta-box{padding:10px;border:1px solid var(--stroke);border-radius:12px;background:var(--surface)}.order-meta-box span{display:block;color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.08em}.order-meta-box strong{display:block;font-size:10px;margin-top:3px}.fulfillment-step{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid var(--stroke)}.fulfillment-step:last-child{border-bottom:0}.fulfillment-step i{width:24px;height:24px;border-radius:9px;background:var(--surface-2);display:grid;place-items:center;font-style:normal;font-size:9px}.fulfillment-step.done i{background:rgba(102,228,165,.16);color:var(--green)}
.product-editor-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:18px;align-items:start}.editor-stack{display:grid;gap:18px}.editor-media-drop{min-height:260px;border:1px dashed var(--stroke-strong);border-radius:18px;background:var(--surface);display:grid;place-items:center;text-align:center;padding:20px;overflow:hidden}.editor-media-drop img{max-width:280px;max-height:230px}.editor-media-drop strong{display:block;font:800 12px Manrope}.editor-media-drop span{font-size:9px;color:var(--muted)}.variant-row{display:grid;grid-template-columns:1fr 110px 90px 34px;gap:7px;align-items:center;margin-top:7px}.editor-actions{display:flex;gap:8px;position:sticky;top:100px}.publish-card{border-radius:20px;padding:17px;display:grid;gap:10px}.seo-preview{padding:13px;border:1px solid var(--stroke);border-radius:14px;background:var(--surface)}.seo-preview strong{font-size:12px;color:#9faaff}.seo-preview span{display:block;font-size:9px;color:var(--green);margin:2px 0}.seo-preview p{font-size:9px;color:var(--muted);margin:0}

/* full SDK studio */
.docs-shell{min-height:100vh;padding:18px}.docs-nav{max-width:1500px;margin:0 auto 18px;height:68px;border-radius:22px;padding:0 18px;display:flex;align-items:center;gap:14px;position:sticky;top:18px;z-index:70}.docs-nav .brand{padding:0}.docs-nav-search{width:min(380px,32vw);margin-left:auto}.docs-layout{max-width:1500px;margin:auto;display:grid;grid-template-columns:230px minmax(0,1fr) 250px;gap:18px;align-items:start}.docs-sidebar,.docs-toc{border-radius:22px;padding:14px;position:sticky;top:104px;max-height:calc(100vh - 122px);overflow:auto}.docs-sidebar .sdk-nav-label{padding-left:8px}.docs-link{width:100%;border:0;background:none;color:var(--muted);padding:8px 9px;border-radius:10px;text-align:left;font-size:10px;font-weight:700;cursor:pointer}.docs-link:hover,.docs-link.active{background:var(--surface-2);color:var(--text)}.docs-main{display:grid;gap:18px;min-width:0}.docs-hero{border-radius:28px;padding:30px}.docs-hero h1{font:800 clamp(34px,5vw,62px)/.98 Manrope;letter-spacing:-2.5px;margin:0 0 12px}.docs-hero p{max-width:760px;color:var(--muted);font-size:13px}.docs-section{border-radius:23px;padding:23px;scroll-margin-top:105px}.docs-section h2{font:800 21px Manrope;margin:0 0 6px}.docs-section>p{color:var(--muted);font-size:11px;margin:0 0 16px}.docs-example{display:grid;grid-template-columns:1fr 1fr;gap:12px}.docs-preview{border:1px solid var(--stroke);border-radius:16px;padding:18px;background:var(--surface);min-height:150px;display:grid;place-items:center}.docs-code{position:relative;border:1px solid var(--stroke);border-radius:16px;background:rgba(3,8,20,.48);overflow:auto}.docs-code pre{margin:0;padding:16px;color:#dce5f4;font:10px/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap}.docs-toc strong{display:block;font:800 10px Manrope;margin:3px 7px 8px}.docs-toc a{display:block;padding:6px 8px;border-left:1px solid var(--stroke);color:var(--muted);font-size:9px}.docs-toc a:hover{color:var(--text);border-color:var(--primary)}.api-table{display:grid;border:1px solid var(--stroke);border-radius:14px;overflow:hidden}.api-row{display:grid;grid-template-columns:190px 1fr;gap:0}.api-row>*{padding:10px 12px;border-bottom:1px solid var(--stroke)}.api-row:last-child>*{border-bottom:0}.api-row code{font-size:9px;color:#c6ceff;background:rgba(124,140,255,.05)}.api-row span{font-size:9px;color:var(--muted)}

/* theme lab */
.lab-layout{display:grid;grid-template-columns:340px minmax(0,1fr);gap:18px;align-items:start}.lab-controls{border-radius:23px;padding:20px;position:sticky;top:104px}.lab-control{display:grid;gap:7px;padding:12px 0;border-bottom:1px solid var(--stroke)}.lab-control:last-child{border-bottom:0}.lab-control label{display:flex;justify-content:space-between;font-size:10px;font-weight:700}.lab-control output{color:var(--muted);font-size:9px}.range{width:100%;accent-color:var(--primary)}.color-row{display:grid;grid-template-columns:1fr 46px;gap:8px}.color-input{width:46px;height:38px;border:1px solid var(--stroke);border-radius:11px;background:var(--surface);padding:4px}.lab-preview{border-radius:28px;padding:24px;min-height:650px}.lab-demo-shell{border-radius:22px;padding:15px;display:grid;gap:13px;background:var(--surface);border:1px solid var(--stroke)}.lab-demo-nav{height:52px;border-radius:15px;padding:0 12px;display:flex;align-items:center;gap:9px}.lab-demo-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:12px}.lab-demo-card{min-height:190px;border-radius:17px;padding:16px}.generated-css{margin-top:12px}.generated-css textarea{font:9.5px/1.6 ui-monospace,monospace;min-height:150px}

/* cross-light parity for 3.0 surfaces */
[data-theme="light"] .shop-media,[data-theme="light"] .choice-card,[data-theme="light"] .checkout-item img,[data-theme="light"] .lab-demo-shell{background:rgba(255,255,255,.66)}
[data-theme="light"] .docs-code{background:#172033}.wide-nav,.checkout-nav,.docs-nav{background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.05))}
[data-theme="light"] .wide-nav,[data-theme="light"] .checkout-nav,[data-theme="light"] .docs-nav{background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(245,249,255,.76))}

@media(max-width:1180px){.docs-layout{grid-template-columns:210px minmax(0,1fr)}.docs-toc{display:none}.storefront-grid{grid-template-columns:repeat(2,1fr)}.topnav-kpis{grid-template-columns:repeat(2,1fr)}.topnav-workgrid{grid-template-columns:1fr}.product-editor-layout{grid-template-columns:1fr}.editor-actions{position:static}.wide-hero{grid-template-columns:1fr .65fr}.lab-layout{grid-template-columns:300px 1fr}}
@media(max-width:900px){.wide-nav{height:auto;min-height:64px;flex-wrap:wrap;padding:10px 13px}.nav-mobile-toggle{display:grid}.wide-nav-menu{display:none;width:100%;order:5}.wide-nav.open .wide-nav-menu{display:flex;flex-direction:column;align-items:stretch}.wide-nav.open .wide-nav-links{display:grid;width:100%}.wide-nav.open .wide-nav-actions{padding-top:8px;border-top:1px solid var(--stroke)}.wide-nav>.wide-nav-links{display:none}.wide-nav>.wide-nav-actions{margin-left:auto}.wide-hero,.storefront-hero{grid-template-columns:1fr}.wide-hero-visual{min-height:250px}.checkout-layout{grid-template-columns:1fr}.checkout-summary{position:static}.docs-layout{grid-template-columns:1fr}.docs-sidebar{position:static;max-height:none;display:flex;gap:5px;overflow:auto}.docs-sidebar .sdk-nav-label{display:none}.docs-link{width:auto;white-space:nowrap}.docs-example{grid-template-columns:1fr}.lab-layout{grid-template-columns:1fr}.lab-controls{position:static}.order-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.wide-shell,.checkout-shell,.docs-shell{padding:10px}.wide-nav,.checkout-nav,.docs-nav{top:10px;margin-bottom:10px}.wide-page{gap:10px}.wide-hero,.storefront-hero{padding:24px;border-radius:23px}.wide-hero h1,.storefront-hero h1{letter-spacing:-2px}.topnav-kpis{grid-template-columns:1fr 1fr;gap:8px}.topnav-projects{grid-template-columns:1fr}.storefront-grid{grid-template-columns:1fr}.shop-media{height:310px}.checkout-progress{display:none}.checkout-panel,.checkout-summary{padding:16px;border-radius:20px}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.order-stats{grid-template-columns:1fr 1fr}.variant-row{grid-template-columns:1fr 80px 70px 32px}.docs-hero,.docs-section{padding:18px}.docs-nav-search{display:none}.api-row{grid-template-columns:1fr}.api-row code{border-bottom:0}.lab-demo-grid{grid-template-columns:1fr}.wide-mini-card{right:auto;left:0}.wide-orb{right:0}}
@media(max-width:430px){.topnav-kpis,.order-stats{grid-template-columns:1fr}.wide-nav-actions .btn span{display:none}.shop-media{height:250px}.checkout-item{grid-template-columns:46px 1fr auto}.checkout-item img{width:46px;height:46px}}
.compare-overlay{position:fixed;inset:0;z-index:250;background:rgba(2,7,18,.64);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:18px;display:grid;place-items:center;opacity:0;visibility:hidden;transition:.2s}.compare-overlay.show{opacity:1;visibility:visible}.compare-shell{width:min(1050px,100%);max-height:calc(100vh - 36px);overflow:auto;border-radius:27px;padding:20px}.compare-head{display:flex;align-items:center;gap:12px;margin-bottom:15px}.compare-head>div:first-child{flex:1}.compare-grid{display:grid;grid-template-columns:130px repeat(var(--compare-cols,2),minmax(190px,1fr));border:1px solid var(--stroke);border-radius:17px;overflow:hidden}.compare-grid>*{padding:12px;border-right:1px solid var(--stroke);border-bottom:1px solid var(--stroke);min-width:0}.compare-grid>*:nth-child(var(--last-col)){border-right:0}.compare-label{font-size:9px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.07em;background:var(--surface)}.compare-product-head{text-align:center}.compare-product-head img{width:110px;height:110px;object-fit:contain;display:block;margin:0 auto 8px}.compare-product-head strong{font:800 12px Manrope;display:block}.compare-cell{font-size:10px}.compare-feature-list{list-style:none;margin:0;padding:0;display:grid;gap:5px;font-size:9px;color:var(--muted)}.compare-feature-list li::before{content:'✓';color:var(--green);margin-right:5px}.compare-overlay [data-compare-close]{position:sticky;top:0}.wishlist-filter-active{background:rgba(255,123,143,.13)!important;color:#ff9caf!important;border-color:rgba(255,123,143,.25)!important}
[data-theme="light"] .compare-overlay{background:rgba(39,50,73,.28)}
@media(max-width:760px){.compare-overlay{padding:8px}.compare-shell{padding:13px;border-radius:20px;overflow:auto}.compare-grid{min-width:720px}}
[data-theme="light"] .seo-preview strong{color:#4656c9}
[data-theme="light"] .wishlist-filter-active{color:#a82b4b!important;background:rgba(180,35,67,.08)!important;border-color:rgba(180,35,67,.18)!important}
[data-theme="light"] .shop-wish.active{color:#b42343;background:rgba(180,35,67,.08)}

/* =========================================================
   Liquiddy 3.1 · Native-control replacement + Theme Lab Pro
   ========================================================= */
:root{
  --glass-saturation:145%;
  --control-height:40px;
  --control-radius:12px;
  --control-track:rgba(255,255,255,.10);
}
[data-theme="light"]{--control-track:rgba(51,68,105,.12)}
.glass{backdrop-filter:blur(var(--blur)) saturate(var(--glass-saturation));-webkit-backdrop-filter:blur(var(--blur)) saturate(var(--glass-saturation))}

/* wide nav: desktop and mobile are separate; mobile copy never leaks into desktop */
.wide-nav-menu{display:none!important}
@media(max-width:900px){
  .wide-nav-menu{display:none!important;width:100%;order:5}
  .wide-nav.open .wide-nav-menu{display:flex!important;flex-direction:column;align-items:stretch}
}

.input,.select,.textarea{border-radius:var(--control-radius)}
.input:not(textarea),.select{min-height:var(--control-height)}

/* range */
.range{
  --range-fill:50%;appearance:none;-webkit-appearance:none;width:100%;height:20px;background:transparent;cursor:pointer;accent-color:transparent
}
.range::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:linear-gradient(90deg,var(--primary) 0 var(--range-fill),var(--control-track) var(--range-fill) 100%);border:1px solid var(--stroke)}
.range::-moz-range-track{height:6px;border-radius:999px;background:var(--control-track);border:1px solid var(--stroke)}
.range::-moz-range-progress{height:6px;border-radius:999px;background:var(--primary)}
.range::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;margin-top:-7px;background:linear-gradient(145deg,#fff,#d8e2f5);border:2px solid var(--primary);box-shadow:0 3px 12px rgba(0,0,0,.25),0 0 0 4px color-mix(in srgb,var(--primary) 12%,transparent);transition:.16s}
.range::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid var(--primary);box-shadow:0 3px 12px rgba(0,0,0,.22)}
.range:hover::-webkit-slider-thumb{transform:scale(1.08)}
.range:focus-visible{outline:none}.range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 5px color-mix(in srgb,var(--primary) 18%,transparent)}

/* hide browser number arrows; Liquiddy inserts its own */
input[type="number"]{-moz-appearance:textfield}
input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.lqd-number-control{width:100%;min-height:var(--control-height);display:grid;grid-template-columns:36px minmax(0,1fr) 36px;align-items:stretch;border:1px solid var(--stroke);border-radius:var(--control-radius);background:rgba(255,255,255,.055);overflow:hidden;transition:.18s}
.lqd-number-control:focus-within{border-color:rgba(124,140,255,.55);box-shadow:0 0 0 3px rgba(124,140,255,.09);background:rgba(255,255,255,.075)}
.lqd-number-control .input{min-width:0;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;text-align:center;padding:0 4px}
.lqd-step-btn{border:0;background:transparent;color:var(--muted);cursor:pointer;font-size:17px;font-weight:700;transition:.15s}.lqd-step-btn:hover{background:var(--surface-2);color:var(--text)}.lqd-step-btn:first-child{border-right:1px solid var(--stroke)}.lqd-step-btn:last-child{border-left:1px solid var(--stroke)}
[data-theme="light"] .lqd-number-control{background:rgba(255,255,255,.72)}

/* shared popup primitive */
.lqd-native-hidden{position:absolute!important;inline-size:1px!important;block-size:1px!important;opacity:0!important;pointer-events:none!important;clip-path:inset(50%)!important}
.lqd-control-wrap{position:relative;width:100%;min-width:0}
.lqd-control-trigger{width:100%;min-height:var(--control-height);border:1px solid var(--stroke);border-radius:var(--control-radius);background:rgba(255,255,255,.055);color:var(--text);display:flex;align-items:center;gap:9px;padding:0 11px;cursor:pointer;text-align:left;transition:.18s}
.lqd-control-trigger:hover{background:var(--surface-2);border-color:var(--stroke-strong)}.lqd-control-trigger:focus-visible{outline:none;border-color:rgba(124,140,255,.55);box-shadow:0 0 0 3px rgba(124,140,255,.09)}
.lqd-control-trigger svg{width:15px;height:15px;color:var(--muted);margin-left:auto;flex:none}
[data-theme="light"] .lqd-control-trigger{background:rgba(255,255,255,.72)}
.lqd-popover{position:absolute;left:0;top:calc(100% + 8px);z-index:160;width:min(310px,calc(100vw - 28px));padding:13px;border-radius:18px;opacity:0;visibility:hidden;transform:translateY(5px) scale(.985);transform-origin:top left;transition:.16s}.lqd-control-wrap.open>.lqd-popover{opacity:1;visibility:visible;transform:none}
[data-theme="light"] .lqd-popover{background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(240,246,255,.96))}

/* custom color picker */
.lqd-color-trigger{justify-content:flex-start}.lqd-color-swatch{width:22px;height:22px;border-radius:7px;background:var(--picker-color);box-shadow:inset 0 0 0 1px rgba(255,255,255,.28),0 2px 8px color-mix(in srgb,var(--picker-color) 35%,transparent)}.lqd-color-trigger code{font:700 10px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text);text-transform:uppercase}
.lqd-color-preview{height:78px;border-radius:13px;background:var(--picker-color);border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 1px rgba(255,255,255,.28);margin-bottom:11px;position:relative;overflow:hidden}.lqd-color-preview::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(255,255,255,.35),transparent 35%,rgba(0,0,0,.12))}
.lqd-color-sliders{display:grid;gap:10px}.lqd-color-line{display:grid;grid-template-columns:20px 1fr 38px;align-items:center;gap:7px;font-size:9px;color:var(--muted)}.lqd-color-line output{text-align:right;color:var(--text);font-weight:700}.lqd-color-hex{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:11px}.lqd-color-hex .input{text-transform:uppercase;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.lqd-color-swatches{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.lqd-color-chip{width:23px;height:23px;border-radius:7px;border:1px solid var(--stroke-strong);background:var(--chip);cursor:pointer;box-shadow:inset 0 1px rgba(255,255,255,.25)}

/* custom temporal picker */
.lqd-temporal-trigger span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lqd-temporal-empty{color:var(--muted)}
.lqd-date-head{display:flex;align-items:center;gap:7px;margin-bottom:10px}.lqd-date-head strong{flex:1;text-align:center;font:800 11px Manrope}.lqd-mini-btn{width:30px;height:30px;border:1px solid var(--stroke);border-radius:9px;background:var(--surface);color:var(--text);display:grid;place-items:center;cursor:pointer}.lqd-mini-btn:hover{background:var(--surface-2)}
.lqd-date-week,.lqd-date-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}.lqd-date-week span{text-align:center;color:var(--muted);font-size:8px;text-transform:uppercase;padding:4px 0}.lqd-date-day{height:31px;border:0;border-radius:9px;background:transparent;color:var(--text);font-size:9px;cursor:pointer}.lqd-date-day:hover{background:var(--surface-2)}.lqd-date-day.muted{opacity:.34}.lqd-date-day.today{box-shadow:inset 0 0 0 1px var(--stroke-strong)}.lqd-date-day.selected{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;box-shadow:0 5px 14px color-mix(in srgb,var(--primary) 25%,transparent)}
.lqd-time-picker{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 0 5px}.lqd-time-unit{display:grid;grid-template-rows:26px 40px 26px;gap:4px}.lqd-time-unit button{border:1px solid var(--stroke);border-radius:8px;background:var(--surface);color:var(--muted);cursor:pointer}.lqd-time-unit button:hover{color:var(--text);background:var(--surface-2)}.lqd-time-unit strong{min-width:54px;border:1px solid var(--stroke);border-radius:11px;display:grid;place-items:center;background:var(--surface-2);font:800 18px Manrope}.lqd-time-colon{font:800 20px Manrope;color:var(--muted)}.lqd-temporal-footer{display:flex;justify-content:space-between;gap:7px;margin-top:11px;padding-top:10px;border-top:1px solid var(--stroke)}

/* custom select opt-in */
.lqd-select-menu{display:grid;gap:4px}.lqd-select-option{width:100%;border:0;border-radius:9px;background:transparent;color:var(--muted);padding:8px 9px;text-align:left;cursor:pointer;font-size:10px}.lqd-select-option:hover{background:var(--surface-2);color:var(--text)}.lqd-select-option.selected{background:color-mix(in srgb,var(--primary) 14%,transparent);color:var(--text);font-weight:700}

/* Theme Lab Pro */
.lab-hero{min-height:280px}.lab-hero h1{font-size:clamp(42px,6vw,72px)}.lab-hero-visual{min-height:220px}.lab-token-float{position:absolute;right:38%;bottom:2%;z-index:3;border-radius:17px;padding:13px 15px;min-width:185px}.lab-token-float span,.lab-token-float small{display:block;color:var(--muted);font-size:8px}.lab-token-float strong{display:block;font:800 18px Manrope;margin:2px 0}.lab-preset-row{display:flex;gap:7px;flex-wrap:wrap;margin-top:19px}.lab-preset{border:1px solid var(--stroke);border-radius:999px;background:var(--surface);color:var(--muted);padding:7px 10px;display:flex;align-items:center;gap:6px;font-size:9px;font-weight:700;cursor:pointer}.lab-preset i{width:9px;height:9px;border-radius:50%;background:var(--preset);box-shadow:0 0 0 3px color-mix(in srgb,var(--preset) 12%,transparent)}.lab-preset:hover,.lab-preset.active{color:var(--text);background:var(--surface-2);border-color:var(--stroke-strong)}
.lab-layout-pro{grid-template-columns:360px minmax(0,1fr)}.lab-actions-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:14px}.lab-preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.lab-device-switch{display:flex;border:1px solid var(--stroke);background:var(--surface);border-radius:11px;padding:3px}.lab-device-switch button{border:0;background:transparent;color:var(--muted);border-radius:8px;padding:6px 9px;font-size:8px;font-weight:800;cursor:pointer}.lab-device-switch button.active{background:var(--surface-2);color:var(--text);box-shadow:inset 0 0 0 1px var(--stroke)}.lab-device-stage{overflow:auto;padding:4px;display:flex;justify-content:center}.lab-device-frame{width:100%;transition:width .28s ease;min-width:0}.lab-device-frame[data-device="tablet"]{width:min(760px,100%)}.lab-device-frame[data-device="mobile"]{width:min(390px,100%)}.lab-big-number{font:800 34px Manrope}.lab-form-studio{border-radius:17px;padding:16px;margin-top:2px}.lab-form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.lab-inline-options{min-height:var(--control-height);display:flex;align-items:center;justify-content:space-between;border:1px solid var(--stroke);border-radius:var(--control-radius);padding:0 10px;background:var(--surface)}.lab-inline-options .check-row{align-items:center}.lab-inline-options .check-row span{font-size:10px}
.lab-preview .lab-demo-shell{background:color-mix(in srgb,var(--surface) 72%,transparent)}
[data-theme="light"] .lab-preset{background:rgba(255,255,255,.7)}

@media(max-width:1180px){.lab-layout-pro{grid-template-columns:320px minmax(0,1fr)}.lab-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.lab-layout-pro{grid-template-columns:1fr}.lab-controls{position:static}.lab-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lab-preview-toolbar{align-items:flex-start;flex-direction:column}}
@media(max-width:620px){.lab-form-grid{grid-template-columns:1fr}.lab-actions-grid{grid-template-columns:1fr 1fr}.lab-device-switch{width:100%}.lab-device-switch button{flex:1}.lab-token-float{right:auto;left:0}.lqd-popover{position:fixed;left:14px!important;right:14px!important;top:auto!important;bottom:14px;width:auto;transform:translateY(16px)}.lqd-control-wrap.open>.lqd-popover{transform:none}}

.lab-apply-global{grid-column:1/-1}.lab-clear-global{grid-column:1/-1}.lab-global-status{margin-top:9px;padding:8px 10px;border:1px solid var(--stroke);border-radius:10px;background:var(--surface);color:var(--muted);font-size:8.5px;line-height:1.45}.lab-global-status.active{color:var(--semantic-success);border-color:color-mix(in srgb,var(--green) 24%,var(--stroke));background:color-mix(in srgb,var(--green) 7%,var(--surface))}