@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fredoka:wght@400;500;600;700&display=swap');
:root{--bg:#251d39;--panel:#332744;--ivory:#fff6dc;--muted:#ddd1ea;--accent:#ff98aa;--line:#5f4c72;--ink:#292039;--yellow:#fbd67b}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--bg);color:var(--ivory);font:16px/1.7 'DM Sans',sans-serif}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #b3dfdc;outline-offset:6px}.skip{position:fixed;top:-100px;left:20px;background:var(--yellow);color:var(--ink);padding:12px;z-index:20}.skip:focus{top:10px}header{max-width:1300px;margin:auto;min-height:105px;display:flex;align-items:center;justify-content:space-between;padding:18px 4%;gap:24px}.brand{display:flex;align-items:center;gap:10px}.brand-icon{width:57px;height:63px;object-fit:contain}.brand-name{font-family:Fredoka,sans-serif;font-size:28px;letter-spacing:1px;font-weight:600;line-height:1}.brand-name small{display:block;font:500 12px 'DM Sans',sans-serif;letter-spacing:6px;margin:8px 0 0 3px}nav{display:flex;gap:9px;flex-wrap:wrap}nav a{font-family:Fredoka,sans-serif;font-size:18px;padding:7px 19px;border:2px solid transparent;border-radius:12px;transition:transform .2s,background .2s}nav a:hover{color:var(--yellow);transform:rotate(-3deg)}nav a.active{background:var(--yellow);color:var(--ink);border-color:var(--ink);box-shadow:3px 3px 0 #100b20;transform:rotate(-3deg)}.hero{max-width:1370px;margin:10px 30px 0;min-height:655px;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;padding:66px 6% 100px;position:relative;isolation:isolate;border:3px solid #100c1c;border-radius:32px;background:#20243d url('assets/ribbon-world.png') center/cover;box-shadow:0 9px 0 #130e24;overflow:hidden}.hero:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#201a37ed 5%,#201a37b8 48%,#201a3740)}.hero-copy{position:relative;z-index:2}.eyebrow{font-weight:700;font-size:14px;letter-spacing:.4px;color:var(--yellow);margin:0 0 24px}.hero .eyebrow{display:inline-block;color:var(--ink);background:var(--yellow);border:2px solid var(--ink);border-radius:6px;padding:5px 14px;transform:rotate(-3deg);box-shadow:3px 3px 0 var(--ink)}h1,h2,h3{font-family:Fredoka,sans-serif;font-weight:600;margin:0;letter-spacing:-1px;line-height:1.08}h1{font-size:clamp(50px,6.3vw,86px);text-shadow:4px 5px 0 #201a37}h1 em,h2 em{font-style:normal;color:var(--accent)}.intro{font-size:18px;line-height:1.7;color:var(--ivory);margin:26px 0 28px}.button,.text-button{display:inline-flex;align-items:center;justify-content:center;padding:12px 25px;border:2px solid var(--ink);border-radius:12px;background:var(--yellow);color:var(--ink);font-family:Fredoka,sans-serif;font-weight:500;font-size:19px;cursor:pointer;box-shadow:4px 5px 0 #120d20;transition:transform .2s,box-shadow .2s}.button:hover,.text-button:hover{transform:translate(2px,2px);box-shadow:2px 3px 0 #120d20;background:#ffe6a7}.hero-mascot{position:relative;align-self:center;transform:rotate(5deg);padding:0 8px}.hero-mascot img{width:100%;max-height:430px;object-fit:contain;filter:drop-shadow(0 12px 0 #19112577)}.mascot-note{display:block;width:max-content;max-width:100%;margin:-4px auto 0;background:var(--accent);border:2px solid var(--ink);padding:7px 20px;transform:rotate(-9deg);color:var(--ink);font:500 20px Fredoka,sans-serif;box-shadow:4px 4px 0 var(--ink);border-radius:5px}.hero-bottom{position:absolute;left:6%;right:6%;bottom:28px;display:flex;justify-content:space-between;gap:20px;color:#e9dfef;font-size:13px}.hero-bottom a{color:var(--yellow);font-weight:600}.scroll-line{display:none}.section{padding:85px max(7%,calc((100vw - 1160px)/2));position:relative}.section-top{margin-bottom:30px}.section-top .eyebrow{display:inline-block;padding:4px 13px;border-radius:7px;border:1px dashed #a28cb4;color:var(--muted);font-size:14px;margin:0}.fine-rule{display:none}h2{font-size:clamp(40px,4.7vw,62px)}.about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:9%;align-items:center}.about-grid p{color:var(--muted);margin:24px 0;font-size:17px}.about-mark{background:#403055;border:3px solid #150f25;border-radius:47% 47% 18% 18%;box-shadow:8px 9px 0 #171022;display:flex;flex-direction:column;align-items:center;padding:22px 25px 26px;transform:rotate(-5deg)}.about-mark img{width:100%;max-height:305px;object-fit:contain}.about-mark>span{font:400 17px Fredoka,sans-serif;color:var(--yellow);margin-top:13px;text-align:center}.studio-note{display:flex;align-items:center;gap:15px;border-top:2px dashed var(--line);padding-top:20px;margin-top:27px;font-size:16px}.asterisk{font-size:35px;color:var(--yellow)}.games{background:var(--ivory);color:var(--ink);border-block:3px solid #140f24;background-image:radial-gradient(#dccda8 1px,transparent 1px);background-size:19px 19px}.games .section-top .eyebrow{color:#6a4962;border-color:#967b81;background:var(--ivory)}.games h2 em{color:#ab3759}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:45px}.section-heading>p{font-size:17px;max-width:280px;color:#635068}.game-grid{display:grid;grid-template-columns:1fr 1fr;gap:35px}.game-card{background:#fffaf0;border:3px solid var(--ink);border-radius:17px;overflow:hidden;box-shadow:7px 8px 0 #d2b8c8;transform:rotate(-1.3deg)}.game-card:nth-child(2){transform:rotate(1.3deg);background:#eadff2}.game-art{display:block;position:relative;aspect-ratio:1.45;width:100%;border:0;border-bottom:3px solid var(--ink);padding:0;overflow:hidden;background:#2a223f;color:white}.semester{cursor:pointer}.game-bg{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}.semester:hover .game-bg{transform:scale(1.045)}.semester:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#172d3990,transparent 60%);pointer-events:none}.game-title{position:absolute;left:12%;top:7%;width:76%;height:70%;object-fit:contain;z-index:1;filter:drop-shadow(0 3px 10px #152126)}.art-caption{position:absolute;bottom:16px;left:0;right:0;text-align:center;z-index:1;font:500 19px Fredoka,sans-serif}.mystery .game-bg{opacity:1;image-rendering:pixelated}.mystery-label{background:linear-gradient(180deg,#251d3910,#251d3960);text-shadow:0 2px 5px #130e24,0 0 16px #130e24}.mystery-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px}.mystery-label>span{font:500 18px Fredoka,sans-serif;color:var(--yellow)}.mystery-label .diamond{font-size:58px;line-height:1;color:var(--accent)}.mystery-label strong{font:500 clamp(20px,2.4vw,32px) Fredoka,sans-serif}.mystery-label .placeholder-label{font:500 12px 'DM Sans',sans-serif;letter-spacing:1px;color:#ddd1ea;margin-top:8px}.game-info{padding:27px}.game-category{display:inline-block;color:#6d3c58;background:#f8dfdf;padding:3px 9px;border-radius:6px;font-size:12px;font-weight:700;margin:0 0 16px}h3{font-size:28px;line-height:1.2;letter-spacing:-.3px}.game-info>p:not(.game-category){color:#65536b;font-size:16px;line-height:1.8;margin:16px 0 23px}.text-button{font-size:17px;padding:8px 19px;background:#ffc4ca;box-shadow:3px 4px 0 var(--ink)}.quiet-label{display:inline-block;font:500 18px Fredoka,sans-serif;color:#684b80;padding:7px 0}.contact{background:#302443}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:start}.contact p{color:var(--muted);font-size:17px;margin:24px 0}.email-link{display:inline-block;font-size:clamp(16px,1.8vw,24px);border-bottom:2px dashed var(--accent);padding-bottom:5px;color:var(--yellow);margin:6px 0 16px;overflow-wrap:anywhere}.contact-caption{display:block;font-size:14px;color:var(--muted)}form{background:#fff6dc;color:var(--ink);border:3px solid #181023;border-radius:18px;padding:28px;box-shadow:7px 8px 0 #181023;transform:rotate(1deg)}label{font-size:14px;font-weight:700;display:block}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:17px}input,textarea{display:block;width:100%;background:#fffdf6;border:2px solid #d5c2cb;color:var(--ink);border-radius:8px;padding:11px;margin:8px 0 19px;font-size:16px;resize:vertical}input::placeholder,textarea::placeholder{color:#807083}.form-bottom{display:flex;align-items:center;gap:17px}.form-bottom .button{font-size:17px;padding:10px 15px;white-space:nowrap}.form-bottom>span{font-size:12px;color:#65536b;line-height:1.5}.contact #form-status{font-size:14px;color:var(--ink);margin:16px 0 0}footer{padding:30px 7%;display:flex;align-items:center;justify-content:space-between;gap:25px;font-size:14px;color:var(--muted)}footer .brand-name{font-size:22px}footer .brand-name small{font-size:10px}footer .brand-icon{width:42px;height:50px}footer>a:last-child{color:var(--yellow)}dialog{background:var(--ivory);color:var(--ink);border:3px solid var(--ink);border-radius:20px;padding:0;max-width:850px;width:calc(100% - 32px);max-height:90svh;overflow:auto;box-shadow:8px 8px 0 #0e091dcc}dialog::backdrop{background:#160f26de;backdrop-filter:blur(7px)}body:has(dialog[open]){overflow:hidden}.dialog-art{width:100%;display:block}.dialog-copy{padding:32px 40px 40px}.dialog-copy h2{font-size:38px}.dialog-copy p:not(.eyebrow){color:#65536b}.dialog-copy .eyebrow{font-size:13px;color:#ab3759;margin-bottom:20px}.close-dialog{display:grid;place-items:center;padding:0;line-height:1;z-index:2;position:absolute;right:12px;top:12px;width:42px;height:42px;background:var(--yellow);color:var(--ink);border:2px solid var(--ink);border-radius:50%;font-size:28px;cursor:pointer}.release-note{font-size:14px;border-top:2px dashed #d5c2cb;padding-top:20px}
@media(min-width:1430px){.hero{margin-left:auto;margin-right:auto}}
@media(max-width:950px){.hero{grid-template-columns:1.2fr .8fr;padding-left:5%;padding-right:5%;min-height:610px}.hero-mascot{padding:0}.mascot-note{font-size:16px;padding:7px 10px}.about-grid{gap:6%}.section{padding:70px 6%}.contact-grid{gap:5%}.form-row{grid-template-columns:1fr;gap:0}.form-bottom{align-items:start;flex-direction:column}.section-heading>p{max-width:220px}.game-info{padding:23px}}
@media(max-width:650px){header{flex-direction:column;padding:18px 15px 8px;gap:17px}.brand-icon{width:47px;height:52px}.brand-name{font-size:27px}nav{gap:3px;justify-content:center;width:100%}nav a{font-size:16px;padding:5px 11px}.hero{margin:14px 14px 0;padding:38px 25px 73px;grid-template-columns:1fr;gap:23px;min-height:0;border-radius:22px;text-align:center;background-position:65% center}.hero .eyebrow{font-size:13px;margin-bottom:22px}h1{font-size:clamp(43px,11vw,68px)}.intro{font-size:16px}.intro br{display:none}.hero-mascot{max-width:260px;margin:0 auto}.hero-mascot img{height:230px}.hero-bottom{bottom:20px;justify-content:center;font-size:13px}.hero-bottom>span{display:none}.section{padding:60px 25px}.section-top .eyebrow{font-size:12px}h2{font-size:43px}.about-grid,.contact-grid,.game-grid{grid-template-columns:1fr;gap:35px}.about-mark{order:2;max-width:300px;margin:0 auto;width:100%}.about-mark img{height:230px}.section-heading{display:block;margin-bottom:30px}.section-heading>p{max-width:none}.game-card,.game-card:nth-child(2){transform:none;box-shadow:5px 6px 0 #d2b8c8}.game-art{aspect-ratio:1.4}.mystery-label strong{font-size:29px}.game-info{padding:23px}.contact-grid{gap:30px}form{padding:22px;transform:none;box-shadow:5px 6px 0 #181023}.form-bottom{flex-direction:row;align-items:center}.contact-caption{font-size:13px}footer{flex-wrap:wrap;padding:28px 25px;gap:20px}footer .brand{width:100%}.dialog-copy{padding:25px}.dialog-copy h2{font-size:31px}}
@media(max-width:370px){nav a{padding:5px 8px;font-size:15px}.section{padding-inline:19px}.form-bottom{flex-direction:column;align-items:start}.mystery-label strong{font-size:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.trailer-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:28px 0}.trailer-actions>span{font-size:14px;color:#65536b}#game-trailer{display:block;width:100%;aspect-ratio:160/99;background:#132332;border:2px solid var(--ink);border-radius:12px}#trailer-panel[hidden]{display:none}.dialog-copy .trailer-note{font-size:14px;line-height:1.6}.trailer-transcript{font-size:14px;color:#65536b;margin:15px 0}.trailer-transcript summary{cursor:pointer;font-weight:700;color:var(--ink)}.trailer-download{display:inline-block;font-size:14px;color:#923252;border-bottom:1px solid currentColor;margin:0 0 12px}
.ribbon-socials{position:relative;width:max-content;max-width:100%;margin:0 auto;z-index:3}.ribbon-toggle{cursor:pointer;position:relative;z-index:2;transition:transform .2s,background .2s}.ribbon-socials.is-open .ribbon-toggle{background:var(--yellow);transform:rotate(-5deg)}.social-fan{position:absolute;width:180px;height:106px;left:50%;bottom:calc(100% - 8px);transform:translateX(-50%);pointer-events:none;visibility:hidden;transition:visibility 0s .25s}.ribbon-socials.is-open .social-fan{visibility:visible;pointer-events:auto;transition-delay:0s}.social-bubble{position:absolute;left:calc(50% - 24px);bottom:8px;width:48px;height:48px;border:3px solid var(--ink);border-radius:50%;display:grid;place-items:center;background:var(--ivory);color:var(--ink);box-shadow:3px 4px 0 #100b20;cursor:pointer;opacity:0;transform:translate(0,40px) scale(.2);transition:transform .35s cubic-bezier(.2,.8,.2,1.2),opacity .2s,background .2s;transition-delay:0s}.social-bubble:nth-child(2){background:var(--yellow)}.social-bubble svg{width:23px;height:23px;fill:currentColor}.ribbon-socials.is-open .social-bubble{opacity:1;transform:translate(var(--x),var(--y)) scale(1);transition-delay:calc(var(--i)*35ms)}.ribbon-socials.is-open .social-bubble:hover,.ribbon-socials.is-open .social-bubble:focus-visible{transform:translate(var(--x),calc(var(--y) - 7px)) scale(1.1);background:#b3dfdc;transition-delay:0s}.social-status{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%) rotate(-5deg);width:260px;text-align:center;font-size:12px;line-height:1.4;color:var(--ivory);background:var(--ink);border-radius:7px;padding:7px 10px}.social-status:empty{display:none}@media(prefers-reduced-motion:reduce){.social-bubble,.ribbon-toggle,.social-fan{transition:none!important}}

.social-bubble[data-coming-soon]::after{content:"Coming soon";position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);white-space:nowrap;background:var(--ivory);color:var(--ink);border:2px solid var(--ink);border-radius:7px;padding:3px 7px;font:500 12px Fredoka,sans-serif;box-shadow:2px 2px 0 #100b20;pointer-events:none;opacity:0}.social-bubble[data-coming-soon]:hover::after,.social-bubble[data-coming-soon]:focus-visible::after{opacity:1}
