/* Equal side columns keep navigation centered regardless of logo/account widths. */
.jgl2 .jgl2-header{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:24px;padding:20px max(24px,calc((100% - 1272px)/2))}
.jgl2-header>.jgl2-brand{justify-self:start;min-width:0;text-decoration:none}
.jgl2 .jgl2-header>nav{justify-self:center;justify-content:center;width:auto;order:initial;gap:22px;min-width:0}
.jgl2 .jgl2-header>.jgl2-account{justify-self:end;justify-content:flex-end;min-width:0;gap:16px}
.jgl2-header a{white-space:nowrap}.jgl2-header .jgl2-account>a{display:inline-flex;align-items:center;justify-content:center;min-height:44px}
.jgl2-header nav>a{display:inline-flex;align-items:center;min-height:44px}
.jgl2-shell>*,.jgl2-grid>*,.jgl2-test-grid>*,.jgl2-feedback-form>*,.jgl2-device-form>*{min-width:0}
.jgl2 input,.jgl2 textarea,.jgl2 select{max-width:100%}.jgl2-test-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1100px){
 .jgl2 .jgl2-header{grid-template-columns:minmax(0,1fr) auto;padding:16px 24px;gap:10px 20px}
 .jgl2 .jgl2-header>nav{grid-column:1/-1;grid-row:2;justify-self:center;justify-content:center;width:100%;gap:24px}
 .jgl2 .jgl2-header>.jgl2-account{grid-column:2;grid-row:1}
}
@media(max-width:480px){
 .jgl2 .jgl2-header{grid-template-columns:minmax(0,1fr);padding:14px 16px;gap:4px}
 .jgl2-header>.jgl2-brand{grid-column:1;justify-self:center;font-size:1.15rem}
 .jgl2 .jgl2-header>nav{grid-column:1;grid-row:2;gap:18px;flex-wrap:wrap}
 .jgl2 .jgl2-header>.jgl2-account{grid-column:1;grid-row:3;justify-self:center;justify-content:center;gap:18px}
 .jgl2 .jgl2-header nav a{font-size:13px}.jgl2-header .jgl2-account .jgl2-button{min-height:40px;padding:10px 16px}
}
@media(max-width:650px){.jgl2-test-grid{grid-template-columns:minmax(0,1fr)}}
.jgl2-login .login-remember label{display:flex;flex-direction:row;align-items:center;gap:10px;cursor:pointer;min-height:44px}
.jgl2-login .login-remember input[type=checkbox]{flex:0 0 20px;width:20px;height:20px;min-height:20px;padding:0;margin:0;accent-color:var(--accent)}
.jgl2-login .login-remember input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
/* Mobile layout: no hidden content, no fixed overlays, all actions remain accessible. */
@media(max-width:650px){
 .jgl2{font-size:16px;line-height:1.6}
 .jgl2 .jgl2-header{padding:12px 16px;gap:8px;grid-template-columns:minmax(0,1fr)}
 .jgl2 .jgl2-header>.jgl2-brand{grid-column:1;justify-self:center;font-size:1.1rem}
 .jgl2 .jgl2-header>nav{grid-column:1;grid-row:2;gap:8px;flex-wrap:wrap}
 .jgl2 .jgl2-header>nav a{justify-content:center;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;font-size:14px;white-space:normal;text-align:center}
 .jgl2 .jgl2-header>.jgl2-account{grid-column:1;grid-row:3;justify-self:center;justify-content:center;gap:8px;flex-wrap:wrap}
 .jgl2 .jgl2-account>a{min-width:44px;min-height:44px;padding:8px;white-space:normal;text-align:center}
 .jgl2 .jgl2-account .jgl2-button{min-height:44px;padding:10px 14px}
 .jgl2 .jgl2-container,.jgl2 .jgl2-shell{width:100%;padding:20px 16px}
 .jgl2 .jgl2-hero{padding:28px 16px;gap:24px;grid-template-columns:minmax(0,1fr)}
 .jgl2 .jgl2-hero h1{font-size:clamp(2rem,8vw,2.8rem);line-height:1.12}
 .jgl2 .jgl2-hero img{height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:14px}
 .jgl2 .jgl2-game-hero>figure{margin:0}
 .jgl2 .jgl2-card{padding:20px 18px;border-radius:12px}
 .jgl2 .jgl2-game{padding:0}
 .jgl2 .jgl2-game>div{padding:20px 18px}
 .jgl2 .jgl2-grid,.jgl2 .jgl2-test-grid,.jgl2 .jgl-feedback-form,.jgl2 .jgl-device-form{grid-template-columns:minmax(0,1fr)}
 .jgl2 input,.jgl2 select,.jgl2 textarea{font-size:16px;min-width:0}
 .jgl2 input[type=file]{padding:8px;font-size:14px}
 .jgl2 input[type=file]::file-selector-button{min-height:44px;max-width:100%;margin-right:8px}
 .jgl2 button,.jgl2 input[type=submit],.jgl2 .jgl2-button{min-height:48px;max-width:100%;white-space:normal;text-align:center}
 .jgl2 .jgl2-card form button[type=submit],.jgl2 .jgl2-card form input[type=submit],.jgl2 .jgl2-test-grid .jgl2-button{width:100%}
 .jgl2 summary{min-height:44px;padding:10px 0;cursor:pointer}
 .jgl2 .jgl2-admin-menu>summary{padding:14px 16px}
 .jgl2 .jgl2-dashboard{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .jgl2 .jgl2-dashboard a{min-width:0;padding:16px}
 .jgl2 .jgl2-dashboard span{font-size:14px}
 .jgl2 .jgl2-work-tiles{gap:12px}
 .jgl2 .jgl2-work-tiles h2{font-size:18px;line-height:1.3}
 .jgl2 .jgl2-work-tiles p{font-size:14px}
 .jgl2 .jgl2-sidebar a{font-size:14px;min-height:44px;overflow-wrap:anywhere}
 .jgl2 .jgl2-heading{gap:12px}
 .jgl2 .jgl2-quick-actions{gap:10px}
 .jgl2 .jgl2-quick-actions a{min-height:48px;min-width:0}
 .jgl2 .jgl2-game-actions>a:not(.jgl2-button){display:inline-flex;align-items:center;min-height:44px}
 .jgl2 .jgl2-footer{padding:24px 16px;gap:8px}
 .jgl2 .jgl2-footer a{display:inline-flex;align-items:center;min-height:44px;overflow-wrap:anywhere}
 .jgl2 .jgl2-game-highlights{padding-top:0;padding-bottom:8px}
 .jgl2 .jgl2-game-test{padding-top:8px}
}
@media(max-width:380px){
 .jgl2 .jgl2-work-tiles{grid-template-columns:minmax(0,1fr)}
 .jgl2 .jgl2-admin-menu .jgl2-sidebar{grid-template-columns:minmax(0,1fr)}
}
/* 1.12 — shared responsive rhythm; desktop space without long reading lines. */
.jgl2{--layout-width:1664px}
.jgl2 .jgl2-account a[aria-current=true]{color:var(--accent);text-decoration:underline;text-underline-offset:5px;font-weight:750}
.jgl2 .jgl2-filter-result{font-size:.9rem;color:var(--muted);margin:12px 0}
.jgl2 .jgl2-filter-clear,.jgl2 .jgl2-discard-draft{background:var(--panel);color:var(--ink)!important;border:1px solid var(--line);min-height:48px}
.jgl2 .jgl2-discard-draft{grid-column:1/-1;justify-self:start;margin-top:8px}
.jgl2 .jgl2-container,.jgl2 .jgl2-hero,.jgl2 .jgl2-footer{max-width:var(--layout-width)}
.jgl2 .jgl2-shell{max-width:var(--layout-width)}
.jgl2 .jgl2-header{padding-left:32px;padding-right:32px}
.jgl2 .jgl2-card h2:first-child,.jgl2 .jgl2-card h3:first-child{margin-top:0}
.jgl2 .jgl2-card>p,.jgl2 .jgl2-hero>div>p{max-width:68ch}
.jgl2 .jgl2-test-grid{gap:24px}
.jgl2 .jgl2-game-hero figcaption{line-height:1.5}
.jgl2 .jgl2-start-links a,.jgl2 .jgl2-quick-actions a{display:inline-flex;align-items:center;min-height:48px}
.jgl2 .jgl2-report-kind button{background:var(--selection);color:var(--ink)!important;border:1px solid var(--line)}
.jgl2 .jgl2-report-kind button[aria-pressed=true]{background:var(--accent);color:var(--button-ink)!important;border-color:var(--accent)}
.jgl2 .jgl2-card details+details{border-top:1px solid var(--line)}
.jgl2 .jgl2-card details>p{max-width:72ch;padding-bottom:8px}
.jgl2 .jgl2-upload progress{height:14px;border-radius:7px}
@media(min-width:1200px){
 .jgl2 .jgl2-container,.jgl2 .jgl2-shell,.jgl2 .jgl2-hero,.jgl2 .jgl2-footer{padding-left:32px;padding-right:32px}
 .jgl2 .jgl2-hero{gap:clamp(32px,4vw,72px);padding-top:64px;padding-bottom:64px}
 .jgl2-game-page .jgl2-game-hero{padding-top:48px;padding-bottom:32px}
 .jgl2 .jgl2-hero img{height:clamp(360px,26vw,460px)}
 .jgl2-game-page .jgl2-game-hero img{height:clamp(340px,24vw,440px)}
 .jgl2 .jgl2-shell{grid-template-columns:240px minmax(0,1fr);gap:32px}
 .jgl2 .jgl2-work-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
 .jgl2 .jgl2-upload{max-width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 24px}
 .jgl2 .jgl2-upload>label:has(textarea),.jgl2 .jgl2-upload>progress,.jgl2 .jgl2-upload>p{grid-column:1/-1}
 .jgl2 .jgl2-upload>button{justify-self:start;margin-top:8px}
}
@media(min-width:651px) and (max-width:1199px){
 .jgl2 .jgl2-header{padding-left:24px;padding-right:24px}
 .jgl2 .jgl2-hero{gap:28px;padding-top:40px;padding-bottom:40px}
 .jgl2 .jgl2-hero h1{font-size:clamp(2.3rem,4.5vw,3.6rem)}
 .jgl2 .jgl2-hero img{height:320px}
}
@media(max-width:650px){
 .jgl2 .jgl2-header{grid-template-columns:minmax(0,1fr) auto;padding:10px 12px;gap:6px 8px}
 .jgl2 .jgl2-header>.jgl2-brand{grid-column:1;grid-row:1;justify-self:start;gap:7px;font-size:1.15rem}
 .jgl2 .jgl2-brand span{font-size:9px;letter-spacing:.1em}
 .jgl2 .jgl2-brand b{font-size:12px;letter-spacing:.02em}
 .jgl2 .jgl2-header>.jgl2-account{grid-column:2;grid-row:1;justify-self:end;gap:4px;flex-wrap:nowrap}
 .jgl2 .jgl2-account>a{min-width:44px;padding:6px;font-size:12px}
 .jgl2 .jgl2-account .jgl2-button{padding:8px 10px;font-size:12px}
 .jgl2 .jgl2-header>nav{grid-column:1/-1;grid-row:2;gap:6px;justify-content:center}
 .jgl2 .jgl2-header>nav a{flex:1 1 auto;min-height:44px;padding:8px 10px;font-size:13px;border-color:transparent;background:var(--panel);border-radius:7px}
 .jgl2 .jgl2-hero{padding:26px 16px;gap:20px}
 .jgl2 .jgl2-hero h1{font-size:clamp(2rem,9vw,3rem);margin-bottom:16px}
 .jgl2 .jgl2-hero>div>p{margin:12px 0;line-height:1.65}
 .jgl2 .jgl2-hero img{display:block;width:100%;height:auto;aspect-ratio:16/10}
 .jgl2 .jgl2-container,.jgl2 .jgl2-shell{padding:18px 16px}
 .jgl2 .jgl2-card{padding:20px 16px;margin-bottom:16px}
 .jgl2 .jgl2-card h2{font-size:1.4rem;line-height:1.3}
 .jgl2 .jgl2-card h3{font-size:1.1rem}
 .jgl2 .jgl2-game{padding:0;margin-bottom:0}
 .jgl2 .jgl2-game>div{padding:20px 16px}
 .jgl2 .jgl2-test-grid{gap:0}
 .jgl2 .jgl2-dashboard>a:last-child:nth-child(odd){grid-column:1/-1}
 .jgl2 .jgl2-start-links{gap:8px}
 .jgl2 .jgl2-start-links a{width:100%;padding:12px 14px}
 .jgl2 .jgl2-report-kind{gap:8px}
 .jgl2 .jgl2-report-kind button{width:100%}
 .jgl2 .jgl2-game-actions{gap:10px}
 .jgl2 .jgl2-game-actions>a:not(.jgl2-button){justify-content:center;width:100%;border:1px solid var(--line);border-radius:7px;text-decoration:none;padding:10px}
 .jgl2 .jgl2-notice{padding:14px 16px;font-size:14px;line-height:1.65}
 .jgl2 .jgl2-card .jgl2-card{padding:16px 12px}
 .jgl2 .jgl2-footer{margin-top:20px;padding:22px 16px}
}
.jgl2 nav.jgl2-actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}
@media(max-width:480px){.jgl2 nav.jgl2-actions>.jgl2-button{width:100%;justify-content:center}}

