/* Jupá · Barra del panel: la misma en Inicio, Invitación, Invitados, Mesas y Cronograma (src/shell/shell.html).
   Autónoma: trae sus colores y letras para verse igual en cualquier página del panel. */
@font-face{font-family:'Figtree';src:url('/fonts/Figtree-var.woff2') format('woff2');font-weight:300 900;font-display:swap}
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.28s}
.jtop,.tabbar{--j-ink:#231a2e;--j-mute:#686270;--j-line:#ece5f1;--j-soft:#f3ecfa;--j-lilac:#d9c8ec;font-family:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif}
.jtop{position:sticky;top:0;z-index:50;height:var(--jtop);background:rgba(250,248,252,.86);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);border-bottom:1px solid var(--j-line);view-transition-name:jtop}
:root{--jtop:64px;--jbot:0px}
.jtop-in{height:100%;display:flex;align-items:center;gap:18px;padding:0 max(20px,env(safe-area-inset-left)) 0 max(20px,env(safe-area-inset-left));max-width:1680px;margin:0 auto}
.jlogo{display:block;flex:none}.jlogo img{display:block;width:112px;height:auto}
.jtop .dnav{display:flex;gap:2px;padding:4px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--j-line)}
.jtop .dn-l{position:relative;padding:8px 15px;border-radius:999px;font-weight:500;font-size:14px;line-height:1;font-family:inherit;color:var(--j-mute);text-decoration:none;white-space:nowrap;transition:background .25s,color .25s}
.jtop .dn-l:hover{color:var(--j-ink)}
.jtop .dn-l.on{background:var(--j-ink);color:#fff}
.jtop .dn-l.busy::after{content:"";position:absolute;right:5px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:currentColor;animation:jpulse .8s infinite alternate}
@keyframes jpulse{to{opacity:.2}}
.jright{margin-left:auto;display:flex;align-items:center;gap:10px}
/* Compu chica (900-1239): las 9 secciones + avisos, ayuda y cuenta no entraban y la cuenta quedaba fuera de la pantalla */
.jtop .dnav{min-width:0;overflow-x:auto;scrollbar-width:none}.jtop .dnav::-webkit-scrollbar{display:none}.jright{flex:none}
@media (min-width:900px) and (max-width:1239px){.jtop-in{gap:10px}.jtop .dn-l{padding:8px 9px;font-size:13px}.jright{gap:6px}}
@media (min-width:900px) and (max-width:1099px){.jtop-in{gap:8px}.jtop .dn-l{padding:8px 7px}.jlogo{width:23px;height:28px;overflow:hidden;border-radius:6px;flex:none}.jlogo img{width:118px;max-width:none;height:28px}}
.jsite{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 15px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--j-line);color:var(--j-ink);font-weight:500;font-size:14px;font-family:inherit;text-decoration:none;white-space:nowrap;transition:background .2s}
.jsite:hover{background:var(--j-soft)}.jsite svg{opacity:.6}
.jtop .me{position:relative}
.jtop .avatar{width:40px;height:40px;border-radius:50%;border:1px solid var(--j-line);background:linear-gradient(135deg,var(--j-lilac),#b99be0);color:var(--j-ink);font-weight:600;font-size:16px;line-height:1;font-family:inherit;display:grid;place-items:center;cursor:pointer;padding:0;transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.jtop .avatar:hover{transform:scale(1.06)}
.jtop .menu{position:absolute;right:0;top:50px;min-width:250px;background:#fff;border-radius:16px;padding:8px;box-shadow:0 0 0 1px var(--j-line),0 30px 60px -20px rgba(13,8,20,.45);transform-origin:top right;animation:jpop .3s cubic-bezier(.16,1,.3,1) both;color:var(--j-ink);z-index:5}
@keyframes jpop{from{opacity:0;transform:scale(.94) translateY(-6px)}}
.jtop .menu[hidden]{display:none}
/* Secciones que la persona no puede usar (equipo del organizador con permisos a elección, 052) */
.dn-l[hidden],.tb-l[hidden],.tb-mi[hidden]{display:none!important}
button.tb-mi{width:100%;border:0;background:none;font:inherit;text-align:left;cursor:pointer}
.jtop .menu .who{padding:10px 12px 12px;border-bottom:1px solid var(--j-soft);margin-bottom:6px;font-size:13px;color:var(--j-mute);word-break:break-all}
.jtop .menu .who strong{display:block;color:var(--j-ink);font-size:15px}
.jtop .menu a,.jtop .menu button{display:flex;width:100%;text-align:left;padding:10px 12px;border:0;background:none;border-radius:10px;font-size:14px;font-family:inherit;color:var(--j-ink);cursor:pointer;text-decoration:none;box-sizing:border-box}
.jtop .menu a:hover,.jtop .menu button:hover{background:var(--j-soft)}
.jtop a:focus-visible,.jtop button:focus-visible,.tabbar a:focus-visible{outline:2px solid #715492;outline-offset:2px}
.tabbar,.jsec,.tb-sheet{display:none}
/* ——— Celular: el panel como una app (encabezado compacto + pestañas abajo + hojas desde abajo) ——— */
@media (max-width:899px),(orientation:landscape) and (max-height:540px) and (max-width:1023px){
  body{margin:0}
  :root{--jtop:calc(54px + env(safe-area-inset-top));--jbot:calc(60px + env(safe-area-inset-bottom));-webkit-tap-highlight-color:transparent}
  .jtop{padding-top:env(safe-area-inset-top);box-sizing:border-box;background:rgba(251,250,252,.9);border-bottom-color:transparent;transition:border-color .25s,box-shadow .25s}
  html.j-scrolled .jtop{border-bottom-color:var(--j-line);box-shadow:0 8px 24px -20px rgba(35,26,46,.5)}
  .jtop .dnav,.jsite{display:none}
  .jtop-in{height:54px;gap:10px;padding:0 max(16px,env(safe-area-inset-right)) 0 max(16px,env(safe-area-inset-left))}
  .jlogo{width:23px;height:28px;overflow:hidden;border-radius:6px}.jlogo img{width:118px;max-width:none;height:28px}
  .jsec{display:block;margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:650 18px/1 'Figtree',system-ui,sans-serif;letter-spacing:-.015em;color:var(--j-ink)}
  .jtop .avatar{width:36px;height:36px;font-size:15px;position:relative}
  .jtop .avatar::after{content:"";position:absolute;inset:-4px;border-radius:50%}
  .jtop .avatar:hover{transform:none}.jtop .avatar:active{transform:scale(.92)}
  /* Pestañas: pegadas abajo, como en una app */
  .tabbar{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);position:fixed;left:0;right:0;bottom:0;z-index:60;height:var(--jbot);box-sizing:border-box;padding:5px max(6px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(6px,env(safe-area-inset-left));background:rgba(251,250,252,.92);backdrop-filter:blur(20px) saturate(1.8);-webkit-backdrop-filter:blur(20px) saturate(1.8);border-top:1px solid var(--j-line);view-transition-name:jtab;touch-action:none;-webkit-user-select:none;user-select:none}
  .tb-l{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:3px;min-width:0;min-height:50px;margin:0;padding:0;border:0;background:none;cursor:pointer;color:#7a7384;text-decoration:none;font:600 10.5px/1.1 'Figtree',system-ui,sans-serif;letter-spacing:0;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
  .tb-l svg{box-sizing:content-box;width:24px;height:24px;padding:4px 16px;border-radius:999px;stroke-width:1.75;transition:background .3s cubic-bezier(.16,1,.3,1),transform .25s cubic-bezier(.3,1.5,.5,1)}
  .tb-l span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tb-l.on{color:#4b3658}
  .tb-l.on svg{background:#e8dcf7;stroke-width:1.9}
  .tb-l.on svg :is(path,rect,circle){fill:rgba(113,84,146,.18)}
  .tb-l:active svg{transform:scale(.9)}
  .tb-l.busy svg{animation:jpulse .8s infinite alternate}
  .tabbar a:focus-visible{outline:none}.tabbar a:focus-visible svg{outline:2px solid #715492;outline-offset:1px}
  .tabbar .tb-l:focus-visible{outline:none}.tabbar .tb-l:focus-visible svg{outline:2px solid #715492;outline-offset:1px}
  /* Arrastre por la barra: sombra lila que sigue al dedo; la pestaña de abajo se resalta y recién al soltar se cambia */
  .tb-pill{position:absolute;left:0;top:0;z-index:0;border-radius:18px;background:rgba(113,84,146,.13);box-shadow:0 8px 22px -10px rgba(113,84,146,.65),inset 0 0 0 1px rgba(113,84,146,.12);opacity:0;pointer-events:none;transition:transform .14s cubic-bezier(.2,.9,.3,1),opacity .18s ease-out}
  .tabbar.dragging .tb-pill{opacity:1}
  .tabbar.dragging.cancel .tb-pill{opacity:0}
  .tabbar.dragging .tb-l svg{transform:none}
  .tabbar.dragging .tb-l.hot{color:#4b3658}
  .tabbar.dragging .tb-l.hot svg{transform:scale(1.08)}
  .tb-more.on svg{background:#e8dcf7}
  /* "Más": hoja desde abajo con Cronograma, Fotos y la cuenta */
  .tb-sheet:not([hidden]){display:block}
  .tb-sheet{position:fixed;inset:0;z-index:130}
  .tb-shade{position:absolute;inset:0;background:rgba(20,12,30,.42);animation:jfade .22s ease-out both;transition:opacity .2s}
  .tb-panel{position:absolute;left:0;right:0;bottom:0;max-height:min(90svh,560px);overflow-y:auto;overscroll-behavior:contain;box-sizing:border-box;padding:28px 12px calc(14px + env(safe-area-inset-bottom));border-radius:24px 24px 0 0;background:#fbfafc;box-shadow:0 -20px 50px -30px rgba(13,8,20,.6);font-family:'Figtree',system-ui,sans-serif;animation:jsheet .32s cubic-bezier(.16,1,.3,1) both;transition:transform .2s ease-out}
  .tb-panel::before{content:"";position:absolute;top:9px;left:50%;width:40px;height:5px;margin-left:-20px;border-radius:3px;background:rgba(41,37,52,.2)}
  .tb-sheet.closing .tb-shade{opacity:0}.tb-sheet.closing .tb-panel{transform:translateY(105%)!important}
  .tb-mi{display:flex;align-items:center;gap:14px;min-height:64px;padding:8px 12px;border-radius:16px;color:#231a2e;text-decoration:none;-webkit-user-select:none;user-select:none;transition:background .15s,transform .15s}
  .tb-mi+.tb-mi{margin-top:4px}
  .tb-mi svg{flex:none;box-sizing:content-box;width:22px;height:22px;padding:11px;border-radius:14px;background:#f3ecfa;color:#4b3658}
  .tb-mi span{display:flex;flex-direction:column;gap:3px;min-width:0}
  .tb-mi b{font:600 16px/1.2 'Figtree',system-ui,sans-serif}
  .tb-mi small{font:400 13.5px/1.3 'Figtree',system-ui,sans-serif;color:#686270}
  .tb-mi:active{background:#f3ecfa;transform:scale(.98)}
  .tb-mi.on{background:#f3ecfa}.tb-mi.on svg{background:#e8dcf7;color:#4b3658}
  .tb-mi[data-k=cuenta]{margin-top:10px;position:relative}
  .tb-mi[data-k=cuenta]::before{content:"";position:absolute;left:12px;right:12px;top:-8px;height:1px;background:#ece5f1}
  .tb-mi:focus-visible{outline:2px solid #715492;outline-offset:-2px}
  /* Menú de la cuenta: hoja desde abajo */
  .jtop:has(.menu:not([hidden])){z-index:140;backdrop-filter:none;-webkit-backdrop-filter:none;view-transition-name:none}
  .jtop .menu{position:fixed;left:8px;right:8px;top:auto;bottom:calc(8px + env(safe-area-inset-bottom));min-width:0;padding:22px 10px 10px;border-radius:24px;box-shadow:0 0 0 100vmax rgba(20,12,30,.42),0 -10px 40px -20px rgba(13,8,20,.5);transform-origin:bottom center;animation:jsheet .4s cubic-bezier(.16,1,.3,1) both}
  .jtop .menu::before{content:"";position:absolute;top:8px;left:50%;width:36px;height:5px;margin-left:-18px;border-radius:3px;background:rgba(35,26,46,.16)}
  .jtop .menu .who{padding:6px 14px 14px;font-size:14px}.jtop .menu .who strong{font-size:17px;margin-bottom:2px}
  .jtop .menu a,.jtop .menu button{min-height:50px;align-items:center;padding:0 14px;font-size:16px;border-radius:14px}
  .jtop .menu a:active,.jtop .menu button:active{background:var(--j-soft)}
  /* Diálogos del panel (cuenta, invitados, formulario…): hoja que sube desde abajo, con la X arriba a mano */
  .drawer{display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;padding:calc(env(safe-area-inset-top) + 18px) 0 0}
  .drawer[hidden]{display:none}
  .drawer .sheet,.drawer .sheet.wide{width:100%;max-width:none;flex:none;margin:0;border-radius:26px 26px 0 0!important;padding-bottom:calc(24px + env(safe-area-inset-bottom))!important;box-shadow:0 -20px 50px -30px rgba(13,8,20,.6);animation:jsheet .45s cubic-bezier(.16,1,.3,1) both}
  .drawer .sheet::before{inset:8px auto auto 50%!important;width:38px;height:5px;margin-left:-19px;border:0!important;border-radius:3px!important;background:rgba(41,37,52,.18)}
  .drawer .close{position:relative;top:auto!important;right:auto!important;flex:none;align-self:flex-end;margin:0 12px 10px;width:40px;height:40px;border:0;background:rgba(255,255,255,.94);box-shadow:0 6px 20px -8px rgba(0,0,0,.5)}
  .drawer .close:hover{transform:none}.drawer .close:active{transform:scale(.92)}
}
@keyframes jsheet{from{transform:translateY(100%)}}
/* ——— Hojas de app (src/sheet.js las marca con .jsheet): alto según el contenido, scroll adentro, manija, X adentro ——— */
@media (max-width:899px),(orientation:landscape) and (max-height:540px) and (max-width:1023px){
  html.j-sheet-open,html.j-sheet-open body{overflow:hidden}
  .drawer.jsheet{position:fixed;inset:0 0 var(--kb,0px) 0;overflow:hidden;padding:0;display:flex;flex-direction:column;justify-content:flex-end}
  .drawer.jsheet>.shade{position:fixed;inset:0;background:rgba(20,12,30,.46);animation:jfade .25s ease-out both;transition:opacity .22s}
  .drawer.jsheet.closing>.shade{opacity:0}
  @keyframes jfade{from{opacity:0}}
  .drawer.jsheet>.sheet,.drawer.jsheet>.sheet.wide{position:relative;box-sizing:border-box;max-height:min(90svh,calc(100dvh - var(--kb,0px) - env(safe-area-inset-top) - 12px));overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;margin:0;padding:30px 20px calc(20px + env(safe-area-inset-bottom))!important;border-radius:24px 24px 0 0!important;background:#fbfafc;text-align:left;animation:jsheet .32s cubic-bezier(.16,1,.3,1) both;scrollbar-width:none}
  .drawer.jsheet>.sheet::-webkit-scrollbar{display:none}
  .drawer.jsheet>.sheet::before{content:"";position:absolute!important;inset:9px auto auto 50%!important;width:40px;height:5px;margin-left:-20px;border:0!important;border-radius:3px!important;background:rgba(41,37,52,.2);z-index:3}
  .drawer.jsheet>.sheet>.mono{display:none}
  .drawer.jsheet>.sheet>.close{position:absolute!important;top:12px!important;right:12px!important;left:auto;margin:0;width:36px;height:36px;border-radius:50%;border:0;background:#ece5f1;box-shadow:none;color:#4b3658;font-size:20px;line-height:1;display:grid;place-items:center;z-index:4;transition:transform .2s}
  .drawer.jsheet>.sheet>.close:active{transform:scale(.9)}
  .drawer.jsheet .sheet h2{margin:0 48px 6px 0;text-align:left;font:650 22px/1.2 'Figtree',system-ui,sans-serif;letter-spacing:-.015em;color:#231a2e}
  .drawer.jsheet .sheet .overline{display:block;text-align:left;margin:0 0 4px}
  .drawer.jsheet .sheet>.lead,.drawer.jsheet .sheet .lead{text-align:left;justify-content:flex-start;font-size:15px;line-height:1.45;margin:0 0 16px}
  /* Botonera fija abajo de la hoja: siempre a la vista, también con el teclado abierto */
  .drawer.jsheet .jbar{position:sticky;bottom:calc(-20px - env(safe-area-inset-bottom));z-index:3;display:flex;gap:10px;margin:8px -20px calc(-20px - env(safe-area-inset-bottom));padding:12px 20px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(rgba(251,250,252,0),#fbfafc 14px);grid-column:1/-1}
  .drawer.jsheet .jbar .btn{flex:1 1 0;min-height:50px;margin:0;border-radius:14px;font-size:16px;width:auto}
  .drawer.jsheet .btn:active{transform:scale(.97)}
}
@media (max-width:899px) and (prefers-reduced-motion:reduce),(orientation:landscape) and (max-height:540px) and (max-width:1023px) and (prefers-reduced-motion:reduce){.drawer.jsheet>.sheet,.drawer.jsheet>.shade{animation:none}}
@media print{.jtop,.tabbar{display:none}}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}.jtop .menu,.drawer .sheet,.tb-panel,.tb-shade{animation:none}.tb-l svg,.tb-pill{transition:none}}
/* Modo oscuro (el editor de la invitación lo permite): la barra acompaña */
:root[data-theme="dark"] .jtop{--j-ink:#ece5f1;--j-mute:#a39cad;--j-line:#292534;--j-soft:#292534;background:rgba(20,18,24,.86)}
:root[data-theme="dark"] .jtop .dnav,:root[data-theme="dark"] .jsite{background:#1c1922}
:root[data-theme="dark"] .jtop .dn-l.on{background:#ece5f1;color:#141218}
:root[data-theme="dark"] .jtop .menu{background:#1c1922}
:root[data-theme="dark"] .jlogo img{content:url(/brand/logo-light.svg)}
/* Selector tipo rueda (src/wheel.js) */
.wh-real{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important}
.wh-btn{min-height:42px;min-width:120px;padding:0 14px;border-radius:12px;border:1px solid var(--line-strong,#d8c4dc);background:var(--paper,#fbfafc);color:var(--ink,#292534);font:500 15px 'Figtree',system-ui,sans-serif;text-align:left;cursor:pointer;text-transform:none;letter-spacing:0;font-variant-numeric:tabular-nums}
.wh-btn.empty{color:#8d8496}.wh-btn:hover{border-color:#715492}.wh-btn[aria-expanded=true]{border-color:#715492;box-shadow:0 0 0 3px rgba(113,84,146,.15)}
.wh-pop{position:fixed;z-index:200;width:min(300px,94vw);padding:10px 10px 12px;border-radius:20px;background:rgba(255,255,255,.96);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 0 0 1px rgba(41,37,52,.08),0 30px 60px -20px rgba(20,12,30,.45);font-family:'Figtree',system-ui,sans-serif;color:#231a2e;animation:whin .28s cubic-bezier(.16,1,.3,1)}
@keyframes whin{from{opacity:0;transform:translateY(-6px) scale(.97)}}
.wh-pop.wh-sheet{left:0;right:0;bottom:0;top:auto!important;width:auto;border-radius:22px 22px 0 0;padding-bottom:calc(14px + env(safe-area-inset-bottom));animation:whup .35s cubic-bezier(.16,1,.3,1)}
@keyframes whup{from{transform:translateY(100%)}}
.wh-cols{position:relative;z-index:1;display:flex;justify-content:center;gap:4px;height:180px;perspective:500px;-webkit-mask:linear-gradient(transparent,#000 30%,#000 70%,transparent);mask:linear-gradient(transparent,#000 30%,#000 70%,transparent)}
.wh-col{flex:1;max-width:90px;height:100%;overflow-y:scroll;scroll-snap-type:y mandatory;scrollbar-width:none;outline:none;overscroll-behavior:contain}
.wh-date .wh-col:nth-child(2){max-width:130px;flex:1.6}
.wh-col::-webkit-scrollbar{display:none}
.wh-pad{height:72px}
.wh-it{height:36px;display:grid;place-items:center;scroll-snap-align:center;font-size:19px;font-variant-numeric:tabular-nums;cursor:pointer;transform-origin:center;transition:color .2s}
.wh-it.on{font-weight:600}
.wh-sep{align-self:center;font-size:20px;font-weight:600}
.wh-band{position:absolute;left:12px;right:12px;top:82px;height:36px;border-radius:10px;background:rgba(113,84,146,.1);pointer-events:none}
.wh-pop.wh-sheet .wh-band{left:14px;right:14px}
.wh-bar{display:flex;justify-content:space-between;gap:8px;margin-top:10px}
.wh-bar button{flex:1;min-height:42px;border-radius:12px;border:0;background:#f3ecfa;color:#4b3658;font:600 14.5px 'Figtree',system-ui,sans-serif;cursor:pointer}
.wh-bar .wh-ok{background:#292534;color:#fff}
.wh-col:focus-visible{background:rgba(113,84,146,.06);border-radius:10px}
/* Los diálogos (cuenta, invitados, formulario…) quedan por encima de la barra del panel */
.drawer{z-index:120}
/* Mesas (celular): el salón ya suma los bordes seguros del teléfono y la barra también; así no se cuentan dos veces */
@media (max-width:899px),(orientation:landscape) and (max-height:540px) and (max-width:1023px){body:has(> canvas#gl){--jt:var(--jtop,0px);--jb:var(--jbot,0px)}}
.jtop .avatar.has-pic,.me-pic.has-pic,#meAv.has-pic{background-size:cover;background-position:center;color:transparent}
/* Casillas y opciones con la estética de la marca (en vez de las celestes del navegador) */
input[type=checkbox]:not(:where([role=switch])),input[type=radio]{-webkit-appearance:none;appearance:none;flex:none;width:22px;height:22px;margin:0;display:inline-grid;place-items:center;border:1.5px solid #cbbfd8;background:#fff;cursor:pointer;vertical-align:middle;transition:background .2s,border-color .2s,box-shadow .2s,transform .25s cubic-bezier(.3,1.6,.5,1)}
input[type=checkbox]:not(:where([role=switch])){border-radius:7px}input[type=radio]{border-radius:50%}
input[type=checkbox]:not(:where([role=switch]))::after{content:"";width:11px;height:6px;border:2.2px solid #fff;border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg) scale(0);transition:transform .25s cubic-bezier(.3,1.6,.5,1)}
input[type=radio]::after{content:"";width:10px;height:10px;border-radius:50%;background:#fff;transform:scale(0);transition:transform .25s cubic-bezier(.3,1.6,.5,1)}
input[type=checkbox]:not(:where([role=switch])):checked,input[type=radio]:checked{background:#715492;border-color:#715492}
input[type=checkbox]:not(:where([role=switch])):checked::after{transform:translateY(-1px) rotate(-45deg) scale(1)}input[type=radio]:checked::after{transform:scale(1)}
input[type=checkbox]:not(:where([role=switch])):hover,input[type=radio]:hover{border-color:#715492}
input[type=checkbox]:not(:where([role=switch])):active,input[type=radio]:active{transform:scale(.9)}
input[type=checkbox]:not(:where([role=switch])):focus-visible,input[type=radio]:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(113,84,146,.25)}
input[type=checkbox]:not(:where([role=switch])):disabled,input[type=radio]:disabled{opacity:.45;cursor:not-allowed}
.chk input[type=checkbox]:not(:where([role=switch])),label input[type=checkbox]:not(:where([role=switch])){width:22px!important;height:22px!important;min-height:0!important;padding:0!important}
.chk{gap:12px!important;align-items:flex-start!important;line-height:1.45}.chk input{margin-top:1px}
/* ——— Guías (src/guide.js): "?" de cada sección, pasos con foco y bienvenida del primer ingreso ——— */
.jhelp{position:relative;width:40px;height:40px;flex:none;display:grid;place-items:center;padding:0;border-radius:50%;border:1px solid var(--j-line);background:#fff;color:#4b3658;cursor:pointer;font-family:inherit;transition:background .2s,transform .2s}
.jhelp[hidden]{display:none}
.jhelp:hover{background:var(--j-soft)}.jhelp:active{transform:scale(.92)}
.jhelp.new::after{content:"";position:absolute;top:1px;right:1px;width:9px;height:9px;border-radius:50%;background:#715492;box-shadow:0 0 0 2px #fbfafc}
:root[data-theme="dark"] .jhelp{background:#1c1922;color:#ece5f1}
@media (max-width:899px),(orientation:landscape) and (max-height:540px) and (max-width:1023px){.jhelp{width:36px;height:36px;border-color:transparent;background:#f3ecfa}.jhelp::before{content:"";position:absolute;inset:-4px;border-radius:50%}.jhelp:hover{background:#f3ecfa}}
/* Los pasos con foco y la bienvenida están en guide.css */
/* ——— Celular ACOSTADO (poco alto): riel de secciones a la izquierda y paneles laterales a la derecha ———
   --rail-w: ancho del riel (0 sin riel). Las páginas lo usan para correr lo que va pegado a la izquierda (Mesas). */
:root{--rail-w:0px}
@media (orientation:landscape) and (max-height:540px) and (max-width:1023px){
  /* Solo las secciones con pestañas llevan riel (Su plan sigue con su encabezado arriba) */
  :root:has(.tabbar){--rail-w:calc(76px + env(safe-area-inset-left));--jtop:0px;--jbot:0px}
  :root:has(.tabbar) body{padding-left:var(--rail-w);padding-right:env(safe-area-inset-right);box-sizing:border-box}
  /* Riel: las cinco secciones arriba/centro; la ayuda y la cuenta abajo */
  .tabbar{display:flex;flex-direction:column;justify-content:center;gap:2px;top:0;right:auto;bottom:0;width:var(--rail-w);height:auto;padding:max(8px,env(safe-area-inset-top)) 4px 100px env(safe-area-inset-left);border-top:0;border-right:1px solid var(--j-line)}
  .tb-l{flex:none;min-height:46px;justify-content:center;gap:2px;font-size:10.5px}
  .tb-panel{left:calc(var(--rail-w) + 8px);right:auto;bottom:calc(8px + env(safe-area-inset-bottom));width:340px;max-height:calc(100dvh - 16px);padding:12px 10px 10px;border-radius:20px;transform-origin:bottom left;animation:jpop .26s cubic-bezier(.16,1,.3,1) both}
  .tb-panel::before{display:none}
  .tb-sheet.closing .tb-panel{transform:none!important;opacity:0;transition:opacity .18s}
  .tb-l svg{width:22px;height:22px;padding:4px 14px}
  :root:has(.tabbar) .jtop{position:fixed;left:0;top:auto;bottom:0;z-index:61;width:var(--rail-w);height:auto;padding:0 0 max(10px,env(safe-area-inset-bottom)) env(safe-area-inset-left);background:none;border:0;box-shadow:none!important;backdrop-filter:none;-webkit-backdrop-filter:none}
  :root:has(.tabbar) .jtop-in{flex-direction:column;justify-content:flex-end;height:auto;gap:8px;padding:0}
  :root:has(.tabbar) :is(.jlogo,.jsec){display:none}
  :root:has(.tabbar) .jright{margin:0;flex-direction:column;gap:8px}
  :root:has(.tabbar) :is(.jtop .avatar,.jhelp){width:40px;height:40px}
  /* Menú de la cuenta: sale al lado del riel, abajo */
  .jtop .menu{left:auto;right:max(8px,env(safe-area-inset-right));top:58px;bottom:auto;max-height:calc(100dvh - 66px);overflow-y:auto;width:320px;padding:12px 10px 10px;border-radius:20px;transform-origin:top right;animation:jpop .28s cubic-bezier(.16,1,.3,1) both}
  :root:has(.tabbar) .jtop .menu{left:calc(var(--rail-w) + 8px);right:auto;top:auto;bottom:calc(8px + env(safe-area-inset-bottom));width:320px;max-height:calc(100dvh - 16px);overflow-y:auto;padding:12px 10px 10px;border-radius:20px;transform-origin:bottom left;animation:jpop .28s cubic-bezier(.16,1,.3,1) both}
  .jtop .menu::before{display:none}
  .jtop .menu a,.jtop .menu button{min-height:46px}
  /* Hojas: panel lateral derecho de alto completo (el contenido queda a la vista a la izquierda) */
  .drawer.jsheet{flex-direction:row;justify-content:flex-end;align-items:stretch}
  .drawer.jsheet>.sheet,.drawer.jsheet>.sheet.wide{width:clamp(360px,48vw,500px);max-width:calc(100vw - var(--rail-w) - 24px);height:auto;max-height:none;align-self:stretch;margin:0;padding:22px max(20px,env(safe-area-inset-right)) calc(16px + env(safe-area-inset-bottom)) 24px!important;border-radius:24px 0 0 24px!important;box-shadow:-20px 0 50px -30px rgba(13,8,20,.6);animation:jside .3s cubic-bezier(.16,1,.3,1) both}
  .drawer.jsheet>.sheet::before{inset:50% auto auto 8px!important;width:5px;height:40px;margin:-20px 0 0}
  .drawer.jsheet>.sheet>.close{top:10px!important;right:max(10px,env(safe-area-inset-right))!important}
  .drawer.jsheet .sheet h2{font-size:20px}
  .drawer.jsheet .sheet>.lead,.drawer.jsheet .sheet .lead{margin-bottom:12px}
  .drawer.jsheet .jbar{bottom:calc(-16px - env(safe-area-inset-bottom));margin:8px calc(-1 * max(20px,env(safe-area-inset-right))) calc(-16px - env(safe-area-inset-bottom)) -24px;padding:10px max(20px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) 24px}
  .drawer.jsheet .jbar .btn{min-height:46px}
  /* Selector de rueda: un poco más bajo para que entre al costado del botón (src/wheel.js lo ubica) */
  .wh-cols{height:144px}.wh-pad{height:54px}.wh-band{top:64px}
}
/* Acostado y con el teclado abierto (queda muy poco alto): el riel solo con íconos, sin la cuenta */
@media (orientation:landscape) and (max-height:300px) and (max-width:1023px){
  :root:has(.tabbar) .jtop{display:none}
  .tabbar{justify-content:flex-start;padding-bottom:4px;overflow:hidden}
  .tb-l{min-height:36px}.tb-l span{display:none}
}
@keyframes jside{from{transform:translateX(100%)}}
@media (orientation:landscape) and (max-height:540px) and (max-width:1023px) and (prefers-reduced-motion:reduce){.drawer.jsheet>.sheet{animation:none}}

/* Modo organizador en el menú de la cuenta (con cuántos casamientos acompaña) */
.jtop .menu .org-mi{justify-content:space-between;align-items:center;gap:12px}.jtop .menu .org-mi small{color:var(--j-mute);font-size:13px;white-space:nowrap}

/* ——— Avisos (src/notify.js): campanita con contador, puntito en Invitados y la hoja con la lista y los ajustes ——— */
.jbell{position:relative;width:40px;height:40px;flex:none;display:grid;place-items:center;padding:0;border-radius:50%;border:1px solid var(--j-line);background:#fff;color:#4b3658;cursor:pointer;font-family:inherit;transition:background .2s,transform .2s}
.jbell:hover{background:var(--j-soft)}.jbell:active{transform:scale(.92)}
.jbell[aria-expanded=true]{background:var(--j-soft)}
.jbell-n{position:absolute;top:-3px;right:-4px;min-width:18px;height:18px;padding:0 5px;box-sizing:border-box;border-radius:9px;background:#715492;color:#fff;font:700 11px/18px 'Figtree',system-ui,sans-serif;text-align:center;box-shadow:0 0 0 2px #fbfafc;animation:jbadge .35s cubic-bezier(.3,1.6,.5,1) both}
.jbell-n[hidden]{display:none}
@keyframes jbadge{from{transform:scale(.4);opacity:0}}
:root[data-theme="dark"] .jbell{background:#1c1922;color:#ece5f1}
.jtop .dn-l.has-dot::before,.tb-l.has-dot::before{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:#715492;box-shadow:0 0 0 2px #fff;z-index:2}
.jtop .dn-l.has-dot::before{top:5px;right:6px}
.jtop .dn-l.on.has-dot::before{box-shadow:0 0 0 2px var(--j-ink)}
@media (max-width:899px),(orientation:landscape) and (max-height:540px) and (max-width:1023px){
  .jbell{width:36px;height:36px;border-color:transparent;background:#f3ecfa}
  .jbell::before{content:"";position:absolute;inset:-4px;border-radius:50%}
  .jbell:hover{background:#f3ecfa}
  .tb-l.has-dot::before{top:3px;left:calc(50% + 9px);box-shadow:0 0 0 2px #fbfafc}
}
@media (orientation:landscape) and (max-height:540px) and (max-width:1023px){
  .tabbar{padding-bottom:150px}
  :root:has(.tabbar) .jbell{width:40px;height:40px}
}
.nt[hidden]{display:none}
.nt{position:fixed;inset:0;z-index:135;font-family:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;color:#231a2e}
.nt .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.nt-shade{position:absolute;inset:0;background:transparent}
.nt-panel{position:absolute;top:calc(var(--jtop) + 8px);right:max(20px,calc((100vw - 1680px) / 2 + 20px));width:400px;max-height:min(680px,calc(100vh - var(--jtop) - 24px));display:flex;flex-direction:column;background:#fff;border-radius:20px;box-shadow:0 0 0 1px #ece5f1,0 30px 60px -20px rgba(13,8,20,.45);overflow:hidden;transform-origin:top right;animation:jpop .26s cubic-bezier(.16,1,.3,1) both;transition:transform .2s ease-out,opacity .2s}
.nt.closing .nt-panel{opacity:0;transform:scale(.97) translateY(-4px)}
.nt-h{flex:none;display:flex;align-items:center;gap:6px;min-height:58px;padding:8px 10px 6px 18px;box-sizing:border-box;touch-action:none;-webkit-user-select:none;user-select:none}
.nt-h h2{flex:1;min-width:0;margin:0;font:650 20px/1.2 'Figtree',system-ui,sans-serif;letter-spacing:-.015em;outline:none}
.nt-tools{display:flex;align-items:center;gap:4px}
.nt-ib{width:40px;height:40px;flex:none;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:transparent;color:#4b3658;cursor:pointer;transition:background .15s,transform .15s}
.nt-ib[hidden],.nt-txt[hidden]{display:none}
.nt-ib:hover{background:#f3ecfa}.nt-ib:active{transform:scale(.92)}
.nt-back{margin-left:-10px}
.nt-txt{min-height:36px;padding:0 12px;border:0;border-radius:999px;background:#f3ecfa;color:#4b3658;font:600 13.5px/1 'Figtree',system-ui,sans-serif;cursor:pointer;white-space:nowrap}
.nt-txt:active{transform:scale(.97)}
.nt :is(button,a,select,input):focus-visible{outline:2px solid #715492;outline-offset:2px}
.nt-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:0 10px 14px}
.nt-sec{margin:12px 10px 4px;font:600 12px/1.3 'Figtree',system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#8d8496}
.nt-it{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr) 12px;gap:12px;align-items:start;min-height:64px;padding:11px 10px;border-radius:16px;color:inherit;text-decoration:none;-webkit-user-select:none;user-select:none;transition:background .15s,transform .15s}
.nt-it+.nt-it{margin-top:2px}
.nt-it:hover{background:#fbfafc}.nt-it:active{background:#f3ecfa;transform:scale(.985)}
.nt-it.new{background:#f3ecfa}
.nt-ic{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#4b3658;box-shadow:inset 0 0 0 1px #e8dcf7}
.nt-ic:is(.k-rsvp,.k-nudge,.k-mail,.k-drive,.k-plan,.k-promo){box-shadow:none}
.nt-ic.k-rsvp{background:#e4f1e9;color:#2f6b4f}.nt-ic.k-nudge{background:#f3ecfa;color:#7a5b12}.nt-ic.k-mail,.nt-ic.k-drive{background:#f9e3e7;color:#a3283f}
.nt-ic.k-plan{background:#e8dcf7;color:#715492}.nt-ic.k-promo{background:#f3ecfa;color:#8a4b2a}
.nt-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.nt-tx b{font:600 15px/1.3 'Figtree',system-ui,sans-serif;color:#231a2e;overflow-wrap:anywhere}
.nt-tx>span{font-size:14px;line-height:1.4;color:#686270}
.nt-tx small{margin-top:3px;font-size:12.5px;color:#8d8496}
.nt-act{align-self:flex-start;margin-top:6px;padding:6px 11px;border-radius:999px;background:#fff;box-shadow:inset 0 0 0 1px #e8dcf7;font:600 13px/1 'Figtree',system-ui,sans-serif;color:#4b3658}
.nt-dot{width:9px;height:9px;margin-top:6px;border-radius:50%;background:#715492}
.nt-more{display:block;width:100%;min-height:46px;margin:8px 0 0;border:0;border-radius:14px;background:#f3ecfa;color:#4b3658;font:600 14.5px/1 'Figtree',system-ui,sans-serif;cursor:pointer}
.nt-empty{padding:34px 18px 30px;text-align:center}
.nt-empty-i{display:inline-grid;place-items:center;width:64px;height:64px;margin-bottom:14px;border-radius:50%;background:#f3ecfa;color:#715492}
.nt-empty h3{margin:0 0 8px;font:500 22px/1.05 Nura,'Figtree',system-ui,sans-serif;text-transform:uppercase;letter-spacing:-.01em}
.nt-empty h3 em{font:italic 400 1.1em/1 'Instrument Serif',Georgia,serif;text-transform:none;color:#715492}
.nt-empty p{margin:0 auto;max-width:300px;font-size:14.5px;line-height:1.5;color:#686270}
.nt-err{margin:20px 10px;font-size:14.5px;line-height:1.5;color:#686270}
.nt-sk{display:grid;gap:10px;padding:10px}
.nt-sk i{display:block;height:58px;border-radius:16px;background:linear-gradient(90deg,#f3ecfa 25%,#fbfafc 50%,#f3ecfa 75%);background-size:200% 100%;animation:ntsk 1.2s linear infinite}
@keyframes ntsk{to{background-position:-200% 0}}
.nt-card{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;margin:2px 0 8px;padding:14px;border-radius:18px;background:#f3ecfa}
.nt-card-i{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#715492}
.nt-card b{display:block;font:650 15.5px/1.3 'Figtree',system-ui,sans-serif}
.nt-card p{margin:3px 0 0;font-size:14px;line-height:1.45;color:#686270}
.nt-card-a,.nt-row-a{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.nt-row-a:empty{display:none}
.nt-btn{min-height:46px;padding:0 16px;border-radius:14px;border:1px solid #e8dcf7;background:#fff;color:#231a2e;font:600 15px/1.1 'Figtree',system-ui,sans-serif;cursor:pointer;transition:transform .15s,background .15s}
.nt-btn:active{transform:scale(.97)}
.nt-btn1{background:#292534;border-color:#292534;color:#fff}
.nt-card .nt-btn1{flex:1 1 220px}
.nt-card .nt-btn0{border-color:transparent;background:transparent;color:#4b3658;padding:0 12px}
.nt-row-a .nt-btn{flex:1 1 200px}
.nt-steps{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}
.nt-steps li{display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.5;color:#3c3446}
.nt-steps li>span:last-child{padding-top:1px}
.nt-sn{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#715492;box-shadow:inset 0 0 0 1px #e8dcf7;font:700 12.5px/1 'Figtree',system-ui,sans-serif}
.nt-share{display:inline-grid;place-items:center;width:24px;height:24px;margin:-3px 1px 0;border-radius:7px;background:#fff;color:#2c6ecb;vertical-align:middle}
.nt-blk{padding:14px 10px;border-top:1px solid #ece5f1}
.nt-blk:first-child{border-top:0;padding-top:4px}
.nt-blk h3{margin:0 0 6px;font:650 16px/1.3 'Figtree',system-ui,sans-serif}
.nt-p{margin:0;font-size:14.5px;line-height:1.5;color:#686270}
.nt-ok{color:#2f6b4f}
.nt-inst{margin-top:14px;padding-top:12px;border-top:1px dashed #e8dcf7}.nt-inst .nt-btn{margin-top:8px}
.nt-grid{display:grid;grid-template-columns:minmax(0,1fr) 64px 64px;margin-top:6px}
.nt-grid.solo{grid-template-columns:minmax(0,1fr) 64px}
.nt-gh,.nt-gr{display:contents}
.nt-gh span{padding:0 0 6px;font:600 12px/1.2 'Figtree',system-ui,sans-serif;color:#8d8496;text-align:center}
.nt-gr>span{min-height:56px;display:flex;align-items:center;justify-content:center;border-top:1px solid #f3ecfa}
.nt-gr>.nt-gl{flex-direction:column;align-items:flex-start;justify-content:center;padding:6px 0}
.nt-gl b,.nt-line b{font:600 14.5px/1.3 'Figtree',system-ui,sans-serif}
.nt-gl small,.nt-line small{display:block;font-size:13px;line-height:1.4;color:#7a7384;margin-top:1px}
.nt-line{display:flex;align-items:center;justify-content:space-between;gap:16px}
.nt-note{margin:8px 0 0;font-size:13px;line-height:1.45;color:#7a7384}
.nt-quiet{display:flex;gap:10px;margin-top:12px}
.nt-quiet[hidden]{display:none}
.nt-quiet label{flex:1;display:flex;flex-direction:column;gap:5px;font:600 13px/1.2 'Figtree',system-ui,sans-serif;color:#686270}
.nt-quiet select{min-height:46px;padding:0 12px;border-radius:12px;border:1px solid #d8c4dc;background:#fff;color:#231a2e;font:500 16px/1 'Figtree',system-ui,sans-serif}
.nt .jswitch{--jsw-w:46px;--jsw-h:28px} /* interruptor de tokens.css, un poco más chico en las tablas de avisos */
.nt-legal{margin:6px 10px 4px;font-size:12.5px;line-height:1.5;color:#8d8496}.nt-legal a{color:#715492}
@media (max-width:899px){
  .nt-shade{background:rgba(20,12,30,.42);animation:jfade .22s ease-out both;transition:opacity .2s}
  .nt-panel{top:auto;left:0;right:0;bottom:0;width:auto;max-height:min(90svh,760px);border-radius:24px 24px 0 0;box-shadow:0 -20px 50px -30px rgba(13,8,20,.6);background:#fbfafc;animation:jsheet .32s cubic-bezier(.16,1,.3,1) both}
  .nt-panel::before{content:"";position:absolute;top:8px;left:50%;width:40px;height:5px;margin-left:-20px;border-radius:3px;background:rgba(41,37,52,.2);z-index:2}
  .nt-h{padding-top:18px}
  .nt-body{padding-bottom:calc(16px + env(safe-area-inset-bottom))}
  .nt-it.new{background:#f3ecfa}
  .nt.closing .nt-shade{opacity:0}.nt.closing .nt-panel{opacity:1;transform:translateY(105%)!important}
}
@media (orientation:landscape) and (max-height:540px) and (max-width:1023px){
  .nt-shade{background:rgba(20,12,30,.42)}
  .nt-panel{top:0;bottom:0;right:0;left:auto;width:min(440px,56vw);max-height:none;border-radius:24px 0 0 24px;transform-origin:right center;animation:jside .3s cubic-bezier(.16,1,.3,1) both;padding-right:env(safe-area-inset-right)}
  .nt-panel::before{display:none}
  .nt.closing .nt-panel{opacity:1;transform:translateX(105%)!important}
}
@media (prefers-reduced-motion:reduce){.nt-panel,.nt-shade,.jbell-n{animation:none}.nt-sk i{animation:none}}
/* Versión nueva publicada (src/sw-register.js) */
/* Tirar hacia abajo para actualizar (solo con Jupá instalada) */
.j-ptr{position:fixed;left:50%;top:calc(var(--jtop) + 4px);z-index:55;width:38px;height:38px;margin-top:-10px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#715492;box-shadow:0 6px 18px -6px rgba(35,26,46,.45);opacity:0;transform:translate(-50%,0);pointer-events:none;transition:opacity .15s}
.j-ptr.ready{color:#fff;background:#715492}
.j-ptr.spin{opacity:1!important;animation:jptr .7s linear infinite}
@keyframes jptr{from{transform:translate(-50%,66px) rotate(0)}to{transform:translate(-50%,66px) rotate(360deg)}}
/* ——— Hojas en la compu (src/sheet.js): ventana centrada de ancho cómodo, alto según el contenido, scroll adentro, la X adentro
   y la botonera fija abajo. Reemplaza al viejo diálogo con forma de arco. En el celular siguen siendo hojas desde abajo. ——— */
@media (min-width:900px) and (min-height:541px),(min-width:1024px){
  .drawer:not([hidden]){position:fixed;inset:0;display:grid;place-items:center;padding:32px;overflow:hidden;perspective:none}
  .drawer>.shade{position:fixed;inset:0;background:rgba(20,12,30,.52);animation:jwfade .2s ease-out both}
  .drawer>.sheet,.drawer>.sheet.wide{position:relative;box-sizing:border-box;width:min(600px,100%);max-height:min(860px,calc(100dvh - 64px));margin:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;padding:28px 32px 24px!important;border-radius:24px!important;background:#fbfafc;text-align:left;box-shadow:0 1px 2px rgba(0,0,0,.08),0 40px 80px -30px rgba(13,8,20,.55);animation:jwin .24s cubic-bezier(.16,1,.3,1) both;scrollbar-width:thin;scrollbar-color:#d9cfe3 transparent}
  .drawer>.sheet::before{display:none!important}
  .drawer>.sheet>.mono{display:none}
  .drawer>.sheet>.close{position:absolute!important;top:16px!important;right:16px!important;left:auto;z-index:4;display:grid;place-items:center;width:36px;height:36px;margin:0;padding:0;border:0;border-radius:50%;background:#ece5f1;box-shadow:none;color:#4b3658;font-size:20px;line-height:1;transition:background .15s,transform .15s}
  .drawer>.sheet>.close:hover{background:#e8dcf7;transform:none}.drawer>.sheet>.close:active{transform:scale(.92)}
  .drawer .sheet h2{margin:0 48px 6px 0;text-align:left;font:650 24px/1.2 'Figtree',system-ui,sans-serif;font-style:normal;letter-spacing:-.015em;color:#231a2e}
  .drawer .sheet .overline{display:block;text-align:left;margin:0 48px 4px 0}
  .drawer .sheet>.lead,.drawer .sheet .lead{text-align:left;justify-content:flex-start;font-size:15px;line-height:1.5;margin:0 0 16px}
  /* Botonera fija abajo: siempre a la vista aunque la hoja sea larga */
  .drawer>.sheet .jbar{position:sticky;bottom:-24px;z-index:3;display:flex;justify-content:flex-end;gap:10px;margin:18px -32px -24px;padding:14px 32px 24px;background:linear-gradient(rgba(251,250,252,0),#fbfafc 14px);grid-column:1/-1}
  .drawer>.sheet .jbar .btn{flex:none;width:auto;min-height:46px;padding:0 20px;margin:0}
  .drawer>.sheet .jbar .btn.primary{min-width:140px}
}
@keyframes jwin{from{opacity:0;transform:translateY(12px) scale(.985)}}
@keyframes jwfade{from{opacity:0}}
@media (prefers-reduced-motion:reduce){.drawer>.sheet,.drawer>.shade{animation:none!important}}
/* Volver al tablero del organizador (056): píldora en la compu, ícono redondo en el celular y en el riel */
.jorg{width:auto;gap:7px;display:inline-flex;align-items:center;padding:0 15px 0 12px;border-radius:999px;font:600 14px var(--font-body,inherit);color:#4b3658;text-decoration:none;white-space:nowrap}
@media (max-width:899px),(orientation:landscape) and (max-height:540px) and (max-width:1023px){.jorg{width:36px;padding:0;justify-content:center}.jorg span{display:none}}
@media (orientation:landscape) and (max-height:540px) and (max-width:1023px){:root:has(.tabbar) .jorg{display:none}}

/* ═══ Avisos flotantes (src/toast.js): una sola pila para todo el panel; se apilan, nunca se tapan entre sí ═══
   Compu: abajo a la izquierda (no tapa la hoja de Avisos, arriba a la derecha, ni las ventanas, al centro).
   Celular: abajo al centro, sobre las pestañas; con una hoja abierta (sube desde abajo) pasan arriba, bajo el encabezado.
   Con un aviso fijo (versión nueva) la página suma espacio abajo para que nada quede detrás. */
.jtoasts{position:fixed;left:24px;bottom:24px;z-index:170;display:flex;flex-direction:column;align-items:flex-start;gap:8px;max-width:min(440px,calc(100vw - 48px));pointer-events:none}
.jtoast{display:flex;align-items:center;gap:12px;box-sizing:border-box;max-width:100%;padding:11px 12px 11px 16px;border-radius:16px;background:#292534;color:#fff;font:500 14.5px/1.35 'Figtree',system-ui,sans-serif;box-shadow:0 18px 40px -16px rgba(13,8,20,.7);pointer-events:auto;opacity:0;transform:translateY(10px);transition:opacity .2s ease-out,transform .24s cubic-bezier(.16,1,.3,1)}
.jtoast:not(:has(button)){padding-right:16px}
.jtoast.in{opacity:1;transform:none}
.jtoast.out{opacity:0;transform:translateY(6px)}
.jtoast[data-kind=error]{background:#7d1f33}
.jtoast button{flex:none;min-height:40px;padding:0 16px;border:0;border-radius:999px;background:#e8dcf7;color:#292534;font:650 14px/1 'Figtree',system-ui,sans-serif;cursor:pointer}
.jtoast button:active{transform:scale(.96)}
.jtoast button:disabled{opacity:.6}
html.j-toast-fixed main{padding-bottom:96px}
@media (max-width:899px){
  .jtoasts{left:16px;right:16px;bottom:calc(var(--jbot) + 14px);align-items:center;max-width:none}
  html.j-sheet-open .jtoasts{top:calc(var(--jtop) + 10px);bottom:auto}
  html.j-sheet-open .jtoast{transform:translateY(-10px)}
  html.j-sheet-open .jtoast.in{transform:none}
  html.j-toast-fixed main{padding-bottom:calc(var(--jbot) + 84px)}
}
@media (orientation:landscape) and (max-height:540px) and (max-width:1023px){.jtoasts{left:calc(var(--rail-w) + 16px);right:auto;bottom:14px;align-items:flex-start}}
@media (prefers-reduced-motion:reduce){.jtoast{transition:none}}
/* ——— Su cuenta sin plan (html.acct-only: vista.js, shell.js): solo la hoja de la cuenta; sin la barra, las secciones,
   la ayuda ni los avisos del panel, que sin plan no llevan a ningún lado ——— */
html.acct-only .tabbar,html.acct-only .tb-sheet,html.acct-only .dnav,html.acct-only main.dash,html.acct-only #jhelp,html.acct-only #jbell,html.acct-only .jorg{display:none!important}
html.acct-only #drawer[hidden]{display:grid}
html.acct-only:not(.acct-ready) .jsec{visibility:hidden}
@media (max-width:899px),(orientation:landscape) and (max-height:540px) and (max-width:1023px){html.acct-only #drawer[hidden]{display:flex}}

/* ——— Presencia en vivo (src/presence.js): quién más está viendo lo mismo ahora, en la barra y en una pastilla
   arriba. Los colores de cada persona llegan por variables (--c,--tx) puestas desde JS: nada de hex acá, para que
   scripts/marca.py siga limpio sin tocar la paleta de marca. En el celular (barra abajo) no hay lugar: se oculta,
   igual se ve el cursor remoto y el tinte de la fila que viene de guests.css. */
.pz-stack{display:flex;align-items:center}
.pz-av{position:relative;width:34px;height:34px;margin-left:-10px;border-radius:50%;background:var(--c);color:var(--tx);border:2px solid #fbfafc;box-shadow:0 1px 3px rgba(35,26,46,.25);display:flex;align-items:center;justify-content:center;font:650 13px/1 'Figtree',system-ui,sans-serif;opacity:0;transform:scale(.4);transition:opacity .22s ease-out,transform .42s cubic-bezier(.34,1.56,.64,1)}
.pz-av:first-child{margin-left:0}
.pz-av{appearance:none;padding:0;cursor:pointer}
.pz-av b{font:inherit}
.pz-n{display:none;font-style:normal;font-weight:600;font-size:13px;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pz-stack.pocos{gap:6px}
.pz-stack.pocos .pz-av{width:auto;height:34px;margin-left:0;padding:0 12px 0 3px;border-radius:999px;gap:7px}
.pz-stack.pocos .pz-av b{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:rgba(251,250,252,.24);font-size:12px}
.pz-stack.pocos .pz-n{display:inline}
.pz-stack.pocos .pz-av::after{right:-2px;bottom:-2px}
.pz-av.lejos{cursor:pointer;opacity:.55}
.pz-av.lejos.in{opacity:.55;transform:scale(.88)}
.pz-av.lejos::after{background:#e8dcf7}
.pz-av:hover,.pz-av:focus-visible{z-index:2}
.pz-av.lejos:hover,.pz-av.lejos:focus-visible{opacity:1}
.pz-nm{position:absolute;top:calc(100% + 9px);right:-6px;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:7px 11px;border-radius:12px;background:#231a2e;color:#fbfafc;font:600 13px/1.25 'Figtree',system-ui,sans-serif;white-space:nowrap;box-shadow:0 14px 30px -14px rgba(13,8,20,.7);opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .16s ease-out,transform .2s cubic-bezier(.16,1,.3,1);z-index:3}
.pz-nm small{font-weight:500;font-size:12px;opacity:.75}
.pz-av:hover .pz-nm,.pz-av:focus-visible .pz-nm{opacity:1;transform:none}
.pz-cur{position:fixed;left:0;top:0;z-index:190;pointer-events:none;display:flex;align-items:flex-start;gap:6px;opacity:0;will-change:transform,opacity;filter:drop-shadow(0 3px 8px rgba(35,26,46,.35));transition:opacity .18s ease-out}
.pz-cur svg{flex:none;margin-top:-1px}
.pz-cur.ping svg{transform-origin:3px 2px;animation:pzPing .9s cubic-bezier(.34,1.56,.64,1) 2}
@keyframes pzPing{0%,100%{transform:scale(1)}40%{transform:scale(1.7)}}
@media (prefers-reduced-motion:reduce){.pz-cur.ping svg{animation:none}}
.pz-tag{margin-top:13px;padding:4px 10px;border-radius:999px;font:600 12.5px/1.3 'Figtree',system-ui,sans-serif;white-space:nowrap;box-shadow:0 6px 16px -8px rgba(35,26,46,.5)}
.pz-tag small{display:inline;margin-left:5px;font-weight:500;opacity:.8}
.pz-av.in{opacity:1;transform:scale(1)}
.pz-av::after{content:"";position:absolute;right:-1px;bottom:-1px;width:9px;height:9px;border-radius:50%;background:#2f6b4f;border:2px solid #fbfafc}
.pz-toast{position:fixed;top:calc(env(safe-area-inset-top) + 10px);left:50%;z-index:180;transform:translate(-50%,-8px);display:flex;align-items:center;gap:9px;max-width:min(420px,calc(100vw - 32px));box-sizing:border-box;padding:10px 16px 10px 12px;border-radius:999px;background:#231a2e;color:#fbfafc;font:500 13.5px/1.3 'Figtree',system-ui,sans-serif;box-shadow:0 18px 40px -16px rgba(13,8,20,.7);opacity:0;pointer-events:none;transition:opacity .22s ease-out,transform .28s cubic-bezier(.16,1,.3,1)}
.pz-toast i{flex:none;width:9px;height:9px;border-radius:50%}
.pz-toast.in{opacity:1;transform:translate(-50%,0)}
@media (max-width:899px),(orientation:landscape) and (max-height:540px) and (max-width:1023px){.pz-stack{display:none}.pz-toast{top:calc(var(--jtop,60px) + 8px);font-size:13px;padding:9px 14px 9px 11px}}
@media (prefers-reduced-motion:reduce){.pz-av{transition:opacity .16s ease-out}.pz-av::after{transition:none}.pz-toast{transition:opacity .16s ease-out}}
/* Celular: los links de texto sueltos tienen zona de toque de 44px (el relleno vertical en un elemento en línea no mueve el renglón) */
@media (pointer:coarse){main a:not([class]){padding-block:14px}}
