*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --primary:#84cc16;--primary-light:#a3e635;--primary-dark:#65a30d;
  --primary-ultra-light:rgba(132,204,22,.08);--primary-glow:rgba(132,204,22,.4);

  --white:#ffffff;--black:#0a0a0b;
  --gray-50:#fafafa;--gray-100:#f4f4f5;--gray-200:#e4e4e7;--gray-300:#d4d4d8;
  --gray-400:#a1a1aa;--gray-500:#71717a;--gray-600:#52525b;--gray-700:#3f3f46;
  --gray-800:#27272a;--gray-900:#18181b;

  --success:#22c55e;--error:#ef4444;--warning:#f59e0b;--info:#3b82f6;

  --glass-bg:rgba(255,255,255,.7);--glass-bg-strong:rgba(255,255,255,.85);
  --glass-border:rgba(255,255,255,.8);--glass-shadow:0 8px 32px rgba(0,0,0,.08);
  --glass-blur:blur(20px);

  --radius:12px;--radius-sm:8px;--radius-xs:5px;--radius-xl:1.5rem;
  --font:'Inter',system-ui,-apple-system,sans-serif;
  --mono:'JetBrains Mono',monospace;

  /* Stand colors — adjusted for light bg */
  --stand-ilot:#65a30d;--stand-ilot-bg:rgba(132,204,22,.15);--stand-ilot-border:rgba(132,204,22,.4);
  --stand-fond:#2563eb;--stand-fond-bg:rgba(37,99,235,.1);--stand-fond-border:rgba(37,99,235,.35);
  --stand-lin:#7c3aed;--stand-lin-bg:rgba(124,58,237,.1);--stand-lin-border:rgba(124,58,237,.3);
  --stand-u:#d97706;--stand-u-bg:rgba(217,119,6,.1);--stand-u-border:rgba(217,119,6,.35);
  --stand-custom:#0f172a;--stand-custom-bg:rgba(15,23,42,.06);--stand-custom-border:rgba(15,23,42,.25);

  /* Spacing scale (4px base) */
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;
  --sp-5:20px;--sp-6:24px;--sp-7:28px;--sp-8:32px;

  /* Type scale */
  --text-xs:.75rem;--text-sm:.8125rem;--text-base:.875rem;
  --text-md:.9375rem;--text-lg:1.125rem;--text-xl:1.375rem;

  /* Transition durations */
  --dur-fast:.12s;--dur-base:.2s;--dur-slow:.3s;
}

/* ═══ FOCUS-VISIBLE (a11y) ═══ */
:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
:focus:not(:focus-visible){outline:none}
html,body{height:100%;overflow:hidden}
body{
  font-family:var(--font);color:var(--gray-800);-webkit-font-smoothing:antialiased;
  background:linear-gradient(135deg,#f0fdf4 0%,#ecfccb 25%,#fefce8 50%,#f0fdf4 75%,#ecfccb 100%);
  background-attachment:fixed
}

/* ═══ APP LAYOUT ═══ */
.app{display:grid;grid-template-rows:auto 1fr;grid-template-columns:1fr 280px;height:100vh}
.toolbar{
  grid-column:1/-1;display:flex;flex-direction:column;
  background:var(--glass-bg-strong);backdrop-filter:var(--glass-blur);
  border-bottom:1px solid var(--glass-border);z-index:20;
}

/* Ligne commune */
.toolbar__row{
  display:flex;align-items:center;gap:6px;padding:5px 12px;
  overflow-x:auto;overflow-y:hidden;
}
.toolbar__row::-webkit-scrollbar{height:3px}
.toolbar__row::-webkit-scrollbar-thumb{background:var(--gray-200);border-radius:2px}

/* Ligne 1 : primaire */
.toolbar__row--primary{
  border-bottom:1px solid var(--gray-100);
  background:var(--white);
}

/* Ligne 2 : outils */
.toolbar__row--tools{
  background:var(--glass-bg-strong);
}
.canvas-area{position:relative;overflow:hidden;background:var(--gray-100)}
.sidebar{
  background:var(--glass-bg-strong);backdrop-filter:var(--glass-blur);
  border-left:1px solid var(--glass-border);overflow-y:auto;display:flex;flex-direction:column
}

/* ═══ TOOLBAR ═══ */
.toolbar__logo{font-weight:800;font-size:.92rem;letter-spacing:-.02em;margin-right:4px;white-space:nowrap;color:var(--gray-900);flex-shrink:0}
.toolbar__logo span{color:var(--primary-dark)}
.toolbar__sep{width:1px;height:24px;background:var(--gray-200);flex-shrink:0;margin:0 2px}
.toolbar__group{display:flex;align-items:center;gap:3px;flex-shrink:0}
.toolbar__label{font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--gray-400);margin-right:4px;white-space:nowrap}

.stand-btn{
  display:flex;align-items:center;gap:5px;padding:5px 10px;border:1.5px solid var(--gray-200);
  border-radius:var(--radius-sm);background:var(--white);color:var(--gray-600);font-family:var(--font);
  font-size:.75rem;font-weight:500;cursor:grab;transition:all .15s;white-space:nowrap;user-select:none;
  box-shadow:0 1px 3px rgba(0,0,0,.04);flex-shrink:0
}
.stand-btn:hover{border-color:var(--primary);color:var(--gray-900);background:var(--primary-ultra-light);box-shadow:0 2px 8px rgba(132,204,22,.12)}
.stand-btn.dragging{opacity:.5;cursor:grabbing}
.stand-btn__icon{width:22px;height:16px;border-radius:2px;flex-shrink:0;position:relative}
.stand-btn__icon--ilot{background:var(--stand-ilot-bg);border:1.5px solid var(--stand-ilot)}
.stand-btn__icon--fond{background:var(--stand-fond-bg);border:1.5px solid var(--stand-fond);border-top:3px solid var(--stand-fond)}
.stand-btn__icon--lineaire{background:var(--stand-lin-bg);border:1.5px solid var(--stand-lin);border-top:3px solid var(--stand-lin);border-left:3px solid var(--stand-lin)}
.stand-btn__icon--u{background:var(--stand-u-bg);border:1.5px solid var(--stand-u);border-top:3px solid var(--stand-u);border-left:3px solid var(--stand-u);border-right:3px solid var(--stand-u)}
.stand-btn__icon--surmesure{background:var(--stand-custom-bg);border:1.5px dashed var(--stand-custom);position:relative}
.stand-btn__icon--surmesure::after{content:'✦';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:8px;color:var(--stand-custom);opacity:.6}

