:root{
  --paper:#FFFFFF; --on-paper:#231F2B; --on-paper-muted:#5B6B80; --on-paper-accent:#4F6F93; --surface:#E8EEF5; --ink:#231F2B; --muted:#5B6B80; --line:#C4D1E0;
  --accent:#4F6F93; --accent-soft:#D5E0EC; --gold:#C8962E; --stage:#FFFFFF; --warn:#B4432F;
  --display:"Grandstander","Nunito",system-ui,sans-serif;
  --body:"Nunito",system-ui,-apple-system,"Segoe UI",sans-serif;
}


*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5}
.wrap{max-width:1180px;margin:0 auto;padding-inline:20px;padding-block:22px 40px}
header{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.brand{font:800 12px/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
h1{font-family:var(--display);font-weight:800;font-size:clamp(28px,4.4vw,44px);line-height:1.02;margin:6px 0 0;text-wrap:balance}
h1 em{font-style:normal;color:var(--accent)}
.lede{color:var(--muted);max-width:46ch;margin:0}
.grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
@media (max-width:860px){.grid{grid-template-columns:1fr}}
.stagecol{position:sticky;top:calc(env(safe-area-inset-top,0px) + 12px);display:flex;flex-direction:column;gap:12px}
@media (max-width:860px){.stagecol{position:static}}
.stage{background:var(--stage);border-radius:22px;border:1px solid var(--line);padding:12px;display:flex;flex-direction:column;align-items:center;box-shadow:0 10px 30px -18px rgba(40,20,80,.35)}
.stage img{display:block;max-width:100%;max-height:68vh;height:auto;width:auto;-webkit-user-drag:none}
.meta{display:flex;flex-wrap:wrap;gap:8px}
.pill{font:700 12px/1 var(--body);padding:7px 11px;border-radius:999px;background:var(--accent-soft);color:var(--ink)}
.pill b{color:var(--accent)}
.legal{font-size:12.5px;line-height:1.45;color:var(--muted);border-top:1px solid var(--line);padding-top:10px}
.legal strong{color:var(--ink);display:block;font-size:13px;margin-bottom:2px}
.panel{display:flex;flex-direction:column;gap:22px}
section h2{font-family:var(--display);font-weight:800;font-size:20px;margin:0 0 10px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
section h2 span{font:800 11px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
button{font:inherit;color:inherit;cursor:pointer}
.signs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
@media (max-width:460px){.signs{grid-template-columns:repeat(3,minmax(0,1fr))}}
.chip{position:relative;background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:9px 6px 8px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1px}
.chip .gl{font-size:22px;line-height:1.1;font-family:"Segoe UI Symbol","Noto Sans Symbols","DejaVu Sans",sans-serif}
.chip .nm{font-weight:800;font-size:13px}
.chip .dt{font-size:10.5px;color:var(--muted)}
.chip[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}
.chip .now{position:absolute;top:6px;right:7px;width:7px;height:7px;border-radius:50%;background:var(--gold)}
.grp{margin-bottom:12px}
.grp h3{font:800 11px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 7px}
.coats{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px}
.coat{position:relative;background:var(--surface);border:1.5px solid var(--line);border-radius:14px;padding:6px 4px 7px;display:flex;flex-direction:column;align-items:center;gap:2px}
.coat .th{height:78px;display:flex;align-items:center;justify-content:center;background:#FFFFFF;border-radius:10px;width:100%}
.coat canvas{height:74px;width:auto;max-width:100%;display:block}
.coat span{font-size:11.5px;font-weight:700;line-height:1.15;text-align:center}
.coat small{font-size:10px;color:var(--muted);font-weight:600}
.coat[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}
.is-owner .coat.own::after{content:"";position:absolute;top:6px;right:6px;width:9px;height:9px;border-radius:50%;background:var(--gold);border:2px solid var(--surface)}
.chip:focus-visible,.coat:focus-visible,.btn:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.owner{background:var(--surface);border:1.5px dashed var(--accent);border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.owner[hidden]{display:none}
.owner .cur{font-weight:800}
.owner .state{font:700 11.5px/1 var(--body);padding:5px 9px;border-radius:999px;background:var(--accent-soft);margin-left:6px;white-space:nowrap}
.owner .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.btn{border:0;border-radius:12px;padding:10px 15px;font-weight:800;background:var(--ink);color:var(--paper)}
.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
.btn.danger{background:var(--warn);color:#fff}
.btn[disabled]{opacity:.55;cursor:progress}
.meter{height:8px;border-radius:99px;background:var(--line);overflow:hidden}
.meter i{display:block;height:100%;background:var(--accent);width:0}
.owner .small{font-size:12.5px;color:var(--muted)}
.owner .msg{font-size:13px;font-weight:700;color:var(--accent);min-height:1.2em}
.owner .msg.err{color:var(--warn)}
footer{margin-top:28px;padding-top:14px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted);max-width:90ch}

.wa{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#1FA855;color:#fff;text-decoration:none;font-weight:800;border-radius:14px;padding:13px 18px;font-size:16px}
.wa:hover{background:#178A45}
.wa:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.wa svg{width:22px;height:22px;flex:none}
.back{color:var(--muted);text-decoration:none;font-weight:700;font-size:13px}
.back:hover{color:var(--accent)}
.adminbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;background:var(--ink);color:var(--paper);padding:10px 20px;font-weight:700;font-size:13px}
.adminbar a{color:var(--paper)}
.login{max-width:420px;margin:8vh auto;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:26px 24px;display:flex;flex-direction:column;gap:14px}
.login h1{font-size:28px}
.login label{font-weight:700;font-size:13px;display:flex;flex-direction:column;gap:5px}
.login input{font:inherit;padding:11px 12px;border-radius:10px;border:1.5px solid var(--line);background:var(--paper);color:var(--ink)}
.login input:focus{outline:2px solid var(--accent);border-color:var(--accent)}
.login .err{color:var(--warn);font-weight:700;font-size:13px}
.login .ok{color:var(--accent);font-weight:700;font-size:13px}
.login p{margin:0;color:var(--muted);font-size:13.5px}

.brandrow{display:flex;align-items:center;gap:16px}
.logo{display:block;flex:none;border-radius:12px}
.logo img{display:block;width:84px;height:auto}
.logo:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

@media (max-width:460px){.logo img{width:64px}}
.desc{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px 16px}
.desc-h{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.desc-g{width:40px;height:40px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:28px;line-height:1;flex:none;font-family:"Segoe UI Symbol","Noto Sans Symbols","DejaVu Sans",sans-serif}
.desc-h strong{display:block;font-family:var(--display);font-weight:800;font-size:19px;line-height:1.1}
.desc-h span{font-size:12.5px;color:var(--muted);font-weight:700}
.desc p{margin:0;font-size:14.5px;line-height:1.55;max-width:60ch}

.stage .legal{border-top:0;padding:0 14px 6px;margin-top:-4px;text-align:center;font-size:11.5px;line-height:1.45;color:#5B6B80;max-width:60ch}
.stage .legal strong{color:#231F2B;font-size:12.5px}

.terms{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:12px 16px;font-size:13.5px;line-height:1.5}
.terms strong{display:block;font-weight:800;margin-bottom:6px;letter-spacing:.06em;font-size:12.5px}
.terms ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}

/* Fondo blanco */
body{color-scheme:light}
header h1,section h2,.grp h3,footer,.brand,.lede,.back{color:var(--on-paper)}
header h1 em{color:var(--on-paper-accent)}
.brand,.lede,footer,section h2 span,.grp h3{color:var(--on-paper-muted)}
.logo img{filter:none}
.logo:focus-visible,.chip:focus-visible,.coat:focus-visible,.btn:focus-visible,.wa:focus-visible{outline-color:var(--on-paper-accent)}
.stage{box-shadow:0 10px 30px -18px rgba(40,20,80,.35);border-color:var(--line)}
.login .brand,.login p{color:var(--muted)}
.login h1{color:var(--ink)}
.login .back{color:var(--muted)}
.adminbar,.adminbar a{color:#FFFFFF}

.chip[aria-pressed="true"],.coat[aria-pressed="true"]{border-color:var(--accent)}

.ledebox{display:flex;flex-direction:column;gap:8px;max-width:46ch}
.loc{margin:0;display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:13.5px;color:var(--accent)}
.loc svg{width:16px;height:16px;flex:none}
.terms-loc{margin:0 0 8px;font-size:13.5px}

.paso3{font-family:var(--display);font-weight:800;font-size:20px;margin:0;display:flex;align-items:baseline;gap:10px;color:var(--on-paper)}
.paso3 span{font:800 11px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--on-paper-muted)}
@media (max-width:860px){
  .grid{display:flex;flex-direction:column}
  .panel{order:1}
  .stagecol{order:2;scroll-margin-top:12px}
  #paso3{scroll-margin-top:12px}
}

.panel{order:1}
.stagecol{order:2}

.coltabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 20px}
.coltabs button{border:1.5px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:9px 16px;font:800 14px/1.2 var(--body);display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.coltabs button[aria-selected="true"]{background:var(--accent);border-color:var(--accent);color:#fff}
.coltabs button:focus-visible,.btn-back:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.soon{font:800 10.5px/1 var(--body);letter-spacing:.08em;text-transform:uppercase;background:#F3E3B5;color:#6B4E0E;border-radius:999px;padding:4px 8px}
.coltabs button[aria-selected="true"] .soon{background:#fff;color:var(--accent)}
.soonbox{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:40px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}
.soonbox h2{font-family:var(--display);font-weight:800;font-size:clamp(24px,4vw,34px);margin:0;color:var(--ink)}
.soonbox p{margin:0;max-width:46ch;color:var(--muted)}
.soon.big{font-size:12px;padding:6px 12px}
.btn-back{margin-top:6px;border:0;border-radius:12px;padding:11px 18px;font:800 14px var(--body);background:var(--ink);color:#fff;cursor:pointer}

[hidden]{display:none!important}

.soonbox p{max-width:58ch;line-height:1.6}
.soonbox .soon-end{color:var(--ink);font-weight:800}

.note{margin:-4px 0 12px;font-size:13.5px;color:var(--muted);max-width:60ch}

/* Puntero huella de gato */
html,body{cursor:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cg%20fill%3D%22%23FFFFFF%22%20stroke%3D%22%23231F2B%22%20stroke-width%3D%221.6%22%3E%3Cellipse%20cx%3D%2216%22%20cy%3D%2221%22%20rx%3D%227.2%22%20ry%3D%226.2%22/%3E%3Cellipse%20cx%3D%227%22%20cy%3D%2213.5%22%20rx%3D%223%22%20ry%3D%223.8%22%20transform%3D%22rotate%28-20%207%2013.5%29%22/%3E%3Cellipse%20cx%3D%2212.5%22%20cy%3D%228%22%20rx%3D%223%22%20ry%3D%223.9%22%20transform%3D%22rotate%28-6%2012.5%208%29%22/%3E%3Cellipse%20cx%3D%2219.5%22%20cy%3D%228%22%20rx%3D%223%22%20ry%3D%223.9%22%20transform%3D%22rotate%286%2019.5%208%29%22/%3E%3Cellipse%20cx%3D%2225%22%20cy%3D%2213.5%22%20rx%3D%223%22%20ry%3D%223.8%22%20transform%3D%22rotate%2820%2025%2013.5%29%22/%3E%3C/g%3E%3C/svg%3E") 16 16,auto}
a,button,[role="tab"],.chip,.coat,.g-card,label{cursor:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%3E%3Cg%20fill%3D%22%234F6F93%22%20stroke%3D%22%23FFFFFF%22%20stroke-width%3D%221.6%22%3E%3Cellipse%20cx%3D%2216%22%20cy%3D%2221%22%20rx%3D%227.2%22%20ry%3D%226.2%22/%3E%3Cellipse%20cx%3D%227%22%20cy%3D%2213.5%22%20rx%3D%223%22%20ry%3D%223.8%22%20transform%3D%22rotate%28-20%207%2013.5%29%22/%3E%3Cellipse%20cx%3D%2212.5%22%20cy%3D%228%22%20rx%3D%223%22%20ry%3D%223.9%22%20transform%3D%22rotate%28-6%2012.5%208%29%22/%3E%3Cellipse%20cx%3D%2219.5%22%20cy%3D%228%22%20rx%3D%223%22%20ry%3D%223.9%22%20transform%3D%22rotate%286%2019.5%208%29%22/%3E%3Cellipse%20cx%3D%2225%22%20cy%3D%2213.5%22%20rx%3D%223%22%20ry%3D%223.8%22%20transform%3D%22rotate%2820%2025%2013.5%29%22/%3E%3C/g%3E%3C/svg%3E") 16 16,pointer}
input,textarea,.sel{cursor:text}

.maria-legal{max-width:60ch;font-size:12px;line-height:1.5;color:var(--muted);border-top:1px solid var(--line);padding-top:12px;margin-top:4px}
.maria-legal strong{display:block;color:var(--ink);font-size:13px;margin-bottom:2px}

.topnote{background:#231F2B;color:#fff;text-align:center;font-size:13.5px;font-weight:700;padding:8px 16px}
.topnote b{color:#F3E3B5}
.launch{background:#FFF6DC;border:1px solid #EBCB78;border-radius:16px;padding:12px 16px;display:flex;flex-direction:column;gap:4px;font-size:13.5px;color:#5A4210}
.launch strong{font-size:15px;color:#3E2D08}

.hand{margin:0;font-size:14.5px;color:var(--on-paper);line-height:1.45}
.hand b{color:var(--accent,#4F6F93);font-weight:800}

.stage .refnote{margin:8px 14px 10px;padding:8px 12px;border-radius:12px;background:var(--surface);font-size:13px;line-height:1.45;color:#3E4C5E;text-align:center;max-width:60ch}
.stage .refnote b{color:#231F2B}
.coat .th canvas{transition:opacity .18s ease}

.foot-legal{font-size:12.5px;color:var(--muted);text-align:center;margin:6px 0 24px}.foot-legal a,.terms a{color:var(--accent);font-weight:700}
.noscript{background:var(--surface);border-radius:14px;padding:12px 16px;font-weight:700;text-align:center}

/* elección de entrega antes de WhatsApp */
.rx{border:1px solid var(--line,#C4D1E0);border-radius:16px;padding:12px 14px;margin:0 0 12px;display:flex;flex-direction:column;gap:8px}
.rx legend{font-weight:800;padding:0 6px}
.rx label{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.45;cursor:pointer}
.rx input[type=radio]{margin-top:3px;width:18px;height:18px;flex:none;accent-color:#4F6F93}
.rx-city{flex-direction:column;gap:4px!important;padding-left:28px}
.rx-city span{font-weight:800;font-size:13px;color:#5B6B80}
.rx-city input{font:inherit;padding:9px 11px;border:1.5px solid #C4D1E0;border-radius:10px;width:100%;max-width:340px}
.rx-city[hidden]{display:none!important}

/* elemento del signo: insignia + texto */
.desc-g{color:#C8962E!important}
.desc-el{margin:14px 0 0!important;display:flex;align-items:center;gap:16px}
.el-badge{width:84px;height:auto;flex:none;display:block}
.el-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.el-tx b{font-size:15.5px;font-weight:700;color:#231F2B;line-height:1.35}
.el-tx span{font-size:14px;color:#5B6B80;line-height:1.4}
@media (max-width:460px){.el-badge{width:72px}.desc-el{gap:12px}}

/* distribución del taller (12 oct 2026) */
.stage img{max-height:48vh}
.panel .desc{margin-top:12px}
details.terms{padding:0}
details.terms summary{list-style:none;cursor:pointer;padding:12px 16px;display:flex;flex-direction:column;gap:2px}
details.terms summary::-webkit-details-marker{display:none}
details.terms summary strong{margin:0;display:flex;justify-content:space-between;align-items:center}
details.terms summary strong::after{content:"+";font-size:18px;line-height:1;color:var(--accent)}
details.terms[open] summary strong::after{content:"–"}
details.terms summary span{font-size:13px;color:var(--muted)}
details.terms[open]>*:not(summary){margin-left:16px;margin-right:16px}
details.terms[open]>ul{margin-bottom:14px}
details.terms summary:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:16px}
.stagecol .wa{width:100%}
.legal-out{border-top:0;padding:0 4px;font-size:11.5px;line-height:1.45;color:#5B6B80}
.legal-out strong{color:#231F2B;font-size:12.5px}
.coats{grid-template-columns:repeat(auto-fill,minmax(72px,1fr))!important;gap:6px!important}
.coat .th{height:66px}.coat canvas{height:62px}
.coat span{font-size:11px}

/* columna "Tu Gatriel" desde arriba y fija (12 oct 2026) */
.layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start}
.layout.maria{grid-template-columns:minmax(0,1fr)}
.leftcol{min-width:0}
.leftcol header{flex-direction:column;align-items:flex-start;gap:14px}
.layout .stagecol{position:sticky;top:calc(env(safe-area-inset-top,0px) + 12px);gap:10px}
.layout .stage img{max-height:42vh}
.layout .stage .refnote{margin-top:4px;margin-bottom:8px}
.layout .rx{margin:0}
@media (max-width:860px){
  .layout{display:block}
  .layout .stagecol{position:static;margin-top:24px}
  .layout .stage img{max-height:60vh}
}
.wa-bar{display:none}
@media (max-width:860px){
  .wa-bar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:30;display:flex;align-items:center;justify-content:center;gap:10px;background:#1FA855;color:#fff;text-decoration:none;font-weight:800;border-radius:14px;padding:14px 18px;font-size:16px;box-shadow:0 10px 24px -10px rgba(0,0,0,.45);transition:transform .2s,opacity .2s}
  .wa-bar.hide,.wa-bar.off{transform:translateY(140%);opacity:0;pointer-events:none}
  body{padding-bottom:76px}
}
@media (prefers-reduced-motion:reduce){.wa-bar{transition:none}}