/* Magic Realm: the illustrated title screen. All art and styles ship locally. */
[hidden]{display:none!important}
#gameShell{height:100%;min-height:100%}
body.cover-open{background:#0a1615}
.cover-screen{
  --cover-gold:#ddbd7e;
  --cover-light:#f3ead5;
  --cover-muted:#b6c0b8;
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  min-height:100vh;
  min-height:100svh;
  overflow:hidden;
  color:var(--cover-light);
  background:#0d1b1b;
}
.cover-art,.cover-shade{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-2}
.cover-art{object-fit:cover;object-position:66% center;user-select:none}
.cover-shade{z-index:-1;background:linear-gradient(90deg,rgba(5,15,15,.97) 0%,rgba(7,19,18,.92) 23%,rgba(8,20,19,.67) 42%,rgba(8,18,17,.12) 68%,rgba(8,18,17,.06) 100%),linear-gradient(0deg,rgba(4,12,12,.97) 0%,rgba(5,14,14,.43) 16%,transparent 48%,rgba(3,12,13,.25) 83%,rgba(3,12,13,.58) 100%)}
.cover-frame{position:absolute;inset:18px;border:1px solid rgba(221,189,126,.22);pointer-events:none;z-index:2}
.cover-frame::before,.cover-frame::after{content:"";position:absolute;width:54px;height:54px;border-color:rgba(221,189,126,.7);border-style:solid}
.cover-frame::before{top:-1px;left:-1px;border-width:1px 0 0 1px}
.cover-frame::after{right:-1px;bottom:-1px;border-width:0 1px 1px 0}
.cover-topline{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:36px max(5.5vw,40px) 0;position:relative}
.cover-brand{display:flex;gap:13px;align-items:center;color:var(--cover-gold);font-size:17px;font-weight:normal;letter-spacing:3.5px;line-height:1;text-transform:uppercase}
.cover-emblem{width:41px;height:41px;stroke:currentColor;stroke-width:1.1;flex-shrink:0}
.cover-emblem circle{fill:currentColor;stroke:none}
.cover-brand-sub{display:block;font-family:Arial,Helvetica,sans-serif;font-size:9px;letter-spacing:5px;margin-top:8px;color:#c6c9b9}
.cover-edition{display:flex;align-items:center;gap:10px;font:10px/1.4 Arial,Helvetica,sans-serif;letter-spacing:2px;text-transform:uppercase;color:#deded1}
.cover-edition-dot{width:5px;height:5px;border-radius:50%;background:var(--cover-gold);box-shadow:0 0 12px rgba(221,189,126,.4)}
#coverVersion{letter-spacing:1px;color:#bac3bc;padding-left:16px;margin-left:6px;border-left:1px solid rgba(221,189,126,.35)}
.cover-hero{flex:1;display:flex;align-items:center;position:relative;width:100%;padding:48px max(7.5vw,40px) 34px}
.cover-content{width:560px;max-width:49%;position:relative}
.cover-kicker{display:flex;align-items:center;gap:13px;margin:0 0 24px;color:var(--cover-gold);font:10px/1.4 Arial,Helvetica,sans-serif;letter-spacing:3.8px;text-transform:uppercase}
.cover-kicker>span{height:1px;width:37px;background:var(--cover-gold);opacity:.7}
.cover-title{font-family:Georgia,'Times New Roman',serif;font-size:clamp(72px,8.65vw,142px);font-weight:400;line-height:.85;letter-spacing:.025em;margin:0 0 27px;text-transform:uppercase;text-shadow:0 4px 25px rgba(0,0,0,.2)}
.cover-title>span{display:block}
.cover-title>span+span{color:var(--cover-gold);margin-top:8px}
.cover-tagline{font-size:clamp(18px,1.55vw,24px);font-style:italic;font-weight:normal;line-height:1.45;letter-spacing:.1px;margin:0 0 14px;color:#eadfca}
.cover-intro{max-width:435px;margin:0 0 29px;font:14px/1.8 Arial,Helvetica,sans-serif;color:var(--cover-muted)}
.cover-actions{display:grid;grid-template-columns:1.08fr 1fr;gap:12px;max-width:510px}
.cover-button{min-height:55px;display:flex;align-items:center;justify-content:center;gap:11px;border-radius:2px;padding:12px 18px;font-family:Georgia,'Times New Roman',serif;font-size:16px;font-weight:normal;letter-spacing:.3px;transition:background-color .18s,border-color .18s,box-shadow .18s,transform .18s}
.cover-button.cover-primary{background:linear-gradient(110deg,#e0c183,#caab6d);border:1px solid #e4c790;color:#18211c;box-shadow:0 4px 20px rgba(0,0,0,.16);justify-content:space-between}
.cover-button.cover-primary:hover:not(:disabled){color:#0b1714;background:linear-gradient(110deg,#eed5a4,#dec28a);border-color:#f4deb1;box-shadow:0 4px 28px rgba(221,189,126,.17);transform:translateY(-1px)}
.cover-arrow{font:22px/1 Arial,Helvetica,sans-serif}
.cover-button.cover-secondary{background:rgba(10,24,23,.55);color:#e5d5b6;border:1px solid rgba(221,189,126,.5)}
.cover-button.cover-secondary:hover:not(:disabled){background:rgba(34,49,39,.85);border-color:var(--cover-gold);color:#fff3d8}
.cover-button.cover-secondary:disabled{opacity:.6;cursor:not-allowed;color:#bfc5bc;border-color:#718078;background:rgba(10,24,23,.5)}
.cover-button svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.2;flex-shrink:0}
.cover-save-row{display:flex;gap:14px;align-items:center;flex-wrap:wrap;min-height:46px;margin:7px 0 17px;max-width:510px}
.cover-text-button{display:inline-flex;align-items:center;gap:8px;border:0;background:none;border-radius:0;padding:7px 0;color:#d1c6ab;font:11px/1.5 Arial,Helvetica,sans-serif;letter-spacing:.2px;white-space:nowrap}
.cover-text-button svg{width:17px;height:17px;stroke:currentColor;stroke-width:1.2}
.cover-text-button:hover:not(:disabled){color:#fff1cd;border:0;background:none;text-decoration:underline;text-underline-offset:4px}
.cover-save-status{flex:1;min-width:170px;color:#9eada5;font:10px/1.55 Arial,Helvetica,sans-serif}
.cover-facts{display:flex;gap:0;margin:0;max-width:510px;border-top:1px solid rgba(221,189,126,.23);padding-top:21px}
.cover-facts>div{flex:1;padding:0 18px;border-left:1px solid rgba(221,189,126,.2)}
.cover-facts>div:first-child{border-left:0;padding-left:0}
.cover-facts dt{font-size:25px;line-height:1;color:#e7d6af;margin:0 0 8px}
.cover-facts dd{margin:0;color:#b3bdb3;text-transform:uppercase;letter-spacing:1.5px;font:9px/1.5 Arial,Helvetica,sans-serif}
.cover-scene-note{position:absolute;right:max(5.5vw,40px);bottom:55px;display:flex;align-items:center;gap:15px;max-width:28%;font:9px/1.5 Arial,Helvetica,sans-serif;letter-spacing:2px;text-transform:uppercase;color:#d7d7c8;text-shadow:0 2px 10px #041411}
.cover-scene-line{width:38px;flex-shrink:0;height:1px;background:rgba(221,189,126,.65)}
.cover-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 max(5.5vw,40px);padding:21px 0 34px;border-top:1px solid rgba(221,189,126,.2)}
.cover-footer>p{font:10px/1.65 Arial,Helvetica,sans-serif;color:#afbaaf;margin:0;letter-spacing:.25px}
.cover-footer>p>span{display:block;color:#8b9c93;font-size:9px}
.cover-links{display:flex;align-items:center;gap:25px;flex-wrap:wrap}
.cover-links button,.cover-links a{padding:7px 0;border:0;border-radius:0;background:none;color:#ddd3ba;text-decoration:none;font:11px/1.5 Arial,Helvetica,sans-serif;white-space:nowrap}
.cover-links a>span{font-size:12px;color:#9cad9f;padding-left:3px}
.cover-links button:hover:not(:disabled),.cover-links a:hover{color:#fff1ca;border:0;text-decoration:underline;text-underline-offset:5px}
.cover-screen :is(button,a):focus-visible{outline:2px solid #f4d99c;outline-offset:5px}
.cover-noscript{margin:0;padding:14px 35px;background:#402b18;color:#fff2ca;text-align:center;font:14px/1.5 Arial,Helvetica,sans-serif}
body.cover-open #modal{background:rgba(3,11,10,.7);backdrop-filter:blur(6px)}
body.cover-open #modal .box{box-shadow:0 24px 90px #0009;border-color:#8b754f}
@media(min-width:1600px){.cover-content{width:600px}.cover-hero{padding-top:60px;padding-bottom:56px}.cover-intro{font-size:15px;margin-bottom:32px}.cover-actions{max-width:530px}.cover-save-row,.cover-facts{max-width:530px}}
@media(max-width:1100px){.cover-topline{padding-top:32px}.cover-hero{padding-top:44px;padding-bottom:34px}.cover-content{max-width:58%}.cover-title{font-size:clamp(76px,10vw,106px)}.cover-intro{font-size:13px;max-width:400px}.cover-button{font-size:14px;padding:12px 14px}.cover-links{gap:20px}.cover-footer{gap:20px}.cover-scene-note{max-width:28%;font-size:8px;letter-spacing:1.5px}.cover-facts dd{letter-spacing:1px}}
@media(max-width:760px){
  .cover-frame{inset:12px}
  .cover-topline{padding:28px 30px 0}
  .cover-brand{font-size:15px;letter-spacing:2.4px;gap:10px}
  .cover-emblem{width:33px;height:33px}
  .cover-brand-sub{font-size:8px;letter-spacing:3.6px;margin-top:6px}
  .cover-edition{font-size:8px;letter-spacing:1.1px;gap:7px}
  #coverVersion{padding-left:8px;margin-left:0}
  .cover-hero{padding:42px 35px 30px;align-items:flex-start}
  .cover-content{width:480px;max-width:84%}
  .cover-title{font-size:98px}
  .cover-shade{background:linear-gradient(90deg,rgba(5,15,15,.88),rgba(7,19,18,.62) 55%,rgba(8,18,17,.2)),linear-gradient(0deg,#061210 0%,rgba(5,14,14,.68) 45%,rgba(3,12,13,.2) 85%,rgba(3,12,13,.4))}
  .cover-art{object-position:68% center}
  .cover-intro{max-width:400px;color:#c6cec5}
  .cover-scene-note{display:none}
  .cover-footer{margin:0 30px;padding:20px 0 28px;flex-direction:column;align-items:flex-start;gap:10px}
  .cover-links{gap:25px;order:-1}
  .cover-footer>p>span{display:inline;margin-left:8px}
}
@media(max-width:520px){
  .cover-topline{align-items:flex-start;padding:26px 27px 0}
  .cover-edition{display:block;text-align:right;line-height:1.65;padding-top:1px}
  .cover-edition-dot{display:none}
  #coverVersion{display:block;padding:1px 0 0;margin:0;border:0;font-size:9px}
  .cover-hero{padding:64px 30px 28px}
  .cover-content{max-width:100%;width:100%}
  .cover-kicker{font-size:8px;letter-spacing:2.6px;margin-bottom:22px}
  .cover-kicker>span{width:25px}
  .cover-title{font-size:clamp(69px,19vw,96px);margin-bottom:23px;line-height:.88;letter-spacing:.04em}
  .cover-title>span+span{margin-top:5px}
  .cover-tagline{font-size:17px;line-height:1.45;margin-bottom:12px;max-width:290px}
  .cover-intro{font-size:12px;line-height:1.8;max-width:335px;margin-bottom:24px}
  .cover-actions{grid-template-columns:1fr;gap:10px}
  .cover-button{min-height:49px;font-size:15px;padding:12px 16px}
  .cover-button.cover-secondary{justify-content:center}
  .cover-save-row{gap:3px 12px;margin:8px 0 17px;min-height:50px}
  .cover-save-status{font-size:9px;min-width:148px}
  .cover-text-button{font-size:10px}
  .cover-facts{padding-top:18px}
  .cover-facts>div{padding:0 12px}
  .cover-facts dt{font-size:24px}
  .cover-facts dd{font-size:8px;letter-spacing:.7px}
  .cover-footer{margin:0 30px;padding:17px 0 28px;gap:11px}
  .cover-links{justify-content:space-between;width:100%;gap:11px}
  .cover-links button,.cover-links a{font-size:10px}
  .cover-footer>p{font-size:9px}
  .cover-footer>p>span{display:block;margin:0;font-size:8px}
  .cover-art{object-position:68% top;min-height:100%}
  .cover-shade{background:linear-gradient(90deg,rgba(5,15,15,.68),rgba(7,19,18,.28) 75%),linear-gradient(0deg,#061210 5%,rgba(5,14,14,.9) 35%,rgba(5,14,14,.7) 60%,rgba(3,12,13,.13) 90%,rgba(3,12,13,.45))}
}
@media(max-height:760px) and (min-width:1101px){.cover-topline{padding-top:29px}.cover-hero{padding-top:27px;padding-bottom:24px}.cover-title{font-size:105px;margin-bottom:20px}.cover-kicker{margin-bottom:18px}.cover-tagline{font-size:21px;margin-bottom:10px}.cover-intro{margin-bottom:20px;font-size:13px}.cover-save-row{margin-bottom:10px}.cover-facts{padding-top:15px}.cover-footer{padding-top:15px;padding-bottom:27px}}
@media(prefers-reduced-motion:reduce){.cover-screen *{transition:none!important;animation:none!important}.cover-button:hover:not(:disabled){transform:none!important}}