/* Tool buttons (Zone, Text) */
.tool-btn{
  display:flex;align-items:center;gap:5px;padding:5px 9px;border:1.5px solid var(--gray-200);
  border-radius:var(--radius-sm);background:var(--white);color:var(--gray-600);font-family:var(--font);
  font-size:.75rem;font-weight:500;cursor:pointer;transition:all .15s;white-space:nowrap;
  box-shadow:0 1px 3px rgba(0,0,0,.04);flex-shrink:0
}
.tool-btn:hover{border-color:var(--primary);color:var(--gray-900);background:var(--primary-ultra-light)}
.tool-btn.active{border-color:var(--primary-dark);color:#fff;background:var(--primary);box-shadow:0 2px 10px rgba(132,204,22,.3)}
.tool-btn svg{width:14px;height:14px}
.tool-btn--sym{padding:4px 7px;font-size:.7rem;gap:3px}
.tool-btn--sym svg{width:13px;height:13px}
.tool-btn--sym.active{border-color:var(--primary-dark);color:#fff;background:var(--primary)}

.tool-hint{
  position:absolute;top:8px;left:50%;transform:translateX(-50%);
  padding:6px 14px;background:var(--primary);color:#fff;font-size:.75rem;font-weight:600;
  border-radius:var(--radius);z-index:6;pointer-events:none;white-space:nowrap;
  box-shadow:0 4px 12px rgba(132,204,22,.3);animation:toolHintIn .3s ease
}
@keyframes toolHintIn{from{opacity:0;transform:translateX(-50%) translateY(-6px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}

.tbtn{
  display:flex;align-items:center;justify-content:center;width:30px;height:30px;
  border:1.5px solid var(--gray-200);border-radius:var(--radius-xs);
  background:var(--white);color:var(--gray-500);cursor:pointer;transition:all .15s;flex-shrink:0
}
.tbtn:hover{border-color:var(--primary);color:var(--primary-dark);background:var(--primary-ultra-light)}
.tbtn.active{border-color:var(--primary);color:var(--primary-dark);background:rgba(132,204,22,.1)}
.tbtn:disabled{opacity:.35;cursor:not-allowed;pointer-events:none}
.tbtn svg{width:14px;height:14px}
/* PDF export button — accent rouge discret */
.tbtn--pdf{color:#dc2626;border-color:#fca5a5}
.tbtn--pdf:hover{border-color:#dc2626;color:#fff;background:#dc2626}
/* CSV export button — accent vert Business */
.tbtn--csv{color:#16a34a;border-color:#86efac}
.tbtn--csv:hover{border-color:#16a34a;color:#fff;background:#16a34a}
.tbtn--active{border-color:var(--warning)!important;color:var(--warning)!important;background:rgba(245,158,11,.08)!important}

.toolbar__dim{display:flex;align-items:center;gap:4px}
.toolbar__dim input{
  width:46px;padding:5px 4px;background:var(--gray-50);border:1.5px solid var(--gray-200);
  border-radius:var(--radius-xs);color:var(--gray-800);font-family:var(--mono);font-size:.78rem;
  font-weight:600;text-align:center;outline:none;transition:all .15s;
  -moz-appearance:textfield
}
.toolbar__dim input::-webkit-inner-spin-button,
.toolbar__dim input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.toolbar__dim input:focus{border-color:var(--primary);background:var(--white);box-shadow:0 0 0 3px var(--primary-ultra-light)}
.toolbar__dim span{color:var(--gray-400);font-size:.72rem;font-weight:500}
.toolbar__dim span:last-child{color:var(--gray-300);font-size:.68rem;font-weight:600;letter-spacing:.02em}

.toolbar__spacer{flex:1;min-width:8px}

.toolbar__zoom{display:flex;align-items:center;gap:2px;flex-shrink:0}
.toolbar__zoom-val{font-family:var(--mono);font-size:.72rem;color:var(--gray-500);min-width:36px;text-align:center}

/* ─── Auth bar (cloud-save) ─────────────────────────────── */
.toolbar__auth{display:flex;align-items:center;gap:6px;flex-shrink:0}

/* User avatar pill (logged in) */
.auth-bar__avatar{
  width:26px;height:26px;border-radius:50%;
  background:var(--primary-dark);color:#fff;
  font-size:.7rem;font-weight:800;
  display:inline-flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.auth-bar__name{font-size:.75rem;font-weight:600;color:var(--gray-700);white-space:nowrap;max-width:100px;overflow:hidden;text-overflow:ellipsis}

/* CTA pill (guest) */
.auth-bar__cta{
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 14px;border-radius:20px;
  font-size:.75rem;font-weight:700;
  background:#1a3d2b;color:#fff;
  border:none;cursor:pointer;text-decoration:none;white-space:nowrap;
  transition:background .15s,transform .1s;
  letter-spacing:.01em;
}
.auth-bar__cta:hover{background:#245a42;transform:scale(1.02)}

.auth-bar__btn{
  display:inline-flex;align-items:center;gap:4px;
  padding:5px 10px;border-radius:6px;
  font-size:.72rem;font-weight:600;
  background:var(--gray-100);color:var(--gray-700);
  border:1px solid var(--gray-200);
  cursor:pointer;text-decoration:none;white-space:nowrap;
  transition:background .15s,color .15s;
}
.auth-bar__btn:hover{background:var(--primary-ultra-light);color:var(--primary-dark);border-color:var(--primary)}
.auth-bar__btn--save{background:#2D6A4F;color:#fff;border-color:#2D6A4F}
.auth-bar__btn--save:hover{background:#1a3d2b;color:#fff;border-color:#1a3d2b}
.auth-bar__btn--ghost{background:transparent;border-color:transparent;color:var(--gray-500)}
.auth-bar__btn--ghost:hover{background:var(--gray-100);color:var(--gray-700);border-color:var(--gray-200)}

/* ═══ CANVAS ═══ */
#planCanvas{display:block;cursor:crosshair;touch-action:none}
.canvas-area.dragging-stand #planCanvas{cursor:copy}
.canvas-area.moving-stand #planCanvas{cursor:move}
.canvas-area.resizing-stand #planCanvas{cursor:nwse-resize}

.drag-ghost{
  position:fixed;pointer-events:none;z-index:999;opacity:.7;
  border:2px dashed var(--primary);border-radius:4px;background:rgba(132,204,22,.1);
  display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:.7rem;color:var(--primary-dark)
}

/* ═══ MINIMAP ═══ */
.minimap{
  position:absolute;bottom:12px;left:12px;width:160px;height:120px;
  background:var(--glass-bg-strong);backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-border);border-radius:var(--radius-sm);
  overflow:hidden;z-index:10;box-shadow:var(--glass-shadow);opacity:.9
}
.minimap:hover{opacity:1}
.minimap canvas{width:100%;height:100%}
.minimap__viewport{position:absolute;border:1.5px solid var(--primary);pointer-events:none;border-radius:1px}

/* ═══ SIDEBAR ═══ */
.sidebar__section{padding:16px;border-bottom:1px solid var(--gray-200)}
.sidebar__title{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-400);margin-bottom:12px;display:flex;align-items:center;gap:6px}
.sidebar__title svg{width:14px;height:14px;color:var(--primary-dark)}

/* Stats toolbar inline */
.toolbar__stats{display:flex;align-items:center;gap:0;background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--radius-sm);overflow:hidden;height:30px}
.tstat{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3px 8px;border-right:1px solid var(--gray-200);min-width:0;height:100%}
.tstat:last-child{border-right:none}
.tstat__val{font-family:var(--mono);font-size:.75rem;font-weight:700;color:var(--gray-900);line-height:1;white-space:nowrap}
.tstat__lbl{font-size:.52rem;color:var(--gray-400);margin-top:1px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.tstat--bar{padding:6px 10px;min-width:64px}

.occ-bar{height:4px;background:var(--gray-200);border-radius:2px;overflow:hidden;width:100%}
.occ-bar__fill{height:100%;border-radius:2px;background:linear-gradient(90deg,var(--primary),var(--primary-light));transition:width .3s}
.occ-bar__fill.warn{background:linear-gradient(90deg,var(--warning),#fbbf24)}
.occ-bar__fill.danger{background:linear-gradient(90deg,var(--error),#f87171)}

/* Stand list */
.stand-list{display:flex;flex-direction:column;gap:6px}
.stand-item{
  display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--white);
  border:1px solid var(--gray-200);border-radius:var(--radius-sm);cursor:pointer;transition:all .15s;
  box-shadow:0 1px 2px rgba(0,0,0,.03)
}
.stand-item:hover{border-color:var(--primary);background:var(--primary-ultra-light)}
.stand-item.selected{border-color:var(--primary);background:rgba(132,204,22,.06);box-shadow:0 0 0 2px var(--primary-ultra-light)}
.stand-item__color{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.stand-item__info{flex:1;min-width:0}
.stand-item__name{font-size:.82rem;font-weight:600;color:var(--gray-800);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stand-item__dims{font-family:var(--mono);font-size:.7rem;color:var(--gray-400)}
.stand-item__price{font-family:var(--mono);font-size:.75rem;color:var(--primary-dark);font-weight:600}
.stand-item__del{
  width:24px;height:24px;display:flex;align-items:center;justify-content:center;
  border-radius:4px;border:none;background:transparent;color:var(--gray-400);cursor:pointer;transition:all .15s;flex-shrink:0
}
.stand-item__del:hover{background:rgba(239,68,68,.1);color:var(--error)}

/* Properties panel */
.props{display:flex;flex-direction:column;gap:10px}
.props__row{display:flex;align-items:center;gap:8px}
.props__label{font-size:.75rem;color:var(--gray-400);width:70px;flex-shrink:0}
.props__val{font-family:var(--mono);font-size:.82rem;color:var(--gray-800);flex:1}
.props__input{
  flex:1;padding:5px 8px;background:var(--white);border:1.5px solid var(--gray-200);border-radius:var(--radius-xs);
  color:var(--gray-800);font-family:var(--mono);font-size:.8rem;outline:none;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.04)
}
.props__input:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ultra-light)}
.props__actions{display:flex;gap:6px;margin-top:4px}
.props__btn{
  flex:1;padding:7px 0;border:1.5px solid var(--gray-200);border-radius:var(--radius-xs);
  background:var(--white);color:var(--gray-600);font-family:var(--font);font-size:.78rem;
  font-weight:500;cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;gap:5px
}
.props__btn:hover{border-color:var(--primary);color:var(--primary-dark);background:var(--primary-ultra-light)}
.props__btn--danger:hover{border-color:var(--error);color:var(--error);background:rgba(239,68,68,.05)}
.props__btn svg{width:14px;height:14px}
.props__btn--icon{flex:0 0 auto;padding:7px 10px;gap:3px}
.props__btn-label{font-size:.74rem;font-weight:600}

/* ─── Props sections (statut + client) ─── */
.props__section{margin-top:12px;border-top:1px solid var(--gray-100);padding-top:10px}
.props__section-title{font-size:.63rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--gray-400);margin-bottom:7px}

/* Statut buttons */
.status-btns{display:flex;gap:5px}
.status-btn{
  flex:1;padding:5px 4px;border:1.5px solid var(--gray-200);border-radius:var(--radius-xs);
  background:var(--white);font-size:.72rem;font-weight:600;cursor:pointer;transition:all .15s;
  color:var(--gray-500);white-space:nowrap;text-align:center
}
.status-btn:hover{border-color:var(--sc,#94a3b8);color:var(--sc,#94a3b8)}
.status-btn--active{border-color:var(--sc,#94a3b8);color:var(--sc,#94a3b8);background:rgba(0,0,0,.03);font-weight:700}

/* Fiche client */
/* ── Client section toggle ── */
.props__client-toggle{
  display:flex;align-items:center;gap:6px;width:100%;
  background:none;border:none;padding:0 0 7px;cursor:pointer;
  font-family:var(--font);text-align:left;
}
.props__client-toggle__title{
  font-size:.63rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  color:var(--gray-400);flex-shrink:0
}
.props__client-toggle__summary{
  flex:1;min-width:0;
  font-size:.65rem;color:var(--gray-400);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-style:italic;
}
.props__client-toggle__chevron{
  flex-shrink:0;color:var(--gray-400);
  transition:transform .2s ease;
}
.props__client-toggle--open .props__client-toggle__chevron{
  transform:rotate(180deg)
}
.props__client-toggle:hover .props__client-toggle__title,
.props__client-toggle:hover .props__client-toggle__chevron{ color:var(--primary) }

.client-form{display:flex;flex-direction:column;gap:5px}
.client-form__row{display:flex;flex-direction:column;gap:2px}
.client-form__label{font-size:.62rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--gray-400)}
.client-form__input{
  width:100%;padding:5px 8px;border:1.5px solid var(--gray-200);border-radius:var(--radius-xs);
  background:var(--white);color:var(--gray-800);font-family:var(--font);font-size:.78rem;
  outline:none;transition:border-color .15s;box-sizing:border-box
}
.client-form__input:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ultra-light)}
.client-form__input::placeholder{color:var(--gray-300)}
.client-form__textarea{resize:vertical;min-height:62px;font-family:var(--font);line-height:1.45}

/* Empty state */
.empty{text-align:center;padding:24px 16px;color:var(--gray-400)}
.empty svg{width:40px;height:40px;margin-bottom:8px;opacity:.3}
.empty__text{font-size:.82rem;line-height:1.5}

/* Brand cards */
.sidebar__brands{
  margin-top:auto;padding:10px;border-top:1px solid var(--gray-200);
  display:flex;flex-direction:column;gap:6px;background:var(--gray-50)
}
.brand-card{
  display:flex;align-items:center;gap:10px;padding:10px 14px;
  border-radius:var(--radius-sm);text-decoration:none;transition:all .2s;
  border:1px solid transparent
}
.brand-card:hover{transform:translateX(3px)}
.brand-card__logo{font-weight:800;font-size:.82rem;letter-spacing:-.02em;white-space:nowrap}
.brand-card__tagline{font-size:.68rem;color:var(--gray-400);white-space:nowrap;margin-left:auto}
.brand-card--monstand{background:rgba(15,23,42,.03)}
.brand-card--monstand .brand-card__logo{color:#0f172a}
.brand-card--monstand .brand-card__logo span{color:#334155}
.brand-card--monstand:hover{background:rgba(15,23,42,.06);border-color:rgba(15,23,42,.1)}
.brand-card--modulaire{background:rgba(132,204,22,.04)}
.brand-card--modulaire .brand-card__logo{color:var(--gray-900)}
.brand-card--modulaire .brand-card__logo span{color:var(--primary-dark)}
.brand-card--modulaire:hover{background:rgba(132,204,22,.08);border-color:rgba(132,204,22,.2)}
.brand-card--mobilier{background:rgba(59,130,246,.03)}
.brand-card--mobilier .brand-card__logo{color:#1e40af}
.brand-card--mobilier .brand-card__logo span{color:#3b82f6}
.brand-card--mobilier:hover{background:rgba(59,130,246,.06);border-color:rgba(59,130,246,.15)}
.brands-hook{
  display:flex;align-items:center;gap:8px;padding:8px 12px;
  background:linear-gradient(135deg,rgba(132,204,22,.08),rgba(59,130,246,.06));
  border:1px solid rgba(132,204,22,.15);border-radius:var(--radius-sm);
  font-size:.72rem;color:var(--gray-600);line-height:1.4
}
.brands-hook strong{color:var(--primary-dark);font-weight:700}
.brands-hook svg{flex-shrink:0;color:var(--primary-dark)}

/* ═══ CONTEXT MENU ═══ */
.ctx-menu{
  position:fixed;z-index:100;min-width:160px;background:var(--glass-bg-strong);backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-border);border-radius:var(--radius-sm);padding:4px;
  box-shadow:0 12px 40px rgba(0,0,0,.12);display:none
}
.ctx-menu.open{display:block}
.ctx-item{
  display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:var(--radius-xs);
  border:none;background:none;color:var(--gray-600);font-family:var(--font);font-size:.8rem;
  cursor:pointer;transition:all .1s;width:100%;text-align:left
}
.ctx-item:hover{background:var(--primary-ultra-light);color:var(--gray-900)}
.ctx-item--danger:hover{background:rgba(239,68,68,.08);color:var(--error)}
.ctx-item svg{width:14px;height:14px;flex-shrink:0}
.ctx-sep{height:1px;background:var(--gray-200);margin:4px 8px}

/* ═══ TOAST ═══ */
.toast-container{position:fixed;bottom:20px;right:20px;z-index:200;display:flex;flex-direction:column-reverse;gap:8px;align-items:flex-end;pointer-events:none}
.toast{
  padding:10px 20px;background:var(--glass-bg-strong);backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-border);border-radius:var(--radius);font-size:.82rem;
  color:var(--gray-800);box-shadow:0 8px 32px rgba(0,0,0,.1);
  animation:toastSlideIn .3s ease;transition:opacity .3s ease,transform .3s ease;
  pointer-events:auto;max-width:360px
}
.toast--error{border-color:rgba(239,68,68,.3);color:var(--error)}
.toast--out{opacity:0;transform:translateX(20px)}
@keyframes toastSlideIn{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:translateX(0)}}

/* ═══ HOVER LIFT (utility) ═══ */
.hover-lift{transition:transform var(--dur-base,.2s) ease,box-shadow var(--dur-base,.2s) ease}
.hover-lift:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(0,0,0,.1)}

/* ═══ AUTOSAVE INDICATOR ═══ */
.autosave-indicator{display:flex;align-items:center;gap:4px;font-size:.68rem;color:var(--gray-400);opacity:0;transition:opacity .3s}
.autosave-indicator.visible{opacity:1}
.autosave-indicator.saving{color:var(--warning)}
.autosave-indicator.saved{color:var(--success)}

/* ═══ RESPONSIVE ═══ */
@media(max-width:900px){
  .app{grid-template-columns:1fr}
  .sidebar{position:fixed;right:0;top:0;bottom:0;width:300px;z-index:30;transform:translateX(100%);transition:transform .25s;box-shadow:-8px 0 32px rgba(0,0,0,.08)}
  .sidebar.open{transform:translateX(0)}
  .sidebar-toggle{display:flex !important}
  .toolbar__label{display:none}
  .stand-btn{padding:4px 8px;font-size:.72rem;gap:4px;position:relative}
  .stand-btn__icon{width:18px;height:13px}
  .tool-btn{padding:4px 8px;font-size:.72rem;gap:4px;position:relative}
  .tool-btn svg{width:14px;height:14px}
  .tool-btn--sym{padding:3px 6px;font-size:.66rem}
  .toolbar__dim input{width:40px;font-size:.72rem}
  .drag-hint-bubble{display:none}
  /* CSS-only tooltips when labels hidden */
  .stand-btn[title]:hover::after,.tool-btn[title]:hover::after,.tbtn[title]:hover::after{
    content:attr(title);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);
    padding:4px 10px;background:var(--gray-900);color:#fff;font-size:.7rem;font-weight:600;
    border-radius:6px;white-space:nowrap;pointer-events:none;z-index:100
  }
  .tbtn{position:relative}
}
@media(max-width:600px){
  .toolbar__row{gap:4px;padding:5px 8px}
  .toolbar__sep{display:none}
  #symbolsGroup .toolbar__label{display:none}
  .stand-btn span:not(.stand-btn__icon){display:none}
  .tool-btn span:not(svg){font-size:0;width:0;overflow:hidden}
}
.sidebar-toggle{display:none;position:absolute;top:12px;right:12px;z-index:15}

/* ═══ SCROLLBAR ═══ */
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}

/* ═══ KEYBOARD SHORTCUTS ═══ */
.shortcuts{font-size:.68rem;color:var(--gray-400);padding:12px 16px;border-top:1px solid var(--gray-200)}
.shortcuts kbd{
  display:inline-block;padding:1px 5px;background:var(--gray-100);border:1px solid var(--gray-200);
  border-radius:3px;font-family:var(--mono);font-size:.65rem;color:var(--gray-500);margin:0 1px
}

/* ═══ INLINE MODAL ═══ */
.inline-modal{
  position:absolute;z-index:50;display:flex;align-items:center;gap:6px;
  padding:6px 8px;background:var(--glass-bg-strong);backdrop-filter:var(--glass-blur);
  border:1.5px solid var(--primary);border-radius:var(--radius-sm);
  box-shadow:0 8px 32px rgba(0,0,0,.12),0 0 0 3px rgba(132,204,22,.15);
  animation:modalIn .15s ease
}
@keyframes modalIn{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.inline-modal__input{
  width:180px;padding:5px 8px;background:var(--white);border:1.5px solid var(--gray-200);
  border-radius:var(--radius-xs);color:var(--gray-800);font-family:var(--font);font-size:.82rem;
  font-weight:600;outline:none
}
.inline-modal__input:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ultra-light)}
.inline-modal__ok{
  padding:5px 12px;background:var(--primary);color:#fff;border:none;border-radius:var(--radius-xs);
  font-family:var(--font);font-size:.78rem;font-weight:600;cursor:pointer;transition:background .15s
}
.inline-modal__ok:hover{background:var(--primary-dark)}
.inline-modal__cancel{
  padding:5px 8px;background:transparent;color:var(--gray-400);border:1px solid var(--gray-200);
  border-radius:var(--radius-xs);font-family:var(--font);font-size:.78rem;cursor:pointer;transition:all .15s
}
.inline-modal__cancel:hover{border-color:var(--gray-300);color:var(--gray-600)}

/* ═══ DRAG HINT BUBBLE ═══ */
.drag-hint-bubble{
  position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);
  display:flex;align-items:center;gap:6px;padding:7px 14px;
  background:var(--primary);color:#fff;font-size:.75rem;font-weight:600;
  border-radius:var(--radius);white-space:nowrap;z-index:40;
  box-shadow:0 4px 16px rgba(132,204,22,.3);
  animation:dragHintBounce 2s ease-in-out infinite;
  pointer-events:none;transition:opacity .4s,visibility .4s
}
.drag-hint-bubble::before{
  content:'';position:absolute;top:-5px;left:50%;transform:translateX(-50%);
  border:6px solid transparent;border-bottom-color:var(--primary)
}
.drag-hint-bubble svg{width:14px;height:14px;flex-shrink:0}
.drag-hint-bubble.hidden{opacity:0;visibility:hidden}
@keyframes dragHintBounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(4px)}}

/* ═══ WELCOME OVERLAY ═══ */
.welcome-overlay{
  position:absolute;inset:0;z-index:25;display:flex;align-items:center;justify-content:center;
  background:rgba(248,250,246,.75);backdrop-filter:blur(10px);
  animation:welcomeFadeIn .4s ease;transition:opacity .5s,visibility .5s;cursor:pointer
}
.welcome-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}
.welcome-card{
  background:var(--glass-bg-strong);border:1px solid var(--glass-border);
  border-radius:var(--radius-xl);padding:32px 40px;max-width:420px;text-align:center;
  box-shadow:0 20px 60px rgba(0,0,0,.08);animation:welcomeSlideUp .5s ease .1s both
}
.welcome-card__icon{
  width:56px;height:56px;margin:0 auto 16px;background:rgba(132,204,22,.12);
  border-radius:50%;display:flex;align-items:center;justify-content:center
}
.welcome-card__icon svg{width:28px;height:28px;color:var(--primary-dark)}
.welcome-card__title{font-size:1.1rem;font-weight:700;color:var(--gray-900);margin-bottom:6px}
.welcome-card__subtitle{font-size:.82rem;color:var(--gray-500);margin-bottom:16px}
.welcome-card__steps{display:flex;flex-direction:column;gap:8px;text-align:left}
.welcome-card__step{
  display:flex;align-items:center;gap:10px;padding:8px 12px;
  background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-sm);
  font-size:.8rem;color:var(--gray-600)
}
.welcome-card__step-num{
  width:24px;height:24px;display:flex;align-items:center;justify-content:center;
  background:var(--primary);color:#fff;border-radius:50%;font-size:.7rem;font-weight:700;flex-shrink:0
}
.welcome-card__dismiss{
  display:inline-block;margin-top:16px;padding:8px 24px;background:var(--primary);color:#fff;
  border:none;border-radius:var(--radius-sm);font-family:var(--font);font-size:.82rem;font-weight:600;
  cursor:pointer;transition:background .15s
}
.welcome-card__dismiss:hover{background:var(--primary-dark)}
@keyframes welcomeFadeIn{from{opacity:0}to{opacity:1}}
@keyframes welcomeSlideUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}

/* ═══ CANVAS HINT (when empty) ═══ */
.canvas-hint{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  display:flex;align-items:center;gap:10px;padding:12px 20px;
  background:var(--glass-bg-strong);border:1px solid var(--glass-border);
  border-radius:var(--radius);box-shadow:var(--glass-shadow);
  font-size:.85rem;color:var(--gray-500);pointer-events:none;
  animation:hintPulse 2.5s ease-in-out infinite;z-index:5;white-space:nowrap
}
.canvas-hint svg{width:20px;height:20px;color:var(--primary-dark);flex-shrink:0;animation:hintBounce 1.5s ease-in-out infinite}
.canvas-hint.hidden{display:none}
@keyframes hintPulse{0%,100%{opacity:.6;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.03)}}
@keyframes hintBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}

/* ═══ SAVE / LEAD CAPTURE MODAL ═══ */
.save-overlay{
  position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;
  background:rgba(10,10,11,.45);backdrop-filter:blur(8px);
  animation:saveOverlayIn .3s ease;transition:opacity .3s,visibility .3s
}
.save-overlay.hidden{opacity:0;visibility:hidden;pointer-events:none}
@keyframes saveOverlayIn{from{opacity:0}to{opacity:1}}

.save-card{
  background:#fff;border-radius:20px;padding:0;max-width:440px;width:calc(100% - 32px);
  box-shadow:0 25px 80px rgba(0,0,0,.18),0 0 0 1px rgba(132,204,22,.1);
  animation:saveCardIn .4s ease .05s both;overflow:hidden
}
@keyframes saveCardIn{from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}

.save-card__header{
  background:linear-gradient(135deg,#65a30d 0%,#84cc16 100%);
  padding:28px 32px 22px;color:#fff;position:relative;overflow:hidden
}
.save-card__header::before{
  content:'';position:absolute;top:-30px;right:-30px;width:120px;height:120px;
  background:rgba(255,255,255,.1);border-radius:50%
}
.save-card__header::after{
  content:'';position:absolute;bottom:-20px;left:-15px;width:80px;height:80px;
  background:rgba(255,255,255,.06);border-radius:50%
}
.save-card__badge{
  display:inline-flex;align-items:center;gap:5px;padding:4px 10px;
  background:rgba(255,255,255,.2);border-radius:20px;font-size:.68rem;font-weight:600;
  letter-spacing:.03em;margin-bottom:12px;backdrop-filter:blur(4px)
}
.save-card__badge svg{width:12px;height:12px}
.save-card__title{font-size:1.2rem;font-weight:800;margin-bottom:4px;position:relative}
.save-card__subtitle{font-size:.82rem;opacity:.85;line-height:1.4;position:relative}

.save-card__body{padding:24px 32px 28px}

.save-card__perks{
  display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:20px
}
.save-perk{
  display:flex;align-items:center;gap:8px;padding:8px 10px;
  background:var(--gray-50);border-radius:var(--radius-sm);font-size:.75rem;color:var(--gray-600)
}
.save-perk svg{width:16px;height:16px;color:var(--primary-dark);flex-shrink:0}

.save-card__form{display:flex;flex-direction:column;gap:10px}
.save-card__field{position:relative}
.save-card__field svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--gray-400);pointer-events:none}
.save-card__input{
  width:100%;padding:11px 12px 11px 38px;background:var(--white);
  border:1.5px solid var(--gray-200);border-radius:var(--radius-sm);
  color:var(--gray-800);font-family:var(--font);font-size:.85rem;outline:none;
  transition:border-color .15s,box-shadow .15s
}
.save-card__input:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-ultra-light)}
.save-card__input::placeholder{color:var(--gray-400)}

