.menu-back{display:inline-flex;align-items:center;gap:10px;margin:0 0 34px;padding:19px 27px;border:2px solid #ffffff55;border-radius:14px;background:#ffffff0d;color:#fff;font-size:22px;font-weight:900;letter-spacing:.06em}.menu-back:active{transform:scale(.98);background:#ffffff1d}.score-actions{display:grid;grid-template-columns:1.2fr 1fr;gap:18px;margin-top:30px}.score-actions .danger{margin:0;width:100%;font-size:21px}.scores-button{height:70px;border:0;border-radius:14px;background:var(--yellow);color:var(--ink);font-size:22px;font-weight:950;letter-spacing:.07em;box-shadow:0 7px 0 #c89400}.scores-overlay{position:fixed;z-index:50;inset:0;display:grid;place-items:center;padding:42px;background:#020b1fd9;backdrop-filter:blur(9px)}.scores-panel{position:relative;width:min(940px,100%);max-height:90svh;overflow:auto;padding:48px;border:2px solid #ffffff25;border-radius:30px;background:linear-gradient(150deg,#123d75,#061a3d 68%);box-shadow:0 35px 90px #000a}.scores-panel h2{margin:8px 0 24px;font-size:55px}.scores-panel>h3{margin:28px 0 16px;color:var(--yellow);font-size:29px;text-transform:uppercase}.scores-close{position:absolute;right:25px;top:23px;width:58px;height:58px;border:1px solid #ffffff55;border-radius:50%;background:#ffffff12;color:#fff;font-size:38px;line-height:1}.score-tabs{display:grid;grid-template-columns:repeat(6,1fr);gap:9px}.score-tabs button{height:62px;border:2px solid #ffffff28;border-radius:12px;background:#ffffff0b;color:#d5e2f1;font-weight:900;font-size:18px}.score-tabs button.active{border-color:var(--yellow);background:var(--yellow);color:var(--ink)}.ranking{display:grid;gap:10px}.ranking-row{display:grid;grid-template-columns:58px 1fr auto;align-items:center;min-height:68px;padding:8px 18px;border-radius:13px;background:#ffffff10;font-size:23px}.ranking-row>b{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#ffffff12;color:var(--yellow)}.ranking-row span{font-weight:800}.ranking-row strong{font-variant-numeric:tabular-nums;color:#fff}.ranking-row:first-child{background:#ffc92822;border:2px solid #ffc92880}.empty-score{padding:55px 20px;text-align:center;color:#bfd0e4;font-size:24px}.menu-intro{font-size:30px}.line-name{font-size:28px}.record{font-size:17px}.instructions h3{font-size:26px}.instructions ol{font-size:22px}.brand-card strong{font-size:17px}.drop-zone>p{font-size:20px}.tap-tip{font-size:19px}.feedback{font-size:23px}

:root{--navy:#071b3f;--blue:#0b2d63;--mid:#164d8b;--yellow:#ffc928;--cream:#f4f6fa;--red:#ef5454;--ink:#061631}

.app-shell{background-position:center;background-repeat:no-repeat;background-size:cover}.app-shell::before{content:"";position:absolute;z-index:0;inset:0;pointer-events:none;background:linear-gradient(180deg,#01082b22 0%,#01082b12 45%,#01082b70 100%)}.app-shell.screen-welcome{background-image:url('backgrounds/cover.png');background-position:center top}.app-shell:not(.screen-welcome){background-image:url('backgrounds/inner.png');background-position:center;background-size:cover}.app-shell:not(.screen-welcome)::before{background:linear-gradient(180deg,#02122e55,#02122e6b)}.screen-welcome .ambient{display:none}
*{box-sizing:border-box}html,body{margin:0;overflow-x:hidden;min-height:100%;background:#03122d;color:white;font-family:Arial,Helvetica,sans-serif}button,input{font:inherit}.app-shell{position:relative;width:100%;max-width:1080px;min-height:100svh;margin:auto;overflow:hidden;background:linear-gradient(155deg,#092e69 0%,#061a3d 58%,#03122d 100%)}.ambient{position:absolute;border-radius:50%;filter:blur(1px);pointer-events:none}.a1{width:620px;height:620px;right:-260px;top:-210px;background:radial-gradient(circle,#1f69b466,transparent 67%)}.a2{width:520px;height:520px;left:-310px;bottom:10%;background:radial-gradient(circle,#1361aa55,transparent 68%)}.screen{position:relative;z-index:1;min-height:100svh;padding:72px 62px}.eyebrow{margin:0;color:#8fb1da;font-size:24px;font-weight:800;letter-spacing:.22em}.star{display:grid;place-items:center;width:104px;height:104px;color:var(--yellow);font-size:84px;filter:drop-shadow(0 12px 18px #0004)}.star.small{display:inline;font-size:25px;width:auto;height:auto}.welcome{display:flex;flex-direction:column;align-items:center;text-align:center;padding-top:160px}.hero-mark{display:flex;align-items:center;font-weight:900;letter-spacing:.22em;font-size:22px}.hero-mark .star{width:82px;height:82px;font-size:66px}.welcome>.eyebrow{margin-top:82px}.welcome h1{font-size:98px;line-height:.9;letter-spacing:-.055em;margin:24px 0 34px;font-weight:950}.welcome h1 em,.finish h2 em{color:var(--yellow);font-style:normal}.lead{font-size:29px;line-height:1.45;max-width:690px;color:#d2e1f3}.name-card{width:100%;margin-top:95px;padding:42px;background:#fff;border-radius:28px;box-shadow:0 28px 80px #0006;text-align:left}.name-card label{color:#173765;font-size:20px;letter-spacing:.12em;font-weight:900}.name-card input{width:100%;height:88px;margin:18px 0 24px;border:3px solid #dae3ef;border-radius:15px;padding:0 25px;color:var(--ink);font-size:29px;outline:none}.name-card input:focus{border-color:#3e74ac}.primary,.secondary{width:100%;height:90px;border:0;border-radius:15px;font-weight:950;letter-spacing:.06em;font-size:24px}.primary{background:var(--yellow);color:var(--ink);box-shadow:0 10px 0 #c89400}.primary:disabled{opacity:.45}.primary span{float:right;font-size:35px}.foot-note{margin-top:auto;color:#a9c1df;font-weight:700;font-size:20px}.menu header{display:flex;justify-content:space-between;align-items:center}.menu header h2,.game-head h2{font-size:58px;margin:9px 0 0;letter-spacing:-.04em}.menu header .star{width:86px;height:86px;font-size:70px}.menu-intro{font-size:26px;line-height:1.45;color:#c9d9ec;margin:36px 0}.line-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.line-card{position:relative;min-height:225px;border:1px solid #ffffff2e;border-radius:22px;background:linear-gradient(145deg,#123f77,#092755);color:#fff;text-align:left;padding:26px;box-shadow:0 18px 25px #0002;overflow:hidden}.line-card:active{transform:scale(.98)}.line-number{position:absolute;right:17px;top:12px;color:#ffffff20;font-size:65px;font-weight:950}.line-icon{display:grid;place-items:center;width:62px;height:62px;border-radius:16px;background:var(--yellow);color:var(--ink);font-weight:950;font-size:19px}.line-name{display:block;margin-top:20px;font-size:25px;font-weight:900;max-width:85%}.record{display:block;color:#90b4dd;font-size:14px;font-weight:800;margin-top:18px;letter-spacing:.06em}.record b{display:block;color:white;margin-top:4px}.arrow{position:absolute;right:20px;bottom:16px;color:var(--yellow);font-size:30px}.instructions{margin-top:28px;background:#ffffff0c;border-left:8px solid var(--yellow);padding:25px 30px;border-radius:8px 18px 18px 8px}.instructions h3{font-size:22px;margin:0 0 14px;color:var(--yellow)}.instructions ol{margin:0;padding-left:25px;color:#ccdaeb;font-size:18px;line-height:1.6}.danger{display:block;margin:28px auto 0;border:1px solid #e66a6a88;color:#ff9d9d;background:transparent;padding:16px 28px;border-radius:12px;font-weight:800}.game{padding:44px 48px 58px}.game-head{display:grid;grid-template-columns:60px 1fr auto;gap:24px;align-items:center}.game-head h2{font-size:41px;text-transform:uppercase}.back{width:58px;height:58px;border-radius:50%;border:1px solid #ffffff4d;background:#ffffff12;color:white;font-size:30px}.timer{text-align:right}.timer span{display:block;color:#8fb1da;font-size:15px;font-weight:900;letter-spacing:.15em}.timer b{font-variant-numeric:tabular-nums;font-size:31px;color:var(--yellow)}.progress-row{display:flex;justify-content:space-between;margin:38px 0 9px;color:#a8bfdc;font-weight:900;font-size:17px;letter-spacing:.1em}.progress-row b{color:white}.progress{height:12px;background:#ffffff1a;border-radius:20px;overflow:hidden}.progress i{display:block;height:100%;background:var(--yellow);transition:width .3s}.drop-zone{min-height:405px;margin-top:30px;border:4px dashed #ffc928aa;border-radius:28px;background:linear-gradient(145deg,#ffc92818,#ffc92808);display:flex;flex-direction:column;align-items:center;text-align:center;padding:25px 30px;transition:.2s}.drop-zone.armed{background:#ffc9282b;box-shadow:0 0 0 7px #ffc92820}.drop-zone .star{height:80px;font-size:67px}.drop-zone h3{margin:0;color:var(--yellow);font-size:29px;line-height:1.05;letter-spacing:.06em}.drop-zone>p{margin:11px 0;color:#b9cce3;font-size:17px}.found-list{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;width:100%;margin-top:9px}.found-brand{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;background:white;color:var(--ink);font-size:15px;font-weight:900}.found-brand span{color:var(--yellow)}.found-brand b{color:#20a46b}.feedback{height:44px;padding-top:10px;text-align:center;color:var(--yellow);font-size:18px;font-weight:900}.bank-title{display:flex;align-items:end;justify-content:space-between;margin:10px 0 16px}.bank-title h3{margin:0;font-size:23px}.bank-title span{color:#8fb1da;font-size:16px}.brand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.brand-card{touch-action:none;min-height:140px;border:3px solid transparent;border-radius:17px;background:#fff;color:var(--ink);padding:11px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 10px 22px #0003}.brand-card.selected{border-color:var(--yellow);transform:translateY(-5px);box-shadow:0 10px 0 var(--yellow)}.brand-card img{max-width:100%;max-height:80px;object-fit:contain}.logo-placeholder{display:grid;place-items:center;width:62px;height:62px;border-radius:17px;background:#e5edf7;color:#174f8b;font-weight:950;font-size:23px}.brand-card strong{font-size:14px;margin-top:8px;text-transform:uppercase}.tap-tip{text-align:center;color:#8fa9ca;font-size:15px}.drag-ghost{position:fixed;z-index:20;transform:translate(-50%,-50%) rotate(-3deg);pointer-events:none;background:white;color:var(--ink);border:5px solid var(--yellow);padding:24px;border-radius:14px;font-weight:950;box-shadow:0 25px 60px #0009}.finish{display:flex;flex-direction:column;align-items:center;text-align:center;padding-top:190px}.burst{display:grid;place-items:center;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,#ffc92838 0 45%,transparent 46%),repeating-conic-gradient(from 0deg,#ffc928 0 3deg,transparent 3deg 23deg)}.burst .star{font-size:100px}.finish>.eyebrow{margin-top:62px}.finish h2{font-size:70px;line-height:1;margin:25px 0}.finish>p:not(.eyebrow){font-size:25px;color:#c6d6e9;max-width:690px;line-height:1.4}.result-time{width:100%;margin-top:58px;background:#fff;border-radius:25px;padding:32px;color:var(--ink)}.result-time span{display:block;letter-spacing:.15em;font-weight:900;color:#587393}.result-time b{font-size:82px;font-variant-numeric:tabular-nums}.new-record{margin-top:22px;color:var(--yellow);font-size:24px;font-weight:950;letter-spacing:.1em}.finish-actions{width:100%;margin-top:65px;display:grid;gap:22px}.secondary{background:transparent;color:white;border:2px solid #ffffff55}
.lighthouse{position:relative;width:150px;height:155px;margin:0 auto 8px;filter:drop-shadow(0 12px 18px #0007)}.lighthouse span,.lighthouse i{position:absolute;display:block}.lighthouse .tower{left:53px;top:63px;width:45px;height:78px;background:linear-gradient(90deg,#d7e0ea,#fff 48%,#b6c4d6);clip-path:polygon(20% 0,80% 0,100% 100%,0 100%)}.lighthouse .base{left:38px;top:136px;width:74px;height:13px;border-radius:5px;background:#d5deea}.lighthouse .lamp{left:48px;top:35px;width:54px;height:34px;border:5px solid #8da3ba;background:#273d59;border-radius:6px}.lighthouse .roof{left:40px;top:24px;width:70px;height:17px;background:var(--yellow);clip-path:polygon(50% 0,100% 100%,0 100%)}.lighthouse .beam{opacity:0;top:37px;width:170px;height:36px;background:linear-gradient(90deg,#ffd84d77,transparent);filter:blur(4px);transition:opacity .5s}.lighthouse .beam.left{right:95px;transform:scaleX(-1);transform-origin:right}.lighthouse .beam.right{left:95px}.drop-zone.lit{border-style:solid;background:radial-gradient(circle at 50% 22%,#ffe8753f,#ffc92812 46%,transparent 72%);box-shadow:inset 0 0 60px #ffc92822,0 0 35px #ffc92833}.lit .lamp{background:#fff7aa;box-shadow:0 0 18px #fff,0 0 52px var(--yellow)}.lit .beam{opacity:1;animation:beamPulse 1.15s ease-in-out infinite alternate}.found-brand{border:0;cursor:pointer}.found-brand b{font-size:19px;color:#e24444}.feedback.wrong{color:#ff8484}.feedback.success{color:#ffe36a;text-shadow:0 0 18px #ffc928}.ignite{display:block;width:100%;height:78px;margin:0 0 23px;border:0;border-radius:16px;background:var(--yellow);color:var(--ink);font-weight:950;font-size:22px;letter-spacing:.08em;box-shadow:0 8px 0 #c89400}.ignite:active{transform:translateY(5px);box-shadow:0 3px 0 #c89400}.ignite:disabled{opacity:.45}.ignite span{display:inline-grid;place-items:center;width:38px;height:38px;margin-right:10px;border-radius:50%;background:#092957;color:var(--yellow)}.finish-lighthouse{display:grid;place-items:center;width:290px;height:240px;border-radius:50%;background:radial-gradient(circle,#ffe97335,transparent 68%)}.finish-lighthouse .lighthouse{transform:scale(1.35);margin:0}@keyframes beamPulse{from{opacity:.55}to{opacity:1}}
@media(max-width:700px){.screen{padding-left:26px;padding-right:26px}.welcome{padding-top:80px}.welcome h1{font-size:58px}.welcome>.eyebrow{margin-top:40px}.name-card{margin-top:40px;padding:24px}.line-grid{gap:10px}.line-card{min-height:185px;padding:18px}.line-name{font-size:20px}.game{padding:25px 18px}.game-head{grid-template-columns:46px 1fr auto;gap:10px}.game-head h2{font-size:24px}.back{width:44px;height:44px}.timer b{font-size:21px}.drop-zone{min-height:330px}.brand-grid{gap:8px}.brand-card{min-height:110px}.finish{padding-top:80px}.finish h2{font-size:50px}}
@media(min-width:900px) and (min-height:1600px){.screen{min-height:1920px}.game{padding-top:70px}.brand-card{min-height:175px}.drop-zone{min-height:470px}.line-card{min-height:245px}.menu-intro{margin-bottom:48px}.menu-intro{font-size:31px}.line-name{font-size:30px}.record{font-size:18px;line-height:1.35}.instructions h3{font-size:29px}.instructions ol{font-size:24px;line-height:1.55}.game-head h2{font-size:48px}.progress-row{font-size:22px}.drop-zone h3{font-size:35px}.drop-zone>p{font-size:22px}.found-brand{font-size:20px;padding:13px 18px}.feedback{font-size:25px;height:54px}.ignite{height:88px;font-size:27px}.bank-title h3{font-size:29px}.bank-title span{font-size:21px}.brand-card strong{font-size:19px;line-height:1.15}.tap-tip{font-size:21px;line-height:1.4}}

.menu-intro{font-size:30px}.line-name{font-size:28px}.record{font-size:17px;line-height:1.4}.instructions h3{font-size:26px}.instructions ol{font-size:22px;line-height:1.6}.brand-card strong{font-size:17px;line-height:1.2}.drop-zone>p{font-size:20px}.tap-tip{font-size:19px;line-height:1.4}.feedback{font-size:23px}
@media(min-width:900px) and (min-height:1600px){.menu-intro{font-size:34px}.line-name{font-size:33px}.record{font-size:21px}.instructions h3{font-size:32px}.instructions ol{font-size:27px}.brand-card strong{font-size:22px}.drop-zone>p{font-size:25px}.tap-tip{font-size:23px}.feedback{font-size:28px}}

/* Portada: un único lienzo vertical 1080 × 1920, sin repetición. */
.app-shell.screen-welcome{width:min(1080px,100%);height:1920px;min-height:1920px;max-height:1920px;background-color:#020737;background-image:url('backgrounds/cover.png');background-repeat:no-repeat;background-position:center 135px;background-size:1500px 2667px}.screen-welcome .welcome{height:1920px;min-height:1920px;max-height:1920px;padding-top:65px;overflow:hidden}
.cover-logo{display:block;width:min(800px,92%);height:auto;margin:0 auto;object-fit:contain;filter:drop-shadow(0 14px 28px #0008)}.screen-welcome .lead{margin-top:38px;text-shadow:0 3px 16px #000}.screen-welcome .name-card{margin-top:315px}
@media(max-width:1079px){.app-shell.screen-welcome{height:100svh;min-height:100svh;max-height:none;background-size:cover}.screen-welcome .welcome{height:100svh;min-height:100svh;max-height:none}}

.line-icon{width:63.36%;height:66px;padding:0;background:transparent;border-radius:0;place-items:center start}.line-icon img{display:block;max-width:100%;max-height:100%;object-fit:contain;object-position:left center;filter:drop-shadow(0 5px 10px #0005)}.line-icon-respiratoria{width:80%}.line-icon-urogin{transform:translateY(-30px)}

/* Responsive táctil: conserva el diseño original en iPad, tablets y teléfonos. */
html{-webkit-text-size-adjust:100%;touch-action:manipulation;overscroll-behavior:none}body{width:100%;overflow-x:hidden;overscroll-behavior:none}button,input{-webkit-tap-highlight-color:transparent}button{min-width:44px;min-height:44px}.app-shell{width:100%;min-height:100dvh}.screen{padding-bottom:max(58px,env(safe-area-inset-bottom));padding-left:max(26px,env(safe-area-inset-left));padding-right:max(26px,env(safe-area-inset-right))}.brand-card,.line-card,.found-brand{user-select:none;-webkit-user-select:none}.brand-card{touch-action:none}.scores-panel{-webkit-overflow-scrolling:touch}
@media (min-width:701px) and (max-width:1024px){.screen{padding:52px 42px}.screen-welcome .welcome{padding-top:48px}.cover-logo{width:min(650px,78%)}.screen-welcome .lead{margin-top:20px;font-size:26px}.screen-welcome .name-card{margin-top:clamp(120px,22vh,275px);padding:34px}.menu header h2{font-size:50px}.line-card{min-height:205px}.instructions ol{font-size:20px}.game{padding:38px 34px 60px}.game-head h2{font-size:34px}.drop-zone{min-height:390px}.brand-card{min-height:135px}.brand-card strong{font-size:16px}.finish{padding-top:100px}.scores-panel{max-height:calc(100dvh - 60px)}}
@media (max-width:700px){.app-shell.screen-welcome,.screen-welcome .welcome{min-height:100dvh;height:100dvh}.screen-welcome .welcome{padding-top:30px}.cover-logo{width:min(470px,88%)}.screen-welcome .lead{margin-top:14px;font-size:20px}.screen-welcome .name-card{margin-top:auto;margin-bottom:28px}.foot-note{margin-top:0}.menu{padding-top:30px}.menu-back{margin-bottom:22px;font-size:16px}.menu header h2{font-size:38px}.menu-intro{font-size:21px;margin:22px 0}.line-card{min-height:150px}.line-icon{width:72%;height:58px}.line-icon-respiratoria{width:88%}.line-icon-urogin{transform:translateY(-18px)}.instructions ol{font-size:17px}.score-actions{grid-template-columns:1fr}.brand-grid{grid-template-columns:repeat(2,1fr)}.brand-card{min-height:112px}.drop-zone{min-height:300px}.scores-overlay{padding:14px}.scores-panel{padding:30px 20px;max-height:calc(100dvh - 28px)}.score-tabs{grid-template-columns:repeat(3,1fr)}.ranking-row{font-size:17px;grid-template-columns:48px 1fr auto}.finish{padding-top:55px}.result-time b{font-size:58px}}
@media (orientation:landscape) and (max-height:850px){.app-shell.screen-welcome,.screen-welcome .welcome{height:auto;min-height:100dvh;max-height:none}.screen-welcome .name-card{margin-top:45px}.screen{min-height:100dvh}.line-grid{grid-template-columns:repeat(3,1fr)}.game{padding-top:24px}.drop-zone{min-height:270px}.brand-grid{grid-template-columns:repeat(5,1fr)}}

/* Tipografía más compacta en dispositivos, sin alterar 1080 × 1920. */
@media (min-width:701px) and (max-width:1024px){.eyebrow{font-size:20px}.screen-welcome .lead{font-size:23px}.name-card label{font-size:18px}.name-card input{font-size:25px}.primary,.secondary{font-size:21px}.menu-back{font-size:19px}.menu header h2{font-size:44px}.menu-intro{font-size:24px}.instructions h3{font-size:23px}.instructions ol{font-size:18px}.scores-button,.score-actions .danger{font-size:18px}.game-head h2{font-size:30px}.timer b{font-size:27px}.progress-row{font-size:16px}.drop-zone h3{font-size:26px}.drop-zone>p{font-size:17px}.ignite{font-size:20px}.bank-title h3{font-size:21px}.brand-card strong{font-size:14px}.tap-tip{font-size:16px}.finish h2{font-size:60px}.finish>p:not(.eyebrow){font-size:22px}}
@media (max-width:700px){.eyebrow{font-size:16px}.screen-welcome .lead{font-size:18px}.name-card label{font-size:16px}.name-card input{height:68px;font-size:21px}.primary,.secondary{height:72px;font-size:18px}.foot-note{font-size:15px}.menu header h2{font-size:32px}.menu-intro{font-size:18px}.instructions h3{font-size:20px}.instructions ol{font-size:15px}.scores-button,.score-actions .danger{font-size:17px}.game-head h2{font-size:21px}.timer span{font-size:12px}.timer b{font-size:18px}.progress-row{font-size:13px}.drop-zone h3{font-size:23px}.drop-zone>p{font-size:15px}.found-brand{font-size:13px}.feedback{font-size:18px}.ignite{font-size:17px}.bank-title h3{font-size:19px}.bank-title span{font-size:14px}.brand-card strong{font-size:13px}.tap-tip{font-size:15px}.finish h2{font-size:44px}.finish>p:not(.eyebrow){font-size:19px}.result-time b{font-size:52px}}

/* Movimiento sutil de portada para reforzar la sensación de juego. */
.screen-welcome .welcome::before{content:"";position:absolute;z-index:-1;left:50%;top:285px;width:760px;height:260px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,#ffd43b30 0%,#ffd43b12 36%,transparent 72%);filter:blur(10px);animation:coverGlow 2.8s ease-in-out infinite alternate}.cover-logo{animation:coverLogoFloat 4.8s ease-in-out infinite;transform-origin:center}.screen-welcome .lead{animation:coverFadeUp .8s .15s both}.screen-welcome .name-card{animation:coverFadeUp .85s .28s both}.screen-welcome .primary:not(:disabled){animation:coverButtonPulse 2.3s 1.2s ease-in-out infinite}.cover-sparkles{position:absolute;z-index:0;inset:120px 8% auto;height:620px;pointer-events:none}.cover-sparkles i{position:absolute;width:8px;height:8px;border-radius:50%;background:#ffe66b;box-shadow:0 0 10px #fff,0 0 22px #ffc928;animation:coverTwinkle 2.6s ease-in-out infinite}.cover-sparkles i:nth-child(1){left:9%;top:42%;animation-delay:.2s}.cover-sparkles i:nth-child(2){left:25%;top:12%;width:5px;height:5px;animation-delay:1.1s}.cover-sparkles i:nth-child(3){right:16%;top:31%;animation-delay:.7s}.cover-sparkles i:nth-child(4){right:5%;top:63%;width:6px;height:6px;animation-delay:1.7s}.cover-sparkles i:nth-child(5){left:16%;top:74%;width:4px;height:4px;animation-delay:2.1s}.cover-sparkles i:nth-child(6){right:31%;top:8%;width:4px;height:4px;animation-delay:1.4s}@keyframes coverLogoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes coverGlow{from{opacity:.58;transform:translateX(-50%) scale(.94)}to{opacity:1;transform:translateX(-50%) scale(1.05)}}@keyframes coverTwinkle{0%,100%{opacity:.15;transform:scale(.55)}45%{opacity:1;transform:scale(1.25)}70%{opacity:.42;transform:scale(.8)}}@keyframes coverFadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes coverButtonPulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.12);box-shadow:0 10px 0 #c89400,0 0 24px #ffc92855}}@media(prefers-reduced-motion:reduce){.cover-logo,.screen-welcome .lead,.screen-welcome .name-card,.screen-welcome .primary,.screen-welcome .welcome::before,.cover-sparkles i{animation:none!important}}

/* Audio global, selección luminosa y countdown. */
.mute-button{position:fixed;z-index:110;top:max(16px,env(safe-area-inset-top));right:max(16px,calc((100vw - 1080px)/2 + 16px));display:flex;align-items:center;gap:8px;min-width:58px;height:54px;padding:0 15px;border:1px solid #ffffff52;border-radius:27px;background:#041936dd;color:#fff;box-shadow:0 8px 24px #0006;backdrop-filter:blur(10px);font-size:22px;font-weight:900}.mute-button span{font-size:12px;letter-spacing:.06em}.line-card:disabled{opacity:1;cursor:default}.line-icon,.line-icon-respiratoria{position:absolute;z-index:1;inset:0;width:100%;height:100%;padding:34px 66px;place-items:center;background:transparent}.line-icon img{max-width:100%;max-height:100%;object-position:center}.line-icon-urogin{transform:none}.line-number,.arrow{z-index:2}.line-card-selected{z-index:3;border-color:#ffe45f;background:linear-gradient(145deg,#1a5ca5,#0b3975);animation:lineSelectedGlow .56s ease-in-out both}.line-card-selected .line-icon img{filter:drop-shadow(0 0 10px #fff) drop-shadow(0 0 22px #ffc928)}@keyframes lineSelectedGlow{0%{transform:scale(1);box-shadow:0 18px 25px #0002}45%{transform:scale(1.035);box-shadow:0 0 24px #ffc928aa,0 0 55px #ffc92855}100%{transform:scale(1.015);box-shadow:0 0 18px #ffc92888}}.countdown-overlay{position:fixed;z-index:105;inset:0;display:grid;place-content:center;text-align:center;background:#02102bd9;backdrop-filter:blur(8px);pointer-events:all}.countdown-overlay p{margin:0 0 12px;color:#d5e5f6;font-size:26px;font-weight:900;letter-spacing:.2em}.countdown-overlay b{display:grid;place-items:center;width:190px;height:190px;margin:auto;border:5px solid #ffc928;border-radius:50%;background:#0a2f67;color:#ffc928;font-size:112px;line-height:1;box-shadow:0 0 32px #ffc92888,inset 0 0 35px #ffc92833;animation:countdownPop .72s ease-out both}@keyframes countdownPop{0%{opacity:0;transform:scale(.45)}45%{opacity:1;transform:scale(1.12)}100%{opacity:1;transform:scale(1)}}@media(max-width:700px){.mute-button{right:12px;top:max(12px,env(safe-area-inset-top));height:46px;padding:0 12px}.mute-button span{display:none}.line-icon,.line-icon-respiratoria{padding:26px 48px}.countdown-overlay p{font-size:19px}.countdown-overlay b{width:145px;height:145px;font-size:84px}}@media(prefers-reduced-motion:reduce){.line-card-selected,.countdown-overlay b{animation:none!important}}

.level-grid .level-locked{filter:saturate(.15);background:#071f43}.level-grid .level-locked .line-icon{opacity:.28}.level-grid .level-locked .line-number{opacity:.45}.level-grid .level-locked .arrow{font-size:24px;filter:grayscale(1)}.level-grid .level-done{border-color:#58d69c;background:linear-gradient(145deg,#124c61,#073751)}.level-grid .level-done .line-icon{opacity:.55}.level-grid .level-done .arrow{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#58d69c;color:#062c35;font-size:25px}.level-complete .result-time{margin-top:30px}.level-complete .finish-actions{margin-top:30px}

/* Ajuste final: el logo combinado de Urología/Salud Femenina se muestra completo. */
.line-icon-urogin{padding:14px 68px}
.line-icon-urogin img{width:auto;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center}
@media(max-width:700px){.line-icon-urogin{padding:10px 42px}}

/* Adaptación final para teléfonos, iPad/tablets y computadoras. */
html,body{width:100%;min-height:100%;overflow-x:hidden}
body{min-height:100dvh}
.app-shell{width:min(100%,1080px);min-height:100dvh}
.screen{min-height:100dvh}
button{cursor:pointer}

/* Computadoras con pantallas menos altas: la portada cabe en la ventana. */
@media (min-width:1080px) and (max-height:1919px){
  .app-shell.screen-welcome,.screen-welcome .welcome{height:100dvh;min-height:760px;max-height:none}
  .app-shell.screen-welcome{background-size:cover;background-position:center top}
  .screen-welcome .welcome{padding-top:clamp(35px,6vh,90px)}
  .cover-logo{width:min(620px,70%)}
  .screen-welcome .lead{margin-top:clamp(14px,3vh,32px)}
  .screen-welcome .name-card{margin-top:auto;margin-bottom:clamp(30px,7vh,90px);max-width:820px}
}

/* iPad y tablets en vertical u horizontal. */
@media (min-width:701px) and (max-width:1100px){
  .app-shell{max-width:100%}
  .screen{padding-left:max(34px,env(safe-area-inset-left));padding-right:max(34px,env(safe-area-inset-right))}
  .line-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .line-card{min-height:clamp(180px,22vw,230px)}
  .line-icon,.line-icon-respiratoria{padding:28px 58px}
  .line-icon-urogin{padding:12px 58px}
  .brand-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .brand-card{min-height:132px}
  .drop-zone{min-height:380px}
  .scores-panel{width:min(92vw,900px)}
}

.server-message{margin:14px 0 0;color:#ffd95a;text-align:center;font-size:16px;font-weight:900;line-height:1.35}
.menu-server-message{padding:12px 16px;border:1px solid #ffc92855;border-radius:12px;background:#ffc92812}
.result-status{margin:18px 0 0!important;color:#ffe067!important;font-size:17px!important;font-weight:900}

/* Teléfonos en vertical: juego completo en una sola pantalla, sin scroll. */
@media (max-width:700px) and (orientation:portrait){
  html,body{height:100%;overflow:hidden}
  .app-shell{height:100dvh;min-height:100dvh;max-height:100dvh;overflow:hidden}
  .screen{height:100dvh;min-height:0;max-height:100dvh;overflow:hidden}
  .screen.menu{overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}
  .game{display:flex;flex-direction:column;height:100dvh;padding:62px 12px max(7px,env(safe-area-inset-bottom));overflow:hidden}
  .game-head{flex:0 0 43px;grid-template-columns:38px minmax(0,1fr) auto;gap:8px}
  .back{width:38px;height:38px;min-height:38px;font-size:21px}
  .game-head .eyebrow{font-size:10px}
  .game-head h2{font-size:16px;line-height:1.05}
  .timer span{font-size:9px}.timer b{font-size:16px}
  .progress-row{flex:0 0 20px;margin:7px 0 3px;font-size:10px}
  .progress{flex:0 0 6px;height:6px}
  .drop-zone{flex:0 0 169px;min-height:169px;margin-top:7px;padding:4px 8px;border-width:2px;border-radius:15px;justify-content:flex-start}
  .drop-zone .lighthouse{flex:0 0 59px;width:95px;height:59px;margin:0 auto;transform:scale(.48);transform-origin:center top}
  .drop-zone h3{position:relative;z-index:2;margin:0;font-size:15px;line-height:1}
  .drop-zone>p{margin:3px 0;font-size:10px;line-height:1.15}
  .found-list{gap:3px;margin-top:2px;max-height:49px;overflow:auto}
  .found-brand{min-height:24px;padding:3px 6px;font-size:9px;border-radius:7px}
  .found-brand b{font-size:13px}
  .feedback{flex:0 0 21px;height:21px;padding-top:3px;font-size:12px}
  .ignite{position:static;flex:0 0 43px;height:43px;min-height:43px;margin:0 0 5px;border-radius:11px;font-size:13px;box-shadow:0 4px 0 #c89400}
  .ignite span{width:24px;height:24px;margin-right:5px}
  .bank-title{flex:0 0 20px;margin:0 0 4px}
  .bank-title h3{font-size:13px}.bank-title span{font-size:10px}
  .brand-grid{flex:1 1 0;min-height:0;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(5,minmax(0,1fr));gap:4px}
  .brand-card{height:auto;min-height:0;padding:3px;border-width:2px;border-radius:8px;box-shadow:0 4px 8px #0003}
  .logo-placeholder{width:27px;height:27px;border-radius:6px;font-size:11px}
  .brand-card strong{margin-top:2px;font-size:8px;line-height:1}
  .tap-tip{flex:0 0 auto;margin:4px 0 0;font-size:9px;line-height:1}
  .drag-ghost{padding:12px;font-size:13px}
}

@media (max-width:700px) and (orientation:portrait) and (max-height:700px){
  .game{padding-top:55px}
  .drop-zone{flex-basis:145px;min-height:145px}
  .drop-zone .lighthouse{flex-basis:48px;height:48px;transform:scale(.4)}
  .brand-card{height:auto}
  .logo-placeholder{width:23px;height:23px;font-size:10px}
  .brand-card strong{font-size:7px}
}

/* Juego por selección: tarjetas grandes y desplazamiento vertical. */
.brand-card{touch-action:manipulation}
.brand-card small{display:block;margin-top:7px;color:#557293;font-size:10px;font-weight:950;letter-spacing:.08em}
.brand-card:active{transform:scale(.96);border-color:var(--yellow);box-shadow:0 0 22px #ffc92877}

@media (max-width:700px){
  html,body{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto}
  .app-shell.screen-game{height:auto;min-height:100dvh;max-height:none;overflow:visible}
  .screen.game{display:block;height:auto;min-height:100dvh;max-height:none;overflow:visible;padding:66px 16px max(38px,env(safe-area-inset-bottom))}
  .game-head{display:grid}
  .progress-row{margin:14px 0 6px}
  .drop-zone{min-height:230px;height:auto;margin-top:12px;padding:13px 12px}
  .drop-zone .lighthouse{width:105px;height:85px;margin:0 auto;transform:scale(.58);transform-origin:center top}
  .drop-zone h3{margin:0;font-size:19px}
  .drop-zone>p{margin:6px 0;font-size:13px}
  .found-list{max-height:none;overflow:visible;gap:5px}
  .found-brand{min-height:32px;padding:5px 8px;font-size:11px}
  .feedback{height:31px;padding-top:6px;font-size:15px}
  .ignite{position:static;height:58px;min-height:58px;margin-bottom:16px;font-size:16px}
  .bank-title{margin:0 0 10px}
  .bank-title h3{font-size:17px}
  .bank-title span{font-size:12px}
  .brand-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:none;gap:10px;min-height:0}
  .brand-card{height:118px;min-height:118px;padding:10px 6px;border-radius:14px}
  .logo-placeholder{width:48px;height:48px;border-radius:12px;font-size:17px}
  .brand-card strong{margin-top:6px;font-size:12px;line-height:1.08}
  .brand-card small{margin-top:5px;font-size:8px}
  .tap-tip{margin:13px 0 0;font-size:12px}
}

@media (max-width:380px){
  .brand-card{height:108px;min-height:108px}
}

@media (min-width:701px) and (max-width:1100px){
  html,body{height:auto;min-height:100%;overflow-x:hidden;overflow-y:auto}
  .app-shell.screen-game{height:auto;min-height:100dvh;max-height:none;overflow:visible}
  .screen.game{display:block;height:auto;min-height:100dvh;max-height:none;overflow:visible;padding-bottom:55px}
  .drop-zone{min-height:300px;height:auto}
  .drop-zone .lighthouse{width:130px;height:118px;transform:scale(.76)}
  .found-list{max-height:none;overflow:visible}
  .brand-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none;gap:12px}
  .brand-card{height:132px;min-height:132px;padding:10px}
  .logo-placeholder{width:57px;height:57px}
  .brand-card strong{font-size:14px}
  .brand-card small{font-size:9px}
}

/* Teléfonos: controles amplios, contenido legible y sin desbordes. */
@media (max-width:700px){
  .screen{padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right));padding-bottom:max(32px,env(safe-area-inset-bottom))}
  .screen-welcome .welcome{overflow-y:auto;padding-top:max(24px,env(safe-area-inset-top))}
  .cover-logo{width:min(430px,88vw)}
  .screen-welcome .name-card{width:100%;margin-top:auto;margin-bottom:18px;padding:22px}
  .line-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .line-card{min-height:142px;padding:12px;border-radius:17px}
  .line-number{font-size:43px;right:11px;top:8px}
  .arrow{right:13px;bottom:9px;font-size:24px}
  .line-icon,.line-icon-respiratoria{padding:24px 32px}
  .line-icon-urogin{padding:8px 30px}
  .instructions{padding:20px 22px}
  .score-actions{gap:12px}
  .game{padding-top:max(70px,calc(env(safe-area-inset-top) + 58px))}
  .game-head{grid-template-columns:44px minmax(0,1fr) auto}
  .game-head h2{overflow-wrap:anywhere}
  .drop-zone{min-height:285px;padding:18px 14px}
  .brand-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .brand-card{min-width:0;min-height:108px;padding:9px}
  .brand-card strong{overflow-wrap:anywhere;text-align:center}
  .ignite{position:sticky;bottom:max(10px,env(safe-area-inset-bottom));z-index:8}
  .result-time{padding:25px 15px}
  .result-time b{font-size:clamp(42px,13vw,58px)}
}

/* Teléfonos angostos: una tarjeta por fila para que ningún logo pierda legibilidad. */
@media (max-width:390px){
  .line-grid{grid-template-columns:1fr}
  .line-card{min-height:122px}
  .line-icon,.line-icon-respiratoria{padding:19px 54px}
  .line-icon-urogin{padding:7px 54px}
  .menu header h2{font-size:28px}
}

/* Modo horizontal en celulares y tablets bajas. */
@media (orientation:landscape) and (max-height:650px){
  .app-shell.screen-welcome,.screen-welcome .welcome{height:auto;min-height:100dvh;max-height:none}
  .screen-welcome .welcome{padding-top:24px}
  .cover-logo{width:min(360px,42vw)}
  .screen-welcome .lead{margin:8px 0;font-size:17px}
  .screen-welcome .name-card{margin:14px auto 18px;max-width:650px;padding:18px}
  .name-card input{height:58px;margin:10px 0 14px}
  .primary,.secondary{height:62px}
  .line-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .line-card{min-height:120px}
  .line-icon,.line-icon-respiratoria{padding:18px 38px}
  .line-icon-urogin{padding:7px 38px}
  .brand-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .drop-zone{min-height:250px}
}

/* Corrección específica para Safari/iPad: centrado real y arrastre táctil. */
.line-icon,.line-icon-respiratoria,.line-icon-urogin{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}
.line-icon img,.line-icon-respiratoria img,.line-icon-urogin img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  margin:auto!important;
  object-fit:contain!important;
  object-position:50% 50%!important;
}
.brand-card{touch-action:none;-webkit-user-select:none;user-select:none}
.drag-ghost{will-change:left,top;max-width:min(260px,70vw);text-align:center}
body.is-dragging{overflow:hidden}

/* Lienzo completo para iPad en vertical: todo el juego cabe sin desplazamiento. */
@media (min-width:700px) and (max-width:1100px) and (orientation:portrait){
  html,body{height:100%;overflow:hidden}
  .app-shell{height:100dvh;min-height:100dvh;max-height:100dvh;overflow:hidden}
  .screen{height:100dvh;min-height:0;max-height:100dvh;overflow:hidden}

  /* Portada */
  .screen-welcome .welcome{height:100dvh;min-height:0;max-height:100dvh;padding:34px 48px 22px}
  .cover-logo{width:min(540px,68vw)}
  .screen-welcome .lead{margin:12px 0 0;font-size:21px}
  .screen-welcome .name-card{margin-top:auto;margin-bottom:12px;padding:24px 28px}
  .name-card input{height:66px;margin:12px 0 16px;font-size:23px}
  .name-card .primary{height:68px}
  .foot-note{margin-top:0;font-size:16px}

  /* Menú de líneas: tres columnas por dos filas. */
  .menu{padding:24px 34px 18px;overflow-y:auto}
  .menu-back{margin-bottom:12px;padding:12px 18px;font-size:16px}
  .menu header h2{font-size:37px}
  .menu header .star{width:58px;height:58px;font-size:48px}
  .menu-intro{margin:14px 0;font-size:20px}
  .line-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .line-card{min-height:138px;border-radius:17px}
  .line-number{font-size:44px}
  .line-icon,.line-icon-respiratoria{padding:24px 30px}
  .line-icon-urogin{padding:7px 28px}
  .instructions{margin-top:14px;padding:14px 20px}
  .instructions h3{margin-bottom:6px;font-size:19px}
  .instructions ol{font-size:15px;line-height:1.4}
  .score-actions{grid-template-columns:1.2fr 1fr;gap:10px;margin-top:12px}
  .scores-button,.score-actions .danger{height:54px;min-height:54px;margin:0;padding:8px;font-size:15px}

  /* Juego: banco compacto y marcas en cinco columnas. */
  .game{display:flex;flex-direction:column;height:100dvh;padding:68px 28px 12px;overflow:hidden}
  .game-head{flex:0 0 auto;grid-template-columns:48px minmax(0,1fr) auto;gap:13px}
  .game-head h2{font-size:27px;margin-top:2px}
  .game-head .eyebrow{font-size:14px}
  .timer span{font-size:11px}
  .timer b{font-size:23px}
  .progress-row{flex:0 0 auto;margin:15px 0 6px;font-size:14px}
  .progress{flex:0 0 8px;height:8px}
  .drop-zone{flex:0 0 250px;min-height:250px;margin-top:12px;padding:9px 18px;border-width:3px;border-radius:22px}
  .lighthouse{width:118px;height:120px;margin-bottom:0;transform:scale(.78);transform-origin:center top}
  .drop-zone h3{margin-top:-22px;font-size:22px}
  .drop-zone>p{margin:5px 0;font-size:14px}
  .found-list{gap:6px;margin-top:4px;max-height:62px;overflow-y:auto}
  .found-brand{padding:6px 9px;font-size:12px}
  .feedback{flex:0 0 32px;height:32px;padding-top:5px;font-size:17px}
  .ignite{flex:0 0 58px;height:58px;min-height:58px;margin:0 0 9px;font-size:18px;box-shadow:0 5px 0 #c89400}
  .ignite span{width:30px;height:30px}
  .bank-title{flex:0 0 29px;margin:0 0 7px}
  .bank-title h3{font-size:19px}
  .bank-title span{font-size:14px}
  .brand-grid{flex:0 0 auto;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}
  .brand-card{min-height:0;height:91px;padding:6px;border-radius:13px}
  .logo-placeholder{width:43px;height:43px;border-radius:11px;font-size:17px}
  .brand-card strong{margin-top:5px;font-size:11px;line-height:1.05}
  .tap-tip{flex:0 0 auto;margin:7px 0 0;font-size:13px;line-height:1.2}
  .drag-ghost{padding:17px;font-size:16px}

  /* Resultado final */
  .finish{height:100dvh;padding:72px 44px 22px}
  .finish-lighthouse{width:210px;height:170px}
  .finish-lighthouse .lighthouse{transform:scale(1)}
  .finish>.eyebrow{margin-top:18px}
  .finish h2{margin:14px 0;font-size:48px}
  .finish>p:not(.eyebrow){font-size:19px}
  .result-time{margin-top:24px;padding:22px}
  .result-time b{font-size:58px}
  .finish-actions{margin-top:22px;gap:12px}
  .finish-actions .primary,.finish-actions .secondary{height:64px}
}

/* iPad vertical de menor altura útil (barra de navegador visible). */
@media (min-width:700px) and (max-width:1100px) and (orientation:portrait) and (max-height:1050px){
  .game{padding-top:60px}
  .drop-zone{flex-basis:220px;min-height:220px}
  .lighthouse{transform:scale(.68)}
  .drop-zone h3{margin-top:-36px;font-size:20px}
  .brand-card{height:80px}
  .logo-placeholder{width:37px;height:37px;font-size:15px}
  .brand-card strong{font-size:10px}
  .tap-tip{margin-top:4px;font-size:12px}
}

/* Separación segura entre el faro y el título en iPad vertical. */
@media (min-width:700px) and (max-width:1100px) and (orientation:portrait){
  .drop-zone{justify-content:flex-start}
  .drop-zone .lighthouse{flex:0 0 108px;width:118px;height:108px;margin:0 auto;transform:scale(.7);transform-origin:center top}
  .drop-zone h3{position:relative;z-index:2;flex:0 0 auto;margin:0!important;line-height:1.02}
  .drop-zone>p{flex:0 0 auto}
  .found-list{flex:0 1 auto}
}
@media (min-width:700px) and (max-width:1100px) and (orientation:portrait) and (max-height:1050px){
  .drop-zone{flex-basis:235px;min-height:235px}
  .drop-zone .lighthouse{flex-basis:100px;height:100px;transform:scale(.65)}
  .drop-zone h3{font-size:20px}
  .found-list{max-height:43px}
}

/* Control permanente para activar y salir de pantalla completa. */
.fullscreen-button{position:fixed;z-index:110;top:max(16px,env(safe-area-inset-top));left:max(16px,calc((100vw - 1080px)/2 + 16px));display:flex;align-items:center;justify-content:center;gap:8px;min-width:58px;height:54px;padding:0 15px;border:1px solid #ffffff52;border-radius:27px;background:#041936dd;color:#fff;box-shadow:0 8px 24px #0006;backdrop-filter:blur(10px);font-size:24px;font-weight:900}
.fullscreen-button span{font-size:12px;letter-spacing:.06em}
@media(max-width:700px){
  .fullscreen-button{left:12px;top:max(12px,env(safe-area-inset-top));height:46px;padding:0 12px}
  .fullscreen-button span{display:none}
  .menu{padding-top:76px}
}
@media (min-width:701px) and (max-width:1100px){
  .fullscreen-button,.mute-button{top:max(10px,env(safe-area-inset-top));height:44px;padding:0 13px}
  .fullscreen-button span,.mute-button span{font-size:10px}
  .menu{padding-top:64px}
}

/* Corrección definitiva: scroll táctil y separación del faro. */
@media (max-width:1100px){
  .app-shell.screen-game{
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
  }
  .screen.game{
    display:block!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:100dvh!important;
    overflow-x:hidden!important;
    overflow-y:scroll!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-y:contain;
    touch-action:pan-y!important;
    padding-bottom:max(55px,env(safe-area-inset-bottom))!important;
  }
  .game .brand-card{
    touch-action:pan-y!important;
  }
  .drop-zone{
    height:auto!important;
    min-height:255px!important;
    justify-content:flex-start!important;
  }
  .drop-zone .lighthouse-slot{
    display:grid;
    place-items:start center;
    flex:0 0 108px;
    width:100%;
    height:108px;
    overflow:visible;
  }
  .drop-zone .lighthouse-slot .lighthouse{
    width:118px!important;
    height:108px!important;
    margin:0 auto!important;
    transform:scale(.68)!important;
    transform-origin:center top!important;
  }
  .drop-zone h3{
    position:relative!important;
    z-index:3!important;
    flex:0 0 auto!important;
    clear:both;
    margin:4px 0 0!important;
    line-height:1.05!important;
  }
}

@media (max-width:700px){
  .screen.game{padding-top:66px!important}
  .drop-zone{min-height:230px!important}
  .drop-zone .lighthouse-slot{flex-basis:88px;height:88px}
  .drop-zone .lighthouse-slot .lighthouse{transform:scale(.55)!important}
  .drop-zone h3{font-size:19px!important}
}

/* Pantalla final desplazable y salida siempre accesible. */
@media (max-width:1100px){
  .app-shell.screen-finish{
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
  }
  .screen.finish{
    display:flex!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:100dvh!important;
    overflow-x:hidden!important;
    overflow-y:scroll!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-y:contain;
    touch-action:pan-y!important;
    padding-bottom:max(45px,env(safe-area-inset-bottom))!important;
  }
  .finish-actions{
    flex:0 0 auto;
    margin-bottom:20px;
  }
  .finish-actions button{
    touch-action:manipulation;
  }
}

@media (max-width:700px){
  .screen.finish{padding-top:64px!important}
  .finish-lighthouse{flex:0 0 150px;width:190px;height:150px}
  .finish>.eyebrow{margin-top:12px}
  .finish h2{margin:12px 0;font-size:40px}
  .result-time{margin-top:20px}
  .finish-actions{margin-top:22px}
}