:root{font-family:"Arial Rounded MT Bold","Trebuchet MS","Malgun Gothic","Yu Gothic",sans-serif;color:#194e55;background:#55c6d0;font-synthesis:none;--ink:#194e55;--muted:#4b7070;--cream:#fff6da;--coral:#ef8060;--gold:#ffdf7b;--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px)}

*{box-sizing:border-box}
body{margin:0;min-height:100svh;overflow-x:clip}
button,select{font:inherit}
button,a,select{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button{cursor:pointer;border:0}
a{color:inherit;text-decoration:none}
p,h1,h2,h3{margin:0}
p{line-height:1.6}
svg{width:22px;height:22px;flex-shrink:0}
button svg,a svg{pointer-events:none}
button:disabled{opacity:.45;cursor:default}
button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible,.stage:focus-visible{outline:3px solid #174e57;outline-offset:4px}

.world-scene{position:fixed;inset:0;z-index:-2;pointer-events:none;background:#55c6d0}
.world-scene img{width:100%;height:100%;object-fit:cover;object-position:center 65%;display:block}
.world-scene:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff5d624,transparent 65%)}

#app{min-height:100svh;isolation:isolate}
.header{height:84px;max-width:1160px;padding:0 28px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}
.brand{display:flex;align-items:center;gap:9px;font-size:27px;font-weight:1000;letter-spacing:-1.6px;color:#fff6db;text-shadow:0 3px 0 #246971;-webkit-text-stroke:3px #246971;paint-order:stroke fill;white-space:nowrap}
.brand-period{color:#ffe395}
.brand-mark{display:flex;flex-direction:column;align-items:center;gap:4px;transform:rotate(-10deg);filter:drop-shadow(0 2px 1px #36555140)}
.brand-mark i{width:24px;height:10px;border-radius:4px;background:linear-gradient(#ffa180,#e97757);box-shadow:inset 0 2px 0 #ffcf9e,0 3px 0 #b96d47}
.brand-mark i:first-child{width:19px;margin-left:7px;background:linear-gradient(#8bf4d6,#2bc8b5);box-shadow:inset 0 2px 0 #d4ffdb,0 3px 0 #1b918d}

.language{display:flex;align-items:center;padding:0 10px;background:#fff8e6e8;border:1px solid #fff9e8;border-radius:17px;box-shadow:0 3px 0 #377d7e35,0 5px 12px #28666e10}
.language>span{display:none}
.language select{color:var(--ink);background:transparent;border:0;font-size:12px;font-weight:800;min-height:44px;max-width:110px;cursor:pointer}
.language option{background:var(--cream)}

.hub{max-width:1120px;margin:auto;padding:0 28px;animation:screen-in .2s ease-out}
.feature-card{position:relative;display:grid;grid-template-columns:.85fr 1.15fr;grid-template-rows:1fr auto;min-height:640px;isolation:isolate}
.feature-copy{align-self:center;text-align:center;padding:25px 0 0;z-index:1}
.eyebrow{text-transform:uppercase;font-size:11px;letter-spacing:.14em;font-weight:900;color:#245d62}
.spotlight{display:flex;align-items:center;justify-content:center;gap:7px;color:#fff8e1;text-shadow:0 1px 3px #245b67;font-size:11px}
.spotlight svg{width:16px;height:16px}
.feature-copy h1{display:flex;flex-direction:column;align-items:center;transform:rotate(-5deg);margin:19px auto 0;color:#fff7da;font-weight:1000;letter-spacing:-3px;line-height:.95;text-shadow:0 5px 0 #306b6a,0 9px 0 #1f555c,0 13px 15px #164f6333;-webkit-text-stroke:7px #286269;paint-order:stroke fill}
.feature-copy h1 span{font-size:49px;letter-spacing:-1.4px}
.feature-copy h1 strong{font-size:98px;line-height:1.13;color:#ffe694;font-weight:1000}
.subtitle{font-size:15px;line-height:1.5;font-weight:900;color:#123b42;margin:22px auto 0;max-width:340px;text-wrap:balance;text-shadow:0 1px 2px #f5ffe8bb}
.feature-art{position:relative;grid-column:2;grid-row:1/3;display:flex;align-items:center;justify-content:center;min-width:0;min-height:600px;pointer-events:none}
.tower-hero{display:block;position:relative;max-width:none;width:118%;height:auto;object-fit:contain;filter:drop-shadow(0 18px 18px #38616c28);animation:tower-float 5s ease-in-out infinite;user-select:none}
.feature-action{grid-column:1;grid-row:2;padding:25px 38px 48px;z-index:1}
.primary,.secondary{display:flex;align-items:center;justify-content:center;gap:13px;min-height:59px;padding:14px 23px;border:2px solid #ffdeae;border-radius:23px;background:linear-gradient(#ffa780 0%,#f68360 45%,#e97654 100%);box-shadow:inset 0 4px 0 #ffd4a577,inset 0 -3px 0 #c9684533,0 6px 0 #ad694c,0 8px 0 #fff0ca66,0 12px 20px #30616e30;color:#4f301f;font-size:19px;font-weight:1000;line-height:1.3;transition:transform .12s,filter .12s,box-shadow .12s;text-shadow:0 1px 0 #ffc8a8}
.primary:hover{filter:brightness(1.07);transform:translateY(-2px)}
.primary:active,.secondary:active{transform:translateY(4px);box-shadow:inset 0 2px 0 #ffe6b999,0 2px 0 #ad694c}
.secondary{background:linear-gradient(#fff9e8,#f6e7c7);border-color:#fffbed;box-shadow:inset 0 3px 0 #fff9,0 4px 0 #c4b697;color:#3b686a;font-size:14px;min-height:47px;text-shadow:none}
.play-link{min-height:75px;font-size:25px;border-radius:26px;width:100%}
.play-triangle{width:25px;height:25px}
.under-button{display:flex;justify-content:center;align-items:center;gap:7px;margin-top:24px;font-size:11px;font-weight:800;color:#254e52;text-shadow:0 1px 1px #fff8da;white-space:nowrap}
.under-button svg{width:17px;height:17px;color:#977126}
.under-button strong{font-size:20px;padding-left:3px}
.how{position:relative;max-width:760px;margin:0 auto;color:var(--ink)}
.how summary{list-style:none;display:flex;justify-content:center;gap:8px;align-items:center;min-height:44px;cursor:pointer;font-size:12px;font-weight:900;text-shadow:0 1px 2px #fff9e1}
.how summary::-webkit-details-marker{display:none}
.how[open]{border-radius:24px;background:#fff7e9f5;box-shadow:0 6px 25px #24545622;margin-top:5px}
.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;padding:18px 24px 24px}
.how-grid article{position:relative;padding:35px 0 0}
.step-num{position:absolute;top:0;color:#c46d44;font-size:22px;font-weight:1000}
.how-grid h3{font-size:14px;margin-bottom:8px}
.how-grid p{font-size:12px;color:#486664}

footer{max-width:1040px;margin:6px auto 0;padding:8px 0 18px;display:flex;justify-content:space-between;align-items:center;gap:14px;color:#385d62;font-size:10px}
footer>div{display:flex;gap:15px}
.text-btn{background:transparent;color:#416063;min-height:44px;padding:6px 3px;font-size:11px;font-weight:700}
.text-btn:hover{text-decoration:underline;color:#123f45}

.game-page{max-width:650px;margin:auto;padding:0 18px 12px;animation:screen-in .18s ease-out}
.game-nav{display:flex;align-items:center;justify-content:space-between;height:36px;margin-bottom:4px}
.game-nav a{display:flex;align-items:center;min-height:44px;font-size:11px;font-weight:800;color:#275a61;text-shadow:0 1px 1px #fff5cf}
.game-nav svg{width:16px}
.mini-label{display:none}
.game-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 12px}
.game-heading h1{font-size:29px;font-weight:1000;letter-spacing:-1px;line-height:1.2;color:#fff8de;text-shadow:0 3px 0 #28636c;-webkit-text-stroke:3px #28636c;paint-order:stroke fill}
.game-tools{display:flex;gap:6px;flex-shrink:0}
.icon-btn{width:46px;height:46px;display:grid;place-items:center;background:linear-gradient(#fffbea,#f3e7c9);color:#315f63;border:1px solid #fffce7;border-radius:17px;box-shadow:inset 0 2px 0 #fff,0 3px 0 #9bbaad,0 5px 10px #30616e15;font-size:21px;font-weight:1000}
.icon-btn:hover{background:#fffbed}
.game-layout{display:block}
.game-board{position:relative;isolation:isolate;height:clamp(480px,calc(100svh - 226px),720px);border-radius:26px;background:linear-gradient(#e5fff10d,#c9fff10b);overflow:hidden}
.scoreboard{position:absolute;top:12px;left:12px;right:12px;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none;z-index:2}
.scoreboard>div{display:flex;flex-direction:column;gap:3px;min-width:82px;padding:9px 15px;background:#fff9e8ed;border:1px solid #fffde9;border-radius:19px;box-shadow:inset 0 2px 0 #fff,0 4px 0 #79a89b70,0 6px 14px #22576612}
.scoreboard span{display:flex;align-items:center;gap:5px;color:#4e6a68;font-size:9px;font-weight:800;letter-spacing:.02em}
.scoreboard strong{font-size:35px;line-height:1.03;font-weight:1000;color:#21565b;font-variant-numeric:tabular-nums}
.scoreboard .best-score{text-align:right;align-items:flex-end}
.scoreboard .best-score strong{font-size:26px;color:#b36836}
.scoreboard svg{width:13px;height:13px;color:#a57b2e}
.stage{position:absolute;inset:0;touch-action:none;user-select:none;-webkit-user-select:none;cursor:pointer}
.stage:focus-visible{outline-offset:-5px;border-radius:24px;outline-color:#236571}
.stage canvas{width:100%;height:100%;display:block}
.board-bottom{position:absolute;bottom:12px;left:16px;right:16px;display:flex;align-items:center;gap:7px;font-size:11px;font-weight:900;color:#214f56;pointer-events:none;text-shadow:0 1px 2px #fff5de}
.status-dot{width:6px;height:6px;border-radius:50%;background:#37736f}
.board-bottom #width-value{margin-left:auto;font-variant-numeric:tabular-nums}
.overlay{position:absolute;inset:94px 20px 43px;display:flex;justify-content:center;align-items:center;z-index:3}
.overlay[hidden]{display:none}
.overlay-card{width:100%;max-width:340px;display:flex;flex-direction:column;align-items:center;text-align:center;padding:23px 23px 17px;border:2px solid #fffce8;border-radius:31px;background:#fff5dfee;box-shadow:inset 0 3px 0 #fff,0 7px 0 #bcbea575,0 20px 40px #275a6740;backdrop-filter:blur(7px);color:#24565b}
.overlay-symbol{display:grid;place-items:center;width:43px;height:43px;margin-bottom:12px;background:linear-gradient(#ffdc89,#f6c970);color:#876531;border:1px solid #fff3b3;border-radius:15px;box-shadow:0 3px 0 #c7a465;transform:rotate(-6deg)}
.overlay-card .eyebrow{font-size:9px;color:#a36b38}
.overlay-card h2{font-size:25px;font-weight:1000;line-height:1.25;letter-spacing:-.7px;margin-top:8px;text-wrap:balance}
.overlay-card p:not(.eyebrow){font-size:12px;white-space:pre-line;color:#52716c;margin:12px 0 18px}
.overlay-card .primary,.overlay-card .secondary{width:100%;margin-top:8px;min-height:53px}
.overlay-note{font-size:9px;color:#52716c;margin-top:20px}
.result-score{font-size:73px;line-height:1;margin-top:15px;font-weight:1000;letter-spacing:-2px;color:#e98554;text-shadow:0 3px 0 #b46b45,0 5px 0 #fff2c5}
.result-score span{font-size:10px;display:block;letter-spacing:.12em;margin-top:8px;color:#677668;text-shadow:none}
.result-card p:not(.eyebrow){margin:13px 0}
.result-best{font-size:10px;display:flex;align-items:center;gap:6px;color:#64705c;font-weight:700}
.result-best svg{width:14px;color:#a8782b}
.result-card small{font-size:9px;color:#65756d}
.result-card .primary{margin-top:18px}
.control-hint{text-align:center;font-size:10px;font-weight:800;color:#335c61;margin-top:14px;text-shadow:0 1px 1px #fff2d2}
.feedback{position:absolute;top:116px;left:6px;right:6px;text-align:center;color:#fff4be;font-size:27px;font-weight:1000;pointer-events:none;opacity:0;z-index:2;text-shadow:0 3px 0 #2e6c71;-webkit-text-stroke:3px #2e6c71;paint-order:stroke fill}
.feedback.show{opacity:1;animation:feedback-pop .4s ease-out}
.feedback[data-kind=perfect]:before,.feedback[data-kind=perfect]:after{content:"✦";display:inline-block;margin:0 10px;font-size:22px;color:#ffe077}
.feedback[data-kind=placed]{font-size:23px;color:#fff9e8}
.game-board[data-state=ended] .result-card{animation:result-in .25s ease-out}

#app[data-view=game] footer{display:none}
#app[data-view=game] .header{max-width:650px;height:64px;padding:0 20px}
#app[data-view=game] .brand{font-size:23px}
#app[data-view=game] .brand-mark{transform:rotate(-10deg) scale(.85)}
.storage-notice{max-width:580px;margin:14px auto;padding:12px 18px;background:#fff1c6;color:#6a4825;font-size:12px;border-radius:13px}
.storage-notice[hidden]{display:none}
dialog{border:2px solid #fffbe7;border-radius:28px;padding:26px;max-width:min(420px,calc(100vw - 32px));color:#23585e;background:#fff5df;box-shadow:0 20px 90px #1f515a55}
dialog::backdrop{background:#1c536577;backdrop-filter:blur(4px)}
dialog h2{font-size:24px;line-height:1.35;font-weight:1000}
dialog p{font-size:13px;color:#4b6b68;margin:15px 0 20px}
dialog button{width:100%;margin-top:12px}
.missing{min-height:60vh;display:grid;place-content:center;gap:30px;padding:30px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

@keyframes tower-float{50%{transform:translateY(-9px) rotate(1deg)}
}
@keyframes screen-in{from{opacity:.4}
to{opacity:1}
}
@keyframes feedback-pop{0%{transform:scale(.8) translateY(9px)}
50%{transform:scale(1.08)}
100%{transform:scale(1)}
}
@keyframes result-in{from{opacity:0;transform:translateY(12px)}
to{opacity:1;transform:none}
}

@media(min-width:1500px){.feature-card{min-height:720px}
.feature-art{min-height:690px}
.tower-hero{width:125%}
}

@media(max-width:760px){.world-scene img{object-position:center bottom}
.world-scene:after{background:none}
.header{height:calc(65px + env(safe-area-inset-top));padding:env(safe-area-inset-top) max(18px,env(safe-area-inset-right)) 0 max(18px,env(safe-area-inset-left))}
.brand{font-size:25px}
.hub{padding:0 18px}
.feature-card{display:flex;flex-direction:column;min-height:0}
.feature-copy{padding:8px 0 0;align-self:stretch}
.spotlight{font-size:9px;letter-spacing:.1em}
.spotlight svg{width:13px;height:13px}
.feature-copy h1{margin:13px 0 0;letter-spacing:-2px;-webkit-text-stroke-width:5px;text-shadow:0 4px 0 #306b6a,0 7px 0 #1f555c,0 10px 10px #164f6322}
.feature-copy h1 span{font-size:30px;letter-spacing:-.8px}
.feature-copy h1 strong{font-size:66px;line-height:1.11}
.subtitle{font-size:12px;margin:13px auto 0;max-width:280px}
.feature-art{min-height:0;height:clamp(240px,calc(100svh - 465px),420px);width:100%;margin-top:-3px;z-index:0;overflow:visible}
.tower-hero{width:auto;max-width:calc(100vw - 18px);height:112%;max-height:none;transform:translateY(4%);object-fit:contain;filter:drop-shadow(0 13px 12px #38616c20)}
.feature-action{width:100%;padding:0 18px 9px;margin-top:-8px}
.play-link{min-height:64px;font-size:23px;border-radius:23px}
.under-button{font-size:10px;margin-top:20px}
.under-button strong{font-size:17px}
.how{margin-top:0}
.how summary{font-size:11px}
.how-grid{grid-template-columns:1fr;gap:20px;padding:14px 20px 24px}
.how-grid article{padding:0 0 0 35px}
.step-num{left:0}
.how-grid p{font-size:12px}
footer{margin-top:0;padding:0 20px calc(12px + env(safe-area-inset-bottom));justify-content:center}
footer>span{display:none}
.text-btn{font-size:10px}
.game-page{padding:0 8px calc(8px + env(safe-area-inset-bottom));max-width:650px}
.game-nav{padding:0 7px;height:36px;margin:0 0 4px}
.game-nav a{min-height:44px}
.game-heading{margin:0 7px 7px;min-height:44px}
.game-heading h1{font-size:24px;max-width:235px;letter-spacing:-.8px}
.game-tools{gap:4px}
.icon-btn{width:44px;height:44px;border-radius:15px}
.game-board{height:calc(100svh - 191px - env(safe-area-inset-top) - env(safe-area-inset-bottom));min-height:420px;border-radius:20px;background:none}
.scoreboard{top:8px;left:8px;right:8px}
.scoreboard>div{padding:8px 12px;min-width:78px;border-radius:17px}
.scoreboard strong{font-size:32px}
.scoreboard .best-score strong{font-size:25px}
.overlay{inset:88px 19px 43px}
.overlay-card{padding:19px 18px 14px;max-width:315px;border-radius:28px}
.overlay-card h2{font-size:23px}
.overlay-card p:not(.eyebrow){font-size:11px;margin:10px 0 13px}
.overlay-card .primary{font-size:18px;min-height:53px}
.overlay-symbol{width:37px;height:37px;margin-bottom:9px}
.overlay-note{margin-top:18px}
.control-hint{font-size:9px;margin-top:12px}
.result-score{font-size:61px;margin-top:12px}
.result-card .primary{margin-top:12px}
.feedback{top:105px;font-size:25px}
#app[data-view=game] .header{height:calc(56px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 15px 0}
#app[data-view=game] .brand{font-size:22px}
.storage-notice{margin:14px 12px}
.board-bottom{left:12px;right:12px}
}

@media(max-width:359px){.header{height:calc(60px + env(safe-area-inset-top));padding-left:14px;padding-right:14px}
.brand{font-size:23px}
.feature-copy{padding-top:2px}
.feature-copy h1{margin-top:9px}
.feature-copy h1 span{font-size:25px}
.feature-copy h1 strong{font-size:54px}
.subtitle{font-size:11px;margin-top:11px}
.feature-art{height:clamp(200px,calc(100svh - 426px),290px)}
.feature-action{padding:0 12px 6px}
.play-link{min-height:58px;font-size:21px}
.game-heading h1{font-size:19px}
.game-tools{gap:3px}
.overlay{inset:81px 12px 36px}
.overlay-card{padding:15px 14px 12px}
.overlay-card h2{font-size:20px}
.overlay-card p:not(.eyebrow){font-size:10px}
.overlay-symbol{display:none}
.result-score{font-size:51px}
.scoreboard span{font-size:8px}
.board-bottom{font-size:10px}
.brand-mark{gap:3px}
.under-button{margin-top:17px}
}

@media(max-height:600px) and (min-width:650px){#app[data-view=game] .header{height:52px;max-width:1000px}
.game-page{max-width:1000px;display:grid;grid-template-columns:180px minmax(0,1fr);gap:0 14px;padding:0 max(14px,var(--safe-right)) 0 max(14px,var(--safe-left))}
.game-nav{grid-column:1;grid-row:1;height:36px;align-self:start}
.game-heading{grid-column:1;grid-row:2;display:block;align-self:start;margin:8px 0}
.game-heading h1{font-size:24px}
.game-tools{margin-top:20px}
.game-layout{grid-column:2;grid-row:1/4}
.game-board{height:calc(100svh - 85px - var(--safe-top) - var(--safe-bottom));min-height:0}
.control-hint{grid-column:2;margin:10px 0 0}
.scoreboard{top:8px;left:10px;right:10px}
.scoreboard>div{padding:5px 10px;min-width:70px}
.scoreboard strong,.scoreboard .best-score strong{font-size:22px}
.overlay{inset:65px 20px 28px}
.overlay-card{padding:12px 18px;max-width:370px}
.overlay-symbol,.overlay-card>.eyebrow,.overlay-card>p:not(.eyebrow),.overlay-note,.result-card small{display:none}
.overlay-card h2{font-size:19px;margin:0 0 5px}
.overlay-card .primary,.overlay-card .secondary{min-height:44px;padding:8px 18px;margin-top:7px}
.overlay-card .text-btn{min-height:28px}
.result-card{display:grid;grid-template-columns:1fr 1fr;gap:4px 15px}
.result-card h2{grid-column:1/3}
.result-score{grid-column:1;grid-row:2/4;margin:0;font-size:40px}
.result-best{grid-column:1;grid-row:4;font-size:9px;justify-content:center}
.result-card .primary{grid-column:2;grid-row:2/4;margin:0}
.result-card .text-btn{grid-column:2;grid-row:4}
.feedback{top:73px}
}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}

.sound-link{display:block;margin:3px auto 0;min-height:44px;background:transparent;color:#194e55;font-size:11px;font-weight:800;text-decoration:underline;text-underline-offset:3px}.volume-label{display:flex;justify-content:space-between;gap:20px;margin-top:23px;font-weight:800;font-size:14px}#volume{display:block;width:100%;min-height:44px;accent-color:#277d79;cursor:pointer}#volume:focus-visible{outline:3px solid #194e55;outline-offset:3px;border-radius:8px}

.lineup{display:grid;grid-template-columns:1fr 1fr;gap:28px;max-width:900px;margin:20px auto 35px}.lineup-card{text-align:center;background:#fff5dbe6;border:2px solid #fff8df;border-radius:30px;padding:18px 22px 24px;box-shadow:0 7px 0 #4b8d8529}.lineup-card img{width:100%;height:260px;object-fit:contain}.lineup-card h2{font-size:27px;font-weight:1000}.lineup-card p{font-size:12px;margin:8px 0 18px}.lineup-card small{display:block;margin-top:16px}.music-link{margin-top:0}#music-volume{width:100%;min-height:44px;accent-color:#277d79}dialog:has(#music-volume){max-height:calc(100svh - 24px);overflow:auto;padding:20px 24px}dialog:has(#music-volume) .volume-label{margin-top:12px}dialog:has(#music-volume) p{margin:10px 0}#app[data-game=color] .feedback{top:86px}#app[data-game=dodge] .feedback{display:none}@media(max-width:760px){.lineup{gap:14px}.lineup-card{padding:10px 12px 18px;border-radius:24px}.lineup-card img{height:180px}.lineup-card h2{font-size:20px}.lineup-card p{font-size:10px;min-height:32px}.lineup-card .primary{font-size:15px;padding:12px;min-height:48px}}@media(max-width:359px){.lineup{grid-template-columns:1fr}.lineup-card img{height:225px}}

.music-link{border:0;background:none;color:var(--ink);font:inherit;font-size:12px;cursor:pointer;padding:8px;}
.lineup{grid-template-columns:repeat(2,minmax(0,1fr))}.lineup-card{min-width:0}.lineup-card img{max-width:100%}@media(max-width:359px){.lineup{grid-template-columns:minmax(0,1fr)}}
.language select{max-width:145px}.game-heading h1{overflow-wrap:anywhere;font-size:clamp(21px,5vw,32px)}.lineup-card h2{overflow-wrap:anywhere}html:lang(zh-Hans){font-family:system-ui,'Noto Sans SC','Microsoft YaHei',sans-serif} .color-choices button span:last-child{overflow-wrap:anywhere;font-size:10px}.mini-label{max-width:45%;text-align:right;overflow-wrap:anywhere}
@media(max-width:380px){.language select{max-width:118px}.header{gap:8px}.brand{flex-shrink:0}}

.music-link{display:block;margin:0 auto;min-height:44px;font-weight:700}

/* Compact catalog scales to nine real games without nine poster-sized rows. */
.lineup{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1040px;gap:18px}.lineup-card{display:flex;flex-direction:column;align-items:stretch;padding:12px 16px 18px;color:#285b59;text-decoration:none}.lineup-card img{height:170px}.lineup-card h2{font-size:22px}.lineup-card p{min-height:2.5em;margin:8px 0 12px}.lineup-card small{font-size:10px;margin-top:12px}.card-play{margin-top:auto;font-size:16px;min-height:44px;padding:10px}.lineup-card:focus-visible{outline:4px solid #174e57;outline-offset:4px}
@media(max-width:760px){.lineup{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.lineup-card{padding:8px 10px 14px;border-radius:24px}.lineup-card img{height:125px}.lineup-card h2{font-size:18px}.lineup-card p{font-size:11px}.lineup-card .card-play{font-size:13px;padding:8px;gap:5px}.card-play svg{width:16px}.lineup-card small{font-size:9px}}
@media(max-width:359px){.lineup{grid-template-columns:minmax(0,1fr)}.lineup-card img{height:145px}.lineup-card h2{font-size:21px}}
/* Split feature: retain the illustrated toy while exposing the real lineup sooner. */
.header-tools{display:flex;align-items:center;gap:9px;min-width:0}.hub-audio.sound-link{display:grid;place-items:center;margin:0;padding:0;min-width:44px;min-height:44px;width:44px;height:44px;text-decoration:none}.hub-audio svg{width:22px;height:22px}
.feature-card{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:240px auto;min-height:0;max-width:850px;margin:0 auto 20px;align-items:center;gap:0 20px}.feature-copy{padding:0;min-width:0}.feature-copy h1{margin:0;transform:rotate(-3deg);letter-spacing:-1px;-webkit-text-stroke-width:4px;text-shadow:0 3px 0 #225963,0 5px 8px #22596333}.feature-copy h1 span{font-size:36px;line-height:1.15}.feature-copy h1 strong{font-size:60px;line-height:1.15}.subtitle{font-size:14px;line-height:1.45;margin-top:14px}.feature-art{grid-column:2;grid-row:1;min-height:0;height:240px;margin:0;width:100%}.tower-hero{width:auto;height:110%;max-width:120%;transform:none}.feature-action{grid-column:1/-1;grid-row:2;padding:8px 0 0;margin:0;max-width:450px;width:100%;justify-self:center}.play-link{min-height:52px;font-size:21px;border-radius:21px}.under-button{margin-top:15px;font-size:11px}.under-button strong{font-size:16px}.lineup{margin-top:18px}.lineup-card p{font-size:12px;line-height:1.45}.lineup-card h2{line-height:1.2}
@media(max-width:760px){.header{padding-left:14px;padding-right:14px;gap:8px}.header-tools{gap:6px}.brand{font-size:23px;gap:6px}.language{padding:0 6px}.language select{max-width:112px;font-size:12px}.hub{padding:0 14px}.feature-card{grid-template-rows:185px auto;gap:0 6px;margin-bottom:20px}.feature-copy h1 span{font-size:25px;letter-spacing:-.4px}.feature-copy h1 strong{font-size:43px;letter-spacing:-1px}.feature-copy h1{-webkit-text-stroke-width:3px}.subtitle{font-size:12px;margin-top:12px;max-width:190px}.feature-art{height:185px;overflow:visible}.tower-hero{height:112%;max-width:116%}.feature-action{padding:5px 7px 0;max-width:420px}.play-link{font-size:20px;min-height:51px}.under-button{margin-top:13px}.lineup-card p{font-size:12px}.lineup-card h2{font-size:18px}.card-play{font-size:14px}}
@media(max-width:359px){.brand{font-size:20px;letter-spacing:-1px}.brand-mark{display:none}.header-tools{gap:5px}.language select{max-width:109px}.feature-card{grid-template-rows:165px auto}.feature-copy h1 span{font-size:22px}.feature-copy h1 strong{font-size:36px}.feature-art{height:165px}.subtitle{font-size:12px;margin-top:10px}.lineup-card h2{font-size:21px}}
.hub-audio.sound-link{background:linear-gradient(#fffbea,#f3e7c9);color:#315f63}
#menu-dialog{width:min(390px,calc(100vw - 24px));max-height:calc(100svh - 32px);overflow:auto;padding:22px;text-align:left}.menu-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.menu-heading h2{font-size:24px}.menu-heading .icon-btn{min-width:44px;min-height:44px}.menu-language{display:grid;gap:8px;margin:20px 0;font-weight:800;font-size:14px}.menu-language select{min-height:48px;border:2px solid #a4c7b9;border-radius:14px;background:#fffbea;color:#174e57;padding:8px;font:inherit;max-width:100%}#menu-dialog nav{display:grid;gap:6px}#menu-dialog nav a{display:flex;align-items:center;min-height:44px;border-radius:12px;padding:8px 12px;background:#fff8e6;color:#174e57;font-weight:700;line-height:1.4}#menu-dialog nav a:hover{background:#c5eadb}.feature-rules{padding:20px}.feature-rules h2{font-size:20px}.feature-rules p{font-size:14px;margin-top:12px}.feature-copy h1{overflow-wrap:anywhere}.feature-copy h1 span{max-width:100%}.feature-copy h1 strong{max-width:100%}
/* Translucent paint only: no backdrop blur or animated filters on the card grid. */
.lineup-card{background:rgba(255,248,225,.72);border-color:rgba(255,253,240,.88)}.lineup-card h2,.lineup-card p,.lineup-card small{opacity:1;color:#17454b}.lineup-card .card-play{opacity:1}.feature-copy h1 .recent-title{font-size:clamp(28px,4.5vw,50px);line-height:1.18;letter-spacing:-.5px}.brand{letter-spacing:-.8px}
@media(max-width:760px){.feature-copy h1 .recent-title{font-size:29px}.brand{font-size:30px}.brand-mark{display:flex}.feature-copy .subtitle{font-size:12px;line-height:1.4}}
@media(max-width:359px){.feature-copy h1 .recent-title{font-size:25px}.brand{font-size:27px}}
@media(prefers-reduced-transparency:reduce){.lineup-card{background:#fff8e1;border-color:#fffdf0}}
@media(forced-colors:active){.lineup-card{background:Canvas;border:2px solid CanvasText}.lineup-card h2,.lineup-card p,.lineup-card small{color:CanvasText}}
.recent-label{display:inline-block;margin-bottom:8px;padding:4px 9px;border-radius:9px;background:#fff7dbe6;color:#23565d;font-size:11px;font-weight:800;line-height:1.3}
.game-guide,.guide-index{max-width:850px;margin:8px auto 32px;padding:24px;background:#fff8e9ed;border:1px solid #fffdf0;border-radius:28px;color:#17454b}.guide-heading{display:flex;align-items:center;gap:20px}.guide-heading>div{flex:1;min-width:0}.guide-heading img{width:150px;height:150px;object-fit:contain}.guide-heading h1,.guide-index h1{font-size:clamp(26px,5vw,40px);line-height:1.2;overflow-wrap:anywhere}.guide-heading p{margin:12px 0}.guide-kicker{font-size:13px;font-weight:800}.game-guide article>.primary{max-width:320px;margin:18px 0 30px}.game-guide section{margin-top:28px}.game-guide h2{font-size:21px;margin-bottom:10px;line-height:1.3}.game-guide p,.game-guide li{font-size:16px;line-height:1.75}.game-guide aside{margin-top:32px}.game-guide a:not(.primary),.guide-index a{text-decoration:underline;text-underline-offset:3px}.game-guide nav a,.game-guide aside a{display:inline-flex;align-items:center;min-height:44px}.guide-index ul{list-style:none;padding:0;display:grid;gap:10px}.guide-index li a{display:flex;align-items:center;gap:16px;padding:12px;border-radius:18px;background:#fffaf0;min-height:100px}.guide-index img{width:85px;height:85px;object-fit:contain}.guide-index li span span{display:block;font-size:14px;line-height:1.5;margin-top:8px}.guide-index strong{font-size:19px}.play-guide-link{text-align:center;padding:8px 16px}.play-guide-link a{display:inline-flex;align-items:center;min-height:44px;font-size:13px;text-decoration:underline} @media(max-width:600px){.game-guide,.guide-index{margin:8px 12px 24px;padding:20px}.guide-heading img{width:95px;height:95px}.guide-heading{gap:10px}.guide-index img{width:64px;height:64px}.game-guide p,.game-guide li{font-size:15px}}
/* Use the available viewport for every game; guides stay below or on their own route. */
@media(min-height:601px), (min-height:500px) and (max-width:649px){
.game-page{height:calc(100svh - 52px - var(--safe-top));max-width:760px;display:grid;grid-template-rows:auto minmax(0,1fr);gap:4px;position:relative;padding:0 max(8px,var(--safe-right)) max(4px,var(--safe-bottom)) max(8px,var(--safe-left))}
.game-heading{grid-row:1;min-height:56px;margin:0;padding:3px 0 3px 46px;gap:6px}.game-heading h1{font-size:clamp(17px,4.5vw,25px);line-height:1.18;letter-spacing:-.4px}.game-tools{gap:4px}.game-tools .icon-btn{width:44px;height:44px}
.game-nav{position:absolute;left:max(8px,var(--safe-left));top:5px;margin:0;padding:0;width:44px;height:44px;z-index:3}.game-nav a{width:44px;min-height:44px;justify-content:center}.game-nav a span,.game-nav .mini-label{display:none}
.game-layout{grid-row:2;min-height:0}.game-board{height:100%;min-height:0;border-radius:24px}.control-hint{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:0}
#app[data-view=game] .board-bottom{background:#fff8e5dc;border-radius:12px;padding:6px 10px;bottom:5px;left:7px;right:7px;font-size:11px;color:#17454b}
}
/* Mobile readability: enlarge content roles independently, preserving the playfield. */
.menu-language,#menu-dialog nav a{font-size:16px;line-height:1.45}.menu-language select{font-size:16px}
.feature-copy .subtitle{font-size:14px;line-height:1.5}.under-button,.recent-label,.lineup-card small{font-size:13px}.lineup-card h2{font-size:21px;line-height:1.2}.lineup-card p{font-size:14px;line-height:1.5}.lineup-card .card-play{font-size:17px;min-height:48px}.how summary{font-size:15px}.feature-rules p,.how-grid p{font-size:15px;line-height:1.6}
.game-heading h1{font-size:clamp(21px,5.3vw,29px);line-height:1.2}.scoreboard>div{max-width:48%}.scoreboard span{font-size:12px;line-height:1.2;letter-spacing:0;overflow-wrap:anywhere}.scoreboard strong{font-size:36px}.scoreboard .best-score strong{font-size:29px}
#app[data-view=game] .board-bottom{font-size:13px;line-height:1.4;background:#fff8e5ed;color:#173f45;padding:6px 10px;border-radius:12px;bottom:5px;left:7px;right:7px}.status-dot{flex-shrink:0}.control-hint,.game-nav a{font-size:13px;line-height:1.4}
.overlay-card{max-height:100%;overflow:auto;overscroll-behavior:contain}.overlay-card h2{font-size:25px}.overlay-card p:not(.eyebrow){font-size:15px;line-height:1.55;color:#315853}.overlay-card .eyebrow,.overlay-note,.result-card small,.result-score span,.result-best{font-size:13px;line-height:1.4}.overlay-card .primary{font-size:20px}.secondary{font-size:16px}.overlay-card .text-btn{font-size:14px}
dialog p{font-size:16px;line-height:1.6;color:#315853}.volume-label{font-size:16px}.sound-link,.storage-notice,.play-guide-link a,.text-btn{font-size:14px;line-height:1.5}.color-choices button span:last-child{font-size:13px;line-height:1.3;font-weight:900}.game-guide p,.game-guide li{font-size:17px;line-height:1.75}.guide-index li span span{font-size:16px;line-height:1.55}.guide-index strong{font-size:21px}
@media(max-width:359px){.feature-copy .subtitle{font-size:13px}.feature-copy h1 .recent-title{font-size:26px}.game-heading h1{font-size:21px}.scoreboard strong{font-size:34px}.scoreboard .best-score strong{font-size:27px}.overlay-card{padding:14px}.overlay-card h2{font-size:23px}.lineup-card h2{font-size:23px}}
@media(max-height:600px) and (min-width:650px){.scoreboard strong,.scoreboard .best-score strong{font-size:26px}.overlay-card h2{font-size:22px}.overlay-card .text-btn{min-height:32px}.overlay-card .primary,.overlay-card .secondary{font-size:18px}.game-heading h1{font-size:27px}.control-hint{display:none}}

/* Shared brand artwork stays within the existing header and leaves 44px utilities. */
.brand{min-height:44px;gap:0;flex-shrink:0}.brand-logo{display:block;width:180px;height:auto;max-height:44px;object-fit:contain;object-position:left center}

/* Safe padding is part of the header extent, never taken from its 52px controls row. */
#app[data-view=game] .header{height:calc(52px + var(--safe-top));padding:var(--safe-top) max(15px,var(--safe-right)) 0 max(15px,var(--safe-left))}

/* Narrow safe-area content gets a full-width title below the utility row. */
@media(max-width:649px) and (min-height:500px){
 .game-page{container-type:inline-size}
 @container(max-width:280px){
  .game-heading{position:relative;display:block;padding:49px 0 3px}
  .game-heading h1{max-width:none}
  .game-heading .game-tools{position:absolute;right:0;top:5px}
 }
}
/* Shared import loader: ready/error/navigation replace it in the existing route lifecycle. */
.cloud-loader{width:min(280px,100%);padding:22px;background:#fff8e9;border:2px solid #fff;border-radius:24px;text-align:center;color:#173f45;display:grid;gap:14px;overflow-wrap:anywhere}
.cloud-loader strong{font-size:25px}.cloud-loader>span{font-size:16px;line-height:1.5}
.cloud-loader-track{height:12px;border-radius:20px;background:#c4ded8;overflow:hidden}
.cloud-loader-track i{display:block;width:38%;height:100%;border-radius:inherit;background:#245c68;animation:cloud-load 1.3s ease-in-out infinite alternate}
@keyframes cloud-load{from{transform:translateX(0)}to{transform:translateX(165%)}}
@media(prefers-reduced-motion:reduce){.cloud-loader-track i{width:100%;background:repeating-linear-gradient(90deg,#245c68 0 16px,#c4ded8 16px 24px)}}
/* Locale-safe content grows and wraps instead of reducing type size. */
.primary,.secondary,.text-btn,.under-button{white-space:normal;overflow-wrap:anywhere;flex-wrap:wrap}
.primary svg,.secondary svg{flex-shrink:0}.under-button{row-gap:4px}
.game-heading>div:first-child,.guide-index li span{min-width:0}
.overlay-card>*{flex-shrink:0;max-width:100%;overflow-wrap:anywhere}
dialog{max-height:calc(100svh - 24px);overflow:auto;overscroll-behavior:contain}
dialog h2,.game-guide h2,.guide-index strong,.menu-heading h2{overflow-wrap:anywhere}
.feature-card{grid-template-rows:minmax(240px,auto) auto}.feature-copy{padding:12px 0}
@media(max-width:760px){.feature-card{grid-template-rows:minmax(185px,auto) auto}}
@media(max-width:359px){.feature-card{grid-template-rows:minmax(165px,auto) auto}}
.menu-info{margin-top:18px;padding-top:16px;border-top:1px solid #aacbc0}.site-info h1{font-size:clamp(26px,5vw,40px);overflow-wrap:anywhere}.site-info p{margin:20px 0}.site-info .text-btn{display:inline-flex;min-height:44px;align-items:center}footer>div{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px}
/* Inner symbols and names remain readable over every shuffled tile background. */
.color-choices .color-symbol{width:46px;margin:0 auto 5px;padding:4px;border-radius:12px;background:#fffbee;border:2px solid #173f45}
.color-choices button>span:last-child{display:block;background:#fffbee;color:#173f45;border-radius:8px;padding:3px;overflow-wrap:anywhere;text-shadow:none}
/* Two small drifting clouds; cards, lettering and the painted skyline stay still. */
.hub{position:relative;isolation:isolate}
.hub::before,.hub::after{content:"";position:fixed;pointer-events:none;z-index:-1;width:120px;height:44px;top:24%;left:8%;border-radius:60px;background:radial-gradient(ellipse at 34% 45%,#fff8e9 0 38%,transparent 40%),radial-gradient(ellipse at 66% 48%,#fff8e9 0 43%,transparent 45%);opacity:.7;animation:lobby-cloud-drift 24s ease-in-out infinite alternate}
.hub::after{top:48%;left:auto;right:12%;width:150px;animation-duration:33s;animation-delay:-12s;opacity:.55}
@keyframes lobby-cloud-drift{from{transform:translateX(-18px)}to{transform:translateX(30px)}}
#app[data-page-hidden=true] .hub::before,#app[data-page-hidden=true] .hub::after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.hub::before,.hub::after{animation:none}}
/* Stack reserves this feedback band above its camera; no tower can grow through it. */
#app[data-game=stack] .feedback{font-size:23px;line-height:1.25;overflow-wrap:anywhere;padding:0 4px}
#app[data-game=stack] .feedback[data-kind=perfect]:before,#app[data-game=stack] .feedback[data-kind=perfect]:after{margin:0 5px;font-size:18px}
.menu-audio{margin:0 0 18px;min-height:44px;width:100%}
/* Hover must not move a replay target out from under a pointer at its edge. */
.primary:hover{transform:none}.primary:active{transform:translateY(4px)}

/* Keep the end reason available in short landscape as well as portrait. */
@media(max-height:600px) and (min-width:650px){.result-card>p:not(.eyebrow){display:block;font-size:14px;line-height:1.3;margin:4px 0}}

/* CloudPop toy finish: shared by all fifteen game shells. */
.game-board .overlay{isolation:isolate}
.game-board .overlay::before{content:'';position:absolute;inset:-10px;border-radius:38px;background:radial-gradient(ellipse,#326b7030,transparent 75%);pointer-events:none;z-index:-1}
.overlay-card{border:3px solid #fff8d8;background:linear-gradient(155deg,#fffcecf0,#fff0cde8);box-shadow:inset 0 4px 0 #fff, inset 0 -5px 0 #e7bc7080,0 0 0 2px #dcac61,0 8px 0 #b58c5799,0 19px 34px #275a6740;backdrop-filter:blur(2px);border-radius:38px 38px 31px 31px}
.result-card h2{align-self:stretch;padding:9px 13px;margin-top:3px;border:2px solid #fff1a7;border-radius:18px;background:linear-gradient(#327e7c,#205e6b);color:#fffbe6;text-shadow:0 2px #185766;box-shadow:inset 0 2px #ffffff55,0 3px #205e6666}
.result-score{color:#a35b27;text-shadow:0 2px #fff5c9,0 4px #b96c3944;min-width:65%;padding:12px 16px;border-radius:24px;background:linear-gradient(#fff7cd,#ffdf8f66);box-shadow:inset 0 2px #fff,0 2px #d9b06a55}
.result-best{padding:7px 14px;border:1px solid #dfc384;border-radius:99px;background:#fffbe4b3;color:#46635b}
.overlay-card .primary,.game-board~* .primary{background:linear-gradient(#ffed9d,#ffd062 65%,#ffc14e);border:2px solid #fff8d5;box-shadow:inset 0 3px #fff9,0 5px 0 #bf8a3d,0 8px 12px #38564c29;color:#4a552f;text-shadow:0 1px #fff3b8;border-radius:19px}
.overlay-card .secondary,.result-card .text-btn{border:2px solid #fff9dc;border-radius:18px;background:linear-gradient(#fffce9,#eddfb6);box-shadow:inset 0 2px #fff,0 4px 0 #a9a581;color:#285b60;min-height:44px;padding:9px 16px;margin-top:10px;text-decoration:none}
.game-board button:active:not(:disabled){filter:brightness(.98)}
.overlay-card button:active:not(:disabled){transform:translateY(3px);box-shadow:inset 0 2px #fff8,0 2px #ac895c}
.color-choices .color-symbol{display:grid!important;place-items:center;width:min(60px,100%);min-height:54px;margin:0 auto;padding:4px;border-radius:17px;background:#fffbee;border:2px solid #173f45}
.color-choices .color-symbol img{display:block;width:44px;max-width:100%;height:44px;object-fit:contain;filter:drop-shadow(0 2px 1px #214f5638)}
.color-choices button:active:not(:disabled){transform:translateY(3px)}
@media(max-height:600px) and (min-width:650px){.result-card h2{padding:4px 8px}.result-score{padding:6px 10px}.result-best{padding:3px 7px}.overlay-card .text-btn{margin-top:5px;padding:5px 10px}.overlay-card{border-radius:25px}}
@media(prefers-reduced-motion:no-preference){.overlay-card button,.color-choices button{transition:transform .08s,box-shadow .08s}.game-board[data-state=ended] .result-card{animation:toy-result-in .28s cubic-bezier(.2,.8,.25,1.1)}@keyframes toy-result-in{from{opacity:0;transform:translateY(15px) scale(.94)}to{opacity:1;transform:none}}}
@media(prefers-reduced-motion:reduce){.overlay-card,.overlay-card *,.color-choices button{animation:none!important;transition:none!important}}

.result-card>.eyebrow{padding:5px 15px;border-radius:8px 8px 13px 13px;background:linear-gradient(#ffe5a2,#ffd075);border:1px solid #fff9d8;color:#765126;box-shadow:0 3px #ba8b4e44}
[data-pair-controls] button{box-shadow:inset 0 3px #ffffff80,0 4px 0 #78998a,0 6px 8px #275a6726;background-image:linear-gradient(155deg,#ffffff55,transparent 50%,#d4ad5020)!important}

.color-choices .color-symbol{position:relative}
.color-choices .color-symbol .color-fallback{display:block;background:transparent;border:0;padding:0;font:900 34px/44px system-ui;text-shadow:0 1px #fff;-webkit-text-stroke:1px #234f4e;paint-order:stroke fill}
.color-choices .color-symbol [hidden]{display:none!important}

/* Editorial content stays below the unchanged viewport-sized game, never in its controls. */
.home-catalog,.play-overview{max-width:850px;margin:24px auto;padding:24px;border-radius:24px;background:#fff8e9;color:#17454b;line-height:1.7}
.home-catalog>ul{padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:20px}.home-catalog h3{margin:0}.home-catalog li p{margin:8px 0}.home-catalog a,.play-overview a{text-decoration:underline;text-underline-offset:3px}.play-overview h2{font-size:20px;margin:18px 0 8px}.language-links{max-width:850px;margin:16px auto;display:flex;justify-content:center;flex-wrap:wrap;gap:6px 18px;padding:8px 16px}.language-links a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline}.language-links [aria-current]{font-weight:800}#app[data-view=game] footer{display:flex}
@media(max-width:600px){.home-catalog,.play-overview{margin:16px 12px;padding:20px}footer{flex-wrap:wrap}}
#menu-dialog .language-links{grid-template-columns:repeat(2,minmax(0,1fr));margin:8px 0;padding:0;gap:6px}#menu-dialog .language-links a{overflow-wrap:anywhere}

/* Return-play context remains readable without animation, including short landscape. */
.puzzle-progress{display:block;font-size:13px;line-height:1.5;font-weight:700;color:#315853;margin:8px 0;overflow-wrap:anywhere}
.puzzle-progress>span{display:block;font-weight:400}
.result-comparison{display:block;font-size:13px;line-height:1.5;color:#315853;margin-top:6px}
.result-recommendation{width:100%;margin-top:12px;border-top:1px solid #b3ad88;padding-top:10px;font-size:13px;line-height:1.4;color:#315853}
.result-recommendation>span{display:block}
.result-recommendation a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;text-decoration:none;white-space:normal}
.result-recommendation svg{width:18px;flex-shrink:0}
.result-recommendation a:focus-visible{outline:3px solid #205e6b;outline-offset:3px}
@media(max-height:600px) and (min-width:650px){.result-card .result-recommendation,.result-card .result-comparison{grid-column:1/-1}.result-card .result-recommendation{margin-top:6px;padding-top:6px}.result-card .result-recommendation .primary{margin-top:6px}.result-card{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}