/* Editorial presentation: distinct visual chapters, without changing workflows. */
.jgl2 .jgl2-hero{position:relative;isolation:isolate;border-bottom:1px solid var(--line);margin-bottom:24px}
.jgl2 .jgl2-hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 85% 15%,rgba(184,163,212,.12),transparent 60%)}
.jgl2 .jgl2-hero h1{max-width:12ch;line-height:1.03;letter-spacing:-.045em}
.jgl2 .jgl2-hero>div>p:not(.jgl2-eyebrow){font-size:clamp(1rem,1.15vw,1.2rem);line-height:1.7;max-width:52ch}
.jgl2 .jgl2-hero img{border-radius:24px 24px 8px 24px;box-shadow:0 24px 60px rgba(0,0,0,.22)}
.jgl2 .jgl2-game-hero figcaption{padding-left:4px;margin-top:12px}
.jgl2 #spiele>.jgl2-heading{align-items:end;padding-bottom:18px;border-bottom:1px solid var(--line);margin-bottom:28px}
.jgl2 #spiele>.jgl2-heading h2{font-size:clamp(1.8rem,3vw,2.5rem);letter-spacing:-.035em}
.jgl2 #spiele>.jgl2-heading>p{max-width:42ch;margin:0}
.jgl2 #spiele .jgl2-game{border-radius:20px;background:var(--panel)}
.jgl2 #spiele .jgl2-game>img{display:block;height:auto;aspect-ratio:16/9;object-fit:cover}
.jgl2 #spiele .jgl2-game>div{padding:28px}
.jgl2 #spiele .jgl2-game h3{font-size:1.75rem;letter-spacing:-.025em;margin:8px 0 14px}
.jgl2 #spiele .jgl2-game p{max-width:55ch}
.jgl2 #apply,.jgl2 #support{border-top:1px solid var(--line);padding-top:48px;padding-bottom:48px}
.jgl2 #apply>h2,.jgl2 #support>h2{font-size:clamp(1.7rem,2.5vw,2.2rem);letter-spacing:-.03em;margin-top:0}
.jgl2 #apply>p,.jgl2 #support>p{max-width:62ch}
.jgl2 .jgl2-game-highlights article{background:transparent;border-width:0 0 1px;border-radius:0;padding:20px 8px}
.jgl2 .jgl2-game-highlights span{display:grid;place-items:center;flex:0 0 44px;height:44px;background:var(--selection);border-radius:12px}
.jgl2 .jgl2-game-test>.jgl2-test-grid>.jgl2-card{padding:30px;border-radius:18px}
.jgl2 .jgl2-game-test>.jgl2-test-grid>.jgl2-card:first-child{border-top:3px solid var(--accent)}
.jgl2 .jgl2-test-mission{background:linear-gradient(145deg,var(--selection),var(--panel))}
@media(min-width:1101px){
 .jgl2 .jgl2-hero{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);padding-top:70px;padding-bottom:58px}
 .jgl2 .jgl2-hero h1{font-size:clamp(3rem,4.7vw,5.2rem)}
 .jgl2 .jgl2-hero img{height:clamp(380px,29vw,490px)}
 .jgl2-game-page .jgl2-game-hero img{height:clamp(360px,27vw,470px)}
}
@media(max-width:650px){
 .jgl2 .jgl2-hero{margin-bottom:12px;padding-top:34px;padding-bottom:28px;gap:24px}
 .jgl2 .jgl2-hero h1{font-size:clamp(2.2rem,10vw,3.4rem);max-width:14ch}
 .jgl2 .jgl2-hero img{height:auto;border-radius:16px 16px 6px 16px}
 .jgl2 #spiele>.jgl2-heading{gap:12px;align-items:start;margin-bottom:20px}
 .jgl2 #spiele .jgl2-grid{gap:24px}
 .jgl2 #spiele .jgl2-game>div{padding:22px 18px}
 .jgl2 #spiele .jgl2-game h3{font-size:1.55rem}
 .jgl2 #apply,.jgl2 #support{padding-top:32px;padding-bottom:32px}
 .jgl2 .jgl2-game-highlights article{padding:14px 0}
 .jgl2 .jgl2-game-test>.jgl2-test-grid>.jgl2-card{padding:24px 18px}
}
/* Onboarding is a guide, not an inferred completion tracker. */
.jgl2 .jgl2-test-guide{margin-top:16px;margin-bottom:24px}
.jgl2 .jgl2-test-guide>h2{font-size:clamp(1.65rem,2.6vw,2.3rem);letter-spacing:-.025em;margin-top:10px}
.jgl2 .jgl2-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:28px}
.jgl2 .jgl2-guide-grid>article{min-width:0;display:flex;flex-direction:column;align-items:start;border-top:1px solid var(--line);padding:22px 0}
.jgl2 .jgl2-guide-number{font-size:2rem;font-weight:750;color:var(--accent);line-height:1}
.jgl2 .jgl2-guide-grid h3{font-size:1.25rem;margin:18px 0 0}
.jgl2 .jgl2-guide-grid p{font-size:.95rem;max-width:45ch}
.jgl2 .jgl2-guide-grid a{margin-top:auto;display:inline-flex;align-items:center;min-height:48px;font-weight:650;text-underline-offset:5px}
@media(max-width:900px){.jgl2 .jgl2-guide-grid{grid-template-columns:minmax(0,1fr);gap:0;margin-top:16px}.jgl2 .jgl2-guide-grid>article{padding:22px 0}.jgl2 .jgl2-guide-grid p{max-width:65ch}}
.jgl2 .jgl2-news-row{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding:18px 0}
.jgl2 .jgl2-news-row>div{min-width:0}.jgl2 .jgl2-news-row h3{margin:6px 0}.jgl2 .jgl2-news-row p{margin:8px 0}.jgl2 .jgl2-news-row small{margin:0}.jgl2 .jgl2-news-row>a{flex-shrink:0}
@media(max-width:650px){.jgl2 .jgl2-news-row{align-items:start;flex-direction:column;gap:12px}.jgl2 .jgl2-news-row>a{width:100%}}