.save-card__submit{
  padding:12px;background:linear-gradient(135deg,#65a30d,#84cc16);color:#fff;
  border:none;border-radius:var(--radius-sm);font-family:var(--font);font-size:.9rem;
  font-weight:700;cursor:pointer;transition:all .2s;margin-top:4px;
  display:flex;align-items:center;justify-content:center;gap:8px;
  box-shadow:0 4px 16px rgba(132,204,22,.3)
}
.save-card__submit:hover{transform:translateY(-1px);box-shadow:0 6px 24px rgba(132,204,22,.4)}
.save-card__submit svg{width:18px;height:18px}

.save-card__skip{
  display:block;margin:12px auto 0;padding:6px 12px;
  background:none;border:none;color:var(--gray-400);font-family:var(--font);
  font-size:.75rem;cursor:pointer;transition:color .15s
}
.save-card__skip:hover{color:var(--gray-600)}

.save-card__legal{font-size:.65rem;color:var(--gray-400);text-align:center;margin-top:8px;line-height:1.4}

/* ═══ PERSISTENT SAVE BAR ═══ */
.save-bar{
  position:fixed;bottom:0;left:0;right:0;z-index:200;
  display:flex;align-items:center;justify-content:center;gap:12px;
  padding:10px 20px;
  background:linear-gradient(135deg,rgba(101,163,13,.95),rgba(132,204,22,.95));
  backdrop-filter:blur(8px);color:#fff;font-size:.82rem;font-weight:500;
  box-shadow:0 -4px 20px rgba(0,0,0,.1);
  animation:saveBarIn .4s ease;transition:transform .3s,opacity .3s
}
.save-bar.hidden{transform:translateY(100%);opacity:0;pointer-events:none}
@keyframes saveBarIn{from{transform:translateY(100%)}to{transform:translateY(0)}}
.save-bar svg{width:16px;height:16px;flex-shrink:0}
.save-bar__btn{
  padding:6px 16px;background:#fff;color:var(--primary-dark);border:none;
  border-radius:var(--radius-sm);font-family:var(--font);font-size:.78rem;font-weight:700;
  cursor:pointer;transition:all .15s;white-space:nowrap
}
.save-bar__btn:hover{background:rgba(255,255,255,.9);transform:scale(1.03)}
.save-bar__close{
  background:none;border:none;color:rgba(255,255,255,.7);cursor:pointer;padding:4px;
  display:flex;align-items:center;transition:color .15s
}
.save-bar__close:hover{color:#fff}
.save-bar__close svg{width:14px;height:14px}

/* ═══ PDF OPTIONS MODAL ═══ */
.pdf-opts-ov{
  position:fixed;inset:0;z-index:9000;
  background:rgba(15,23,42,.55);backdrop-filter:blur(4px);
  display:flex;align-items:center;justify-content:center;
  animation:pdfOvIn .18s ease;
}
.pdf-opts-ov--out{animation:pdfOvOut .2s ease forwards}
@keyframes pdfOvIn  {from{opacity:0}to{opacity:1}}
@keyframes pdfOvOut {from{opacity:1}to{opacity:0}}

.pdf-opts-dlg{
  background:#fff;border-radius:14px;width:420px;max-width:calc(100vw - 32px);
  box-shadow:0 24px 64px rgba(0,0,0,.22),0 4px 16px rgba(0,0,0,.1);
  overflow:hidden;
  animation:pdfDlgIn .22s cubic-bezier(.34,1.3,.64,1);
}
.pdf-opts-ov--out .pdf-opts-dlg{animation:pdfDlgOut .2s ease forwards}
@keyframes pdfDlgIn  {from{opacity:0;transform:scale(.94) translateY(8px)}to{opacity:1;transform:none}}
@keyframes pdfDlgOut {from{opacity:1;transform:none}to{opacity:0;transform:scale(.94) translateY(8px)}}

.pdf-opts-dlg__hdr{
  display:flex;align-items:center;gap:9px;
  padding:16px 18px 14px;
  background:linear-gradient(135deg,rgba(101,163,13,.07),rgba(132,204,22,.04));
  border-bottom:1px solid rgba(132,204,22,.2);
  font-weight:700;font-size:.92rem;color:var(--primary-dark,#14532d)
}
.pdf-opts-dlg__hdr svg{color:var(--primary,#65a30d);flex-shrink:0}

.pdf-opts-dlg__body{padding:14px 18px;display:flex;flex-direction:column;gap:14px}

.pdf-opts-intro{
  margin:0;font-size:.78rem;color:var(--gray-500,#6b7280);line-height:1.4
}

.pdf-opts-section{display:flex;flex-direction:column;gap:4px}
.pdf-opts-stitle{
  font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  color:var(--gray-400,#9ca3af);padding-bottom:4px;
  border-bottom:1px solid rgba(0,0,0,.05);margin-bottom:2px
}

.pdf-opts-row{
  display:flex;align-items:center;gap:10px;
  padding:7px 10px;border-radius:8px;cursor:pointer;
  transition:background .12s;
}
.pdf-opts-row:hover{background:rgba(101,163,13,.06)}
.pdf-opts-row input[type=checkbox]{
  width:16px;height:16px;flex-shrink:0;accent-color:var(--primary,#65a30d);cursor:pointer
}
.pdf-opts-row > div{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}
.pdf-opts-row strong{font-size:.82rem;color:#1e293b;font-weight:600}
.pdf-opts-row span{font-size:.72rem;color:var(--gray-500,#6b7280)}

.pdf-opts-row--priv{
  background:rgba(239,68,68,.04);border:1px solid rgba(239,68,68,.15);border-radius:8px
}
.pdf-opts-row--priv:hover{background:rgba(239,68,68,.07)}

.pdf-opts-badge{
  flex-shrink:0;font-size:.62rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.05em;padding:2px 7px;border-radius:20px;
  background:rgba(239,68,68,.1);color:#dc2626;border:1px solid rgba(239,68,68,.25)
}

.pdf-opts-dlg__ftr{
  display:flex;align-items:center;justify-content:flex-end;gap:10px;
  padding:12px 18px;
  background:#fafafa;border-top:1px solid rgba(0,0,0,.06)
}
.pdf-opts-btn--cancel{
  padding:8px 16px;background:none;border:1.5px solid #e2e8f0;
  border-radius:8px;font-family:var(--font);font-size:.82rem;font-weight:600;
  color:var(--gray-500,#6b7280);cursor:pointer;transition:all .12s
}
.pdf-opts-btn--cancel:hover{border-color:#94a3b8;color:#374151}
.pdf-opts-btn--confirm{
  display:flex;align-items:center;gap:6px;
  padding:8px 18px;background:var(--primary,#65a30d);color:#fff;
  border:none;border-radius:8px;font-family:var(--font);font-size:.82rem;font-weight:700;
  cursor:pointer;transition:all .15s;box-shadow:0 2px 8px rgba(101,163,13,.3)
}
.pdf-opts-btn--confirm:hover{background:#4d7c0a;box-shadow:0 4px 14px rgba(101,163,13,.4)}
.pdf-opts-btn--confirm:focus-visible{outline:2px solid var(--primary,#65a30d);outline-offset:2px}

/* ═══ UPGRADE MODAL ═══ */
.upgrade-overlay{position:fixed;inset:0;z-index:9500;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.upgrade-overlay.hidden{display:none}
.upgrade-dialog{background:#fff;border-radius:16px;width:min(420px,92vw);box-shadow:0 20px 60px rgba(0,0,0,.2);overflow:hidden;animation:pdfDlgIn .2s ease-out}
.upgrade-hdr{display:flex;align-items:center;gap:8px;padding:16px 20px;background:linear-gradient(135deg,#1a3d2b,#2D6A4F);color:#fff;font-weight:700;font-size:.95rem}
.upgrade-hdr svg{color:#84cc16}
.upgrade-close{margin-left:auto;background:none;border:none;color:rgba(255,255,255,.7);font-size:1.4rem;cursor:pointer;line-height:1}
.upgrade-close:hover{color:#fff}
.upgrade-body{padding:24px 20px}
.upgrade-msg{font-size:.9rem;color:#374151;line-height:1.5;margin:0 0 16px}
.upgrade-suggestion{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:10px;padding:14px;margin-bottom:20px}
.upgrade-suggestion p{margin:0;font-size:.85rem;color:#166534}
.upgrade-actions{display:flex;flex-direction:column;gap:8px}
.upgrade-btn{display:block;width:100%;padding:12px;border-radius:10px;font-family:var(--font);font-size:.88rem;font-weight:600;text-align:center;text-decoration:none;cursor:pointer;border:none;transition:all .15s}
.upgrade-btn--primary{background:#84cc16;color:#fff;box-shadow:0 2px 8px rgba(132,204,22,.3)}
.upgrade-btn--primary:hover{background:#65a30d}
.upgrade-btn--secondary{background:#f0f9ff;color:#0369a1;border:1px solid #bae6fd}
.upgrade-btn--secondary:hover{background:#e0f2fe}
.upgrade-btn--ghost{background:none;color:#6b7280;font-weight:500}
.upgrade-btn--ghost:hover{color:#374151}

/* ═══ TIER BADGES (auth bar) ═══ */
.auth-bar__tier{display:inline-flex;padding:2px 7px;border-radius:4px;font-size:.65rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.auth-bar__tier--starter{background:#f1f5f9;color:#64748b}
.auth-bar__tier--pro{background:#ecfccb;color:#3f6212}
.auth-bar__tier--business{background:#dbeafe;color:#1e40af}
.auth-bar__tier--enterprise{background:#fef3c7;color:#92400e}
.auth-bar__btn--upgrade{color:#84cc16!important;font-weight:600!important}

/* ═══ PLAN LOCKED ═══ */
body.plan-locked .stand-btn,
body.plan-locked .tool-btn,
body.plan-locked .tool-btn--sym{opacity:.4;pointer-events:none}
body.plan-locked .toolbar__dim input{opacity:.5;pointer-events:none}

/* ═══ LANG SWITCH ═══ */
.lang-switch{display:flex;gap:2px;margin-left:8px}
.lang-switch__btn{font-size:.68rem;font-weight:700;padding:3px 6px;border-radius:4px;
  color:var(--gray-400);text-decoration:none;transition:all .15s}
.lang-switch__btn:hover{color:var(--gray-600)}
.lang-switch__btn.active{color:#fff;background:var(--primary);pointer-events:none}

/* ═══ SIDEBAR GROUPS ═══ */
.elem-group{border-bottom:1px solid var(--gray-100)}
.elem-group__toggle{width:100%;display:flex;align-items:center;gap:6px;padding:7px 8px;
  font-weight:700;font-size:.72rem;color:var(--gray-500);background:var(--gray-50);
  border:none;cursor:pointer;text-transform:uppercase;letter-spacing:.04em}
.elem-group__toggle:hover{background:var(--gray-100)}
.elem-group__toggle__chevron{transition:transform .2s;flex-shrink:0}
.elem-group__toggle--open .elem-group__toggle__chevron{transform:rotate(180deg)}
.elem-group__body{overflow:hidden}
.elem-group__body--collapsed{display:none}

/* ═══ PROPS SUB-TOGGLES ═══ */
.props__sub-toggle{width:100%;display:flex;align-items:center;gap:4px;padding:6px 0;
  font-weight:600;font-size:.76rem;color:var(--gray-600);border:none;background:none;
  cursor:pointer;border-top:1px solid var(--gray-100)}
.props__sub-toggle:hover{color:var(--gray-800)}
.props__sub-toggle__chevron{transition:transform .2s;flex-shrink:0}
.props__sub-toggle--open .props__sub-toggle__chevron{transform:rotate(180deg)}
.props__sub-body{overflow:hidden}
.props__sub-body--collapsed{display:none}

/* ═══ SHARE MODAL ═══ */
.share-overlay{position:fixed;inset:0;z-index:9600;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px);animation:fadeIn .15s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.share-modal{background:var(--white);border-radius:var(--radius);box-shadow:0 24px 64px rgba(0,0,0,.18);width:420px;max-width:calc(100vw - 32px);max-height:calc(100vh - 64px);overflow-y:auto;animation:modalIn .15s ease}
.share-modal__header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;border-bottom:1px solid var(--gray-100)}
.share-modal__header h3{font-size:.9rem;font-weight:700;color:var(--gray-800);margin:0}
.share-modal__close{width:28px;height:28px;border:none;background:var(--gray-100);border-radius:6px;font-size:1.1rem;color:var(--gray-500);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s}
.share-modal__close:hover{background:var(--gray-200);color:var(--gray-700)}
.share-modal__body{padding:16px 20px 20px;display:flex;flex-direction:column;gap:16px}
.share-modal__section{display:flex;flex-direction:column;gap:6px}
.share-modal__label{font-size:.72rem;font-weight:600;color:var(--gray-500);text-transform:uppercase;letter-spacing:.3px}
.share-modal__input{flex:1;padding:7px 10px;border:1.5px solid var(--gray-200);border-radius:var(--radius-xs);font-family:var(--mono);font-size:.75rem;color:var(--gray-700);outline:none;background:var(--gray-50);transition:border-color .15s}
.share-modal__input:focus{border-color:var(--primary);background:var(--white)}
.share-modal__input[readonly]{background:var(--gray-100);color:var(--gray-600);cursor:default}
.share-link-field{display:flex;gap:6px}
.share-modal__btn{padding:7px 14px;border:none;border-radius:var(--radius-xs);font-family:var(--font);font-size:.75rem;font-weight:600;cursor:pointer;transition:all .15s;white-space:nowrap}
.share-modal__btn--copy{background:var(--primary);color:#fff}
.share-modal__btn--copy:hover{background:var(--primary-dark)}
.share-modal__btn--send{background:#2D6A4F;color:#fff}
.share-modal__btn--send:hover{background:#1a3d2b}
.share-modal__btn:disabled{opacity:.5;cursor:not-allowed}
.share-list{display:flex;flex-direction:column;gap:2px;max-height:160px;overflow-y:auto}
.share-list__empty{font-size:.78rem;color:var(--gray-400);padding:8px 0;text-align:center}
.share-list__item{display:flex;align-items:center;justify-content:space-between;padding:7px 8px;border-radius:var(--radius-xs);background:var(--gray-50);border:1px solid var(--gray-100)}
.share-list__info{display:flex;flex-direction:column;gap:1px;min-width:0}
.share-list__label{font-size:.78rem;font-weight:500;color:var(--gray-700);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.share-list__link-label{font-size:.72rem;color:var(--info);font-weight:600}
.share-list__date{font-size:.68rem;color:var(--gray-400)}
.share-list__revoke{width:24px;height:24px;border:none;background:transparent;color:var(--gray-400);font-size:1rem;cursor:pointer;border-radius:4px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s}
.share-list__revoke:hover{background:rgba(239,68,68,.1);color:var(--error)}

/* Share badge in auth bar (guest mode) */
.auth-bar__share-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:6px;font-size:.72rem;font-weight:600;color:var(--info);background:rgba(59,130,246,.08);white-space:nowrap}
.auth-bar__btn--share{background:rgba(59,130,246,.08);color:var(--info);border-color:rgba(59,130,246,.2)}
.auth-bar__btn--share:hover{background:rgba(59,130,246,.15);border-color:var(--info)}

/* ═══ AI GENERATE MODAL ═══ */
.tbtn--ai{background:var(--primary)!important;color:#fff!important;font-size:.7rem;font-weight:800;letter-spacing:.04em;border-radius:var(--radius-xs);padding:0 10px!important;min-width:auto}
.tbtn--ai:hover{background:var(--primary-dark)!important}

.ai-gen__info{font-size:.78rem;color:var(--gray-500);line-height:1.5;padding:8px 12px;background:var(--gray-50);border-radius:var(--radius-xs);border-left:3px solid var(--primary)}
.ai-gen__textarea{resize:vertical;min-height:100px;font-family:var(--font);font-size:.8rem;line-height:1.5}
.ai-gen__textarea--code{font-family:var(--mono);font-size:.72rem;line-height:1.4;min-height:180px}
.ai-gen__prompt-output{max-height:240px;overflow-y:auto;padding:12px;background:var(--gray-800);color:#e2e8f0;border-radius:var(--radius-xs);font-family:var(--mono);font-size:.68rem;line-height:1.5;white-space:pre-wrap;word-break:break-word;margin:0}
.ai-gen__error{font-size:.78rem;color:var(--error);padding:8px 12px;background:rgba(239,68,68,.06);border:1px solid rgba(239,68,68,.15);border-radius:var(--radius-xs)}
/* AI modal step visibility (scoped — no global .hidden to avoid breaking transitions) */
#aiStep1.hidden,#aiStep1b.hidden,#aiStep2.hidden,#aiJsonError.hidden{display:none}

/* ═══ REDUCED MOTION ═══ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important}
}