/* The open expedition menu: landscape, a readable title, and the next action. */
.title-screen .title-practice{width:82%;margin:14px auto 0}
@media(max-width:650px){.title-screen .title-practice{width:100%}}
.title-screen,
.title-screen.has-paid-entry,
.title-screen:has(.title-settings){
  --menu-gold:#dbb869;
  --menu-cream:#f7e8b4;
  --menu-forest:#0c281c;
  display:flex;align-items:center;justify-content:flex-end;flex-direction:column;
  min-height:100svh;padding: max(150px,40svh) 24px max(7.5svh,30px);gap:0;
}
.title-landscape{object-position:center center}
.title-shade{background:linear-gradient(180deg,transparent 36%,#041a072b 48%,#03170855 74%,#03170814)}
.title-screen .title-menu,
.title-screen.has-paid-entry .title-menu{
  display:block;width:min(646px,100%);min-width:0;animation:none;text-align:center;
}
.title-screen .title-brand{margin:0;text-align:center}
.title-screen .title-menu h1.title-name{
  color:var(--menu-cream);font-family:Cinzel,Georgia,serif;font-size:clamp(42px,5.3vw,72px);
  line-height:.95;font-weight:600;letter-spacing:-.035em;margin:0;white-space:nowrap;
  text-shadow:0 2px 1px #725320,0 5px 9px #07180be6;
}
.title-name>span{display:flex;justify-content:center;align-items:center;gap:14px}
.title-name>span:before,.title-name>span:after{
  content:"";width:86px;max-width:14%;height:1px;background:var(--menu-gold);flex:none;
}
.title-ornament{display:flex;align-items:center;justify-content:center;width:22%;height:22px;margin:0 auto;color:var(--menu-gold)}
.title-ornament:before,.title-ornament:after{content:"";height:1px;background:currentColor;flex:1}
.title-ornament>span{position:relative;width:9px;height:9px;border:1px solid currentColor;transform:rotate(45deg);margin:0 8px}
.title-ornament>span:after{content:"";position:absolute;width:7px;height:7px;border:1px solid currentColor;left:3px;top:-5px}
.title-token-brand{display:flex;align-items:center;justify-content:center;gap:18px;margin:3px auto 11px;color:var(--menu-cream);font:18px/1.3 Georgia,serif;text-shadow:0 2px 5px #041406}
.title-token-brand:before,.title-token-brand:after{content:"";width:92px;height:1px;background:var(--menu-gold)}
.title-screen .paid-entry{display:block;padding:0;margin:0;border:0;border-radius:0;background:none;grid-area:auto;text-align:center}
.title-screen #paid-entry>h2{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.title-screen .entry-tiers{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:0;padding:0;border:0}
.title-screen .entry-tier span{
  flex-direction:column;gap:1px;min-height:59px;padding:8px 3px;border:1px solid var(--menu-gold);
  border-radius:2px;background:#092419ed;color:var(--menu-cream);font:600 18px/1.1 Georgia,serif;
  outline:1px solid #b8944570;outline-offset:-4px;
}
.title-screen .entry-tier b{font:inherit;white-space:nowrap;font-variant-numeric:tabular-nums}
.title-screen .entry-tier small{font:600 16px/1.15 Georgia,serif}
.title-screen .entry-tier input:checked+span{
  background:linear-gradient(#f4d995,#dfb65f);border-color:#fff0b9;color:#142619;outline-color:#9f7730;
}
.title-screen .entry-tier:hover span{background:#20462d}
.title-screen .entry-tier input:checked:hover+span{background:#f5d995}
.title-screen .entry-tier input:disabled+span{opacity:.65;cursor:wait}
.title-screen .entry-primary-actions{display:grid;grid-template-columns:minmax(0,335fr) minmax(0,178fr);gap:12px 14px;width:82%;margin:20px auto 0;align-items:stretch}
.title-screen .title-action{
  position:relative;min-height:56px;padding:10px 16px;display:flex;align-items:center;justify-content:center;
  border-radius:3px;font:600 23px/1.2 Georgia,serif;letter-spacing:0;text-decoration:none;
  border:1px solid var(--menu-gold);outline:1px solid #b8944570;outline-offset:-4px;
  transition:background 150ms ease-out,color 150ms ease-out,box-shadow 150ms ease-out;
}
.title-screen .title-play{color:#142619;background:linear-gradient(#f5dc9d,#dfb967);outline-color:#a67f37;border-color:#f5deaa;box-shadow:0 4px 10px #05150b4d}
.title-screen .title-play:hover:not(:disabled){background:#f7dfa4}
.title-screen .title-action:active:not(:disabled){box-shadow:0 2px 4px #05150b50}
.title-screen .title-tutorial{color:var(--menu-cream);background:#0a251be8;font-size:21px}
.title-screen .title-tutorial:hover{background:#214832}
.title-screen .title-buy{grid-column:1;min-height:44px;color:var(--menu-cream);background:#0a251be8;font-size:18px;gap:10px}
.title-screen .title-buy:hover{background:#214832}
.title-screen :is(.entry-tier span,.title-action){
  position:relative;border:0;border-radius:0;outline:0;
  clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px);
}
.title-screen :is(.entry-tier span,.title-action):before{
  content:"";position:absolute;inset:0;pointer-events:none;border:7px solid transparent;
  border-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 60'%3E%3Cpath d='M7 1H93L99 7V53L93 59H7L1 53V7Z' fill='none' stroke='%23e6c574' stroke-width='1.5'/%3E%3Cpath d='M8 4H92L96 8V52L92 56H8L4 52V8Z' fill='none' stroke='%23997c3e'/%3E%3C/svg%3E") 8 stretch;
}
.title-screen .title-action:focus-visible:after,
.title-screen .entry-tier input:focus-visible+span:after{
  content:"";position:absolute;inset:7px;border:2px solid #fff5c8;pointer-events:none;
}
.title-buy svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.title-screen .entry-feedback,.title-screen .wallet-feedback{padding:10px 14px;background:#10291eef;border-radius:4px}
.title-screen .wallet-connection{margin:14px auto 0;max-width:530px}
.title-screen :is(.title-action,.entry-tier input):focus-visible,
.title-screen .entry-tier input:focus-visible+span{outline:3px solid #fff5c8;outline-offset:5px}
.title-screen .title-action:disabled{cursor:wait}
.title-screen #game-links{margin:18px auto 0;width:min(335px,100%)}
.title-screen .menu-settings{position:absolute;z-index:20;right:max(16px,env(safe-area-inset-right));top:max(14px,env(safe-area-inset-top));color:var(--menu-cream)}
.menu-settings>summary{display:grid;place-items:center;width:44px;height:44px;margin-left:auto;list-style:none;border:1px solid var(--menu-gold);border-radius:50%;background:#102b1deb;cursor:pointer}
.menu-settings>summary::-webkit-details-marker{display:none}
.menu-settings>summary svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.menu-settings>summary:hover{background:#284b30}
.menu-settings>summary:focus-visible{outline:3px solid #fff5c8;outline-offset:4px}
.menu-settings .title-settings{
  position:absolute;display:grid;grid-template-columns:1fr;top:54px;right:0;left:auto;
  width:min(340px,calc(100vw - 32px));max-width:none;max-height:calc(100svh - 86px);overflow:auto;
  padding:20px;gap:14px;background:#10291ffb;border:1px solid #b9a06a;border-radius:8px;
  scrollbar-width:thin;scrollbar-color:#b9a06a #10291f;
}
.title-settings h2{font:600 25px/1.2 Georgia,serif;margin:0 0 3px}
.menu-settings .title-language{display:grid;grid-template-columns:1fr;gap:5px;padding:0;border:0;border-radius:0;background:none;font-size:14px;position:static}
.menu-settings .title-language span{font:15px/1.3 system-ui,sans-serif}
.menu-settings .title-settings .title-language select{width:100%;max-width:none;font:16px/1.4 system-ui,sans-serif;min-height:44px;background:#1b3a2b;border:1px solid #7f8d68;border-radius:4px;padding:7px 10px;color:#fff1ce}
.menu-settings .audio-settings{position:static;top:auto;right:auto;color:#fff1ce}
.menu-settings .audio-panel{position:static;width:100%;max-height:none;overflow:visible;border:0;border-radius:0;background:none;padding:16px 0 0;border-top:1px solid #607051;color:#fff1ce}
.menu-settings .audio-panel label{font-size:16px;margin-bottom:8px}
.menu-settings .audio-panel .music-toggle{font-size:16px;min-height:44px;border-radius:4px}
.menu-settings .audio-panel input{accent-color:#e3c480}
.menu-settings .audio-panel p{font-size:13px;color:#d6dbbe}
.menu-settings .audio-settings :is(button,input):focus-visible{outline-color:#ffe5a1}
@media(min-width:1600px){
  .title-screen .title-menu,.title-screen.has-paid-entry .title-menu{width:740px}
  .title-screen .entry-tier span{min-height:65px;font-size:20px}
  .title-screen .entry-primary-actions{max-width:600px}
}
@media(max-width:650px){
  .title-screen,.title-screen.has-paid-entry,.title-screen:has(.title-settings){padding: max(140px,32svh) 20px max(8svh,28px);min-height:100svh}
  .title-landscape{object-position:55% center}
  .title-screen .title-menu h1.title-name{font-size:clamp(34px,8.3vw,52px)}
  .title-token-brand{font-size:16px;margin:2px auto 14px}
  .title-screen .entry-tiers{grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}
  .title-screen .entry-tier{grid-column:span 2}
  .title-screen .entry-tier:nth-of-type(4){grid-column:2/span 2}
  .title-screen .entry-tier span{font-size:16px;min-height:57px}
  .title-screen .entry-tier small{font-size:14px}
  .title-screen .entry-primary-actions{width:100%;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:10px;margin-top:16px}
  .title-screen .title-action{font-size:19px;min-height:54px;padding:10px}
  .title-screen .title-buy{font-size:16px;min-height:44px}
  .menu-settings .title-language:last-child{grid-column:auto}
}
@media(max-width:370px){
  .title-screen .title-action{font-size:17px}
  .title-screen .title-buy{font-size:14px}
  .title-screen .entry-tier span{font-size:14px}
}
@media(max-height:560px) and (min-width:651px){
  .title-screen,.title-screen.has-paid-entry,.title-screen:has(.title-settings){padding-top:95px;padding-bottom:24px}
  .title-screen .title-menu h1.title-name{font-size:44px}
  .title-screen .title-menu,.title-screen.has-paid-entry .title-menu{width:620px}
}
@media(prefers-reduced-motion:reduce){.title-screen .title-action{transition:none}}