/* SPDX-License-Identifier: Apache-2.0 */
.modules-main{max-width:1440px;padding-block:58px 64px}.modules-page .header nav [aria-current]{color:var(--cyanlight)}
.modules-page :is(h1,h2){line-height:1.1}.modules-page h1{font-size:clamp(42px,5.5vw,76px);letter-spacing:-.04em;margin:20px 0 24px}.modules-page h1 span{color:var(--cyanlight)}
.modules-intro>p:not(.eyebrow){font-size:20px;line-height:1.65;color:var(--muted);max-width:770px}.module-areas{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:36px}.module-areas a{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:8px;padding:18px 22px;background:var(--panel);min-height:100px}.module-areas a:hover{border-color:var(--cyan)}.module-areas strong{font-size:14px;letter-spacing:.08em;color:var(--cyanlight)}.module-areas span{font-size:14px;color:var(--muted);margin-top:5px}
.modules-disclosure{font-size:15px;color:var(--muted);max-width:850px;margin:28px 0 36px}.module-directory{display:grid;gap:28px}.module-tile{display:grid;grid-template-columns:1.15fr 1fr;overflow:hidden;border:1px solid var(--line);border-radius:10px;background:#0b1b2c;scroll-margin-top:110px}.module-art{margin:0;min-width:0;background:#0b1b2c}.module-art img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}.module-art figcaption{font-size:12px;color:#bdcedd;padding:12px 16px;background:#0a1827;line-height:1.5}.module-tile-copy{padding:clamp(24px,3vw,42px);display:flex;flex-direction:column;justify-content:center}.module-tile h2{font-size:clamp(28px,3vw,42px);margin:12px 0 18px}.module-tile h2 a:hover{color:var(--cyanlight)}.module-action{font-size:19px;line-height:1.65;margin:0 0 20px}.module-status{font-size:14px;line-height:1.6;color:#ffe0a7;border-left:2px solid #c7a56d;padding-left:12px}.module-audience{display:flex;flex-wrap:wrap;gap:9px;list-style:none;padding:0;margin:20px 0}.module-audience li{padding:6px 11px;border:1px solid #38516a;border-radius:30px;font-size:13px;color:#c3d7e5;line-height:1.5}.module-link{display:inline-flex;align-items:center;gap:24px;min-height:48px;color:var(--cyanlight);font-size:16px;font-weight:500;text-decoration:underline;text-underline-offset:5px;align-self:start}.module-jobs-note{margin:44px 0 0;border-top:1px solid var(--line);padding:30px 0;max-width:850px}.module-jobs-note h2{font-size:30px;margin:12px 0}.module-jobs-note p{font-size:17px;line-height:1.7;color:var(--muted)}.module-jobs-note a{display:inline-flex;align-items:center;min-height:44px;color:var(--cyanlight);text-decoration:underline}
.module-breadcrumb{display:flex;flex-wrap:wrap;gap:16px;align-items:center;color:var(--muted);font-size:14px;margin-bottom:32px}.module-breadcrumb a{color:var(--cyanlight);min-height:44px;display:inline-flex;align-items:center}.module-showcase{display:grid;grid-template-columns:1fr 1.2fr;gap:48px;align-items:center}.module-showcase h1{font-size:clamp(38px,4.4vw,62px)}.module-showcase .module-art{border:1px solid var(--line);border-radius:10px;overflow:hidden}.module-value{font-size:17px;color:var(--muted);line-height:1.7}.module-fit{display:grid;grid-template-columns:1fr 1fr;gap:70px;padding-block:54px;border-bottom:1px solid var(--line)}.module-fit h2{font-size:clamp(26px,2.5vw,34px);margin:14px 0 20px}.module-fit p{font-size:17px;line-height:1.75;color:var(--muted);max-width:580px}.module-fit a{color:var(--cyanlight);text-decoration:underline;display:inline-flex;align-items:center;min-height:44px;font-size:15px}.module-rights{border-left:2px solid #53758c;padding-left:20px}.module-experience{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;padding:38px 0 48px;scroll-margin-top:110px}.module-experience h2{font-size:clamp(28px,3vw,40px);margin:12px 0 24px}.module-experience p{font-size:17px;color:var(--muted);line-height:1.75}.module-experience p.module-fine{font-size:14px}.module-specs{margin:12px 0;background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:26px}.module-specs dt{font-size:13px;color:var(--cyanlight);font-weight:500;margin-bottom:8px}.module-specs dd{font-size:15px;color:var(--muted);line-height:1.7;margin:0 0 24px}.module-specs dd:last-child{margin-bottom:0}.module-next{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;border-top:1px solid var(--line);padding-top:26px}.module-next a{display:flex;flex-wrap:wrap;align-items:center;gap:16px;min-height:80px;padding:16px;border:1px solid var(--line);border-radius:8px;font-size:16px}.module-next a>span:first-child{color:var(--cyanlight);width:100%;font-size:12px;letter-spacing:.1em}.module-next a:hover{background:var(--panel)}.modules-footer{padding-block:32px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}.modules-footer nav a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:980px){.module-showcase{gap:26px}.module-fit,.module-experience{gap:32px}.module-areas{grid-template-columns:1fr 1fr}.module-tile{grid-template-columns:1fr 1fr}.module-next{grid-template-columns:1fr}}
@media(max-width:760px){.modules-main{padding-block:32px 44px}.module-tile,.module-showcase,.module-fit,.module-experience{grid-template-columns:1fr}.module-showcase .module-art{grid-row:1}.module-showcase{gap:24px}.module-tile-copy{padding:24px}.module-fit{padding-block:30px;gap:20px}.module-experience{padding-block:30px;gap:20px}.modules-intro>p:not(.eyebrow){font-size:18px}.wide-break{display:none}.module-areas{gap:10px;margin-top:24px}.module-areas a{padding:15px}.modules-footer{align-items:start;flex-direction:column}.module-breadcrumb{margin-bottom:20px}.module-directory{gap:22px}.module-action{font-size:18px}.module-specs{padding:22px}}

/* Complement the root header offset at section links. */
.module-tile,.module-experience{scroll-margin-top:20px}
@media(max-width:980px){html:not(.has-js){scroll-padding-top:16px}html:not(.has-js) .modules-page .header{position:static}}
.module-experience--demo{display:block;border-block:1px solid var(--line);margin-top:40px}.module-demo{min-width:0}.module-demo>p{max-width:850px}.module-demo-stage{position:relative;aspect-ratio:16/9;max-height:62vh;min-height:300px;overflow:hidden;background:#050b12;border:1px solid #38516a;border-radius:8px}.module-demo-host,.module-demo-host iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.module-demo-poster{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:24px;background:radial-gradient(ellipse at top,#123247,#08111d 75%);color:var(--muted)}.module-demo-poster strong{font-size:clamp(22px,3vw,34px);color:var(--text);line-height:1.3}.module-demo-poster span{font-size:15px;line-height:1.7}.module-demo [hidden]{display:none!important}.module-demo-toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:18px}.module-demo-toolbar :is(button,a){display:inline-flex;align-items:center;justify-content:center;min-height:48px;border:1px solid #53758c;border-radius:6px;padding:10px 16px;font:inherit;font-size:15px;color:var(--cyanlight);background:#102436;cursor:pointer}.module-demo-toolbar a{gap:10px;text-decoration:underline;text-underline-offset:4px}.module-demo-toolbar :is(button,a):hover{background:#17354b;border-color:var(--cyanlight)}.module-demo-toolbar [data-demo-play]{background:var(--cyanlight);color:#08111d;border-color:var(--cyanlight);font-weight:600}.module-demo-toolbar [data-demo-play]:hover{background:#b3f4fa}.module-demo p.module-demo-status,.module-demo p.module-demo-error{font-size:14px;line-height:1.7}.module-demo-error{border-left:2px solid #ffe0a7;padding-left:14px;color:#ffe0a7!important}.module-experience--demo .module-specs{margin-top:30px}.module-demo:fullscreen{background:#08111d;padding:18px;display:flex;flex-direction:column;overflow:auto}.module-demo:fullscreen>.eyebrow,.module-demo:fullscreen>h2,.module-demo:fullscreen>p:not(.module-demo-status):not(.module-demo-error){display:none}.module-demo:fullscreen .module-demo-stage{flex:1;aspect-ratio:auto;min-height:220px}.module-demo:fullscreen .module-demo-toolbar{flex-shrink:0}.module-demo:fullscreen .module-demo-status{margin-bottom:0}
@media(max-width:760px){.module-experience--demo{margin-top:26px}.module-demo-stage{min-height:340px;max-height:none;aspect-ratio:3/4}.module-demo-toolbar{gap:10px}.module-demo-toolbar :is(button,a){padding:10px 12px}.module-demo:fullscreen{padding:10px}}
/* Completion pass: purposeful starting points and a visible, explicit demo entry. */
.module-starts{margin-top:40px}.module-section-heading h2{font-size:clamp(27px,3vw,38px);margin:10px 0 24px}.module-start-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.module-start-grid article{padding:28px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(140deg,#102a3e,#0a1929)}.module-start-grid h3{font-size:26px;line-height:1.2;margin:12px 0 18px;max-width:450px}.module-start-grid p:not(.eyebrow){font-size:16px;line-height:1.75;color:var(--muted);max-width:550px}.module-start-grid .module-link{display:flex;margin-top:18px}.module-small-link{display:inline-flex;align-items:center;min-height:44px;color:var(--cyanlight);text-decoration:underline;text-underline-offset:5px;font-size:15px;line-height:1.5}.module-status--available{color:#a0edce;border-left-color:#68d5b0}.module-heading-actions{display:flex;align-items:center;flex-wrap:wrap;gap:14px 24px;margin-top:22px}.module-heading-actions .button{font-size:15px;min-height:48px}.module-workflow{padding:44px 0;border-bottom:1px solid var(--line);scroll-margin-top:22px}.module-workflow ol{padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.module-workflow li{padding:26px;border:1px solid var(--line);border-radius:8px;background:#0b1b2c}.module-step-number{font-size:13px;color:var(--cyanlight);letter-spacing:.1em}.module-workflow h3{font-size:23px;line-height:1.25;margin:28px 0 14px}.module-workflow p{font-size:16px;line-height:1.75;color:var(--muted);margin-bottom:0}.module-related-work{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:34px 0}.module-related-work h2{font-size:29px;margin:8px 0 14px}.module-related-work p:not(.eyebrow){max-width:720px;line-height:1.7;color:var(--muted);font-size:16px}.module-related-work>a{flex-shrink:0}.module-specs a{color:var(--cyanlight);text-decoration:underline;text-underline-offset:3px}#reuse,#module-controls{scroll-margin-top:120px}.module-demo-stage{height:min(62vh,620px);aspect-ratio:auto;max-height:none;min-height:360px}.module-demo-poster{padding:0;isolation:isolate}.module-demo-poster>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.32);z-index:-2}.module-demo-poster:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#061321e8,#06132155),linear-gradient(0deg,#061321cf,transparent)}.module-demo-invitation{padding:34px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;width:100%}.module-demo-invitation .eyebrow{font-size:12px;margin:0}.module-demo-invitation>strong{font-size:clamp(32px,4vw,56px);letter-spacing:-.035em}.module-demo-invitation>span{max-width:550px;color:#d2e4ef}.module-demo [data-demo-play]{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:56px;padding:14px 27px;border:1px solid #8eebfc;border-radius:8px;background:#86e9f7;color:#08111d;font:inherit;font-weight:600;cursor:pointer}.module-demo [data-demo-play]:hover{background:#b7f5fc}.module-demo p.module-demo-keys{font-size:14px;color:#d5e8f2;margin:4px 0}.module-demo-keys kbd{font:inherit;border:1px solid #7898ac;padding:5px 8px;border-radius:4px;margin-right:5px;background:#0b1a29}.module-demo-keys>span{margin:0 10px}.module-demo-invitation .module-demo-art-note{font-size:12px;color:#c2d4e2}.module-demo-loading{display:none;position:absolute;inset:0;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;padding:28px;background:#08111df5;pointer-events:none}.module-demo-loading strong{font-size:26px;color:var(--text)}.module-demo-loading span{font-size:15px;color:var(--muted);line-height:1.6}.module-demo[data-state="loading"] .module-demo-loading{display:flex}.module-demo-device-note{display:none}.module-demo:fullscreen .module-demo-stage{height:auto}
@media(max-width:980px){.module-workflow ol{gap:12px}.module-workflow li{padding:22px}.module-related-work{display:block}.module-related-work>a{margin-top:12px}}
@media(max-width:760px){.module-start-grid,.module-workflow ol{grid-template-columns:1fr}.module-starts{margin-top:30px}.module-start-grid article{padding:24px}.module-start-grid h3{font-size:25px}.module-workflow{padding-block:32px}.module-workflow h3{margin-top:18px}.module-demo-stage{height:min(58svh,480px);min-height:340px;aspect-ratio:auto}.module-demo-invitation{padding:22px;gap:15px}.module-demo-invitation .eyebrow{font-size:10px;letter-spacing:1px}.module-demo p.module-demo-keys{line-height:2.4}.module-demo-invitation .module-demo-art-note{font-size:11px}.module-demo .module-demo-device-note{display:block;font-size:14px;line-height:1.7}.module-related-work{padding-block:26px}}
/* Keep pause/retry/return controls in reach while the embedded game is in view. */
.module-demo-toolbar{position:sticky;top:84px;z-index:10;margin:0;padding:12px 0;background:#08111df5;border-bottom:1px solid var(--line)}.module-demo:fullscreen .module-demo-toolbar{position:static;padding-top:0;margin-top:0}
@media(max-width:980px){.module-demo-toolbar{top:70px}}

/* Let visitors reach an existing example before the audience guidance. */
.modules-intro{display:grid;grid-template-columns:minmax(0,2fr) minmax(250px,1fr);column-gap:60px}.modules-intro>:not(nav):not(a){grid-column:1}
.module-intro-play{grid-column:2;grid-row:1/4;align-self:center;min-height:176px;display:flex;align-items:center;gap:18px;padding:26px;border:1px solid #3c6b80;border-radius:8px;background:linear-gradient(135deg,#15374a,#0b1c2e);color:var(--cyanlight)}
.module-intro-play:hover{border-color:var(--cyanlight);background:#15374a}
.module-intro-play__icon{font-size:36px;font-weight:400;line-height:1}
.module-intro-play>span:last-child{margin-left:auto}
.module-intro-play strong{display:block;color:var(--text);font-size:22px;font-weight:600;line-height:1.3;margin-bottom:10px}
.module-intro-play strong+span{display:block;color:#bcd4e1;font-size:14px;line-height:1.6}
.modules-intro .module-areas{grid-column:1/-1;margin-top:42px;border-block:1px solid var(--line);gap:0}
.module-areas a{border:0;border-radius:0;background:transparent;padding-block:22px}
.module-areas a:first-child{padding-left:0}.module-areas a+a{border-left:1px solid var(--line)}
.module-areas a:hover{background:#11273a}
.modules-disclosure strong{color:var(--text);font-weight:500}
.module-directory{gap:36px}
.module-tile:nth-child(even) .module-art{order:2}
.module-starts{margin-top:64px;padding-top:40px;border-top:1px solid var(--line)}
.module-start-grid article{border:0;border-top:1px solid #3b566a;border-radius:0;background:transparent;padding:26px 24px 10px 0}
.module-start-grid article+article{padding-left:24px;border-left:1px solid var(--line)}
.modules-page .module-start-grid h3{font-size:27px}
@media(max-width:1100px){.modules-intro{column-gap:30px;grid-template-columns:minmax(0,2fr) minmax(220px,1fr)}.module-intro-play{padding:22px;gap:12px}.module-intro-play__icon{font-size:28px}.module-intro-play strong{font-size:21px}}
@media(max-width:760px){.modules-intro{grid-template-columns:minmax(0,1fr)}.module-intro-play{grid-column:1;grid-row:auto;min-height:0;margin:28px 0 0;padding:22px}.module-intro-play strong{font-size:21px;margin-bottom:4px}.module-intro-play__icon{font-size:32px}.modules-intro .module-areas{margin:26px 0 0;grid-template-columns:repeat(2,minmax(0,1fr))}.module-areas a{padding:18px 16px;min-height:94px}.module-areas a:nth-child(3){padding-left:0;border-left:0}.module-areas a:nth-child(n+3){border-top:1px solid var(--line)}.module-tile:nth-child(even) .module-art{order:0}.module-starts{margin-top:40px;padding-top:30px}.module-start-grid article{padding:22px 0 10px}.module-start-grid article+article{padding-left:0;border-left:0}.module-directory{gap:26px}}
