:root{--bg:#0b0b0f;--card:#151522;--txt:#f2f2f7;--muted:#a8a8b8;--accent:#66ff99}
*{box-sizing:border-box} body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto;background:var(--bg);color:var(--txt)}
.top{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:rgba(11,11,15,.9);backdrop-filter: blur(10px);z-index:5;border-bottom:1px solid rgba(255,255,255,.06)}
.brand{font-weight:700;letter-spacing:.2px} .brand span{color:var(--accent)}
.ghost{background:transparent;border:1px solid rgba(255,255,255,.14);color:var(--txt);padding:10px 12px;border-radius:12px}
.primary{width:100%;background:var(--accent);border:none;color:#062012;font-weight:800;padding:14px 14px;border-radius:14px}
.full{width:100%}
.deck{padding:14px 14px 82px;display:flex;justify-content:center}
.card{width:min(520px,96vw);background:var(--card);border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.06);touch-action:none}
.card .img{height:320px;background:linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02))}
.card .meta{padding:14px}
.h1{font-size:20px;font-weight:800;margin:0 0 8px}
.row{display:flex;gap:10px;align-items:center;justify-content:space-between}
.badge{display:inline-flex;gap:8px;align-items:center;color:var(--muted);font-size:13px}
.price{font-size:34px;font-weight:900}
.timer{font-size:14px;color:var(--muted)}
.bottom{position:fixed;bottom:0;left:0;right:0;background:rgba(11,11,15,.9);backdrop-filter: blur(10px);display:flex;justify-content:space-around;padding:10px;border-top:1px solid rgba(255,255,255,.06)}
.tab{background:transparent;border:1px solid rgba(255,255,255,.12);color:var(--txt);padding:10px 14px;border-radius:14px;text-decoration:none}
.tab.active{border-color:rgba(102,255,153,.6)}
.skeleton .meta .line{height:12px;background:rgba(255,255,255,.08);border-radius:10px;margin:10px 0}
.w60{width:60%}.w40{width:40%}.w30{width:30%}
.modal{position:fixed;inset:0;display:grid;place-items:end center;z-index:20}
.backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6)}
.sheet{position:relative;width:min(560px,100vw);background:#0f0f18;border-top-left-radius:22px;border-top-right-radius:22px;border:1px solid rgba(255,255,255,.08);padding:12px 14px 18px;z-index:2}
.sheetHead{display:flex;align-items:center;justify-content:space-between}
.mTitle{font-weight:900;font-size:18px}
.mBody{padding-top:10px}
.mRow{display:flex;gap:10px}
.pill{padding:8px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.12);color:var(--muted);font-size:13px}
.mPrice{font-size:42px;font-weight:950;margin:12px 0 2px}
.mTime{color:var(--muted);margin-bottom:12px}
.hidden{display:none}
.holdBox{margin-top:10px;border-top:1px solid rgba(255,255,255,.08);padding-top:12px}
.holdMsg{color:var(--muted);margin-bottom:10px}
.slots{display:flex;flex-direction:column;gap:10px;margin-bottom:10px}
.slotBtn{background:transparent;border:1px solid rgba(255,255,255,.14);color:var(--txt);padding:12px;border-radius:14px;text-align:left}
.hint{color:var(--muted);font-size:13px;margin:10px 0}
.alt input{width:100%;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#0b0b12;color:var(--txt);margin:6px 0}
.form{padding:14px 14px 28px;max-width:560px;margin:0 auto}
.form label{display:block;color:var(--muted);margin-top:12px;margin-bottom:6px}
.form input,.form select{width:100%;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#0b0b12;color:var(--txt)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.out{background:#0b0b12;border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:12px;color:#c7fbd6;white-space:pre-wrap}

/* ENLAZUM_RASTRO_EXTRAS */
.actions { display:flex; gap:10px; align-items:center; }
.pill.select { padding: 10px 12px; }
select.pill { appearance:none; -webkit-appearance:none; -moz-appearance:none; }
select.pill.select { border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04); color:#fff; border-radius:999px; }

.mHero { height:160px; border-radius:18px; background:rgba(255,255,255,.06); margin:8px 0 14px; }
.desc { color: rgba(255,255,255,.78); line-height:1.35; margin: 8px 0 14px; white-space:pre-wrap; }
.slotBtn { width:100%; text-align:left; padding:12px 14px; border-radius:14px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04); color:#fff; margin-top:10px; }

.img { position:relative; overflow:hidden; }
.img::after { content:""; position:absolute; inset:0; background: linear-gradient(135deg, rgba(0,0,0,.15), rgba(0,0,0,.55)); }
.imgTag { position:absolute; left:14px; top:14px; z-index:2; font-size:12px; padding:6px 10px; border-radius:999px; background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.12); }

/* ENLAZUM_RASTRO_EXTRAS */
.actions { display:flex; gap:10px; align-items:center; }
.pill.select { padding: 10px 12px; }
select.pill { appearance:none; -webkit-appearance:none; -moz-appearance:none; }
select.pill.select { border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04); color:#fff; border-radius:999px; }

.mHero { height:160px; border-radius:18px; background:rgba(255,255,255,.06); margin:8px 0 14px; }
.desc { color: rgba(255,255,255,.78); line-height:1.35; margin: 8px 0 14px; white-space:pre-wrap; }
.slotBtn { width:100%; text-align:left; padding:12px 14px; border-radius:14px; border:1px solid rgba(255,255,255,.10); background:rgba(255,255,255,.04); color:#fff; margin-top:10px; }

.img { position:relative; overflow:hidden; }
.img::after { content:""; position:absolute; inset:0; background: linear-gradient(135deg, rgba(0,0,0,.15), rgba(0,0,0,.55)); }
.imgTag { position:absolute; left:14px; top:14px; z-index:2; font-size:12px; padding:6px 10px; border-radius:999px; background:rgba(0,0,0,.35); border:1px solid rgba(255,255,255,.12); }