:root{
  --espresso:#1E1209;--ristretto:#3A2210;--crema:#C07B1A;
  --crema-soft:rgba(192,123,26,.1);--foam:#F2E8D5;--milk:#FAF6EF;
  --map-green:#0F6E56;--text:#1E1209;--muted:#7A6248;
  --subtle:#B8A990;--border:rgba(30,18,9,.08);--border-mid:rgba(30,18,9,.15);
  --surface:#fff;
  --sidebar-w:288px;--panel-w:300px;--topbar-h:50px;
  --r:10px;--r-sm:6px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
[dir=rtl] *{font-family:'DM Sans',sans-serif;}
html,body{height:100%;overflow:hidden;font-family:'DM Sans',sans-serif;font-size:14px;background:var(--milk);color:var(--text);}
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--border-mid);border-radius:5px;}
::-webkit-scrollbar-thumb:hover{background:var(--subtle);}
button{font-family:inherit;}

/* TOPBAR */
.topbar{position:fixed;top:0;left:0;right:0;height:var(--topbar-h);z-index:200;
  display:flex;align-items:center;background:var(--espresso);
  border-bottom:1px solid rgba(255,255,255,.05);padding:0 1rem;gap:.4rem;}
.tb-logo{font-family:'Cormorant Garamond',serif;font-size:1.1rem;font-weight:600;
  color:var(--foam);text-decoration:none;margin-right:.5rem;letter-spacing:-.01em;}
.tb-logo span{color:var(--crema);}
.tb-sep{width:1px;height:18px;background:rgba(255,255,255,.08);margin:0 .25rem;}
.tb-btn{display:flex;align-items:center;gap:.4rem;padding:.4rem .75rem;
  border-radius:var(--r-sm);font-size:.78rem;cursor:pointer;
  background:none;border:none;color:rgba(242,232,213,.55);transition:all .15s;white-space:nowrap;}
.tb-btn:hover{background:rgba(255,255,255,.06);color:var(--foam);}
.tb-btn.active{background:rgba(192,123,26,.18);color:var(--crema);}
.tb-spacer{flex:1;}

/* LANG SWITCHER (dropdown) */
.lang-wrap{position:relative;}
.lang-trigger{display:flex;align-items:center;gap:.4rem;
  background:transparent;border:1px solid rgba(255,255,255,.1);
  padding:.32rem .55rem;border-radius:100px;
  font-size:.72rem;color:rgba(242,232,213,.7);
  cursor:pointer;transition:all .15s;}
.lang-trigger:hover{border-color:var(--crema);color:var(--foam);}
.lang-trigger img{width:16px;height:12px;border-radius:2px;object-fit:cover;
  border:1px solid rgba(0,0,0,.06);display:block;}
.lang-trigger .chev{font-size:.6rem;opacity:.6;transition:transform .2s;}
.lang-wrap.open .lang-trigger .chev{transform:rotate(180deg);}
.lang-menu{position:absolute;top:calc(100% + .35rem);right:0;
  background:#fff;border:1px solid var(--border);border-radius:10px;
  box-shadow:0 8px 28px rgba(30,18,9,.16);
  padding:.35rem;min-width:178px;
  opacity:0;pointer-events:none;transform:translateY(-6px);
  transition:opacity .18s,transform .18s;z-index:300;}
.lang-wrap.open .lang-menu{opacity:1;pointer-events:auto;transform:translateY(0);}
.lang-item{display:flex;align-items:center;gap:.55rem;
  padding:.45rem .55rem;border-radius:5px;
  font-size:.8rem;color:var(--text);cursor:pointer;
  background:none;border:none;width:100%;font-family:inherit;text-align:left;}
.lang-item:hover{background:var(--milk);}
.lang-item.active{background:var(--crema-soft);color:var(--crema);font-weight:500;}
.lang-item img{width:18px;height:13px;border-radius:2px;object-fit:cover;
  flex-shrink:0;border:1px solid rgba(0,0,0,.06);}
.lang-item .name{flex:1;}
.lang-item .code{font-family:'DM Mono',monospace;font-size:.65rem;color:var(--subtle);text-transform:uppercase;}

.tb-user{display:flex;align-items:center;gap:.5rem;padding:.25rem .55rem;
  border-radius:var(--r-sm);cursor:pointer;}
.tb-user:hover{background:rgba(255,255,255,.06);}
.tb-avatar{width:24px;height:24px;border-radius:50%;background:var(--crema);
  color:var(--espresso);display:flex;align-items:center;justify-content:center;
  font-size:.68rem;font-weight:600;}
.tb-username{font-size:.76rem;color:rgba(242,232,213,.65);}

/* SHELL */
.shell{display:flex;height:100vh;padding-top:var(--topbar-h);}

/* SIDEBAR */
.sidebar{width:var(--sidebar-w);flex-shrink:0;background:var(--surface);
  border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;
  transition:transform .25s cubic-bezier(.4,0,.2,1);}
.sidebar.collapsed{transform:translateX(calc(-1 * var(--sidebar-w)));margin-right:calc(-1 * var(--sidebar-w));}
[dir=rtl] .sidebar{border-right:none;border-left:1px solid var(--border);}
[dir=rtl] .sidebar.collapsed{transform:translateX(var(--sidebar-w));margin-right:0;margin-left:calc(-1 * var(--sidebar-w));}

.sb-head{padding:.85rem 1rem .65rem;border-bottom:1px solid var(--border);flex-shrink:0;}
.sb-head-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:.6rem;}
.sb-title{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--subtle);font-weight:500;}
.sb-search{display:flex;align-items:center;gap:.4rem;background:var(--milk);
  border:1px solid var(--border);border-radius:var(--r-sm);padding:.4rem .55rem;}
.sb-search input{border:none;background:transparent;font-family:inherit;
  font-size:.78rem;color:var(--text);outline:none;width:100%;}
.sb-search input::placeholder{color:var(--subtle);}

.sb-tabs{display:flex;border-bottom:1px solid var(--border);flex-shrink:0;}
.sb-tab{flex:1;padding:.55rem .4rem;text-align:center;
  font-size:.7rem;font-weight:500;color:var(--muted);cursor:pointer;
  border-bottom:2px solid transparent;transition:all .15s;}
.sb-tab.active{color:var(--crema);border-bottom-color:var(--crema);}

.sb-body{flex:1;overflow-y:auto;padding:.4rem 0;}

.sb-section{margin-bottom:.2rem;}
.sb-section-hd{display:flex;align-items:center;justify-content:space-between;
  padding:.5rem 1rem .3rem;cursor:pointer;user-select:none;}
