/* Night Watch — la herramienta. Piso de la fábrica: portapapeles del Foreman + tarjeta de checador. */
:root{
  --soot:#0b0a08; --ink:#120e0a; --bone:#ece4d4; --paper:#f4eddf; --paper2:#e9e0cd; --rule:rgba(18,14,10,.14);
  --o1:#ffa23a; --o2:#ff7a0e; --o3:#e05c00; --sodium:#ffa62b; --ember:#d9381a; --green:#2f7a1e;
  --disp:"Big Shoulders Display",system-ui,sans-serif; --sten:"Big Shoulders Stencil Display","Big Shoulders Display",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace; --body:"Inter Tight",system-ui,sans-serif;
}
@view-transition{navigation:auto}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--body);color:var(--ink);-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden;position:relative;
  background:radial-gradient(ellipse 34% 52% at 56% 46%,#ffd28f 0%,rgba(255,170,70,0) 70%),linear-gradient(160deg,var(--o1) 0%,var(--o2) 55%,var(--o3) 100%) fixed}
button,input{font:inherit;color:inherit}
button{cursor:pointer}
.rays{position:fixed;left:56%;top:46%;width:2200px;height:2200px;margin:-1100px 0 0 -1100px;opacity:.24;pointer-events:none;
  background:repeating-conic-gradient(from 0deg,rgba(255,244,220,.6) 0deg 4deg,rgba(255,244,220,0) 4deg 25.7deg);
  -webkit-mask:radial-gradient(circle,#000 0%,rgba(0,0,0,.5) 30%,transparent 60%);mask:radial-gradient(circle,#000 0%,rgba(0,0,0,.5) 30%,transparent 60%);
  filter:blur(16px);animation:spin 140s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- barra ---------- */
.top{position:relative;z-index:5;height:72px;display:flex;align-items:center;gap:30px;padding:0 30px}
.brand{display:inline-flex;align-items:flex-end;font-family:var(--disp);font-weight:900;font-size:31px;line-height:.78;color:var(--ink);text-decoration:none}
.brand .o{width:.92em;height:.78em;margin:0 .03em;color:var(--ink)}
.links{display:flex;gap:26px;margin-left:20px}
.links a{font-family:var(--disp);font-weight:800;font-size:18px;letter-spacing:.06em;text-transform:uppercase;color:rgba(18,14,10,.62);text-decoration:none}
.links a:hover{color:var(--ink)}
.links a.on{color:var(--ink);text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:7px}
.right{margin-left:auto;display:flex;align-items:center;gap:12px}
.shift{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.06em;padding:10px 14px;border-radius:999px;border:2px solid rgba(18,14,10,.7);text-transform:uppercase;white-space:nowrap}
.shift i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ink);margin-right:8px;vertical-align:1px;animation:blink 1.6s ease-in-out infinite}
@keyframes blink{50%{opacity:.3}}
.conn{font-family:var(--mono);font-weight:600;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;padding:12px 18px;border-radius:999px;background:var(--ink);color:var(--bone);border:0;white-space:nowrap;transition:transform .15s}
.conn:hover{transform:translateY(-1px)}
.conn.on{background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
.conn .h{color:var(--green)}
.conn .addr{text-transform:none;letter-spacing:.02em}

/* ---------- rejilla ---------- */
.stage-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) 330px 380px;gap:0 24px;padding:8px 30px 26px;height:calc(100vh - 72px);min-height:760px}

/* ---------- portapapeles ---------- */
.clip{position:relative;margin-top:18px;min-height:0}
.clip-board{position:absolute;inset:0;border-radius:22px;background:#3a2a1c;box-shadow:0 30px 60px -24px rgba(80,30,0,.55);
  background-image:linear-gradient(135deg,rgba(255,255,255,.06),rgba(0,0,0,.12)),repeating-linear-gradient(95deg,rgba(0,0,0,.05) 0 3px,transparent 3px 9px)}
