:root { --black:#0b0b0d; --panel:#151518; --line:#303035; --white:#f3f0ec; --muted:#949197; --red:#ee2d38; --mono:'DM Mono',monospace; --sans:'Space Grotesk',sans-serif; }
* { box-sizing:border-box; } body { margin:0; min-height:100vh; color:var(--white); background:var(--black); font-family:var(--sans); } body:before { content:''; position:fixed; inset:0; opacity:.05; pointer-events:none; background-image:radial-gradient(#fff .5px,transparent .5px); background-size:5px 5px; } .noise { position:fixed; right:0; top:0; width:45vw; height:100vh; background:linear-gradient(135deg,transparent 42%,#8d1b23 43%,transparent 50%); filter:blur(75px); opacity:.2; pointer-events:none; }
.home-shell { width:min(100% - 40px,1000px); margin:auto; padding:28px 0 35px; position:relative; z-index:1; } .topbar { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); padding-bottom:22px; } .brand { display:flex; align-items:center; gap:13px; color:var(--white); text-decoration:none; } .brand img { width:48px; height:48px; object-fit:contain; filter:grayscale(1) brightness(3); } .divider { height:30px; width:1px; background:var(--red); transform:skew(-18deg); } .brand-label { font:11px/1.2 var(--mono); letter-spacing:.1em; } .brand-label em { color:var(--red); font-style:normal; } .login-link { color:var(--white); text-decoration:none; font:11px var(--mono); letter-spacing:.08em; } .login-link span,.red { color:var(--red); }
.hero { padding:clamp(70px,12vw,145px) 0 90px; } .eyebrow,.section-label,footer { color:var(--red); font:11px var(--mono); letter-spacing:.14em; } h1 { font-size:clamp(5rem,15vw,10rem); line-height:.8; letter-spacing:-.1em; margin:20px 0 25px; } h1 span:not(.red) { color:transparent; -webkit-text-stroke:1px var(--white); } .hero p { color:#bbb8bc; font-size:18px; max-width:430px; line-height:1.45; } .activities { max-width:690px; } .section-label { margin-bottom:15px; } .activity-card { display:grid; grid-template-columns:55px 1fr 20px; align-items:center; gap:10px; padding:22px 18px; margin-bottom:9px; color:var(--white); text-decoration:none; background:var(--panel); border:1px solid var(--line); transition:.2s; } .activity-card:hover { border-color:var(--red); transform:translateX(4px); } .activity-number { color:var(--red); font:13px var(--mono); } .activity-card b { display:block; font-size:21px; letter-spacing:-.04em; } .activity-card small { display:block; color:var(--muted); font:12px var(--mono); margin-top:5px; } .activity-card strong { color:var(--red); font-size:21px; } footer { display:flex; justify-content:space-between; border-top:1px solid var(--line); margin-top:100px; padding-top:20px; color:var(--muted); font-size:10px; }
@media (max-width:600px) { .home-shell { width:min(100% - 30px,1000px); } .topbar { padding-bottom:17px; } .brand img { width:40px; height:40px; } .brand-label { font-size:9px; } .login-link { font-size:10px; } .hero { padding:75px 0 75px; } h1 { font-size:clamp(4.8rem,21vw,7rem); } .hero p { font-size:16px; } .activity-card b { font-size:19px; } .activity-card small { font-size:11px; } footer { margin-top:70px; font-size:9px; } }

/* EKOPARTY HOME / cyberpunk minimal brutalist skin */
:root { --black:#08090c; --panel:#121012; --line:#302326; --white:#f0ece8; --muted:#8e8587; --red:#ff3d4d; --cyan:#ff3d4d; --acid:#ded4d2; }
body { background:var(--black); color:var(--white); overflow-x:hidden; }
body:after { content:''; position:fixed; inset:0; pointer-events:none; opacity:.13; background:linear-gradient(rgba(255,61,77,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,61,77,.08) 1px,transparent 1px); background-size:46px 46px; mask-image:linear-gradient(to bottom,#000,transparent 80%); }
.noise { width:65vw; height:65vh; top:5vh; right:-15vw; background:var(--red); opacity:.12; filter:blur(135px); }
.home-shell { width:min(100% - 48px,1160px); padding-top:25px; }
.topbar { border-bottom:1px solid var(--red); padding-bottom:18px; box-shadow:0 12px 35px -28px var(--red); }
.brand img { width:42px; height:42px; filter:grayscale(1) brightness(2.7); }
.divider { background:var(--red); height:26px; }
.brand-label { color:var(--white); font-size:10px; }
.brand-label em { color:var(--cyan); }
.login-link { border:1px solid var(--red); padding:10px 13px; color:var(--white); transition:background .2s,color .2s; box-shadow:0 0 18px -14px var(--red); }
.login-link:hover { background:var(--red); color:var(--black); box-shadow:0 0 22px -5px var(--red); }
.login-link span { color:var(--red); }
.hero { min-height:475px; padding:clamp(85px,13vw,150px) 0 75px; display:flex; flex-direction:column; justify-content:center; position:relative; }
.hero:before { content:'MS // 001'; position:absolute; top:32px; right:0; color:var(--muted); font:10px var(--mono); letter-spacing:.14em; }
.eyebrow,.section-label,footer { color:var(--cyan); font-size:10px; }
h1 { max-width:920px; font-size:clamp(5.6rem,16vw,12rem); line-height:.76; letter-spacing:-.12em; margin:23px 0 30px; text-transform:uppercase; }
h1 span:not(.red) { -webkit-text-stroke:1px var(--red); }
h1 .red { color:var(--red); }
.hero p { color:var(--muted); font:14px/1.5 var(--mono); max-width:430px; border-left:2px solid var(--red); padding-left:14px; }
.activities { max-width:850px; border-top:1px solid var(--line); padding-top:17px; }
.section-label { color:var(--acid); margin-bottom:13px; }
.activity-card { grid-template-columns:58px 1fr 25px; padding:19px 17px; margin-bottom:7px; background:rgba(16,19,25,.88); border:1px solid var(--line); }
.activity-card:hover { border-color:var(--red); transform:translateX(7px); box-shadow:8px 0 0 var(--red),0 0 28px -18px var(--red); }
.activity-number { color:var(--acid); }
.activity-card b { font-size:22px; letter-spacing:.01em; font-weight:600; }
.activity-card small { color:var(--muted); font-size:11px; }
.activity-card strong { color:var(--red); }
footer { border-color:var(--line); color:var(--muted); margin-top:90px; }
@media (max-width:600px) { .home-shell { width:min(100% - 30px,1160px); } .topbar { padding-bottom:14px; } .login-link { padding:8px 9px; font-size:9px; } .hero { min-height:455px; padding:92px 0 70px; } .hero:before { top:27px; } h1 { font-size:clamp(5rem,22vw,7.2rem); letter-spacing:-.13em; } .hero p { font-size:13px; } .activity-card { grid-template-columns:43px 1fr 18px; padding:18px 12px; } .activity-card b { font-size:18px; } .activity-card small { font-size:10px; } }
.activity-info { min-width:0; } .activity-info em { display:block; color:var(--red); font:10px var(--mono); font-style:normal; letter-spacing:.14em; margin-top:14px; } .activity-info .prizes { color:#b7abad; line-height:1.55; white-space:normal; }
.activity-info>small { font-size:15px !important; line-height:1.45; } .activity-info .prizes { display:block; margin-top:7px; font:14px/1.55 var(--mono); color:#c7bec0; } .activity-info .prizes span { display:block; margin-top:7px; } .activity-info .prizes strong { color:var(--white); font-weight:500; } .activity-card { align-items:start; } .activity-card>.activity-number,.activity-card>strong { margin-top:3px; }
@media (max-width:600px) { .activity-info>small { font-size:14px !important; } .activity-info .prizes { font-size:13px; line-height:1.55; } .activity-info .prizes span { margin-top:9px; } .activity-info em { font-size:11px; margin-top:18px; } }
.activity-card { padding:26px 20px; } .activity-info>b { display:block; font-size:clamp(1.65rem,3vw,2.25rem); line-height:1; letter-spacing:-.045em; } .activity-info>small { display:block; margin-top:8px; color:var(--muted); font-size:13px !important; line-height:1.35; } .activity-info em { display:inline-block; margin-top:18px; padding:5px 7px; border:1px solid var(--red); color:var(--red); font-size:9px; letter-spacing:.16em; } .activity-info .prizes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 18px; margin-top:5px; font-size:11px; line-height:1.4; color:#b7abad; } .activity-info .prizes span { padding:10px 0; margin:0; border-top:1px solid var(--line); } .activity-info .prizes strong { color:var(--red); font:10px var(--mono); letter-spacing:.04em; } .activity-card>.activity-number { color:var(--muted); } .activity-card>strong { color:var(--red); }
@media (max-width:600px) { .activity-card { padding:22px 14px; } .activity-info>b { font-size:1.65rem; } .activity-info>small { font-size:12px !important; } .activity-info .prizes { grid-template-columns:1fr; font-size:11px; } .activity-info em { margin-top:15px; } }
.activity-info .prizes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px 24px; margin-top:12px; font-size:12px; line-height:1.35; } .activity-info .prize-place { display:grid; align-content:start; gap:7px; padding-top:12px; border-top:1px solid var(--line); } .activity-info .prize-place>strong { color:var(--red); font:10px var(--mono); letter-spacing:.12em; } .activity-info .prize-place i { display:flex; align-items:flex-start; gap:8px; color:#c7bec0; font:12px/1.35 var(--mono); font-style:normal; } .activity-info .prize-place i>span { width:17px; flex:0 0 17px; color:var(--red); font-size:15px; line-height:1; text-align:center; } .activity-info .prizes>span:not(.prize-place) { display:none; }
.activity-info .prize-place i>span { display:inline-grid; place-items:center; width:18px; height:18px; flex:0 0 18px; background:var(--red); color:var(--black); font:700 12px/18px Arial,sans-serif; border-radius:2px; }
.activity-info .prize-place i>span.emoji-icon { width:22px; height:22px; flex:0 0 22px; background:transparent; color:initial; font:16px/22px "Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif; border-radius:0; }
.activity-info .prize-place i { align-items:center; min-height:25px; } .activity-info .prize-place i>span.emoji-icon { display:grid; place-items:center; line-height:1; vertical-align:middle; } .activity-info .prize-place i { overflow-wrap:anywhere; }
.activity-info .prize-place i { display:block; min-height:0; line-height:1.5; } .activity-info .prize-place i>span { display:none; }
@media (max-width:600px) { .activity-info .prizes { grid-template-columns:1fr; gap:12px; font-size:12px; } .activity-info .prize-place { padding-top:11px; } .activity-info .prize-place i { font-size:12px; } }
/* Legibilidad: escala final para lectura cómoda en pantalla y móvil. */
.brand-label{font-size:13px}.login-link{font-size:13px}.eyebrow,.section-label,footer{font-size:13px}.hero p{font-size:18px}.activity-info>b{font-size:clamp(1.9rem,3.5vw,2.65rem)}.activity-info>small{font-size:16px!important}.activity-info em{font-size:12px}.activity-info .prizes{font-size:15px;line-height:1.5}.activity-info .prize-place>strong{font-size:12px}.activity-info .prize-place i{font-size:15px;line-height:1.45}
@media(max-width:600px){.brand-label{font-size:11px}.login-link{font-size:11px}.eyebrow,.section-label,footer{font-size:11px}.hero p{font-size:16px}.activity-info>b{font-size:1.85rem}.activity-info>small{font-size:15px!important}.activity-info .prizes{font-size:14px}.activity-info .prize-place>strong{font-size:11px}.activity-info .prize-place i{font-size:14px}}