.sb-section-label{display:flex;align-items:center;gap:.4rem;
  font-size:.65rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--subtle);font-weight:500;}
.sb-section-label .dot{width:5px;height:5px;border-radius:50%;}
.sb-section-count{font-size:.65rem;background:var(--crema-soft);color:var(--crema);
  border-radius:100px;padding:.05rem .4rem;font-weight:500;}
.sb-chevron{color:var(--subtle);transition:transform .2s;font-size:.65rem;}
.sb-section.open .sb-chevron{transform:rotate(90deg);}
.sb-section.closed .sb-section-body{display:none;}

.sb-map-item{display:flex;align-items:center;gap:.6rem;padding:.5rem 1rem;
  cursor:pointer;border-left:2px solid transparent;transition:all .12s;}
.sb-map-item:hover{background:var(--milk);}
.sb-map-item.active{background:rgba(192,123,26,.06);border-left-color:var(--crema);}
.sb-map-thumb{width:32px;height:24px;border-radius:3px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--border);background:var(--milk);
  position:relative;overflow:hidden;}
.sb-map-thumb img.sb-flag{width:18px;height:13px;border-radius:1px;
  border:1px solid rgba(0,0,0,.06);object-fit:cover;}
.sb-map-info{flex:1;min-width:0;}
.sb-map-name{font-size:.8rem;font-weight:500;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:.05rem;}
.sb-map-meta{font-size:.66rem;color:var(--muted);font-family:'DM Mono',monospace;}
.sb-map-badge{font-size:.58rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase;
  padding:.1rem .35rem;border-radius:100px;flex-shrink:0;}
.badge-owned{background:rgba(15,110,86,.1);color:var(--map-green);}
.badge-active{background:var(--crema);color:#fff;border-radius:50%;width:8px;height:8px;display:flex;align-items:center;justify-content:center;font-size:6px;padding:0;}
.badge-free{background:var(--milk);color:var(--muted);border:1px solid var(--border);}

/* HIERARCHICAL CATALOG */
/* Year level */
.sb-year-section{border-bottom:2px solid var(--border);}
.sb-year-section.closed .sb-year-body{display:none;}
.sb-year-header{display:flex;align-items:center;gap:.5rem;
  padding:.65rem .75rem;cursor:pointer;font-size:.88rem;font-weight:600;
  color:var(--text);user-select:none;background:var(--milk);transition:background .12s;}
.sb-year-header:hover{background:rgba(192,123,26,.06);}
.sb-year-icon{font-size:1rem;}
.sb-year-name{flex:1;font-size:.92rem;font-weight:700;letter-spacing:.02em;}
.sb-year-count{font-size:.72rem;color:var(--crema);background:rgba(192,123,26,.1);
  padding:.15rem .5rem;border-radius:5px;font-weight:500;}
.sb-year-chevron{font-size:1rem;color:var(--crema);transition:transform .2s;font-weight:700;}
.sb-year-section.closed .sb-year-chevron{transform:rotate(-90deg);}
.sb-year-section.open .sb-year-chevron{transform:rotate(0);}
.sb-year-body{padding-left:0;}
/* Year filter bar */
.sb-year-filter{display:flex;align-items:center;gap:.4rem;padding:.5rem .75rem;
  border-bottom:1px solid var(--border);background:var(--bg);}
.sb-year-filter-label{font-size:.7rem;color:var(--muted);font-weight:500;margin-right:.2rem;}
.sb-year-pill{font-size:.7rem;padding:.2rem .55rem;border-radius:10px;cursor:pointer;
  background:var(--milk);color:var(--muted);border:1px solid var(--border);
  font-weight:500;transition:all .12s;user-select:none;}
.sb-year-pill:hover{border-color:var(--crema);color:var(--crema);}
.sb-year-pill.active{background:var(--crema);color:#fff;border-color:var(--crema);}
.sb-year-filter-info{font-size:.65rem;color:var(--muted);margin-left:auto;font-weight:400;white-space:nowrap;}

/* Country level */
.sb-country-section{border-bottom:1px solid var(--border);}
.sb-country-section.closed .sb-country-body{display:none;}
.sb-country-header{display:flex;align-items:center;gap:.5rem;
  padding:.55rem .75rem;cursor:pointer;font-size:.82rem;font-weight:500;
  color:var(--text);user-select:none;transition:background .12s;}
.sb-country-header:hover{background:var(--milk);}
.sb-country-name{flex:1;}
.sb-country-count{font-size:.72rem;color:var(--text);background:var(--milk);
  padding:.12rem .45rem;border-radius:5px;font-weight:600;min-width:1.2rem;text-align:center;}
.sb-country-chevron{font-size:.9rem;color:var(--crema);transition:transform .2s;font-weight:600;}
.sb-country-section.closed .sb-country-chevron{transform:rotate(-90deg);}
.sb-country-section.open .sb-country-chevron{transform:rotate(0);}
.sb-subset-badge{font-size:.62rem;color:var(--crema);
  background:rgba(192,123,26,.1);padding:.12rem .4rem;border-radius:4px;
  cursor:pointer;font-weight:600;flex-shrink:0;transition:background .12s;}
.sb-subset-badge:hover{background:rgba(192,123,26,.2);}
.sb-subsets-container{border-left:2px solid var(--border);
  margin-left:1.25rem;padding-left:.5rem;}
.sb-subset-group-header{font-size:.62rem;color:var(--muted);
  padding:.3rem .5rem;text-transform:uppercase;letter-spacing:.05em;font-weight:500;}
.sb-subset-item{padding-left:.5rem !important;}

/* Catalog tab */
.sb-catalog-card{padding:.6rem .75rem;border-bottom:1px solid var(--border);cursor:pointer;transition:background .1s;}
.sb-catalog-card:hover{background:var(--milk);}
.sb-catalog-card-name{font-size:.78rem;font-weight:500;color:var(--text);}
.sb-catalog-card-meta{font-size:.65rem;color:var(--muted);margin-top:.15rem;}
.sb-catalog-card-price{display:inline-flex;align-items:center;gap:.3rem;
  font-size:.68rem;color:var(--crema);font-weight:600;margin-top:.25rem;}

/* Academic export presets */
.export-presets{display:flex;flex-direction:column;gap:.3rem;margin-bottom:.5rem;}
.exp-preset-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem .6rem;
  border:1px solid var(--border);border-radius:8px;background:transparent;
  cursor:pointer;text-align:left;transition:all .12s;color:var(--text);font-size:.72rem;}
.exp-preset-btn:hover{border-color:var(--crema);background:rgba(192,123,26,.03);}
.exp-preset-btn .preset-icon{font-size:.9rem;flex-shrink:0;}
.exp-preset-btn .preset-label{font-weight:500;line-height:1.3;}
.exp-preset-btn .preset-detail{font-size:.62rem;color:var(--muted);font-weight:400;}

.sb-suggest-card{margin:.25rem .65rem;border:1px solid var(--border);
  border-radius:var(--r);overflow:hidden;cursor:pointer;transition:all .18s;background:#fff;}
.sb-suggest-card:hover{border-color:var(--crema);box-shadow:0 2px 12px rgba(192,123,26,.12);}
.sb-suggest-thumb{height:48px;display:flex;align-items:center;justify-content:center;
  font-size:1.5rem;}
.sb-suggest-body{padding:.5rem .65rem .55rem;}
.sb-suggest-name{font-size:.78rem;font-weight:500;color:var(--text);margin-bottom:.1rem;}
.sb-suggest-sub{font-size:.66rem;color:var(--muted);margin-bottom:.4rem;font-family:'DM Mono',monospace;}
.sb-suggest-footer{display:flex;align-items:center;justify-content:space-between;}
.sb-price{font-family:'Cormorant Garamond',serif;font-size:1rem;font-weight:600;color:var(--crema);}
.btn-buy{font-size:.65rem;font-weight:500;background:var(--espresso);color:var(--foam);
  border:none;border-radius:100px;padding:.22rem .65rem;cursor:pointer;
  font-family:inherit;transition:all .12s;}
.btn-buy:hover{background:var(--ristretto);}

.sb-footer{border-top:1px solid var(--border);padding:.6rem .7rem;flex-shrink:0;}
.sb-footer-btn{width:100%;display:flex;align-items:center;gap:.55rem;
  padding:.45rem .6rem;border-radius:var(--r-sm);font-size:.78rem;color:var(--muted);
  cursor:pointer;background:none;border:none;font-family:inherit;
  transition:all .12s;text-align:left;margin-bottom:.15rem;}
.sb-footer-btn:hover{background:var(--milk);color:var(--text);}
.sb-footer-btn.upgrade{background:rgba(192,123,26,.1);color:var(--crema);font-weight:500;}
.sb-footer-btn.upgrade:hover{background:rgba(192,123,26,.18);}

/* MAIN */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0;}

.canvas-area{flex:1;position:relative;overflow:hidden;
  background:radial-gradient(ellipse at 25% 20%, rgba(192,123,26,.04), transparent 55%),
             radial-gradient(ellipse at 80% 75%, rgba(15,110,86,.04), transparent 55%),
             var(--milk);}
.canvas-area.drag-active::after{
  content:'';position:absolute;inset:0;z-index:100;
  border:3px dashed var(--crema);border-radius:8px;
  background:rgba(192,123,26,.05);pointer-events:none;
  animation:dash-pulse 1s ease-in-out infinite;
}
@keyframes dash-pulse{0%,100%{opacity:.6;}50%{opacity:1;}}

/* Drop zone */
.drop-zone{position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:1rem;transition:all .2s;padding:2rem;}
.drop-zone.hidden{display:none;}
.drop-box{border:1.5px dashed var(--border-mid);border-radius:14px;
  padding:2.5rem 3.5rem;text-align:center;background:rgba(255,255,255,.7);
  transition:all .2s;cursor:pointer;backdrop-filter:blur(4px);max-width:480px;}
.drop-box:hover,.drop-box.drag-over{border-color:var(--crema);background:rgba(192,123,26,.04);transform:translateY(-2px);}
.drop-icon{font-size:2.2rem;margin-bottom:.7rem;opacity:.55;}
.drop-title{font-size:.95rem;font-weight:500;color:var(--text);margin-bottom:.3rem;}
.drop-sub{font-size:.78rem;color:var(--muted);line-height:1.5;}
.drop-hint{font-size:.74rem;color:var(--subtle);display:flex;align-items:center;gap:.4rem;}
.hint-chip{display:inline-flex;align-items:center;gap:.35rem;
  background:var(--espresso);color:var(--foam);border-radius:100px;
  padding:.32rem .75rem;font-size:.72rem;cursor:pointer;
  opacity:.85;transition:all .15s;border:none;font-family:inherit;}
.hint-chip:hover{opacity:1;transform:translateY(-1px);}

/* Map preview area */
.map-preview{position:absolute;inset:0;display:flex;flex-direction:column;}
.map-preview.hidden{display:none;}
.map-svg-wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:0;overflow:hidden;position:relative;}
.map-svg-wrap svg{max-width:100%;max-height:100%;display:block;}