.clamp{position:absolute;left:50%;top:-18px;width:210px;height:52px;transform:translateX(-50%);border-radius:12px 12px 16px 16px;z-index:3;
  background:linear-gradient(180deg,#d9d4cb,#8f8a82 55%,#b9b4ab);box-shadow:0 6px 12px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.7)}
.clamp:after{content:"";position:absolute;left:50%;top:12px;width:70px;height:14px;transform:translateX(-50%);border-radius:7px;background:#5d5952;box-shadow:inset 0 2px 3px rgba(0,0,0,.5)}
.sheet{position:absolute;inset:16px;background:var(--paper);border-radius:6px;padding:44px 28px 16px;display:flex;flex-direction:column;min-height:0;
  box-shadow:0 2px 0 var(--paper2),0 4px 0 #ddd3bf}
.sh{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding-bottom:12px}
.sh h1{font-family:var(--disp);font-weight:900;font-size:clamp(40px,3.9vw,58px);line-height:.82;text-transform:uppercase}
.sh h1 em{font-style:normal;color:var(--o3)}
.sh p{font-family:var(--mono);font-size:11.5px;text-align:right;line-height:1.5;color:rgba(18,14,10,.62)}
.sh p b{color:var(--ink)}
/* pestañas de carpeta */
.tabs{display:flex;gap:4px;border-bottom:3px solid var(--ink);overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{position:relative;border:0;background:var(--paper2);padding:9px 12px 7px;white-space:nowrap;flex:none;border-radius:8px 8px 0 0;font-family:var(--disp);font-weight:800;font-size:16px;letter-spacing:.05em;text-transform:uppercase;color:rgba(18,14,10,.6)}
.tabs button span{font-family:var(--mono);font-weight:600;font-size:10.5px;margin-left:4px;color:rgba(18,14,10,.45)}
.tabs button.on{background:var(--ink);color:var(--sodium)}
.tabs button.on span{color:rgba(255,166,43,.7)}
.pages{flex:1;min-height:0;overflow:auto;margin:0 -10px;padding:0 10px 10px;scrollbar-width:thin;scrollbar-color:rgba(18,14,10,.25) transparent}
.page{display:none} .page.on{display:block}
.list{display:flex;flex-direction:column}
.empty{font-family:var(--mono);font-size:12px;color:rgba(18,14,10,.5);padding:22px 0}
.mini{font-family:var(--disp);font-weight:900;font-size:16px;letter-spacing:.08em;text-transform:uppercase;margin:18px 0 2px;padding-bottom:6px;border-bottom:1px solid var(--rule)}

/* entradas de la bitácora */
.e{position:relative;display:grid;grid-template-columns:62px minmax(0,1fr) minmax(0,.9fr) auto;gap:12px;align-items:center;padding:13px 0;border-bottom:1px solid var(--rule)}
.e .t{font-family:var(--sten);font-weight:900;font-size:26px;color:rgba(18,14,10,.5);line-height:1}
.e .c{min-width:0}
.e .c b{font-family:var(--disp);font-weight:900;font-size:24px;text-transform:uppercase;line-height:.95;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* la línea de abajo (ticker, compradores, enlace) pasa al siguiente renglón si no cabe: nunca se monta sobre la columna de al lado */
.e .c span{display:block;font-size:12.5px;line-height:1.4;color:rgba(18,14,10,.66);white-space:normal;overflow-wrap:anywhere}
.e .c span em,.e .c span strong{overflow-wrap:normal}
.e .c span em{font-style:normal;font-family:var(--mono);font-size:11px}
.e .who{font-size:12.5px;line-height:1.35;font-weight:500;min-width:0}
.e .who small{display:block;font-family:var(--mono);font-size:10.5px;color:rgba(18,14,10,.55);font-weight:400}
.act{justify-self:end;font-family:var(--disp);font-weight:900;font-size:15px;letter-spacing:.08em;text-transform:uppercase;padding:8px 12px;border-radius:6px;border:2px solid var(--ink);background:transparent;white-space:nowrap;transition:transform .12s,background .15s}
.act:hover{transform:translateY(-1px)}
.act.go{background:var(--ink);color:var(--sodium)}
.act[disabled]{opacity:.45;cursor:not-allowed;transform:none}
.e.sel{background:rgba(18,14,10,.06);margin:0 -10px;padding-left:10px;padding-right:10px;border-radius:6px}
.e.old{opacity:.6}
.e.live{margin:6px -12px;padding:16px 12px;border-radius:8px;background:rgba(255,166,43,.34);border-bottom:0}
.e.live .t{color:var(--o3)}
.e.new{animation:drop .55s cubic-bezier(.2,.9,.25,1.2)}
@keyframes drop{from{opacity:0;transform:translateY(-10px) rotate(-.6deg)}to{opacity:1;transform:none}}
.stamp{position:absolute;right:74px;top:-14px;transform:rotate(-7deg);font-family:var(--sten);font-weight:900;font-size:17px;letter-spacing:.08em;color:var(--ember);
  border:3px solid var(--ember);border-radius:6px;padding:2px 9px 0;opacity:.88;mix-blend-mode:multiply;text-transform:uppercase;pointer-events:none}
.e.new .stamp{animation:stamp .5s .25s cubic-bezier(.3,1.6,.5,1) both}
@keyframes stamp{from{opacity:0;transform:rotate(-7deg) scale(1.8)}to{opacity:.88;transform:rotate(-7deg) scale(1)}}
/* bloqueado para el público (15 min) */
.e.locked .c,.e.locked .who{filter:blur(6px);user-select:none;pointer-events:none}
.lockline{grid-column:2/-1;font-family:var(--mono);font-size:11px;color:var(--o3);margin-top:-4px}
.up{color:var(--green)} .dn{color:var(--ember)}
/* compras sueltas y traders: más compactas */
.e.mini-e{grid-template-columns:62px minmax(0,1fr) auto auto;padding:10px 0}
.e.mini-e .t{font-size:21px}
.e.mini-e .c b{font-size:20px}
.e .sol{font-family:var(--mono);font-size:12px;text-align:right;white-space:nowrap}
.tr{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--rule)}
.tr .r{font-family:var(--sten);font-weight:900;font-size:20px;color:rgba(18,14,10,.45)}
.tr b{font-family:var(--disp);font-weight:900;font-size:21px;text-transform:uppercase;display:block;line-height:1}
.tr small{font-family:var(--mono);font-size:10.5px;color:rgba(18,14,10,.55)}
.tr .ago{font-family:var(--mono);font-size:11px;color:rgba(18,14,10,.55)}
.tr.hit{background:rgba(255,166,43,.3);margin:0 -10px;padding-left:10px;padding-right:10px;border-radius:6px}
.tr.custom .r{font-size:13px;font-family:var(--mono);font-weight:600}
/* mis copias */
.pend{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:12px;margin-top:10px;border-radius:8px;background:var(--ink);color:var(--bone)}
.pend b{font-family:var(--disp);font-weight:900;font-size:19px;text-transform:uppercase;letter-spacing:.03em;display:block}
.pend small{font-family:var(--mono);font-size:11px;color:#b9b1a3}
.pend .act{border-color:var(--sodium);color:var(--sodium)}
.pend .act.go{background:var(--sodium);color:var(--ink)}
.pend .x{background:transparent;border:0;color:#8a8378;font-family:var(--mono);font-size:11px}
.rule{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px dashed var(--rule);font-size:13px}
.rule b{font-weight:700}
.rule small{display:block;font-family:var(--mono);font-size:11px;color:rgba(18,14,10,.55)}
.rule button{border:0;background:transparent;font-family:var(--mono);font-size:11px;text-decoration:underline;color:rgba(18,14,10,.6)}
.logi{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:8px;align-items:baseline;padding:8px 0;border-bottom:1px dashed var(--rule);font-size:13px}
.logi .t{font-family:var(--mono);font-size:11px;color:rgba(18,14,10,.55)}
.logi .r{font-family:var(--mono);font-size:11px}
/* posiciones */
.pos-sum{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;padding:12px 0 8px;border-bottom:1px solid var(--rule)}
.pos-sum b{font-family:var(--sten);font-weight:900;font-size:34px;line-height:1}
.pos-sum span{font-family:var(--mono);font-size:11.5px;color:rgba(18,14,10,.6)}
.pos-sum button{margin-left:auto;border:0;background:transparent;font-family:var(--mono);font-size:11px;text-decoration:underline;color:rgba(18,14,10,.6)}
.pos{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:6px 12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--rule)}
.pos .ic{position:relative;width:40px;height:40px;border-radius:50%;border:2px solid var(--ink);background:var(--paper2);display:grid;place-items:center;font-family:var(--disp);font-weight:900;overflow:hidden}
.pos .ic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tabs i{font-style:normal}
.tabs .s{display:none}
.pos .nm b{display:block;font-family:var(--disp);font-weight:900;font-size:21px;text-transform:uppercase;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pos .nm small{font-family:var(--mono);font-size:10.5px;color:rgba(18,14,10,.58)}
.pos .val{text-align:right;font-family:var(--mono);font-size:12.5px;font-weight:600;white-space:nowrap}
.pos .val small{display:block;font-weight:400;font-size:10.5px;color:rgba(18,14,10,.58)}
.pos .sell{grid-column:2/-1;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.pos .sell button{border:2px solid var(--ink);background:transparent;border-radius:6px;padding:5px 9px;font-family:var(--disp);font-weight:900;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase}
.pos .sell button.all{background:var(--ink);color:var(--sodium)}
.pos .sell button[disabled]{opacity:.4;cursor:not-allowed}
.pos .sell input{width:44px;font-family:var(--mono);font-size:12px;padding:5px 4px;border:2px solid var(--ink);border-radius:6px;background:#fff9ee;text-align:right}
.pos .sell .dead{font-family:var(--mono);font-size:11px;color:var(--ember)}
.pump{font-family:var(--mono);font-size:10.5px;font-weight:600;color:var(--o3);text-decoration:none;white-space:nowrap}
.pump:hover{text-decoration:underline}
.target .pump{display:inline-block;margin-left:6px}

/* pegar wallet */
.paste{display:flex;align-items:center;gap:12px;border:2px dashed rgba(18,14,10,.4);border-radius:10px;padding:10px 12px 10px 16px;margin-top:12px}
.paste label{font-family:var(--disp);font-weight:900;font-size:19px;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.paste input{flex:1;min-width:0;font-family:var(--mono);font-size:12.5px;background:transparent;border:0;border-bottom:2px solid var(--ink);padding:6px 0;outline:none}
.paste input::placeholder{color:rgba(18,14,10,.45)}
.paste .btn{font-family:var(--disp);font-weight:900;font-size:16px;letter-spacing:.08em;text-transform:uppercase;padding:9px 14px;border-radius:7px;background:var(--ink);color:var(--bone);border:0;white-space:nowrap}
.paste-msg{font-family:var(--mono);font-size:11px;min-height:1.2em;margin-top:6px;color:rgba(18,14,10,.6)}
.paste-msg.warn{color:var(--ember)} .paste-msg.ok{color:var(--green)}

/* ---------- Foreman ---------- */
.fm{position:relative;display:flex;flex-direction:column;align-items:center;min-height:0;padding-top:24px}
.bubble{position:relative;width:100%;background:var(--ink);color:var(--bone);border-radius:18px;padding:16px 18px;z-index:2;transition:transform .25s}
.bubble:after{content:"";position:absolute;left:46%;bottom:-10px;width:22px;height:22px;background:var(--ink);transform:rotate(45deg);border-radius:4px}
.bubble b{font-family:var(--disp);font-weight:900;font-size:14px;letter-spacing:.12em;color:var(--sodium);text-transform:uppercase;display:block;margin-bottom:4px}
.bubble p{font-size:16.5px;line-height:1.4;min-height:2.8em}
.bubble p strong{color:var(--sodium);font-weight:600}
.bubble.pop{animation:pop .4s cubic-bezier(.3,1.5,.5,1)}
@keyframes pop{from{transform:scale(.96)}to{transform:none}}
.hero-foreman{position:relative;width:100%;aspect-ratio:1;max-width:400px;margin-top:6px;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-y;flex:none}
.hero-foreman.grab{cursor:grabbing}
.hero-foreman .glow{position:absolute;inset:6% 4% 10%;border-radius:50%;background:radial-gradient(circle at 50% 40%,rgba(255,236,200,.7),rgba(255,190,110,.16) 46%,transparent 70%)}
.stage{position:absolute;inset:0;-webkit-mask-image:linear-gradient(to bottom,#000 88%,transparent 100%);mask-image:linear-gradient(to bottom,#000 88%,transparent 100%)}
.stage img,.stage canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .6s ease}
.stage img.on,.stage canvas.on{opacity:1}
@keyframes fm-breathe{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-1.1%) rotate(-.6deg)}}
.stage img.still.on{animation:fm-breathe 3.4s ease-in-out infinite;transform-origin:50% 80%}
@media (prefers-reduced-motion:reduce){.stage img.still.on{animation:none}}
.stage canvas{touch-action:pan-y}
.hero-foreman .floor{position:absolute;left:18%;right:18%;bottom:-2%;height:9%;border-radius:50%;background:radial-gradient(closest-side,rgba(60,18,0,.35),transparent);filter:blur(4px)}
.counts{display:flex;justify-content:center;gap:26px;margin-top:auto;padding-top:14px}
.counts div{text-align:center}
.counts b{display:block;font-family:var(--sten);font-weight:900;font-size:40px;line-height:.9}
.counts span{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:rgba(18,14,10,.7)}
.mode-note{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:rgba(18,14,10,.7);margin-top:10px;text-align:center}
.mode-note b{background:var(--ink);color:var(--sodium);padding:2px 6px;border-radius:4px;font-weight:600}

/* ---------- tarjeta ---------- */
.ticket-wrap{position:relative;min-height:0;overflow:auto;padding:18px 4px 4px;margin:0 -4px;scrollbar-width:none}
.ticket-wrap::-webkit-scrollbar{display:none}
.sheet-bar{display:none}
.card{position:relative;background:var(--paper);border-radius:14px;padding:22px 22px 18px;box-shadow:0 30px 60px -24px rgba(80,30,0,.55);transform:rotate(1.2deg);transition:transform .3s}
.card.flash{animation:flash .6s ease}
@keyframes flash{30%{transform:rotate(0deg) translateY(-4px)}}
.card:before{content:"";position:absolute;left:50%;top:12px;width:56px;height:10px;transform:translateX(-50%);border-radius:6px;background:var(--o2);box-shadow:inset 0 2px 3px rgba(0,0,0,.3)}
.ch{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:3px solid var(--ink);padding:10px 0 8px}
.ch b{font-family:var(--disp);font-weight:900;font-size:30px;line-height:.85;text-transform:uppercase}
.ch span{font-family:var(--mono);font-size:10.5px;color:rgba(18,14,10,.55);text-align:right;line-height:1.4}
.target{display:flex;align-items:center;gap:12px;margin:14px 0 10px;min-width:0}
.target>div:last-child{min-width:0}
.coin-i{flex:none;width:44px;height:44px;border-radius:50%;background:var(--paper2) center/cover;border:2px solid var(--ink);display:grid;place-items:center;font-family:var(--disp);font-weight:900;font-size:19px}
.target b{font-family:var(--disp);font-weight:900;font-size:26px;text-transform:uppercase;line-height:.9;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.target span{font-size:12px;color:rgba(18,14,10,.62)}
.scope{display:flex;gap:4px;background:var(--paper2);border-radius:8px;padding:3px;margin-bottom:10px}
.scope:empty{display:none}
.scope button{flex:1;border:0;background:transparent;border-radius:6px;padding:7px 6px;font-family:var(--mono);font-size:11px;font-weight:600;color:rgba(18,14,10,.6)}
.scope button.on{background:var(--ink);color:var(--bone)}
.punch{border-top:1px solid var(--rule)}
.pr{display:grid;grid-template-columns:22px 1fr auto;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--rule);cursor:pointer}
.pr input[type=radio]{position:absolute;opacity:0;pointer-events:none}
.pr i{width:18px;height:18px;border-radius:50%;border:2px solid rgba(18,14,10,.35);transition:background .15s}
.pr.on i{border-color:var(--ink);background:radial-gradient(circle,var(--o2) 0 4px,var(--ink) 5px)}
.pr b{font-family:var(--disp);font-weight:900;font-size:18px;letter-spacing:.05em;text-transform:uppercase}
.pr span{font-family:var(--mono);font-size:12px;color:rgba(18,14,10,.6);white-space:nowrap}
.pr.on span{color:var(--ink);font-weight:600}
input.v{width:46px;font-family:var(--mono);font-size:12px;font-weight:600;text-align:right;background:var(--paper2);border:0;border-radius:4px;padding:3px 5px;outline:none}
input.v:focus{box-shadow:0 0 0 2px var(--o2)}
.big{display:flex;align-items:baseline;gap:8px;margin:14px 0 2px}
.big b{font-family:var(--sten);font-weight:900;font-size:60px;line-height:.86}
.big b.none{font-family:var(--disp);font-size:44px;color:rgba(18,14,10,.3);letter-spacing:.04em}
.big span{font-family:var(--disp);font-weight:900;font-size:22px}
.big em{margin-left:auto;font-style:normal;font-family:var(--mono);font-size:12px;color:rgba(18,14,10,.6)}
.note{font-size:12.5px;line-height:1.4;color:rgba(18,14,10,.72);min-height:2.8em}
.note b{color:var(--ink)}
.note.warn{color:var(--ember)}
.lim{display:flex;gap:6px;margin-top:10px}
.lim label{flex:1;font-family:var(--mono);font-size:10.5px;padding:6px 6px;border-radius:6px;background:var(--paper2);text-align:center;white-space:nowrap}
.lim input.v{width:30px;background:var(--paper);padding:2px 3px}
.box{display:flex;gap:10px;align-items:center;margin-top:12px;font-size:13px;font-weight:500;cursor:pointer}
.box input{position:absolute;opacity:0}
.box i{width:19px;height:19px;border:2px solid var(--ink);border-radius:4px;display:grid;place-items:center;font-style:normal;font-weight:800;font-size:13px}
.box input:checked+i:after{content:"✓"}
.punchin{margin-top:14px;width:100%;border:0;border-radius:10px;padding:16px 0;background:var(--ink);color:var(--sodium);font-family:var(--disp);font-weight:900;font-size:23px;letter-spacing:.08em;text-transform:uppercase;transition:transform .12s,box-shadow .2s}
.punchin:hover:not([disabled]){transform:translateY(-1px);box-shadow:0 10px 24px -10px rgba(18,14,10,.6)}
.punchin[disabled]{opacity:.4;cursor:not-allowed}
.fee{display:flex;justify-content:space-between;margin-top:9px;font-family:var(--mono);font-size:10.5px;color:rgba(18,14,10,.6)}
.fee b{color:var(--green)}
.legal{margin:18px 6px 0;font-size:12.5px;line-height:1.5;color:rgba(18,14,10,.84)}
.legal b{font-weight:700}

.toast{position:fixed;left:50%;bottom:26px;z-index:60;transform:translate(-50%,20px);opacity:0;pointer-events:none;max-width:min(560px,calc(100% - 32px));
  background:var(--ink);color:var(--bone);border-radius:12px;padding:13px 16px;font-size:13.5px;line-height:1.45;box-shadow:0 20px 40px -14px rgba(0,0,0,.6);transition:opacity .25s,transform .25s}
.toast.on{opacity:1;transform:translate(-50%,0)}
.toast b{color:var(--sodium)}

/* ---------- selector de wallet ---------- */
.modal{position:fixed;inset:0;z-index:70;display:none;place-items:center;padding:20px;background:rgba(11,10,8,.55);backdrop-filter:blur(6px)}
.modal.on{display:grid}
.wbox{position:relative;width:min(440px,100%);background:var(--paper);border-radius:16px;padding:26px 24px 22px;box-shadow:0 40px 80px -30px rgba(0,0,0,.7);animation:drop .35s cubic-bezier(.2,.9,.25,1.2)}
.wbox:before{content:"";position:absolute;left:0;right:0;top:0;height:12px;border-radius:16px 16px 0 0;background:repeating-linear-gradient(-45deg,var(--ink) 0 10px,var(--o2) 10px 20px)}
.wx{position:absolute;right:12px;top:18px;border:0;background:transparent;font-size:26px;line-height:1;color:rgba(18,14,10,.55)}
.wbox h2{font-family:var(--disp);font-weight:900;font-size:40px;line-height:.86;text-transform:uppercase;margin-top:8px}
.wbox h2 em{font-style:normal;color:var(--o3)}
.wsub{font-size:13px;line-height:1.5;color:rgba(18,14,10,.72);margin:12px 0 16px}
.wlist{display:flex;flex-direction:column;gap:8px}
.wopt{display:flex;align-items:center;gap:12px;width:100%;border:2px solid var(--ink);border-radius:10px;background:#fff9ee;padding:10px 12px;text-align:left;transition:transform .12s,background .15s}
.wopt:hover:not([disabled]){transform:translateY(-1px);background:#fff}
.wopt img,.wopt i{width:32px;height:32px;border-radius:8px;flex:none;background:var(--paper2)}
.wopt span{flex:1;font-family:var(--disp);font-weight:900;font-size:20px;letter-spacing:.04em;text-transform:uppercase}
.wopt em{font-style:normal;font-family:var(--mono);font-size:11px;color:rgba(18,14,10,.6)}
.wnone{font-size:13.5px;line-height:1.5}
.wnone a{color:var(--o3);font-weight:600}
.logi a,.toast a{color:var(--o3);font-weight:600}
.toast a{color:var(--sodium)}

/* ---------- pantallas medianas ---------- */
@media (max-width:1240px){
  .stage-grid{grid-template-columns:minmax(0,1fr) 280px 350px;gap:0 18px;padding:8px 20px 22px}
  .links{display:none}
  .e{grid-template-columns:54px minmax(0,1fr) auto}
  .e .who{grid-column:2/3;grid-row:2}
  .e .act{grid-row:1/3;grid-column:3}
}
/* ---------- celular y tableta: una columna; la tarjeta sube desde abajo ---------- */
@media (max-width:900px){
  body{background-attachment:scroll}
  .top{height:60px;padding:0 16px;gap:12px}
  .brand{font-size:24px}
  .shift{display:none}
  .conn{padding:10px 14px;font-size:11px}
  .stage-grid{display:flex;flex-direction:column;height:auto;min-height:0;padding:0 12px 120px}
  .stage-grid>*,.sheet,.tabs,.pages{min-width:0;max-width:100%}
  .sh{flex-direction:column;align-items:flex-start;gap:8px}
  .sh p{text-align:left;font-size:10.5px}
  .sh p br{display:none}
  .tabs{gap:3px}
  .tabs [data-tab=tape] span,.tabs [data-tab=traders] span,.tabs [data-tab=positions] span{display:none}
  .tabs button{font-size:13px;padding:8px 6px 6px;flex:1}
  .tabs .l{display:none} .tabs .s{display:inline}
  .tabs button span{display:none}
  .pos .sell{gap:5px}
  .pos .sell button{padding:5px 6px;font-size:12px;letter-spacing:.03em}
  .pos .sell input{width:36px}
  .toast{top:70px;bottom:auto;transform:translate(-50%,-20px);width:calc(100% - 32px)}
  .fm{order:-1;display:grid;grid-template-columns:132px 1fr;grid-template-rows:auto auto;align-items:center;gap:6px 12px;padding-top:4px}
  .hero-foreman{grid-row:1/3;grid-column:1;width:132px;margin:0}
  .bubble{grid-column:2;padding:12px 14px;border-radius:14px}
  .bubble:after{left:-8px;top:40%;bottom:auto;width:16px;height:16px}
  .bubble b{font-size:12px}
  .bubble p{font-size:14.5px;min-height:0}
  .counts{grid-column:2;margin:0;padding:0;justify-content:flex-start;gap:16px}
  .counts b{font-size:26px}
  .counts span{font-size:9px}
  .mode-note{grid-column:1/-1;margin-top:2px}
  .clip{margin-top:26px}
  .clip-board{border-radius:16px}
  .clamp{width:150px;height:40px;top:-14px}
  .clamp:after{width:50px;top:10px}
  .sheet{position:relative;inset:auto;margin:10px;padding:34px 14px 12px}
  .sh h1{font-size:40px}
  .sh p{font-size:10px}
  .tabs{overflow-x:auto;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tabs button{font-size:14px;padding:8px 9px 6px;white-space:nowrap;flex:1}
  .pages{overflow:visible;margin:0;padding:0}
  .e{grid-template-columns:48px minmax(0,1fr) auto;gap:4px 10px}
  .e .t{font-size:21px}
  .e .c b{font-size:21px}
  .e .who{grid-column:2/3;grid-row:2}
  .e .act{grid-row:1/3;grid-column:3;padding:7px 10px;font-size:14px}
  .e.mini-e{grid-template-columns:48px minmax(0,1fr) auto}
  .e.mini-e .sol{grid-column:2;grid-row:2;text-align:left}
  .stamp{right:64px;top:-12px;font-size:14px}
  .paste{flex-wrap:wrap;padding:10px 12px}
  .paste label{font-size:16px}
  .paste input{flex-basis:100%;order:3}
  .paste .btn{margin-left:auto;padding:7px 12px;font-size:14px}
  /* hoja inferior */
  .ticket-wrap{position:fixed;left:0;right:0;bottom:0;z-index:40;margin:0;padding:0;max-height:88vh;overflow:visible;transform:translateY(calc(100% - 64px));transition:transform .35s cubic-bezier(.2,.8,.2,1)}
  .ticket-wrap.open{transform:none;overflow:auto}
  .sheet-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;height:64px;border:0;padding:0 18px calc(env(safe-area-inset-bottom) * .5);background:var(--ink);color:var(--sodium);border-radius:16px 16px 0 0;
    font-family:var(--disp);font-weight:900;font-size:18px;letter-spacing:.06em;text-transform:uppercase;box-shadow:0 -10px 30px rgba(60,20,0,.35)}
  .sheet-bar span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ticket-wrap.open .sheet-bar i{transform:rotate(180deg)}
  .sheet-bar.ready{background:var(--sodium);color:var(--ink)}
  .card{transform:none;border-radius:0;box-shadow:none;padding:18px 16px 14px}
  .card:before{display:none}
  .legal{margin:0;padding:12px 16px calc(18px + env(safe-area-inset-bottom));background:var(--paper);font-size:11.5px}
}
@media (prefers-reduced-motion:reduce){.rays,.shift i{animation:none}.e.new,.e.new .stamp,.bubble.pop,.card.flash{animation:none}}