/* Harmonie 0.2 extends the approved start-page mood to every game view. */
body,body:has(.play-page){background:var(--cream)}body{background-image:radial-gradient(ellipse at 5% 15%,#f8dfac22,transparent 45%),radial-gradient(ellipse at 90% 90%,#dbe8c52e,transparent 45%)}.site-header{background:transparent;border:0;padding:27px 6% 20px;max-width:1440px;width:100%;margin:auto;gap:20px}.brand-logo{width:224px}.company-claim,.product-name{display:none}.header-link{background:#0092460b;border-radius:70% 45% 60% 45%;padding:12px 20px;text-decoration:none;font-size:11px;min-height:44px}.site-header .brand-link{display:block}.site-footer{border:0;background:transparent;color:var(--muted);padding-top:20px;font-size:9px;gap:6px 22px}.site-footer .text-link{font-size:9px;min-height:44px}.site-footer>span:first-child{font-weight:800}main{padding:0;max-width:1440px}.app-view:not(.start-screen){padding:24px clamp(24px,5vw,72px) 35px;position:relative;isolation:isolate;max-width:1320px;margin:auto;min-height:660px}.app-view:not(.start-screen):before{content:'';position:absolute;inset:5% 0 0;background:radial-gradient(ellipse at 45% 50%,#f6e8c547,transparent 70%);z-index:-1;pointer-events:none}.app-view:not(.start-screen) h1{transform:none;width:auto;max-width:100%;margin-left:0;font-style:italic;font-size:45px;line-height:1.2;letter-spacing:-1.5px}.app-view:not(.start-screen) h1 span{font-size:inherit;letter-spacing:inherit;color:inherit}.page-title{max-width:670px!important}.page-nav{margin:0 0 24px;gap:20px}.page-nav .back,.page-nav .subtle-button{font-size:12px;font-weight:600}.back span{font-size:25px}.btn,.button{font-family:Montserrat,Arial,sans-serif;cursor:pointer}.btn{border-radius:999px;min-height:56px;padding:14px 28px;border:2px solid white;background:linear-gradient(175deg,#ffe68a,#FFD45C 65%,#ffc736);color:var(--ink);box-shadow:0 4px 0 #c5902726,0 8px 24px #ae852b14;font-size:16px;gap:22px}.btn.dark{background:#f0e5c8;color:var(--ink);box-shadow:none}.btn.outline{background:#fffaf0a8;color:var(--ink);border:1px solid #b8c6ab70;box-shadow:none}.btn:hover{filter:brightness(.98)}.btn:active{transform:translateY(1px)}.text-link{text-underline-offset:5px}.eyebrow{letter-spacing:1.15px;font-size:9px}.page-intro{font-size:15px;line-height:1.8;margin-top:16px}.safe-note{font-size:11px;line-height:1.8}.subtle-button{font-size:12px;min-height:46px}.start-screen .hero{padding-top:23px}.start-screen .hero h1{margin-top:0;margin-bottom:0}.start-screen .button.play{border:3px solid white;font-size:18px}.start-screen .button.training{border:0;font-size:13px}.start-screen .start>p{margin-top:15px}.start-screen .scene figcaption{box-shadow:none}.start-screen .hero .intro h2{font-size:26px}.start-screen .discover{margin-top:0}.start-screen .invitation{padding-bottom:40px}.start-screen .training{color:white}.start-screen .website{font-size:10px}
/* Category choices sit together in one playful stage. */
.category-page .page-title,.category-page>.page-intro{max-width:640px}.category-stage{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:45px;align-items:center;margin:15px 0 0}.categories{display:flex;flex-direction:column;gap:15px;margin:20px 0 25px}.category{border:0!important;min-height:110px;padding:23px 32px;display:flex;flex-direction:row;align-items:center;gap:24px;border-radius:60px 43px 56px 41px;text-align:left;background:linear-gradient(115deg,#fae1d3,#f8e6d585);box-shadow:none;position:relative;transition:transform .15s ease}.category:nth-child(2){border-radius:44px 65px 42px 60px;background:linear-gradient(115deg,#dceaca,#e7eddb85)}.category:nth-child(3){border-radius:65px 45px 60px 46px;background:linear-gradient(115deg,#f7e6af,#faefd985)}.category:hover{transform:translateX(3px);background:#fae3d2}.category:nth-child(2):hover{background:#dceaca}.category:nth-child(3):hover{background:#f7e6af}.category strong{font-style:italic;font-weight:900;font-size:23px;letter-spacing:-.7px;margin:0 0 8px}.category .description{font-size:12px;line-height:1.5;padding-right:15px}.category .icon{width:40px;height:40px;color:var(--red);flex-shrink:0}.category.category-green .icon{color:#00783a}.category.category-lime .icon{color:var(--red)}.category .chevron{position:absolute;right:30px;top:50%;transform:translateY(-50%);font-size:25px}.category-visual{align-self:stretch;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end}.category-visual .leo-figure{--leo-height:390px;mix-blend-mode:multiply}.category-visual p{font-weight:800;font-style:italic;line-height:1.6;font-size:17px;text-align:center;margin-top:10px;transform:rotate(-4deg)}.category-bottom{justify-content:flex-start;gap:35px;margin-top:5px}.category-bottom .btn{min-width:260px}.category-page>.text-link{margin:24px 0 0;font-size:11px}.category-page .safe-note{text-align:left}
/* Calm question surface, soft edges, Leo always outside the reading area. */
.play-grid{grid-template-columns:minmax(0,1fr) 245px;gap:35px;align-items:stretch}.card,.play-page .card{background:linear-gradient(145deg,#fffdf8,#fff9ec);border:0;border-radius:55px 38px 52px 34px;padding:34px 40px 38px;min-height:420px;box-shadow:0 14px 60px #906c2410;position:relative;isolation:isolate}.card:before{content:'';position:absolute;inset:-18px -18px -25px;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,#f8dcc178,transparent 72%);pointer-events:none}.card[data-category="entdecker"]:before{background:radial-gradient(ellipse,#cce0b865,transparent 72%)}.card[data-category="herzen"]:before{background:radial-gradient(ellipse,#f8e4a565,transparent 72%)}.card .tag{font-size:11px;letter-spacing:.9px;display:inline-flex;align-self:flex-start;padding:10px 16px 11px;background:#f5e3d5b3;border-radius:70% 45% 65% 42%;margin-left:-5px;gap:12px}.card[data-category="entdecker"] .tag{background:#dce9cfa8}.card[data-category="herzen"] .tag{background:#f6e5b4a8}.card .tag .icon{width:26px;height:26px}.card-surface{background:transparent;border-radius:0;margin:0;padding:0}.play-page .card h1{font-style:normal;font-weight:800;font-size:36px;line-height:1.38;letter-spacing:-1.1px;margin:28px 0 0;max-width:100%;overflow-wrap:anywhere}.card .hint{font-size:14px;line-height:1.8;margin-top:25px;max-width:620px}.play-aside{background:transparent;border-radius:0;min-height:420px;padding:24px 0 0;overflow:visible;justify-content:flex-end;position:relative}.play-aside p{font-size:14px;font-style:italic;line-height:1.6;transform:rotate(-5deg);padding:10px 20px;background:#fffdf46e;border-radius:50% 45% 55% 45%;margin-bottom:14px}.play-aside .leo-figure{--leo-height:340px;mix-blend-mode:multiply}.card-controls{margin-top:30px;gap:18px 25px}.card-controls .btn{min-width:260px}.play-note{font-size:11px;margin-top:18px}.play-mode{font-size:10px}.leo-figure{mask-image:linear-gradient(to bottom,#000 89%,transparent 100%)}
/* The offer and closing scene grow out of the same family moment. */
.offer-grid{grid-template-columns:minmax(0,1fr) 1.03fr;gap:25px;align-items:center}.offer-copy .page-title{font-size:43px!important}.offer-panel{background:transparent;border:0;padding:13px 18px 15px 0;margin:10px 0 0;border-radius:30% 50% 50% 35%;position:relative;isolation:isolate}.offer-panel:before{content:'';position:absolute;inset:0 -12px 0 -20px;background:radial-gradient(ellipse at 35% 50%,#dce7c477,transparent 75%);z-index:-1;pointer-events:none}.offer-panel.parents:before{background:radial-gradient(ellipse at 35% 50%,#f1e0b177,transparent 75%)}.offer-panel h2{font-size:17px;font-style:italic;font-weight:900}.offer-panel p{font-size:13px;line-height:1.8;margin-top:8px}.family-art{width:100%;height:auto;display:block;border-radius:38px}.offer-visual{position:relative;align-self:center;margin:0 -35px 0 -25px}.offer-visual p{font-style:italic;font-weight:800;line-height:1.6;font-size:14px;transform:rotate(-3deg);margin-top:-15px}.offer-actions{max-width:430px;margin-top:25px;gap:0}.training-cta{background:var(--red);color:white;border:0;box-shadow:0 5px 20px #c1050512;border-radius:999px;min-height:67px;font-size:15px;padding:12px 20px;gap:3px}.training-cta small{font-size:10px}.offer-actions .text-link{font-size:12px}.site-address{font-size:10px}.offer-page .return-row{max-width:430px;margin-top:8px}.end-grid{grid-template-columns:1fr .86fr;gap:45px;align-items:center}.end-hello h1{font-size:43px!important;line-height:1.2!important;margin:13px 0 0!important}.end-hello .page-intro{font-size:15px;margin-top:18px}.end-hello .family-art{max-height:none;object-fit:contain;width:calc(100% + 60px);max-width:none;margin:10px 0 0 -30px}.end-invite{background:transparent;border:0;border-radius:0;padding:28px 15px;position:relative;isolation:isolate}.end-invite:before{content:'';position:absolute;inset:-25px -30px;background:radial-gradient(ellipse,#dce8c466,transparent 72%);border-radius:50%;z-index:-1;pointer-events:none}.end-invite h2{font-size:32px;font-style:italic;font-weight:900;letter-spacing:-1px;line-height:1.3}.end-invite>p{font-size:14px;line-height:1.8;margin-top:18px}.end-invite .offer-actions{margin-top:23px}.end-return{margin-top:15px}.end-return .btn{min-width:280px}.end-return .subtle-button{margin-top:7px}.complete-page,.error-page{max-width:780px!important;padding-top:70px!important;min-height:630px!important}.complete-page .icon{width:65px;height:65px;color:var(--green);margin-bottom:28px}.complete-page h1,.error-page h1{font-size:42px!important;line-height:1.25!important;margin:0}.complete-page p,.error-page p{font-size:15px;line-height:1.9;margin-top:23px}.complete-actions{max-width:400px;gap:14px;margin-top:30px}.complete-actions .btn{font-size:14px}.complete-page .safe-note{font-size:11px}.start-screen .hero .intro h1{font-style:italic;line-height:.94}
@supports(mask-image:linear-gradient(black,transparent)){.family-art{border-radius:0;mask-image:linear-gradient(to right,transparent,#000 10%,#000 94%,transparent),linear-gradient(to bottom,transparent,#000 10%,#000 75%,transparent 99%);mask-composite:intersect}}
@media(max-width:1100px){.app-view:not(.start-screen){padding:20px 40px 32px;min-height:620px}.category-stage{grid-template-columns:minmax(0,1fr) 235px;gap:25px}.category-visual .leo-figure{--leo-height:345px}.category strong{font-size:21px}.play-grid{grid-template-columns:minmax(0,1fr) 195px;gap:25px}.play-aside .leo-figure{--leo-height:305px}.play-page .card h1{font-size:32px}.card,.play-page .card{padding:28px 32px;min-height:400px}.offer-grid{grid-template-columns:1fr 1fr;gap:20px}.offer-copy .page-title{font-size:36px!important}.offer-visual{margin:0 -25px}.end-grid{gap:20px;grid-template-columns:1fr 1fr}.end-hello h1{font-size:37px!important}.end-invite h2{font-size:29px}.training-cta{font-size:13px}.start-screen .hero .intro h2{font-size:24px}}
@media(max-width:760px){.site-header{padding:22px 24px 14px}.brand-logo{width:205px}.header-link{font-size:10px;padding:10px 14px}.app-view:not(.start-screen){padding:16px 25px 30px}.category-stage{grid-template-columns:minmax(0,1fr) 180px;gap:15px}.category-visual .leo-figure{--leo-height:285px}.category-visual p{font-size:14px}.category{padding:21px 23px;gap:14px}.category strong{font-size:18px}.category .description{font-size:11px}.category .icon{width:33px;height:33px}.category .chevron{right:16px}.category-bottom{gap:20px}.category-bottom .btn{min-width:230px}.play-grid{grid-template-columns:minmax(0,1fr) 160px;gap:15px}.play-aside .leo-figure{--leo-height:260px}.play-aside p{font-size:12px}.play-page .card h1{font-size:29px}.card,.play-page .card{padding:25px;min-height:380px}.offer-grid{gap:10px}.offer-copy .page-title{font-size:32px!important}.offer-panel p{font-size:12px}.offer-panel h2{font-size:15px}.end-hello h1{font-size:31px!important}.end-invite h2{font-size:26px}.end-invite>p{font-size:12px}.training-cta{font-size:12px}}
@media(max-width:680px){.site-header{justify-content:center;padding:23px 20px 10px}.brand-logo{width:211px}.header-link{display:none}.app-view:not(.start-screen){padding:19px 21px 25px;min-height:610px}.site-footer{padding:12px 20px 20px;font-size:8px;gap:0 14px}.site-footer .text-link{font-size:8px}.app-view:not(.start-screen) h1{font-size:33px;line-height:1.25;letter-spacing:-1.1px}.page-nav{margin:0 0 20px;gap:12px}.page-nav .back,.page-nav .subtle-button{font-size:10px;line-height:1.5}.page-intro{font-size:13px;line-height:1.8;margin-top:14px}.category-page .page-title{text-align:center;font-size:34px!important;margin:5px auto 0;max-width:320px!important}.category-page>.page-intro{text-align:center;margin-top:15px}.category-stage{display:block;margin-top:10px}.category-visual{display:none}.categories{gap:14px;margin:19px 0 24px}.category{min-height:105px;padding:20px 27px 20px 20px;gap:17px;border-radius:45px 33px 47px 35px}.category:nth-child(2){border-radius:32px 45px 36px 48px}.category:nth-child(3){border-radius:45px 35px 48px 33px}.category strong{font-size:19px;margin-bottom:8px;letter-spacing:-.6px}.category .description{font-size:11px;padding-right:7px}.category .icon{width:33px;height:33px}.category .chevron{right:18px}.category-bottom{display:flex;flex-direction:column;gap:17px}.category-bottom .btn{width:100%;min-width:0;max-width:350px;font-size:15px}.category-bottom .safe-note{text-align:center;font-size:11px}.category-page>.text-link{margin:15px auto 0;text-align:center;font-size:10px}.play-grid{display:block}.play-aside{display:none}.card,.play-page .card{padding:27px 25px 30px;min-height:390px;border-radius:37px 27px 40px 28px}.card .tag{font-size:10px;letter-spacing:.6px;padding:9px 13px;margin-left:-3px}.card .tag .icon{width:24px;height:24px}.play-page .card h1{font-size:28px;line-height:1.4;letter-spacing:-.8px;margin-top:28px;font-style:normal;transform:none}.card .hint{font-size:13px;line-height:1.8;margin-top:23px}.card-controls{margin-top:25px;gap:5px;flex-direction:column;align-items:stretch}.card-controls .btn{width:100%;min-width:0;font-size:16px}.card-controls .subtle-button{font-size:11px}.play-note{font-size:10px;margin-top:8px;text-align:center}.play-mode{text-align:center;font-size:9px;margin-top:10px}.offer-grid{display:flex;flex-direction:column;gap:5px;align-items:stretch}.offer-copy .page-title{font-size:34px!important;max-width:340px!important}.offer-copy>.page-intro{font-size:13px;margin-bottom:17px}.offer-panel{padding:13px 8px 13px 4px;margin-top:6px}.offer-panel h2{font-size:16px}.offer-panel p{font-size:12px;line-height:1.8}.offer-visual{margin:0 -21px;align-self:stretch}.offer-visual .family-art{max-height:none;object-fit:contain}.offer-visual p{display:block;font-size:12px;margin-top:-14px}.offer-actions{max-width:100%;margin-top:19px}.training-cta{font-size:13px;min-height:65px;padding:12px 15px}.training-cta small{font-size:9px}.offer-actions .text-link{font-size:11px}.site-address{font-size:9px}.offer-page .return-row{max-width:none;margin-top:4px}.end-grid{display:flex;flex-direction:column;gap:0;align-items:stretch}.end-hello{text-align:center}.end-hello .eyebrow{font-size:8px;margin-top:12px}.end-hello h1{font-size:34px!important;line-height:1.22!important;margin-top:14px!important}.end-hello .page-intro{font-size:13px;line-height:1.8;margin-top:16px}.end-hello .family-art{width:calc(100% + 42px);margin:6px -21px 0;max-height:none}.end-invite{padding:7px 8px 15px;text-align:center}.end-invite h2{font-size:28px}.end-invite>p{font-size:12px;line-height:1.8;margin-top:14px}.end-invite .offer-actions{margin-top:21px}.end-return{margin-top:8px}.end-return .btn{width:100%;min-width:0;max-width:350px;font-size:14px}.end-return .subtle-button{font-size:11px}.complete-page,.error-page{min-height:610px!important;padding-top:55px!important}.complete-page h1,.error-page h1{font-size:32px!important;line-height:1.3!important}.complete-page p,.error-page p{font-size:13px;line-height:1.9;margin-top:21px}.complete-actions{margin-top:27px;gap:15px}.complete-actions .btn{font-size:13px}.complete-page .safe-note{font-size:10px}.start-screen .hero{padding-top:12px}.start-screen .hero .intro h2{font-size:19px}.start-screen .hero .intro h1{font-size:51px}.start-screen .hero .intro h1 span{font-size:66px}.start-screen .button.play{font-size:19px}.start-screen .training{font-size:11px}.start-screen .invitation{padding-bottom:30px}}
@media(max-width:350px){.app-view:not(.start-screen){padding-left:17px;padding-right:17px}.category strong{font-size:17px}.category .description{font-size:10px}.category{padding-left:16px;gap:13px}.category .icon{width:29px;height:29px}.category-page .page-title{font-size:30px!important}.play-page .card h1{font-size:25px}.card,.play-page .card{padding:24px 21px;min-height:380px}.card .tag{font-size:9px;padding:8px 10px}.offer-copy .page-title{font-size:30px!important}.training-cta{font-size:11px}.end-hello h1{font-size:30px!important}.end-invite h2{font-size:26px}.offer-visual{margin-left:-17px;margin-right:-17px}.end-hello .family-art{width:calc(100% + 34px);margin-left:-17px;margin-right:-17px}.start-screen .hero .intro h1{font-size:45px}.start-screen .hero .intro h1 span{font-size:58px}.start-screen .hero .intro h2{font-size:17px}}
@media(prefers-reduced-motion:reduce){.category{transition:none}.rise{animation:none}}
/* Only decorative outer washes may reach the viewport edge. */
body{overflow-x:clip}.card:before{inset:-14px}
main{overflow-x:clip}
/* Blend the white source sheet into a real cream backdrop inside its mask. */
.leo-figure{background:var(--cream);isolation:isolate;mix-blend-mode:normal!important;mask-image:linear-gradient(to bottom,transparent,#000 4%,#000 88%,transparent 100%)}.leo-figure img{mix-blend-mode:multiply}
/* Announced view headings are not controls; interactive focus rings stay visible. */
#view-title:focus{outline:none}
