/* Gorekanoid: Seitenmenü und Spielrahmen. Alle Bilder und Schriften liegen lokal. */
.gk-site-page { --gkl-bg:#0c0b0e; --gkl-panel:#171419; --gkl-line:#3b3037; --gkl-text:#f4eadd; --gkl-muted:#b5a9ae; --gkl-accent:#ed6268; background:radial-gradient(ellipse at 80% 0,#29121d 0,transparent 48%),var(--gkl-bg); color:var(--gkl-text); padding-bottom:36px; }
.gk-site-page .spiel-kopf { max-width:1120px; padding:22px 24px 16px; --spiel-kopf-farbe:#b5a9ae; }
.gk-site-page .spiel-kopf__kicker { opacity:.85; }
#gk-wrap { max-width:1120px; margin:0 auto; padding:0 24px; scroll-margin-top:12px; }
#gk-lobby-root.gk-host { position:relative; width:100%; height:auto; overflow:visible; background:transparent; }
#gk-lobby-root:empty, #gk-toolbar-root:empty { display:none; }
#gk-wrap[data-view="menu"] #gkFrameWrap, #gk-wrap[data-view="menu"] #gk-toolbar-root, #gk-wrap[data-view="menu"] .gkl-playing-note { display:none; }
#gkFrameWrap { position:relative; width:100%; height:min(76svh,720px); min-height:400px; background:#050205; border:1px solid #493039; border-radius:0 0 12px 12px; overflow:hidden; line-height:normal; }
#gk-root:focus { outline:none; }
.gkl-lobby { color:#f4eadd; font:14px/1.6 Inter,system-ui,sans-serif; text-align:left; padding-bottom:12px; }
.gkl-lobby *, .gkl-game-toolbar * { box-sizing:border-box; }
.gkl-lobby button, .gkl-game-toolbar button { font:inherit; cursor:pointer; }
.gkl-lobby button:focus-visible, .gkl-lobby summary:focus-visible, .gkl-lobby input:focus-visible, .gkl-game-toolbar button:focus-visible { outline:3px solid #f3c584; outline-offset:4px; }
.gkl-lobby button:disabled, .gkl-game-toolbar button:disabled { opacity:.45; cursor:default; }
.gkl-hero { position:relative; isolation:isolate; overflow:hidden; min-height:330px; border:1px solid #4c313d; border-radius:16px; background:#1b1118 url('img/menu-anatomy-eye-v1.webp') 76% 44%/cover; margin-bottom:32px; }
.gkl-hero::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(15,9,15,.99),rgba(15,9,15,.89) 38%,rgba(15,9,15,.18) 90%); }
.gkl-hero-copy { max-width:600px; padding:32px 36px; }
.gkl-eyebrow { display:block; color:#d9a5ab; font:700 10px/1.4 ui-monospace,monospace; letter-spacing:.14em; }
.gkl-hero h1 { margin:20px 0 12px; color:#f4eadd; font:400 clamp(38px,5.7vw,66px)/1.12 Nosifer,system-ui,sans-serif; letter-spacing:-.04em; }
.gkl-hero h1 span { display:block; color:#ed6268; }
.gkl-hero p { max-width:405px; margin:0; color:#d1c3c5; font-size:15px; line-height:1.7; }
.gkl-tags { display:flex; flex-wrap:wrap; gap:8px 18px; margin:18px 0 6px; color:#d5c9cc; font:11px/1.5 ui-monospace,monospace; }
.gkl-hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 20px; margin-top:12px; }
.gkl-hero-actions .gkl-text-button, .gkl-hero-actions .gkl-comment-link, .gkl-hero-actions .gkl-report-button { min-height:44px; padding:10px 0; background:none; border:0; color:#c8b4bc; font-size:12px; font-weight:400; text-decoration:underline; text-underline-offset:4px; }
.gkl-hero-actions .gkl-text-button:hover, .gkl-hero-actions .gkl-comment-link:hover, .gkl-hero-actions .gkl-report-button:hover { color:#f1d4dc; }
.gkl-disclosure-icon::before { content:'+'; }
.gkl-details[open] .gkl-disclosure-icon::before { content:'−'; }
.gkl-layout { display:grid; grid-template-columns:minmax(0,1fr) 300px; align-items:start; gap:24px; }
.gkl-main, .gkl-sidebar { min-width:0; }
.gkl-section-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.gkl-section-heading h2 { margin:0; color:#f4eadd; font:700 19px/1.3 Inter,system-ui,sans-serif; letter-spacing:-.02em; }
.gkl-section-heading > span { color:#b5a9ae; font-size:11px; }
.gkl-modes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.gkl-mode { display:flex; flex-direction:column; align-items:flex-start; min-width:0; padding:22px; border:1px solid #3b3037; border-radius:12px; background:linear-gradient(145deg,#1c171e,#131116); }
.gkl-mode-campaign { border-color:#86424b; background:linear-gradient(145deg,#321b25,#181318); }
.gkl-mode h3 { margin:16px 0 10px; color:#f4eadd; font-size:22px; font-weight:700; line-height:1.3; letter-spacing:-.03em; }
.gkl-mode p { color:#bfb2b7; margin:0 0 24px; font-size:13px; line-height:1.65; flex:1; }
.gkl-mode small { color:#c6b1b6; margin-top:12px; }
.gkl-button { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:46px; border:1px solid #70505b; border-radius:7px; padding:11px 16px; background:#272029; color:#f4eadd; font-weight:700!important; line-height:1.3!important; text-decoration:none; transition:background .15s,border-color .15s; }
.gkl-mode .gkl-button { width:100%; }
.gkl-button:hover { background:#392731; border-color:#c87685; }
.gkl-button-primary { background:#bb3d49; border-color:#e5727d; color:#fff7eb; }
.gkl-button-primary:hover { background:#d34c59; border-color:#f69da6; }
.gkl-resume { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; padding:18px; margin-bottom:14px; border:1px solid #726044; background:#292219; border-radius:9px; }
.gkl-resume strong, .gkl-resume span { display:block; }
.gkl-resume strong { color:#f4d5a3; font-size:14px; }
.gkl-resume span { color:#c8bba8; font-size:12px; margin-top:4px; }
.gkl-controls { margin:28px 0; padding:22px; border:1px solid #3b3037; border-radius:12px; background:#151217; }
.gkl-controls ol { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; list-style:none; margin:20px 0 0; padding:0; }
.gkl-controls li { display:flex; gap:10px; }
.gkl-controls li > span { display:grid; place-items:center; flex:0 0 25px; height:25px; border:1px solid #65434d; border-radius:50%; color:#efa0a5; font:12px ui-monospace,monospace; }
.gkl-controls strong { font-size:12px; color:#f4eadd; }
.gkl-controls p { color:#b5a9ae; margin:5px 0 0; font-size:11px; line-height:1.6; }
.gkl-details-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.gkl-details { min-width:0; align-self:start; border:1px solid #3b3037; border-radius:9px; background:#171419; }
.gkl-details summary { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:17px 18px; cursor:pointer; list-style:none; color:#e8dadd; font-size:13px; font-weight:600; }
.gkl-details summary::-webkit-details-marker { display:none; }
.gkl-details summary > span { color:#b796a3; font:12px ui-monospace,monospace; }
.gkl-details[open] summary { border-bottom:1px solid #3b3037; }
.gkl-details-body { padding:16px; }
.gkl-details-body > p { font-size:12px; color:#b5a9ae; margin:0 0 18px; }
.gkl-details-body .audio-ctl, .gkl-details-body .skin-picker { justify-content:flex-start; gap:10px; margin:12px 0; color:#d9bac3; max-width:none; letter-spacing:0; }
.gkl-details-body .audio-ctl input[type=range] { flex:1; min-width:70px; max-width:140px; height:28px; }
.gkl-details-body .audio-btn { min-height:38px; border-color:#5f414c; background:#28202a; color:#ebd9de; letter-spacing:0; }
.gkl-details-body .skin-locked { width:100%; color:#c6b1b6; }
.gkl-badges { list-style:none; padding:0; margin:0; }
.gkl-badges li { display:flex; gap:12px; padding:10px 0; color:#b5a9ae; border-bottom:1px solid #332b31; }
.gkl-badges li:last-child { border-bottom:0; }
.gkl-badges li.earned { color:#eaca8f; }
.gkl-badges strong, .gkl-badges small { display:block; font-size:11px; line-height:1.5; }
.gkl-badges small { margin-top:3px; color:#b5a9ae; }
.gkl-player, .gkl-ranking { padding:22px; border:1px solid #3b3037; border-radius:12px; background:#171419; }
.gkl-player { margin-bottom:16px; }
.gkl-player label { display:block; margin-bottom:10px; color:#e8dadd; font-size:12px; font-weight:600; }
.gkl-player input { width:100%; min-height:44px; padding:10px 12px; color:#f4eadd; background:#0e0b10; border:1px solid #66505c; border-radius:6px; font:14px Inter,system-ui,sans-serif; }
.gkl-player input::placeholder { color:#a998a2; }
.gkl-player input[readonly] { border-color:#6c5a3d; color:#ead09e; }
.gkl-player p { color:#b5a9ae; font-size:11px; line-height:1.6; margin:10px 0 0; }
.gkl-ranking .gkl-section-heading { margin-bottom:4px; }
.gkl-icon-button { width:38px; height:38px; padding:0; border:1px solid #55404c; border-radius:6px; color:#eab2bf; background:#241a23; font-size:22px!important; }
.gkl-ranking-sub { margin:0 0 18px; color:#b5a9ae; font-size:11px; }
.gkl-ranking table { width:100%; border-collapse:collapse; table-layout:fixed; font-size:12px; }
.gkl-ranking th { padding:8px 0; color:#b5a9ae; font-size:10px; font-weight:500; border-bottom:1px solid #50404a; }
.gkl-ranking td { padding:12px 0; border-bottom:1px solid #332a32; vertical-align:middle; }
.gkl-ranking th:first-child, .gkl-ranking td:first-child { width:30px; color:#b796a3; text-align:left; font:11px ui-monospace,monospace; }
.gkl-ranking th:nth-child(2), .gkl-ranking td:nth-child(2) { text-align:left; overflow-wrap:anywhere; padding-right:10px; }
.gkl-ranking th:last-child, .gkl-ranking td:last-child { width:84px; text-align:right; color:#f3d6b1; font-variant-numeric:tabular-nums; }
.gkl-ranking tbody tr:first-child td { color:#f0c687; }
.gkl-ranking-empty { text-align:center; padding:22px 0; }
.gkl-ranking-empty > span { display:block; color:#795862; font-size:34px; }
.gkl-ranking-empty strong { display:block; color:#e9d9dd; font-size:13px; }
.gkl-ranking-empty p { color:#b5a9ae; font-size:11px; line-height:1.6; }
.gkl-game-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 18px; border:1px solid #493039; border-bottom:0; border-radius:12px 12px 0 0; background:linear-gradient(180deg,#241a24,#19121b); color:#f4eadd; font:13px/1.4 Inter,system-ui,sans-serif; }
.gkl-game-toolbar .gkl-toolbar-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.gkl-game-toolbar .gkl-tool { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 14px; border:1px solid #65424f; border-radius:8px; background:#2c202b; color:#f0dce2; font-size:13px; font-weight:600; line-height:1.2; transition:background .15s,border-color .15s; }
.gkl-game-toolbar .gkl-tool:hover:not(:disabled) { background:#442b3a; border-color:#bd7589; }
.gkl-game-toolbar .gkl-tool-primary { background:#713444; border-color:#ce7687; color:#fff0e6; }
.gkl-game-toolbar .gkl-tool-primary:hover:not(:disabled) { background:#914356; border-color:#f1a3b0; }
.gkl-game-toolbar .gkl-tool-back { background:transparent; border-color:transparent; color:#d1b8c3; padding-left:4px; }
.gkl-game-toolbar .gkl-tool-report { background:transparent; border-color:transparent; color:#bfa4b1; font-size:11px; font-weight:400; }
.gkl-tool-icon { width:18px; height:18px; flex:0 0 18px; }
.gkl-toolbar-title { font:700 11px ui-monospace,monospace; color:#d6a4b3; letter-spacing:.08em; }
.gkl-playing-note { margin:12px 0 22px; color:#b5a9ae; font:11px/1.6 Inter,system-ui,sans-serif; text-align:center; }
.gkl-community { max-width:1072px; margin:32px auto 0; padding:24px; border-top:1px solid #3b3037; color:#b5a9ae; --ink:#f4eadd; --muted:#b5a9ae; --red:#ed6268; --paper:#171419; --paper-2:#20191f; --rt-text-muted:#d7c2cb; --rt-text-faint:#b5a9ae; --rt-text-sub:#e5d5dc; }
.gkl-community-heading { display:flex; align-items:baseline; flex-wrap:wrap; gap:12px; }
.gkl-community-heading h2 { margin:0; color:#f4eadd; font:700 18px Inter,system-ui,sans-serif; }
.gkl-community-heading p { margin:0; font:12px/1.6 Inter,system-ui,sans-serif; }
.gkl-community .kom-wrap, .gkl-community .sf-wrap { max-width:none; margin:20px 0 0; padding:0; }
.gkl-community .sf-auf { color:#d6abb8; border-color:#60404e; min-height:40px; border-radius:5px; }
.gkl-community .sf-hinweis { color:#b5a9ae; }
#gk-help-root { position:fixed; inset:0; z-index:10001; width:100%; height:100%; background:rgba(0,0,0,.8); }
#gk-help-root:empty { display:none; }
#gk-help-root .help-overlay { inset:5vh max(16px,calc((100vw - 820px)/2)); padding:28px; border:1px solid #6a414f; border-radius:12px; background:#151018; backdrop-filter:blur(8px); }
#gk-help-root .help-body { max-width:100%; }
.gk-host .gkl-dialog-close { position:absolute; top:14px; right:14px; width:40px; height:40px; background:#291d29; border:1px solid #684454; border-radius:6px; color:#f4eadd; font-size:24px; cursor:pointer; }
.gk-host .game-root > .gkl-lobby { position:absolute; inset:0; z-index:40; overflow:auto; padding:24px; background:#0c0b0e; }
#gk-wrap:fullscreen, #gk-wrap:-webkit-full-screen, #gk-wrap.gk-fs-ios { max-width:none; background:#050205; padding:0; display:flex; align-items:center; justify-content:center; }
#gk-wrap.gk-fs-ios { position:fixed; inset:0; z-index:9999; }
body.gk-fs-active { overflow:hidden; position:fixed; width:100%; height:100%; }
#gk-wrap:fullscreen > *:not(#gkFrameWrap):not(#gk-help-root), #gk-wrap:-webkit-full-screen > *:not(#gkFrameWrap):not(#gk-help-root), #gk-wrap.gk-fs-ios > *:not(#gkFrameWrap):not(#gk-help-root) { display:none!important; }
#gk-wrap:fullscreen #gkFrameWrap, #gk-wrap:-webkit-full-screen #gkFrameWrap, #gk-wrap.gk-fs-ios #gkFrameWrap { width:100vw; height:100dvh; min-height:0; border:0; border-radius:0; }
@media (max-width:900px) { .gkl-layout { grid-template-columns:minmax(0,1fr) 260px; gap:18px; } .gkl-mode { padding:18px; } .gkl-modes { grid-template-columns:1fr; } .gkl-toolbar-title { display:none; } }
@media (max-width:680px) { #gk-wrap { padding:0 14px; } .gk-site-page .spiel-kopf { padding:16px 14px; } .gkl-hero { min-height:0; margin-bottom:24px; background-position:68% center; } .gkl-hero::before { background:linear-gradient(90deg,rgba(15,9,15,.98),rgba(15,9,15,.82) 58%,rgba(15,9,15,.44)); } .gkl-hero-copy { padding:24px; } .gkl-hero h1 { font-size:44px; } .gkl-hero p { font-size:13px; } .gkl-layout { grid-template-columns:1fr; } .gkl-modes { grid-template-columns:1fr; } .gkl-controls ol { grid-template-columns:1fr; gap:18px; } .gkl-controls strong { font-size:13px; } .gkl-controls p { font-size:12px; } .gkl-details-grid { grid-template-columns:1fr; } .gkl-sidebar { display:grid; gap:16px; } .gkl-player { margin:0; } .gkl-community { padding:22px 14px; } .gkl-game-toolbar { padding:8px; gap:8px; flex-wrap:wrap; } .gkl-game-toolbar > div { flex:1; justify-content:flex-end; gap:4px; } .gkl-game-toolbar button { font-size:11px; padding:8px; } #gkFrameWrap { height:min(72svh,650px); min-height:360px; } #gk-help-root .help-overlay { inset:12px; padding:18px; } #gk-help-root .screen-big { font-size:30px; } }
@media (max-width:380px) { .gkl-hero-copy { padding:20px; } .gkl-hero h1 { font-size:36px; } .gkl-game-toolbar > div { flex-basis:100%; justify-content:space-between; } }
@media (prefers-reduced-motion:reduce) { .gkl-lobby *, .gkl-game-toolbar * { transition:none!important; scroll-behavior:auto!important; } }

.gkl-community .kom-wrap { border-top:1px solid #493039; }
.gkl-community .kom-toggle { border-color:#493039; }
.gkl-community .kom-input, .gkl-community .kom-textarea { border-color:#60404e; color:#f4eadd; }
/* Auch Spielunterbrechungen müssen in schmale Rahmen passen. */
.gk-host .overlay:not(.help-overlay) { overflow-y:auto; justify-content:safe center; padding:24px 18px; }
.gk-host .screen-big { max-width:100%; margin:0 0 12px; font-size:clamp(20px,5vw,46px); line-height:1.25; overflow-wrap:anywhere; }
.gk-host .screen-big.dark-red { color:#ef7d88; text-shadow:0 0 18px #6a1829; }
.gk-host .overlay .primary-btn, .gk-host .overlay .secondary-btn { min-height:44px; margin-top:16px; border-radius:6px; max-width:100%; padding:10px 22px; font-size:12px; box-shadow:0 4px 18px rgba(0,0,0,.3); }
.gk-host .overlay button:focus-visible { outline:3px solid #f3c584; outline-offset:3px; }
@media (max-width:680px) { .gk-host .screen-sub { font-size:10px; letter-spacing:.06em; line-height:1.6; } .gk-host .hud-group { gap:6px; } .gk-host .hud-group.right { gap:4px; } .gk-host .hud-score { font-size:14px; } .gk-host .hud-level { font-size:12px; } .gk-host .hud-life { width:17px; height:17px; } .gk-host .hud-lives { gap:3px; } }

.gkl-note-touch { display:none; }
@media (pointer:coarse) { .gkl-note-pointer { display:none; } .gkl-note-touch { display:inline; } }
.gk-host .hint-toast { width:min(400px,calc(100% - 32px)); max-width:none; }
.gk-host .launch-hint { width:max-content; max-width:calc(100% - 32px); text-align:center; line-height:1.5; }

.gkl-report-card { margin:24px 0; padding:20px; border:1px solid #86424b; border-radius:10px; background:#21151d; scroll-margin-top:20px; }
.gkl-community .gkl-report-card .sf-wrap { margin:0; }
.gkl-report-card .sf-auf { background:#9d3344; color:#fff2ea; border-color:#da7481; font-weight:700; }
.gkl-report-card .sf-form { border-color:#60404e; background:#171018; }
.gkl-report-card .sf-label { color:#dbc6ce; }
.gkl-report-card .sf-text { border-color:#715362; border-radius:6px; font-size:13px; }
#fehler-melden { scroll-margin-top:20px; }

@media (max-width:680px) {
  .gkl-game-toolbar { display:grid; grid-template-columns:auto 1fr; gap:10px; padding:12px; }
  .gkl-game-toolbar .gkl-toolbar-title { display:block; justify-self:end; font-size:10px; }
  .gkl-game-toolbar .gkl-tool-back { min-height:32px; padding:4px 0; justify-self:start; }
  .gkl-game-toolbar .gkl-toolbar-actions { display:grid; grid-column:1/-1; grid-template-columns:minmax(0,1.05fr) minmax(0,.8fr) minmax(0,1.25fr) 36px; gap:6px; }
  .gkl-game-toolbar .gkl-tool { gap:4px; padding:8px 5px; font-size:11px; min-width:0; }
  .gkl-game-toolbar .gkl-tool-icon { width:15px; height:15px; flex-basis:15px; }
  .gkl-game-toolbar .gkl-tool-report { padding:8px 0; }
  .gkl-game-toolbar .gkl-tool-report span { display:none; }
}

.gk-host .hud-bar-controls { z-index:35; }

.gkl-comment-link { display:inline-flex; align-items:center; }
.gkl-comment-link:focus-visible { outline:3px solid #f3c584; outline-offset:4px; }