/* Data load animation */
.province{transition:fill .6s ease, fill-opacity .6s ease;}
.province.anim-pending{fill:#E5E0D5 !important;fill-opacity:1 !important;}
/* SVG basemap layer */
.basemap-layer image{opacity:.65;}

/* Province styling */
.province{
  stroke:#000;stroke-width:.5;stroke-opacity:.55;cursor:pointer;
  transition:opacity .12s,stroke-width .12s;
}
.province:hover{stroke:rgba(0,0,0,0.8);stroke-width:1;opacity:.9;}
.province.no-data{fill:#E5E0D5;}
.basemap-on .province{fill-opacity:.78;}

/* Map title overlay (live UI) */
.map-title-block{position:absolute;top:1rem;left:1.5rem;background:rgba(255,255,255,.85);
  backdrop-filter:blur(8px);padding:.6rem .85rem;border-radius:8px;
  border:1px solid var(--border);max-width:50%;}
.map-title{font-family:'Cormorant Garamond',serif;font-size:1.1rem;font-weight:600;color:var(--espresso);}
.map-subtitle{font-size:.85rem;color:var(--muted);margin-top:.15rem;}

/* Tooltip */
.map-tooltip{position:fixed;background:var(--espresso);color:var(--foam);
  padding:.55rem .85rem;border-radius:8px;font-size:.74rem;
  pointer-events:none;opacity:0;transition:opacity .12s;
  z-index:300;box-shadow:0 6px 24px rgba(0,0,0,.3);min-width:140px;}
.map-tooltip-name{font-weight:500;font-size:.82rem;margin-bottom:.15rem;white-space:nowrap;}
.map-tooltip-val{color:var(--crema);font-family:'DM Mono',monospace;font-size:.9rem;font-weight:500;margin-bottom:.35rem;}
.tt-dist-wrap{margin-top:.1rem;}
.tt-dist-bar{height:3px;background:rgba(255,255,255,.15);border-radius:2px;position:relative;margin-bottom:.2rem;}
.tt-dist-dot{position:absolute;top:-3px;width:9px;height:9px;border-radius:50%;
  background:var(--crema);border:1.5px solid #fff;transition:left .15s;}
.tt-dist-labels{display:flex;justify-content:space-between;font-size:.58rem;color:rgba(242,232,213,.45);font-family:'DM Mono',monospace;}
.tt-rank{font-size:.65rem;color:rgba(242,232,213,.55);margin-top:.2rem;}

/* Legend (live UI) */
.map-legend{position:absolute;bottom:3rem;left:1.5rem;
  background:rgba(255,255,255,.92);backdrop-filter:blur(8px);
  padding:.7rem .85rem;border-radius:8px;border:1px solid var(--border);
  font-size:.72rem;}
.legend-title{font-size:.66rem;color:var(--muted);margin-bottom:.4rem;font-weight:500;}
.legend-bar{display:flex;height:10px;border-radius:2px;overflow:hidden;margin-bottom:.3rem;min-width:200px;max-width:320px;}
.legend-bar div{flex:1;}
.legend-classes{display:flex;justify-content:space-between;font-family:'DM Mono',monospace;font-size:.62rem;color:var(--muted);margin-top:.3rem;min-width:200px;max-width:320px;overflow:visible;}
.legend-detailed{display:flex;flex-direction:column;gap:.25rem;margin-top:.35rem;}
.legend-detail-row{display:flex;align-items:center;gap:.45rem;font-family:'DM Mono',monospace;font-size:.66rem;color:var(--muted);}
.legend-detail-swatch{width:16px;height:12px;border-radius:2px;flex-shrink:0;border:1px solid rgba(30,18,9,.12);}


.onboard-overlay{position:fixed;inset:0;z-index:500;
  background:rgba(30,18,9,.55);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;
  animation:fadeIn .3s ease;}
.onboard-overlay.hidden{display:none;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
.onboard-card{background:#fff;border-radius:16px;padding:2.2rem 2.5rem;
  max-width:400px;width:90%;text-align:center;
  box-shadow:0 20px 60px rgba(30,18,9,.25);
  animation:slideUp .35s ease;}
@keyframes slideUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
.onboard-step-dots{display:flex;gap:.4rem;justify-content:center;margin-bottom:1.5rem;}
.onboard-dot{width:8px;height:8px;border-radius:50%;background:var(--border-mid);transition:all .2s;}
.onboard-dot.active{background:var(--crema);width:20px;border-radius:4px;}
.onboard-icon{font-size:2.5rem;margin-bottom:.8rem;}
.onboard-title{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:600;
  color:var(--espresso);margin-bottom:.5rem;}
.onboard-text{font-size:.88rem;color:var(--muted);line-height:1.65;margin-bottom:1.6rem;}
.onboard-actions{display:flex;justify-content:space-between;align-items:center;}
.onboard-noshow{display:flex;align-items:center;gap:.4rem;font-size:.76rem;color:var(--muted);
  cursor:pointer;margin-bottom:.8rem;justify-content:center;}
.onboard-noshow input{accent-color:var(--crema);}
.onboard-skip{background:none;border:none;color:var(--muted);font-size:.8rem;cursor:pointer;
  font-family:inherit;padding:.4rem .6rem;}
.onboard-skip:hover{color:var(--espresso);}
.onboard-next{background:var(--espresso);color:var(--foam);border:none;border-radius:100px;
  padding:.6rem 1.4rem;font-size:.85rem;font-weight:500;cursor:pointer;
  font-family:inherit;transition:all .15s;}
.onboard-next:hover{background:var(--ristretto);transform:translateY(-1px);}

.detail-card{position:absolute;top:1rem;right:3.5rem;
  background:rgba(255,255,255,.92);backdrop-filter:blur(10px);
  border:1px solid var(--border);border-radius:var(--r);
  padding:1rem 1.2rem;min-width:200px;max-width:260px;
  box-shadow:0 8px 28px rgba(30,18,9,.12);
  z-index:18;display:none;animation:cardIn .2s ease;}
@keyframes cardIn{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:translateY(0);}}
.detail-close{position:absolute;top:.4rem;right:.5rem;background:none;border:none;
  font-size:1.1rem;color:var(--muted);cursor:pointer;line-height:1;}
.detail-close:hover{color:var(--espresso);}
.detail-name{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:600;
  color:var(--espresso);margin-bottom:.3rem;padding-right:1.2rem;}
.detail-value{font-family:'DM Mono',monospace;font-size:1.5rem;font-weight:500;
  color:var(--crema);margin-bottom:.5rem;line-height:1.1;}
.detail-stats{font-size:.76rem;color:var(--muted);line-height:1.65;margin-bottom:.55rem;}
.detail-rank{font-size:.72rem;color:var(--map-green);font-weight:500;margin-bottom:.5rem;}
.detail-bar-wrap{height:4px;background:var(--border);border-radius:2px;overflow:hidden;}
.detail-bar{height:100%;background:var(--crema);border-radius:2px;transition:width .4s ease;}
/* Status bar */
.canvas-statusbar{position:absolute;bottom:0;left:0;right:0;height:30px;
  background:rgba(255,255,255,.85);backdrop-filter:blur(6px);
  border-top:1px solid var(--border);display:flex;align-items:center;
  padding:0 1rem;gap:1.4rem;}
.status-item{font-size:.7rem;color:var(--muted);display:flex;align-items:center;gap:.32rem;}
.status-dot{width:5px;height:5px;border-radius:50%;background:var(--map-green);}
.status-mono{font-family:'DM Mono',monospace;}

/* RIGHT PANEL */
.panel{width:var(--panel-w);flex-shrink:0;background:var(--surface);
  border-left:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;
  transition:transform .25s cubic-bezier(.4,0,.2,1);}
.panel.collapsed{transform:translateX(var(--panel-w));margin-left:calc(-1 * var(--panel-w));}
[dir=rtl] .panel{border-left:none;border-right:1px solid var(--border);}

.panel-tabs{display:flex;border-bottom:1px solid var(--border);flex-shrink:0;}
.ptab{flex:1;padding:.65rem;text-align:center;font-size:.72rem;font-weight:500;
  color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;
  transition:all .15s;background:none;border-top:none;border-left:none;border-right:none;}
.ptab.active{color:var(--crema);border-bottom-color:var(--crema);}
.ptab:hover:not(.active){color:var(--text);}

.panel-body{flex:1;overflow-y:auto;padding:.85rem;}

.ctrl-group{margin-bottom:1rem;}
.ctrl-label{display:flex;align-items:center;justify-content:space-between;
  font-size:.66rem;font-weight:500;color:var(--muted);text-transform:uppercase;
  letter-spacing:.06em;margin-bottom:.35rem;}
.ctrl-label-hint{font-size:.62rem;color:var(--subtle);font-weight:400;text-transform:none;letter-spacing:0;}
.ctrl-label-success{color:var(--map-green) !important;text-transform:none !important;letter-spacing:0 !important;font-weight:400;}
.ctrl-select,.ctrl-input{width:100%;padding:.4rem .55rem;border:1px solid var(--border);
  border-radius:var(--r-sm);background:var(--milk);font-family:inherit;font-size:.8rem;
  color:var(--text);outline:none;transition:border-color .15s;}
.ctrl-select{appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg width='10' height='6' viewBox='0 0 10 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%237A6248' fill='none' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right .55rem center;padding-right:1.8rem;}
.ctrl-select:focus,.ctrl-input:focus{border-color:var(--crema);}
.pro-locked{opacity:.55;cursor:not-allowed;}
.pro-tag{font-size:.55rem;background:var(--crema);color:#fff;padding:.05rem .3rem;border-radius:100px;letter-spacing:.05em;text-transform:uppercase;font-weight:500;margin-left:.25rem;}

.ctrl-row{display:flex;gap:.4rem;}
.ctrl-row .ctrl-select,.ctrl-row .ctrl-input{flex:1;}

.ctrl-slider-row{display:flex;align-items:center;gap:.65rem;}
.ctrl-slider{flex:1;appearance:none;height:3px;background:var(--border-mid);
  border-radius:3px;cursor:pointer;outline:none;}
.ctrl-slider::-webkit-slider-thumb{appearance:none;width:13px;height:13px;
  border-radius:50%;background:var(--crema);cursor:pointer;
  box-shadow:0 1px 4px rgba(192,123,26,.4);}
.ctrl-slider-val{font-family:'DM Mono',monospace;font-size:.74rem;
  color:var(--text);min-width:1.4rem;text-align:center;}

/* Manual breaks editor */
.breaks-list{margin-top:.4rem;}
.break-row{display:flex;align-items:center;gap:.4rem;margin-bottom:.3rem;}
.break-row input{flex:1;padding:.3rem .5rem;border:1px solid var(--border);
  border-radius:var(--r-sm);background:var(--milk);font-family:'DM Mono',monospace;
  font-size:.78rem;outline:none;}
.break-row input:focus{border-color:var(--crema);}
.break-row .rm{background:none;border:none;color:var(--muted);
  cursor:pointer;font-size:1rem;padding:.1rem .3rem;border-radius:3px;}
.break-row .rm:hover{color:#C62828;background:#FEE;}
.break-add{display:flex;align-items:center;gap:.4rem;font-size:.74rem;
  color:var(--crema);background:none;border:1px dashed var(--crema);
  padding:.35rem .55rem;border-radius:var(--r-sm);cursor:pointer;
  font-family:inherit;width:100%;justify-content:center;margin-top:.2rem;}
.break-add:hover{background:var(--crema-soft);}
.break-info{font-size:.66rem;color:var(--muted);margin-top:.4rem;line-height:1.5;}

.palette-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.4rem;}
.palette-swatch{height:24px;border-radius:var(--r-sm);cursor:pointer;
  border:2px solid transparent;transition:all .15s;display:flex;overflow:hidden;}
.palette-swatch.active{border-color:var(--crema);box-shadow:0 0 0 2px rgba(192,123,26,.18);}
.palette-swatch:hover{transform:scale(1.03);}
.sw-seg{flex:1;}

.ctrl-toggle-row{display:flex;align-items:center;justify-content:space-between;
  padding:.45rem 0;border-bottom:1px solid var(--border);}
.ctrl-toggle-row:last-child{border-bottom:none;}
.ctrl-toggle-label{font-size:.8rem;color:var(--text);}
.toggle{width:30px;height:17px;border-radius:100px;background:var(--border-mid);
  cursor:pointer;position:relative;transition:background .2s;flex-shrink:0;}
.toggle.on{background:var(--crema);}
.toggle::after{content:'';position:absolute;top:2px;left:2px;width:13px;height:13px;
  border-radius:50%;background:#fff;transition:transform .2s;
  box-shadow:0 1px 3px rgba(0,0,0,.2);}
.toggle.on::after{transform:translateX(13px);}

.panel-divider{height:1px;background:var(--border);margin:.85rem -.85rem;}
.panel-section-title{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--subtle);font-weight:500;margin-bottom:.5rem;}

/* Basemap selector */
.basemap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;}
.basemap-opt{padding:.6rem .3rem;border:1px solid var(--border);border-radius:var(--r-sm);
  cursor:pointer;text-align:center;background:var(--milk);transition:all .15s;
  font-size:.68rem;color:var(--muted);font-weight:500;display:flex;flex-direction:column;align-items:center;gap:.3rem;}
.basemap-opt.active{border-color:var(--crema);background:var(--crema-soft);color:var(--crema);}
.basemap-opt:hover{border-color:var(--crema);}
.basemap-icon{width:36px;height:24px;border-radius:3px;background:#fff;
  border:1px solid var(--border);overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:.85rem;}

.export-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.35rem;}
.exp-btn{display:flex;flex-direction:column;align-items:center;gap:.25rem;
  padding:.6rem .25rem;border:1px solid var(--border);border-radius:var(--r-sm);
  background:var(--milk);cursor:pointer;transition:all .15s;
  font-size:.66rem;color:var(--muted);font-weight:500;font-family:inherit;}
.exp-btn:hover{border-color:var(--crema);color:var(--crema);background:var(--crema-soft);}
.exp-icon{font-size:1.1rem;}


.insight-card{display:flex;gap:.7rem;padding:.7rem .6rem;border-bottom:1px solid var(--border);
  transition:background .15s;}
.insight-card:hover{background:var(--milk);}
.insight-card:last-child{border-bottom:none;}
.insight-hero{background:linear-gradient(135deg,rgba(192,123,26,.06),rgba(192,123,26,.02));border-radius:var(--r);
  margin-bottom:.3rem;border:1px solid rgba(192,123,26,.12);padding:1rem .8rem;}
.insight-icon{font-size:1.1rem;flex-shrink:0;width:24px;text-align:center;padding-top:.1rem;}
.insight-body{flex:1;min-width:0;}
.insight-headline{font-family:'Cormorant Garamond',serif;font-size:1.8rem;font-weight:600;
  color:var(--crema);line-height:1.1;}
.insight-sub{font-size:.76rem;color:var(--muted);margin-top:.15rem;}
.insight-text{font-size:.78rem;color:var(--text);line-height:1.6;}
.insight-text strong{color:var(--espresso);font-weight:600;}
.insight-label{font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--subtle);font-weight:500;}
.insight-rank{font-family:'DM Mono',monospace;font-size:.68rem;color:var(--crema);font-weight:600;}
.enrich-pro-banner{background:linear-gradient(135deg,rgba(192,123,26,.08),rgba(192,123,26,.03));
  border:1px solid rgba(192,123,26,.2);border-radius:var(--r);padding:.85rem;margin-bottom:1rem;text-align:center;}
