
:root{color-scheme:dark;--brand:#fc4169;--brand2:#b64a69;--shade:#151822}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:#06080e;color:#fff;margin:0;font:15px/1.45 Inter,system-ui,-apple-system,Arial,sans-serif;min-height:100vh}
a{color:inherit}button,select{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible{outline:2px solid #fff;outline-offset:3px}
.backdrop{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 88% 9%,color-mix(in srgb,var(--brand) 18%,transparent),transparent 50%);z-index:-1}
.bar{display:flex;align-items:center;gap:14px;padding:15px max(20px,calc((100vw - 1470px)/2));min-height:74px;border-bottom:1px solid #fff2;background:#0a0c14e8;position:sticky;top:0;z-index:100;backdrop-filter:blur(16px)}
.logo{font-size:25px;font-weight:950;color:var(--brand)}.logo small{font-size:13px;color:white;font-weight:800;padding-left:8px}.bar>a{margin-left:auto;border:1px solid #fff4;background:#1b1c28;border-radius:14px;padding:9px 14px;text-decoration:none;font-size:12px}
.layout{display:grid;grid-template-columns:250px minmax(0,1fr);max-width:1470px;margin:auto;min-height:calc(100vh - 74px)}
.side{background:#0e111acc;border-right:1px solid #fff2;padding:22px 13px}.side h2{font-size:11px;color:#afb1c3;letter-spacing:1px;text-transform:uppercase;margin:20px 12px 12px}.side button{display:flex;width:100%;text-align:left;align-items:center;gap:10px;margin:5px 0;background:transparent;color:#dedde7;border:0;padding:11px 13px;border-radius:12px}.side button.active{background:color-mix(in srgb,var(--brand) 22%,#171822);color:#fff;box-shadow:inset 3px 0 var(--brand)}.side-note{border:1px solid #fff2;background:#ffffff08;padding:14px;border-radius:14px;font-size:12px;color:#c2c3cb;margin-top:20px}
main{min-width:0;padding:18px clamp(14px,2.5vw,36px) 115px}.eyebrow{color:var(--brand);font-size:11px;font-weight:800;letter-spacing:2px;margin:0 0 5px;text-transform:uppercase}
.hero{position:relative;border-radius:22px;border:1px solid #ffffff30;padding:28px 30px;min-height:220px;display:flex;align-items:end;overflow:hidden;background:radial-gradient(ellipse at 70% 25%,color-mix(in srgb,var(--brand) 32%,transparent),transparent 56%),linear-gradient(120deg,#13101a,#151b27);box-shadow:0 16px 55px #0006}.hero:after{content:'✦';font-size:200px;color:color-mix(in srgb,var(--brand) 22%,transparent);position:absolute;top:-95px;right:15px;transform:rotate(-30deg)}.hero h1{position:relative;z-index:1;font-size:clamp(26px,4vw,50px);margin:0 0 5px;letter-spacing:-1px}.hero p{margin:0;color:#e5e5ea;position:relative;z-index:1}.avatar{width:84px;height:84px;border-radius:50%;border:3px solid var(--brand);background:linear-gradient(140deg,var(--brand),#171522);display:grid;place-items:center;font-size:40px;position:relative;z-index:1;flex:none;margin-right:20px;box-shadow:0 0 24px color-mix(in srgb,var(--brand) 45%,transparent)}
.controls{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:19px 0}.controls label{color:#c7c4d1;font-size:12px;font-weight:800}.controls select{display:block;margin-top:5px;color:white;background:#1a1b26;border:1px solid #fff4;border-radius:12px;padding:10px 11px;min-width:180px}.btn{background:var(--brand);color:#090811;padding:10px 14px;border:0;border-radius:12px;font-weight:800}.helper{margin-left:auto;max-width:320px;font-size:12px;color:#bdbecc}
.tabs{display:flex;gap:9px;overflow-x:auto;border-bottom:1px solid #fff3;padding:7px 0 14px;scrollbar-width:none}.tabs button{border:1px solid #fff2;border-radius:99px;padding:10px 15px;background:#171b24;color:#c7c9d4;white-space:nowrap}.tabs button.active{background:var(--brand);color:#08090c;font-weight:900}
.heading{font-size:21px;line-height:1.3;margin:22px 0 14px}.heading small{display:block;font-weight:450;color:#b3b8c2;font-size:12px;margin-top:4px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.card{min-width:0;background:linear-gradient(140deg,color-mix(in srgb,var(--brand) 14%,#161b26),#0b1119);border:1px solid color-mix(in srgb,var(--brand) 46%,#293042);border-radius:16px;min-height:158px;display:flex;flex-direction:column;justify-content:end;padding:14px;color:#fff;box-shadow:0 9px 28px #0006}.card big{font-size:30px;opacity:.8;margin-bottom:auto}.card b{font-size:17px;line-height:1.2}.card span{color:#cacbd3;font-size:12px;margin-top:4px}.card.hero-card{grid-column:span 2;min-height:228px}.card:hover{transform:translateY(-2px);border-color:var(--brand)}
.pins{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.pin{border:1px solid #fff3;background:#121622;border-radius:16px;min-width:0;min-height:190px;padding:12px}.pin strong{display:block;font-size:13px;margin:7px 0}.pin a.external{display:inline-block;margin-top:8px;color:#f0a0b6;font-size:12px;text-underline-offset:3px}.pin-frame{min-height:95px;display:grid;place-items:center;background:linear-gradient(145deg,#252633,#10131c);border-radius:11px;font-size:12px;color:#a8b1ba;text-align:center;padding:9px;overflow:hidden}.pin-frame:has(span){display:block}.pin-frame>span{display:block}.pin-frame a[data-pin-do]{display:inline-block!important;margin:9px auto}.small{font-size:12px;color:#b3b5c0}.disclaimer{padding:14px 16px;border-radius:12px;border:1px solid #fff3;margin:24px 0;color:#c0c2d0;background:#ffffff07;font-size:12px}
.bottom{display:none}
body[data-mode=sakura] .card{border-radius:26px;background:linear-gradient(145deg,#37213a,#1a1223);border-color:#fa94c38c}body[data-mode=sakura] .hero{background:radial-gradient(circle at 70% 5%,#bd6ba062,transparent 56%),linear-gradient(120deg,#331a2d,#15101f)}
body[data-mode=clasica] .cards{grid-template-columns:repeat(4,minmax(0,1fr))}body[data-mode=clasica] .card{min-height:120px}body[data-mode=clasica] .hero-card{grid-column:auto;min-height:120px}
body[data-mode=portal] .cards{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-mode=portal] .card{min-height:180px}body[data-mode=portal] .hero-card{grid-column:span 2;min-height:270px}
body[data-mode=mosaico] .cards{grid-template-columns:repeat(4,minmax(0,1fr))}body[data-mode=mosaico] .card{min-height:137px}body[data-mode=mosaico] .hero-card{grid-column:auto;min-height:137px}body[data-mode=mosaico] .pin{min-height:140px}
body[data-mode=salas] .cards{display:flex;flex-direction:column}body[data-mode=salas] .card{min-height:89px;flex-direction:row;align-items:center;justify-content:start;gap:20px}body[data-mode=salas] .card big{margin:0}body[data-mode=salas] .card b{min-width:160px}
body[data-mode=noche]{background:#030513}body[data-mode=noche] .hero{background:radial-gradient(circle at 80% 0%,#637fe674,transparent 50%),linear-gradient(120deg,#070e29,#110a23)}body[data-mode=noche] .card{background:linear-gradient(120deg,#091b35,#110d26);border-color:#7089cb78}
body[data-mode=editorial] h1,body[data-mode=editorial] .heading,body[data-mode=editorial] .card b{font-family:Georgia,serif}body[data-mode=editorial] .cards{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-mode=editorial] .hero-card{grid-column:span 2}body[data-mode=editorial] .card{min-height:188px}
body[data-mode=minimal] .hero{border-radius:8px;min-height:152px;background:#171b22}body[data-mode=minimal] .card{border-radius:8px;background:#171b22;border-color:#3c414d;min-height:90px;box-shadow:none}body[data-mode=minimal] .hero-card{min-height:90px}
@media(max-width:920px){.layout{grid-template-columns:1fr}.side{display:none}.pins{grid-template-columns:repeat(2,minmax(0,1fr))}.bottom{display:flex;position:fixed;z-index:99;bottom:0;left:0;right:0;justify-content:space-around;background:#0c0e17f5;border-top:1px solid #fff3;padding:8px}.bottom button{background:transparent;border:0;color:#c1c4ce;padding:7px;font-size:11px}.bottom button.current{color:var(--brand)}.bottom b{display:block;font-size:20px}}
@media(max-width:600px){.bar{padding:9px 14px;min-height:60px}.logo small{font-size:11px}.bar>a{padding:7px;font-size:11px}.hero{padding:16px;min-height:190px}.avatar{width:68px;height:68px;font-size:30px;margin-right:12px}.hero h1{font-size:26px}.controls{padding:12px 0}.controls label{width:calc(50% - 7px)}.controls select{min-width:0;width:100%;padding:9px;font-size:12px}.helper{max-width:none;margin-left:0}.cards,body[data-mode=clasica] .cards,body[data-mode=portal] .cards,body[data-mode=mosaico] .cards,body[data-mode=editorial] .cards{grid-template-columns:repeat(2,minmax(0,1fr))}.card{min-height:146px}.card.hero-card,body[data-mode=portal] .card.hero-card,body[data-mode=editorial] .card.hero-card{grid-column:span 2;min-height:188px}body[data-mode=minimal] .card.hero-card{min-height:120px}.card b{font-size:15px}.pins{grid-template-columns:repeat(2,minmax(0,1fr))}.pin{padding:9px}main{padding:13px 12px 90px}body[data-mode=salas] .card{gap:10px}.pin-frame{min-height:75px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
