/* Spielfeld, Vollbild und Spieldialoge. Seitenlayout: page.css. */
#kPoster { position:absolute; inset:0; z-index:6;
    width:100%; height:100%; object-fit:contain;
    background:#060008; pointer-events:none;
    transition:opacity .45s ease; }
#kPoster.k-poster-weg { opacity:0; }
#gameWrap { position:relative; display:block; line-height:0; }
#gameCanvas { display:block; border:2px solid #440011;
    box-shadow:0 0 24px #660011, inset 0 0 8px #000;
    touch-action:none;
    width:  min(calc(100vw - 8px), calc(100svh - 110px), 680px);
    aspect-ratio: 1 / 1; }
@media (orientation:landscape) and (max-height:520px) {
#gameCanvas { width:min(calc(100svh - 70px), 680px); }
}
@media (orientation:landscape) and (max-height:620px) and (pointer: coarse) {
#gameCanvas { width:min(calc(100svh - 20px), 680px); }
}
.k-kammer-konto { text-align:center; color:#ddc88a; font-size:0.85rem; letter-spacing:0.1em;
    margin-bottom:10px; font-family:'Courier New',monospace; }
.k-kammer-titel { color:#886644; font-size:0.68rem; letter-spacing:0.18em; margin:12px 0 5px;
    border-bottom:1px solid #33261a; padding-bottom:3px; }
.k-kammer-row { display:flex; align-items:center; gap:9px; width:100%; text-align:left;
    padding:6px 8px; margin-bottom:3px; background:rgba(60,45,25,0.22);
    border:1px solid transparent; border-radius:4px; color:#ddbb99;
    font-family:'Courier New',monospace; font-size:0.7rem; cursor:pointer; }
.k-kammer-row:hover:not(:disabled) { background:rgba(110,85,45,0.35); border-color:#5a4c33; }
.k-kammer-row:disabled { cursor:default; opacity:0.75; }
.k-kammer-row.k-kammer-aktiv { border-color:#997733; background:rgba(120,90,30,0.28); }
.k-kammer-row small { display:block; color:#7a6448; font-size:0.62rem; margin-top:1px; }
.k-kammer-punkt { width:1em; height:1em; border-radius:50%; flex-shrink:0;
    border:1px solid rgba(0,0,0,0.5); }
.k-kammer-stufen { color:#ccaa55; letter-spacing:1px; width:2.6em; flex-shrink:0; }
.k-kammer-preis { margin-left:auto; color:#a8905f; white-space:nowrap; flex-shrink:0; }
.k-kammer-row .k-ach-label { flex:1; min-width:0; overflow-wrap:anywhere; }
#krypta-wrap:fullscreen, #krypta-wrap:-webkit-full-screen, #krypta-wrap.k-fs-ios { background:#02010a; padding:0; gap:8px;
    display:flex; flex-direction:column; align-items:center; justify-content:center; }
#krypta-wrap.k-fs-ios { position:fixed; inset:0; z-index:9999; }
body.k-fs-active { overflow:hidden; position:fixed; width:100%; height:100%; }
#krypta-wrap:fullscreen > *:not(#kPlay):not(.k-modal-overlay),
  #krypta-wrap:-webkit-full-screen > *:not(#kPlay):not(.k-modal-overlay),
  #krypta-wrap.k-fs-ios > *:not(#kPlay):not(.k-modal-overlay) { display:none !important; }
#krypta-wrap:fullscreen #gameCanvas,
  #krypta-wrap:-webkit-full-screen #gameCanvas,
  #krypta-wrap.k-fs-ios #gameCanvas { width:min(100vw,100svh) !important; height:min(100vw,100svh) !important;
    max-width:none !important; aspect-ratio:1/1 !important;
    border:none !important; box-shadow:none !important; }
@media (orientation:landscape) {
#krypta-wrap:fullscreen, #krypta-wrap:-webkit-full-screen, #krypta-wrap.k-fs-ios { flex-direction:row; }
}
#kFsExit { display:none; position:absolute; top:10px; left:10px; z-index:10000;
    width:36px; height:36px; align-items:center; justify-content:center;
    background:rgba(0,0,0,0.6); border:1px solid #550011; color:#cc4433;
    font-family:'Courier New',monospace; font-size:18px; line-height:1;
    border-radius:4px; cursor:pointer; -webkit-user-select:none; user-select:none; }
#krypta-wrap:fullscreen #kFsExit,
  #krypta-wrap:-webkit-full-screen #kFsExit,
  #krypta-wrap.k-fs-ios #kFsExit { display:flex; }
.k-pausep-actions { display:none; flex-wrap:wrap; gap:6px; justify-content:center; max-width:min(92vw,360px); }
#krypta-wrap:fullscreen .k-pausep-actions,
  #krypta-wrap:-webkit-full-screen .k-pausep-actions,
  #krypta-wrap.k-fs-ios .k-pausep-actions { display:flex; }
.k-pausep-actions button { background:rgba(80,0,10,0.55); border:1px solid #550011; color:#cc4433;
    font-family:'Courier New',monospace; font-size:0.62rem; letter-spacing:0.06em;
    padding:5px 9px; cursor:pointer; border-radius:4px; white-space:nowrap; }
.k-pausep-actions button:hover { background:rgba(140,0,20,0.7); }
.kVol { -webkit-appearance:none; appearance:none;
    width:90px; height:4px; background:#330008; border-radius:2px; outline:none; cursor:pointer; }
.kVol::-webkit-slider-thumb { -webkit-appearance:none; width:13px; height:13px; border-radius:50%;
    background:#aa2233; box-shadow:0 0 6px #660011; cursor:pointer; }
.kVol::-moz-range-thumb { width:13px; height:13px; border-radius:50%; border:none;
    background:#aa2233; box-shadow:0 0 6px #660011; cursor:pointer; }
#kPausePanel { position:absolute; left:50%; bottom:11%; transform:translateX(-50%);
    display:flex; flex-direction:column; align-items:center; gap:11px;
    padding:14px 20px; border-radius:8px; z-index:5;
    background:rgba(10,4,20,0.92); border:1px solid #443366;
    box-shadow:0 0 26px rgba(60,20,90,0.55);
    font-family:'Courier New',monospace; }
#kPausePanel[hidden] { display:none; }
.k-pausep-titel { color:#8866ff; font-size:0.6rem; letter-spacing:0.24em; }
.k-pausep-row { display:flex; align-items:center; gap:11px; color:#aa99dd; font-size:0.7rem; letter-spacing:0.05em; }
.k-pausep-btns { display:flex; gap:8px; }
.kAudioBtn { background:rgba(80,0,10,0.55); border:1px solid #550011; color:#cc4433;
    font-family:'Courier New',monospace; font-size:0.65rem; letter-spacing:0.08em;
    padding:4px 10px; cursor:pointer; border-radius:4px; white-space:nowrap; }
.kAudioBtn:hover { background:rgba(140,0,20,0.7); }
.kAudioBtn.kAudio--off { color:#442222; border-color:#2a0008; background:rgba(20,0,5,0.55); }
.k-modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.82);
    display:flex; align-items:center; justify-content:center; z-index:1000; }
.k-modal-overlay[hidden] { display:none; }
.k-modal-box { background:#0d0210; border:1px solid #550011; border-radius:6px;
    padding:20px 22px; max-width:280px; text-align:center;
    box-shadow:0 0 30px rgba(150,0,30,0.4);
    font-family:'Courier New',monospace; }
.k-modal-box p { color:#cc8877; font-size:0.75rem; margin:0 0 12px; line-height:1.5; }
.k-modal-actions { display:flex; gap:8px; margin-top:14px; justify-content:center; }
#kResumeGo { background:rgba(80,0,10,0.7); border:1px solid #550011; color:#ffbb99;
    font-family:'Courier New',monospace; font-size:0.7rem; letter-spacing:0.1em;
    padding:7px 14px; cursor:pointer; border-radius:4px; }
#kResumeGo { background:rgba(20,60,80,0.7); border-color:#225566; color:#99ddee; }
#kResumeGo:hover { background:rgba(30,90,120,0.85); }
#kResumeNew { background:transparent; border:1px solid #332222; color:#775555;
    font-family:'Courier New',monospace; font-size:0.65rem;
    padding:7px 10px; cursor:pointer; border-radius:4px; }
#kResumeNew:hover { color:#997777; border-color:#443333; }
.k-modal-box.k-modal-wide { max-width:320px; text-align:left; }
.k-modal-box.k-modal-wide h2 { color:#cc8877; font-size:0.85rem; margin:0 0 10px; text-align:center; letter-spacing:0.1em; }
#kAchProgress, #kKompProgress { color:#997755; font-size:0.65rem; text-align:center; margin-bottom:10px; }
#kAchList, #kKompendiumList { max-height:280px; overflow-y:auto; display:flex; flex-direction:column; gap:4px; }
#kKompendiumList { max-height:52vh; }
#kKammerModal .k-modal-box { display:flex; flex-direction:column;
    max-height:calc(100vh - 24px); max-height:calc(100dvh - 24px);
    box-sizing:border-box; width:min(320px, calc(100vw - 24px)); }
#kKammerModal .k-modal-close-row { flex-shrink:0; padding-top:8px; }
.k-kammer-row small.k-kammer-wirk { color:#ccaa55; margin-top:2px; }
.k-modal-box.k-modal-wide h3 { color:#997755; font-size:0.68rem; letter-spacing:0.08em; margin:8px 0 0; text-align:left; }
.k-modal-box.k-modal-wide h3:first-child { margin-top:0; }
.k-ach-row { display:flex; align-items:center; gap:8px; padding:6px 8px;
    background:rgba(80,0,10,0.25); border-radius:4px; font-size:0.7rem; color:#ddbb99; }
.k-ach-row.k-ach-locked { color:#554433; background:rgba(40,20,10,0.2); }
.k-ach-icon { font-size:0.95rem; width:1.4em; text-align:center; flex-shrink:0; }
.k-modal-box.k-modal-wide ul { margin:0 0 12px; padding-left:1.2em; color:#cc8877; font-size:0.72rem; line-height:1.7; }
.k-modal-box.k-modal-wide ul li { margin-bottom:2px; }
#kTutorialModal .k-modal-box { display:flex; flex-direction:column; box-sizing:border-box;
    width:min(460px, calc(100vw - 24px));
    max-width:none;
    max-height:calc(100vh - 24px); max-height:calc(100dvh - 24px); }
#kTutorialModal .k-modal-box h2 { font-size:0.95rem; margin-bottom:6px; }
.k-modal-close-row { display:flex; justify-content:center; margin-top:4px; }
#kAchClose, #kTutorialClose, #kKammerClose, #kKompClose { background:rgba(80,0,10,0.7); border:1px solid #550011; color:#ffbb99;
    font-family:'Courier New',monospace; font-size:0.7rem; letter-spacing:0.1em;
    padding:7px 18px; cursor:pointer; border-radius:4px; }
#kAchClose:hover, #kTutorialClose:hover, #kKammerClose:hover, #kKompClose:hover { background:rgba(140,0,20,0.85); }
  .k-tut-lead { color:#b89a80; font-size:0.72rem; line-height:1.5; text-align:center; margin:0 0 10px; }
  .k-tut-body {
    flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain;
    display:flex; flex-direction:column; gap:7px; padding-right:3px;
    scrollbar-width:thin; scrollbar-color:#5a4c33 #150a12;
  }
  .k-tut-sec {
    display:grid; grid-template-columns:2.4em 1fr; gap:10px; align-items:start;
    padding:8px 10px; background:rgba(80,0,10,0.22); border:1px solid rgba(120,30,40,0.35);
    border-radius:5px;
  }
  .k-tut-ic {
    font-size:1.3rem; line-height:1; text-align:center; padding-top:2px;
    filter:drop-shadow(0 0 5px rgba(255,120,80,0.35));
  }
  .k-tut-sec h3 { margin:0 0 3px; color:#e8b896; font-size:0.74rem; letter-spacing:0.1em; text-transform:uppercase; }
  .k-tut-sec p { margin:0; color:#c9a58f; font-size:0.7rem; line-height:1.55; }
  .k-tut-sec.k-tut-warn { border-color:rgba(200,60,60,0.5); background:rgba(110,10,20,0.3); }
  .k-tut-sec.k-tut-gut  { border-color:rgba(80,170,130,0.4); background:rgba(10,60,40,0.25); }
  .k-tut kbd {
    display:inline-block; min-width:1.5em; padding:1px 5px; margin:0 1px; text-align:center;
    background:#241420; border:1px solid #6a4a58; border-bottom-width:2px; border-radius:3px;
    color:#f0d0b8; font:inherit; font-size:0.66rem;
  }
  .k-tut-keys { margin-top:7px; color:#8a7260; font-size:0.64rem; text-align:center; line-height:1.8; }

#kKammerList { flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#5a4c33 #150a12; }