.enrich-pro-banner .badge{display:inline-block;background:var(--crema);color:#fff;
  padding:.15rem .5rem;border-radius:100px;font-size:.62rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase;margin-bottom:.4rem;}
.enrich-pro-banner h4{font-family:'Cormorant Garamond',serif;font-size:1rem;
  font-weight:600;color:var(--espresso);margin-bottom:.25rem;}
.enrich-pro-banner p{font-size:.72rem;color:var(--muted);line-height:1.5;margin-bottom:.6rem;}
.enrich-pro-banner button{background:var(--espresso);color:var(--foam);border:none;
  border-radius:100px;padding:.4rem 1rem;font-size:.74rem;cursor:pointer;font-family:inherit;}

.enrich-source{display:flex;align-items:center;gap:.55rem;padding:.5rem .55rem;
  border:1px solid var(--border);border-radius:var(--r-sm);margin-bottom:.35rem;cursor:pointer;
  transition:all .12s;opacity:.55;}
.enrich-source.locked{cursor:not-allowed;}


/* Auth modal */
.auth-modal{position:fixed;inset:0;z-index:600;background:rgba(30,18,9,.5);
  backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;}
.auth-modal.hidden{display:none;}
.auth-card{background:#fff;border-radius:16px;padding:2rem 2.2rem;
  max-width:380px;width:90%;box-shadow:0 20px 60px rgba(30,18,9,.25);
  animation:slideUp .3s ease;}
