
:root{
  --bg:#0b0c0f;--panel:#111318;--panel2:#171a21;--panel3:#1d212b;--line:#2a2f3a;
  --text:#f4f7fb;--muted:#b5beca;--soft:#909aaa;--chip:#12161d;--shadow:0 18px 50px rgba(0,0,0,.32)
}
*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}body{overflow-x:hidden}
a{text-decoration:none}.app-shell{min-height:100vh;background:radial-gradient(circle at top right, rgba(145,145,145,.08), transparent 30%),linear-gradient(180deg,#0b0c0f 0%,#101218 100%)}
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.login-card{width:min(480px,100%);background:linear-gradient(180deg,var(--panel) 0%,var(--panel2) 100%);border:1px solid var(--line);border-radius:28px;padding:32px;box-shadow:var(--shadow)}
.login-title{font-size:2rem;font-weight:800;letter-spacing:-.03em}.login-subtitle{color:var(--soft);margin:10px 0 24px}
.form-control,.form-select,.form-check-input{background:#0f1217;border:1px solid var(--line);color:var(--text)}.form-control:focus,.form-select:focus{background:#0f1217;color:var(--text);border-color:#576071;box-shadow:none}
input[type="date"],input[type="time"]::-webkit-calendar-picker-indicator{filter:invert(1)}
.btn-app{border:none;background:#eef2f7;color:#0f1216;border-radius:16px;padding:12px 18px;font-weight:700}.btn-app:hover{background:#fff}
.login-footer{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:16px;color:var(--soft)}
.layout{display:grid;grid-template-columns:290px 1fr;min-height:100vh}
.sidebar{background:rgba(15,18,24,.92);border-right:1px solid var(--line);padding:18px 14px;height:100vh;overflow:auto;position:sticky;top:0;z-index:30}
.sidebar-title{margin:18px 10px 8px;color:#788192;text-transform:uppercase;font-size:.72rem;letter-spacing:.12em}
.sidebar-link{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;color:var(--muted);border:1px solid transparent;transition:all .18s ease}
.sidebar-link:hover,.sidebar-link.active{background:var(--panel3);border-color:#303646;color:var(--text)}
.nav-icon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 18px}.nav-icon svg{width:18px;height:18px}
.sidebar-backdrop{display:none}.main{min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 22px;border-bottom:1px solid var(--line);background:rgba(11,12,15,.86);backdrop-filter:blur(16px);position:sticky;top:0;z-index:20}
.topbar-left{display:flex;align-items:center;gap:14px;min-width:0}.brand-logo{width:44px;height:44px;object-fit:contain;flex:0 0 44px;border-radius:12px;background:#fff;padding:6px}
.brand{font-size:1.15rem;font-weight:800;letter-spacing:-.02em}.brand-sub{font-size:.9rem;color:var(--soft)}.topbar-right{display:flex;gap:10px;flex-wrap:wrap}
.meta-pill{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:var(--chip);color:var(--muted);font-size:.9rem}.meta-link:hover{color:var(--text)}
.mobile-sidebar-toggle{display:none;flex-direction:column;gap:4px;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;border:1px solid var(--line);background:var(--chip)}.mobile-sidebar-toggle span{display:block;width:18px;height:2px;background:#f4f7fb;border-radius:999px}
.content-wrap{padding:22px}.hero{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;flex-wrap:wrap;margin-bottom:18px}.hero h1{margin:0;font-size:2rem;letter-spacing:-.04em}.hero p{margin:8px 0 0;color:var(--soft);max-width:940px}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px}.stat-card,.panel-card,.tab-card{background:linear-gradient(180deg,var(--panel) 0%,var(--panel2) 100%);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}.stat-card{padding:18px}
.stat-label{color:var(--soft);font-size:.92rem}.stat-value{font-size:1.7rem;font-weight:800;margin-top:8px}.quick-links{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:18px}
.quick-link{background:linear-gradient(180deg,#131722 0%,#171c27 100%);border:1px solid var(--line);border-radius:20px;padding:18px;color:var(--text);display:flex;gap:14px;min-height:110px}.quick-link .nav-icon{width:22px;height:22px}.quick-link-title{font-weight:700}.quick-link-copy{color:var(--soft);font-size:.92rem;margin-top:6px}
.card-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.panel-card,.tab-card,.form-panel{padding:20px}
.app-tabs{display:flex;gap:10px;overflow:auto;padding-bottom:4px;margin-bottom:14px;flex-wrap:nowrap}.app-tabs .nav-link{border:none;background:var(--panel);color:var(--muted);border:1px solid var(--line);border-radius:14px;padding:12px 16px;white-space:nowrap}.app-tabs .nav-link.active{background:#e8edf5;color:#101318;border-color:#e8edf5;font-weight:700}
.tab-intro{color:var(--soft);margin-bottom:16px}.section-title{font-size:1rem;font-weight:800;margin-bottom:10px}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:18px;background:#0f1218;margin-bottom:14px}
.table-dark-app{--bs-table-bg:#0f1218;--bs-table-color:#f0f4f8;--bs-table-border-color:#2b3040;--bs-table-striped-bg:#131722;--bs-table-striped-color:#f0f4f8}
.table-dark-app thead th{font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;color:#aeb6c4;white-space:nowrap}.table-dark-app td,.table-dark-app th{padding:14px 16px;vertical-align:middle}
.note-list{display:grid;gap:10px}.note-item{background:#10141b;border:1px solid var(--line);color:var(--muted);border-radius:14px;padding:12px 14px}
.export-toolbar{display:flex;justify-content:flex-end;gap:10px;margin-bottom:12px}
.calendar-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.calendar-day{background:linear-gradient(180deg,var(--panel) 0%,var(--panel2) 100%);border:1px solid var(--line);border-radius:20px;padding:18px}
.calendar-day h4{margin:0 0 4px}.calendar-day small{color:var(--soft)}.event-list{margin-top:14px;display:grid;gap:10px}.event-item{background:#10141b;border:1px solid var(--line);border-radius:14px;padding:12px}.event-time{font-weight:700}.event-note{color:var(--soft);font-size:.9rem;margin-top:4px}
.gantt-legend{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}.gantt-chip{padding:8px 12px;border-radius:999px;border:1px solid var(--line);background:#10141b;color:var(--muted);font-size:.88rem}.gantt-table td.bar-cell{min-width:420px}
.gantt-track{position:relative;height:16px;background:#0f1217;border-radius:999px;border:1px solid #2a3040;overflow:hidden}.gantt-bar{position:absolute;top:0;height:100%;border-radius:999px}
.type-setup{background:#5d6778}.type-rigging{background:#8b6f3d}.type-lighting{background:#7366a7}.type-audio{background:#2f7e71}.type-check{background:#6b8ac1}.type-show{background:#98516d}.type-headliner{background:#b97a30}.type-out{background:#5c6676}
.download-list,.contact-list{display:grid;gap:12px}.download-item,.contact-card{background:#10141b;border:1px solid var(--line);border-radius:18px;padding:16px}
.download-item{display:flex;justify-content:space-between;align-items:center;gap:12px}.download-meta,.contact-meta,.small-help,.footer-note,.section-intro-copy{color:var(--soft)}
.form-section-title{font-size:1rem;font-weight:800;margin:22px 0 12px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.section-intro-copy{margin:0 0 14px}.success-card{background:#102218;border:1px solid #244a34;color:#d8ffe7;border-radius:18px;padding:16px;margin-bottom:16px}.error-card{background:#2a1518;border:1px solid #6b2d35;color:#ffdfe2;border-radius:18px;padding:16px;margin-bottom:16px}
.pdf-export-root{position:absolute;left:-99999px;top:0;width:1180px;background:#fff;color:#000;padding:28px}.pdf-page{page-break-after:always;padding:0 0 24px}.pdf-page:last-child{page-break-after:auto}
.pdf-header{display:flex;align-items:flex-start;gap:18px;margin-bottom:22px}.pdf-header img{width:250px;height:auto;max-height:90px;object-fit:contain}.pdf-header-title{font-size:22px;font-weight:800;color:#000;margin-top:6px}.pdf-header-sub{font-size:12px;color:#555}
.pdf-section-title{font-size:18px;font-weight:800;margin:16px 0 10px;color:#000}.pdf-copy{color:#333;font-size:13px;margin-bottom:10px}.pdf-note{font-size:12px;color:#333;border:1px solid #ddd;border-radius:8px;padding:8px 10px;margin:8px 0}
.pdf-table{width:100%;border-collapse:collapse;font-size:12px;color:#000;margin-bottom:14px}.pdf-table th,.pdf-table td{border:1px solid #ccc;padding:7px 8px;vertical-align:top}.pdf-table th{background:#f2f2f2;text-transform:uppercase;font-size:11px;letter-spacing:.04em}
@media (max-width:1199px){.stats-grid{grid-template-columns:repeat(2,1fr)}.quick-links{grid-template-columns:repeat(2,1fr)}.calendar-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:991px){.layout{grid-template-columns:1fr}.sidebar{position:fixed;left:0;top:0;bottom:0;width:290px;transform:translateX(-100%);transition:transform .22s ease}.sidebar-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:25;display:none}body.sidebar-open .sidebar{transform:translateX(0)}body.sidebar-open .sidebar-backdrop{display:block}.mobile-sidebar-toggle{display:flex}.topbar{padding:14px 16px}.content-wrap{padding:16px}}
@media (max-width:767px){.hero h1{font-size:1.55rem}.stats-grid,.quick-links,.card-grid,.calendar-grid{grid-template-columns:1fr}.topbar{align-items:flex-start}.topbar-right{width:100%}.meta-pill{width:100%}.brand-logo{width:40px;height:40px;flex-basis:40px}.download-item{flex-direction:column;align-items:flex-start}.table-dark-app td,.table-dark-app th{padding:12px}}
@media print{.sidebar,.topbar,.mobile-sidebar-toggle,.export-toolbar,.sidebar-backdrop{display:none !important}.layout{display:block}.content-wrap{padding:0}body,html,.app-shell{background:#fff;color:#000}.tab-card,.panel-card,.calendar-day,.download-item,.contact-card,.form-panel{box-shadow:none;border:1px solid #d6d6d6;background:#fff;color:#000}}


input[type="date"], input[type="time"], input[type="number"]{
  color-scheme: dark;
  background:#0f1217 !important;
  color:var(--text) !important;
}
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator{
  filter: invert(1) brightness(0.9);
  opacity: 0.85;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button{
  filter: invert(1);
  opacity: 1;
  background: transparent;
}
input[type="number"]{
  appearance: auto;
  -moz-appearance: textfield;
}


.calendar-month-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}
.calendar-card-true{background:linear-gradient(180deg,var(--panel) 0%,var(--panel2) 100%);border:1px solid var(--line);border-radius:18px;min-height:132px;padding:12px;display:flex;flex-direction:column;gap:8px}
.calendar-card-empty{opacity:.25}
.calendar-number{font-size:1rem;font-weight:800}
.calendar-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;font-size:.72rem;font-weight:800;letter-spacing:.02em;width:max-content}
.badge-show{background:#e45061;color:#fff}
.badge-setup{background:#717785;color:#fff}
.badge-dayoff{background:#46536c;color:#fff}
.calendar-subtitle{color:#f4f7fb;font-size:.86rem;font-weight:600}
.calendar-month-wrap{overflow-x:auto}
@media (max-width:767px){
  .calendar-month-grid{grid-template-columns:repeat(2,1fr)}
  .calendar-card-true{min-height:120px}
}


.map-card{border:1px solid var(--line);background:linear-gradient(180deg,var(--panel) 0%,var(--panel2) 100%);border-radius:20px;overflow:hidden}
.map-frame{position:relative;width:100%;padding-top:56.25%;background:#0b0f14}
.map-frame iframe{filter:grayscale(.15) invert(.9) hue-rotate(180deg) saturate(.55) contrast(.95) brightness(.82)}
.map-actions{display:flex;justify-content:flex-end;padding:12px}


.map-frame iframe{filter:grayscale(.15) invert(.9) hue-rotate(180deg) saturate(.55) contrast(.95) brightness(.82)}
.map-note{color:var(--muted);font-size:.86rem;margin-top:8px}
.archive-tree{display:flex;flex-direction:column;gap:16px}
.archive-artist-card{border:1px solid var(--line);background:linear-gradient(180deg,var(--panel) 0%,var(--panel2) 100%);border-radius:18px;padding:16px}
.archive-file-list{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.archive-file-row{display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid var(--line);border-radius:14px;padding:10px 12px;background:rgba(255,255,255,.02)}
.archive-meta{color:var(--muted);font-size:.82rem}

.pdf-link-note{font-size:.85rem;color:var(--muted)}

/* Framework compatibility additions */
:root{
  --bg: var(--project-bg, #0b0c0f);
  --panel: var(--project-panel, #111318);
  --panel2: #171a21;
  --panel3: #1d212b;
  --line: var(--project-line, #2a2f3a);
  --text: var(--project-text, #f4f7fb);
  --muted: #b5beca;
  --soft: #909aaa;
}
.sidebar-nav{list-style:none;margin:0;padding:0}
.icon-wrap{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex:0 0 18px}
.login-brand-logo{width:72px;height:72px;object-fit:contain;border-radius:18px;background:#fff;padding:10px;margin-bottom:16px}
.login-form .form-control{width:100%}
.fw-tab-btn{border:none;background:var(--panel);color:var(--muted);border:1px solid var(--line);border-radius:14px;padding:12px 16px;white-space:nowrap}
.fw-tab-btn.active{background:#e8edf5;color:#101318;border-color:#e8edf5;font-weight:700}
.fw-tabs-row{display:flex;gap:10px;overflow:auto;padding-bottom:4px;margin-bottom:14px;flex-wrap:nowrap}
.fw-tab-panel{display:none}
.fw-tab-panel.active{display:block}

/* Framework v3 fixes */
.btn.btn-danger, .btn-danger, button.btn-danger, .login-form .btn-danger, .meta-pill.meta-link[style]{
  background:#c62828 !important;
  border-color:#c62828 !important;
  color:#fff !important;
  box-shadow:none !important;
}
.btn.btn-outline-light, .btn-outline-light, button.btn-outline-light{
  background:transparent !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}
.btn-app{
  display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;
  border-radius:14px;border:1px solid #c62828;background:#c62828;color:#fff;text-decoration:none;font-weight:700;
}
.btn-app:hover{filter:brightness(1.05);color:#fff}
.login-card .btn-danger, .login-card .btn{min-height:48px;border-radius:16px;font-weight:700}

/* v4 polish */
html input:-webkit-autofill,
html input:-webkit-autofill:hover,
html input:-webkit-autofill:focus{
  -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important;
  -webkit-text-fill-color:#111 !important;
}
.login-card .form-control,
.login-page .form-control,
.form-panel .form-control,
.form-panel .form-select{
  background:#ffffff !important;
  color:#111 !important;
  border:1px solid #d7dde7 !important;
}
.login-card .form-control::placeholder{color:#666 !important}
.login-card .btn,
.login-card button,
.login-form .btn,
.login-form button{
  background:#111827 !important;
  color:#fff !important;
  border:1px solid #2a2f3a !important;
  border-radius:16px !important;
}
.login-card .btn:hover,
.login-form .btn:hover{filter:brightness(1.08)}
.btn-danger, .btn.btn-danger{background:#c62828 !important;border-color:#c62828 !important;color:#fff !important}
.btn-outline-light, .btn.btn-outline-light{background:transparent !important;color:#fff !important;border-color:#dbe3f0 !important}

/* v6 advance form polish */
.form-panel{
  background:transparent;
}
.form-panel .form-control,
.form-panel .form-select{
  background:#ffffff !important;
  color:#111111 !important;
  border:1px solid #d7dde7 !important;
  border-radius:12px !important;
  min-height:44px;
  padding:10px 14px !important;
  box-shadow:none !important;
}
.form-panel textarea.form-control{
  min-height:auto;
  padding-top:12px !important;
}
.form-panel .form-label{
  color:#f4f7fb;
  font-weight:600;
  margin-bottom:8px;
}
.form-section-title{
  font-size:1.05rem;
  font-weight:800;
  color:#f4f7fb;
  margin:30px 0 14px;
  padding-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.form-panel .quick-link-title{
  color:#f4f7fb;
  font-size:1rem;
  font-weight:800;
}
.form-panel .form-control::placeholder{
  color:#6d7480 !important;
}

.login-card .form-label{display:block;margin-bottom:8px;color:#eef2f7;font-weight:700}
.login-card .btn-app{margin-top:6px}
.login-card .mb-3{margin-bottom:1.25rem!important}

.form-panel .form-control, .form-panel .form-select{background:#fff!important;color:#111!important;border:1px solid #d8dee8!important;border-radius:12px!important;min-height:46px;padding:10px 14px!important}
.form-panel textarea.form-control{min-height:110px}

.form-panel .form-control,.form-panel .form-select,.form-panel textarea.form-control{background:#0f1217 !important;color:#f4f7fb !important;border:1px solid var(--line) !important;border-radius:12px !important;min-height:46px !important;padding:10px 14px !important;box-shadow:none !important}.form-panel textarea.form-control{min-height:110px !important}.form-panel .form-control::placeholder,.form-panel textarea.form-control::placeholder{color:#9aa3b2 !important}.form-panel .form-control:focus,.form-panel .form-select:focus,.form-panel textarea.form-control:focus{background:#0f1217 !important;color:#f4f7fb !important;border-color:#576071 !important;box-shadow:none !important}

.sidebar-group{margin-bottom:10px}
.sidebar-group-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;background:transparent;border:0;color:#909aaa;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;padding:10px 10px 8px;cursor:pointer}
.sidebar-group-caret{transition:transform .18s ease}
.sidebar-group.is-open .sidebar-group-caret{transform:rotate(180deg)}
.sidebar-group-items{display:none}
.sidebar-group.is-open .sidebar-group-items{display:block}
.portal-card,.portal-section{padding:18px}
.portal-list{margin:10px 0 0 18px;color:var(--muted)}
.portal-list li{margin-bottom:6px}
.portal-image-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.portal-image-card{padding:0;overflow:hidden}
.portal-image{width:100%;height:220px;object-fit:cover;display:block;background:#0c1017}
.portal-image-card figcaption{padding:14px}
@media (max-width: 920px){.portal-image-grid{grid-template-columns:1fr}}

/* v13 accordion sidebar */
.sidebar-group-items{display:none}
.sidebar-group.is-open .sidebar-group-items{display:block}
.sidebar-group-toggle{
  width:100%;display:flex;align-items:center;justify-content:space-between;
  background:transparent;border:0;color:var(--text);padding:10px 12px;border-radius:14px;
  font-weight:700;cursor:pointer
}
.sidebar-group-toggle:hover{background:rgba(255,255,255,.04)}
.sidebar-group-label{display:flex;align-items:center;gap:10px}
.sidebar-group-caret{transition:transform .18s ease;color:var(--soft)}
.sidebar-group.is-open .sidebar-group-caret{transform:rotate(180deg)}
.sidebar-group{margin-bottom:6px}

/* v14 definitive sidebar */
.sidebar-home{margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.sidebar-group{margin-bottom:8px;border-radius:16px}
.sidebar-group-toggle{
  list-style:none;width:100%;display:flex;align-items:center;justify-content:space-between;
  background:transparent;border:0;color:var(--text);padding:10px 12px;border-radius:14px;
  font-weight:800;cursor:pointer
}
.sidebar-group-toggle::-webkit-details-marker{display:none}
.sidebar-group[open] .sidebar-group-toggle{background:rgba(255,255,255,.04)}
.sidebar-group-items{padding:4px 0 8px}
.sidebar-group-caret{transition:transform .18s ease;color:var(--soft)}
.sidebar-group[open] .sidebar-group-caret{transform:rotate(180deg)}
.image-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.image-card{background:linear-gradient(180deg,var(--panel) 0%,var(--panel2) 100%);border:1px solid var(--line);border-radius:18px;padding:14px}
.image-card img{width:100%;height:160px;object-fit:cover;border-radius:12px;border:1px solid var(--line);background:#0f1217}
.image-card-title{font-weight:800;margin:10px 0 6px}
.download-list{display:grid;gap:12px}
.download-item{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.02)}
.section-copy{color:var(--soft);margin:0 0 16px}

/* v15 sidebar definitive fix */
.sidebar-group-items{display:none !important}
details.sidebar-group[open] > .sidebar-group-items{display:block !important}
details.sidebar-group > summary.sidebar-group-toggle{
  list-style:none;
}
details.sidebar-group > summary::-webkit-details-marker{display:none}
details.sidebar-group[open] > summary .sidebar-group-caret{transform:rotate(180deg)}

.image-card-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.image-card-actions .btn{min-height:36px;border-radius:999px}

/* v22 sidebar/toggle stability */
.sidebar-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:25}
.mobile-sidebar-toggle{display:none;flex-direction:column;gap:4px;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;border:1px solid var(--line);background:var(--panel);color:var(--text)}
.mobile-sidebar-toggle span{display:block;width:16px;height:2px;background:currentColor;border-radius:999px}
details.sidebar-group > .sidebar-group-items{display:none}
details.sidebar-group[open] > .sidebar-group-items{display:block}
details.sidebar-group > summary.sidebar-group-toggle{list-style:none}
details.sidebar-group > summary::-webkit-details-marker{display:none}
@media (max-width: 1024px){
  .layout{grid-template-columns:1fr}
  .mobile-sidebar-toggle{display:flex}
  .sidebar{position:fixed;left:0;top:0;bottom:0;width:290px;transform:translateX(-100%);transition:transform .22s ease;z-index:30}
  body.sidebar-open .sidebar{transform:translateX(0)}
  body.sidebar-open .sidebar-backdrop{display:block}
  .main{min-width:0}
}