.auth-card h2{font-family:'Cormorant Garamond',serif;font-size:1.6rem;font-weight:600;
  color:var(--espresso);margin-bottom:.3rem;text-align:center;}
.auth-card .auth-sub{font-size:.82rem;color:var(--muted);text-align:center;margin-bottom:1.4rem;}
.auth-card label{font-size:.72rem;font-weight:500;color:var(--muted);
  text-transform:uppercase;letter-spacing:.05em;display:block;margin-bottom:.25rem;}
.auth-card input[type="email"],.auth-card input[type="password"],.auth-card input[type="text"]{
  width:100%;padding:.55rem .7rem;border:1px solid var(--border);border-radius:var(--r-sm);
  font-family:inherit;font-size:.85rem;margin-bottom:.85rem;outline:none;
  background:var(--milk);transition:border-color .15s;}
.auth-card input:focus{border-color:var(--crema);}
.auth-btn{width:100%;padding:.6rem;border:none;border-radius:100px;font-family:inherit;
  font-size:.88rem;font-weight:500;cursor:pointer;transition:all .15s;}
.auth-btn-primary{background:var(--espresso);color:var(--foam);}
.auth-btn-primary:hover{background:var(--ristretto);}
.auth-toggle{text-align:center;margin-top:1rem;font-size:.78rem;color:var(--muted);}
.auth-toggle a{color:var(--crema);text-decoration:none;font-weight:500;cursor:pointer;}
.auth-toggle a:hover{text-decoration:underline;}
.auth-error{background:#FEE;color:#C62828;font-size:.76rem;padding:.5rem .7rem;
  border-radius:var(--r-sm);margin-bottom:.85rem;display:none;}
.auth-close{position:absolute;top:.8rem;right:1rem;background:none;border:none;
  font-size:1.2rem;color:var(--muted);cursor:pointer;}
.auth-close:hover{color:var(--espresso);}

/* Payment / Billing Modal */
.pay-modal{position:fixed;inset:0;z-index:650;background:rgba(30,18,9,.55);
  backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;}
.pay-modal.hidden{display:none;}
.pay-card{background:#fff;border-radius:16px;padding:0;max-width:520px;width:92%;
  box-shadow:0 20px 60px rgba(30,18,9,.25);animation:slideUp .3s ease;overflow:hidden;}
.pay-header{background:var(--espresso);color:var(--foam);padding:1.4rem 1.8rem;position:relative;}
.pay-header h2{font-family:'Cormorant Garamond',serif;font-size:1.4rem;font-weight:600;margin-bottom:.2rem;}
.pay-header p{font-size:.78rem;color:rgba(242,232,213,.6);}
.pay-close{position:absolute;top:.8rem;right:1rem;background:none;border:none;
  font-size:1.3rem;color:rgba(242,232,213,.5);cursor:pointer;}
.pay-close:hover{color:var(--foam);}
.pay-body{padding:1.5rem 1.8rem;}
.pay-plans{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.65rem;margin-bottom:1.4rem;}
.pay-plan{border:1.5px solid var(--border);border-radius:var(--r);padding:.85rem .7rem;
  text-align:center;cursor:pointer;transition:all .15s;position:relative;background:#fff;}
.pay-plan:hover{border-color:var(--crema);transform:translateY(-2px);box-shadow:0 4px 16px rgba(192,123,26,.1);}
.pay-plan.selected{border-color:var(--crema);background:rgba(192,123,26,.04);}
.pay-plan.current{border-color:var(--map-green);background:rgba(15,110,86,.04);}
.pay-plan-badge{position:absolute;top:-.5rem;left:50%;transform:translateX(-50%);
  background:var(--crema);color:#fff;font-size:.58rem;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;padding:.15rem .5rem;border-radius:100px;white-space:nowrap;}
.pay-plan-name{font-family:'Cormorant Garamond',serif;font-size:1.1rem;font-weight:600;
  color:var(--espresso);margin-bottom:.15rem;margin-top:.3rem;}
.pay-plan-price{font-family:'DM Mono',monospace;font-size:1.3rem;font-weight:500;
  color:var(--crema);margin-bottom:.25rem;}
.pay-plan-price small{font-size:.65rem;color:var(--muted);font-weight:400;}
.pay-plan-features{font-size:.68rem;color:var(--muted);line-height:1.6;text-align:left;padding-left:.4rem;}
.pay-plan-features li{margin-bottom:.15rem;list-style:none;}
.pay-plan-features li::before{content:'✓ ';color:var(--map-green);}

.pay-divider{height:1px;background:var(--border);margin:1.2rem 0;}
.pay-section-title{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--subtle);font-weight:500;margin-bottom:.65rem;}
.pay-methods{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem;}
.pay-method-card{display:flex;align-items:center;gap:.7rem;padding:.6rem .75rem;
  border:1px solid var(--border);border-radius:var(--r-sm);cursor:pointer;transition:all .12s;}
.pay-method-card:hover{border-color:var(--crema);background:rgba(192,123,26,.03);}
.pay-method-card.selected{border-color:var(--crema);background:rgba(192,123,26,.05);}
.pay-method-icon{font-size:1.3rem;flex-shrink:0;}
.pay-method-info{flex:1;min-width:0;}
.pay-method-label{font-size:.82rem;font-weight:500;color:var(--text);}
.pay-method-detail{font-size:.68rem;color:var(--muted);font-family:'DM Mono',monospace;}
.pay-method-remove{background:none;border:none;color:var(--subtle);font-size:.85rem;cursor:pointer;padding:.2rem;}
.pay-method-remove:hover{color:#C62828;}

.pay-form-row{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin-bottom:.65rem;}
.pay-form-row.full{grid-template-columns:1fr;}
.pay-form-group label{font-size:.68rem;font-weight:500;color:var(--muted);text-transform:uppercase;
  letter-spacing:.04em;display:block;margin-bottom:.2rem;}
.pay-form-group input{width:100%;padding:.5rem .6rem;border:1px solid var(--border);border-radius:var(--r-sm);
  font-family:'DM Mono',monospace;font-size:.82rem;background:var(--milk);outline:none;transition:border-color .15s;}
.pay-form-group input:focus{border-color:var(--crema);}
.pay-form-group input::placeholder{color:var(--subtle);font-family:'DM Sans',sans-serif;}

.pay-add-card-btn{display:flex;align-items:center;gap:.4rem;font-size:.76rem;
  color:var(--crema);background:none;border:1px dashed var(--crema);
  padding:.4rem .7rem;border-radius:var(--r-sm);cursor:pointer;font-family:inherit;
  transition:all .12s;width:100%;justify-content:center;}
.pay-add-card-btn:hover{background:rgba(192,123,26,.06);}

.pay-actions{display:flex;gap:.6rem;margin-top:1.2rem;}
.pay-btn{flex:1;padding:.6rem;border:none;border-radius:100px;font-family:inherit;
  font-size:.85rem;font-weight:500;cursor:pointer;transition:all .15s;text-align:center;}
.pay-btn-primary{background:var(--espresso);color:var(--foam);}
.pay-btn-primary:hover{background:var(--ristretto);}
.pay-btn-secondary{background:var(--milk);color:var(--muted);border:1px solid var(--border);}
.pay-btn-secondary:hover{background:var(--foam);color:var(--text);}
.pay-btn:disabled{opacity:.45;cursor:not-allowed;}

.pay-success{text-align:center;padding:1.5rem 0;}
.pay-success-icon{font-size:2.5rem;margin-bottom:.6rem;}
.pay-success-title{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:600;color:var(--espresso);}
.pay-success-sub{font-size:.82rem;color:var(--muted);margin-top:.3rem;}

/* Admin Panel */
.admin-badge{display:inline-flex;align-items:center;gap:.3rem;
  background:linear-gradient(135deg,#FFD700,#FFA500);color:var(--espresso);
  font-size:.58rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  padding:.15rem .45rem;border-radius:100px;margin-left:.4rem;}
.tb-user-dropdown-item.admin{color:var(--crema);font-weight:500;}
.admin-panel{position:fixed;inset:0;z-index:600;background:rgba(30,18,9,.55);
  backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;}
.admin-panel.hidden{display:none;}
.admin-card{background:#fff;border-radius:16px;max-width:600px;width:92%;
  max-height:80vh;overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 20px 60px rgba(30,18,9,.25);animation:slideUp .3s ease;}
.admin-card-head{background:linear-gradient(135deg,var(--espresso),var(--ristretto));
  color:var(--foam);padding:1.2rem 1.6rem;display:flex;align-items:center;justify-content:space-between;}
.admin-card-head h2{font-family:'Cormorant Garamond',serif;font-size:1.3rem;font-weight:600;}
.admin-card-body{flex:1;overflow-y:auto;padding:1.2rem 1.6rem;}
.admin-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem;margin-bottom:1.2rem;}
.admin-stat{background:var(--milk);border:1px solid var(--border);border-radius:var(--r);
  padding:.7rem .8rem;text-align:center;}
.admin-stat-val{font-family:'Cormorant Garamond',serif;font-size:1.5rem;font-weight:600;color:var(--crema);}
.admin-stat-label{font-size:.66rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;}
.admin-user-list{border:1px solid var(--border);border-radius:var(--r);overflow:hidden;}
.admin-user-row{display:flex;align-items:center;gap:.65rem;padding:.6rem .8rem;
  border-bottom:1px solid var(--border);font-size:.8rem;transition:background .1s;}
.admin-user-row:last-child{border-bottom:none;}
.admin-user-row:hover{background:var(--milk);}
.admin-user-avatar{width:28px;height:28px;border-radius:50%;background:var(--crema);
  color:var(--espresso);display:flex;align-items:center;justify-content:center;
  font-size:.6rem;font-weight:600;flex-shrink:0;}
.admin-user-info{flex:1;min-width:0;}
.admin-user-name{font-weight:500;color:var(--text);}
.admin-user-email{font-size:.68rem;color:var(--muted);font-family:'DM Mono',monospace;}
.admin-user-plan{font-size:.62rem;padding:.12rem .4rem;border-radius:100px;font-weight:500;}
.plan-free{background:var(--milk);color:var(--muted);border:1px solid var(--border);}
.plan-base{background:rgba(192,123,26,.12);color:var(--crema);}
.plan-pro{background:rgba(15,110,86,.12);color:var(--map-green);}
.admin-user-actions select{font-family:inherit;font-size:.72rem;padding:.2rem .4rem;
  border:1px solid var(--border);border-radius:var(--r-sm);background:#fff;cursor:pointer;}

/* Payment Provider Buttons */
.pay-providers{display:flex;flex-direction:column;gap:.45rem;margin-bottom:1rem;}
.pay-provider-btn{display:flex;align-items:center;gap:.65rem;padding:.6rem .8rem;
  border:1.5px solid var(--border);border-radius:var(--r-sm);cursor:pointer;
  background:#fff;transition:all .15s;font-family:inherit;font-size:.82rem;
  color:var(--text);width:100%;text-align:left;}
.pay-provider-btn:hover{border-color:var(--crema);background:rgba(192,123,26,.03);transform:translateY(-1px);
  box-shadow:0 3px 12px rgba(192,123,26,.08);}
.pay-provider-btn.selected{border-color:var(--crema);background:rgba(192,123,26,.05);
  box-shadow:0 0 0 1px var(--crema);}
.pay-provider-icon{width:36px;height:22px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.pay-provider-icon img,.pay-provider-icon svg{max-width:100%;max-height:100%;}
.pay-provider-name{font-weight:500;flex:1;}
.pay-provider-detail{font-size:.66rem;color:var(--muted);margin-top:.1rem;}
.pay-provider-check{width:16px;height:16px;border:1.5px solid var(--border);border-radius:50%;
  flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .12s;}
.pay-provider-btn.selected .pay-provider-check{border-color:var(--crema);background:var(--crema);}
.pay-provider-btn.selected .pay-provider-check::after{content:'✓';color:#fff;font-size:.6rem;font-weight:700;}
.pay-stripe-badge{background:#635BFF;color:#fff;font-size:.52rem;font-weight:600;
  letter-spacing:.04em;padding:.12rem .35rem;border-radius:3px;margin-left:.3rem;}

/* Topbar user states */
.tb-login-btn{display:flex;align-items:center;gap:.4rem;padding:.35rem .85rem;
  border-radius:100px;font-size:.78rem;font-weight:500;cursor:pointer;
  background:rgba(192,123,26,.15);border:none;color:var(--crema);
  font-family:inherit;transition:all .15s;}
.tb-login-btn:hover{background:rgba(192,123,26,.25);}
.tb-user-menu{position:relative;}
.tb-user-dropdown{position:absolute;top:calc(100% + .4rem);right:0;
  background:#fff;border:1px solid var(--border);border-radius:10px;
  box-shadow:0 8px 28px rgba(30,18,9,.16);padding:.35rem;min-width:180px;
  opacity:0;pointer-events:none;transform:translateY(-6px);
  transition:opacity .18s,transform .18s;z-index:300;}
.tb-user-menu.open .tb-user-dropdown{opacity:1;pointer-events:auto;transform:translateY(0);}
.tb-user-dropdown-item{display:flex;align-items:center;gap:.5rem;
  padding:.45rem .6rem;border-radius:5px;font-size:.8rem;color:var(--text);
  cursor:pointer;background:none;border:none;width:100%;font-family:inherit;text-align:left;}
.tb-user-dropdown-item:hover{background:var(--milk);}
.tb-user-dropdown-item.danger{color:#C62828;}

/* Toast */
.toast{position:fixed;bottom:50px;left:50%;transform:translateX(-50%);
  background:var(--espresso);color:var(--foam);padding:.5rem 1rem;border-radius:100px;
  font-size:.76rem;z-index:9999;opacity:0;pointer-events:none;
  transition:opacity .25s;white-space:nowrap;}
.toast.show{opacity:1;pointer-events:auto;}

/* Edge toggle */
.sb-edge,.pn-edge{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	z-index:50;
	width:22px;
	height:48px;
	background:#E2D6C4 !important;
	border:1px solid var(--border-mid);
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:1rem;
	color:var(--muted);
	transition:all .25s;
	box-shadow:0 2px 12px rgba(0,0,0,.18);
	}
.sb-edge:hover,.pn-edge:hover{background:#D4C4A8 !important;color:var(--espresso);}
.sb-edge{left:var(--sidebar-w);border-left:none;border-radius:0 5px 5px 0;}
.sb-edge.collapsed{left:0;}
.pn-edge{right:var(--panel-w);border-right:none;border-radius:5px 0 0 5px;}
.pn-edge.collapsed{right:0;}

.no-data-banner{padding:.55rem .85rem;background:#FFF7E6;border:1px solid #F5D584;
  border-radius:var(--r-sm);font-size:.74rem;color:#7A4F00;
  display:flex;align-items:center;gap:.5rem;margin-bottom:.85rem;}
.no-data-banner .icon{font-size:1rem;}

@media (max-width: 900px){
  .sidebar,
  .panel{
    position: fixed;
    top: var(--topbar-h);
    bottom: 0;
    z-index: 80;
  }
  .sb-edge,.pn-edge{
    width:26px;height:56px;font-size:.75rem;
    box-shadow:0 3px 14px rgba(0,0,0,.25);
  }


  /* nascosti di default su mobile */
  .sidebar{
    left: 0;
    transform: translateX(-100%);
    margin-right: 0;
  }

  .panel{
    right: 0;
    transform: translateX(100%);
    margin-left: 0;
  }

  /* quando il JS aggiunge .collapsed, su mobile li facciamo comparire */
  .sidebar.collapsed{
    transform: translateX(0);
    margin-right: 0;
  }

  .panel.collapsed{
    transform: translateX(0);
    margin-left: 0;
  }

  /* maniglie/frecce sempre visibili ai bordi */
  .sb-edge,
  .pn-edge{
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    z-index: 90;
    width: 22px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.96);
    border: 1px solid var(--border);
    box-shadow: 0 2px 10px rgba(0,0,0,.08);
    color: var(--crema);
    opacity: 1;
  }

  .sb-edge{
    left: 0;
    border-left: none;
    border-radius: 0 8px 8px 0;
  }

  .pn-edge{
    right: 0;
    border-right: none;
    border-radius: 8px 0 0 8px;
  }
}

/* ─── Checkout Preview ─── */
.ckp-item{display:flex;gap:.8rem;padding:.7rem 0;border-bottom:1px solid var(--border);}
.ckp-item:last-child{border-bottom:none;}
.ckp-map-thumb{width:160px;height:110px;flex-shrink:0;border-radius:8px;
  background:var(--milk);border:1px solid var(--border);overflow:hidden;
  display:flex;align-items:center;justify-content:center;position:relative;}
.ckp-map-thumb svg{max-width:100%;max-height:100%;}
.ckp-map-thumb .ckp-loading{font-size:.7rem;color:var(--subtle);}
.ckp-info{flex:1;display:flex;flex-direction:column;justify-content:center;min-width:0;}
.ckp-name{font-size:.88rem;font-weight:500;color:var(--text);margin-bottom:.15rem;
  display:flex;align-items:center;gap:.4rem;} 
.ckp-name img{width:14px;height:10px;border-radius:1px;object-fit:cover;
  border:1px solid rgba(0,0,0,.06);}
.ckp-detail{font-size:.7rem;color:var(--muted);font-family:'DM Mono',monospace;margin-bottom:.3rem;}
.ckp-features{font-size:.68rem;color:var(--muted);line-height:1.5;}
.ckp-price{font-family:'Cormorant Garamond',serif;font-size:1.2rem;font-weight:600;
  color:var(--crema);margin-top:.3rem;}
.ckp-price.free{font-size:.85rem;color:var(--map-green);font-family:'DM Sans',sans-serif;}