*{box-sizing:border-box;-webkit-user-select:none;user-select:none}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#080b0f;color:#fff;font-family:system-ui,-apple-system,sans-serif}button{font:inherit;color:inherit}.hidden{display:none!important}
#menu,#game{position:fixed;inset:0}#menu{background:#0a0d12 url("approved_visual_target.png") center/cover no-repeat}.menuShade{position:absolute;inset:0;background:linear-gradient(90deg,#070a10f5,#070a10c9 38%,#070a1044 68%,#070a1088)}.logo{position:absolute;left:6vw;top:50%;transform:translateY(-50%);width:min(340px,40vw);text-shadow:0 5px 24px #000}.logo small{letter-spacing:.28em;color:#e6b94e;font-size:9px;font-weight:900}.logo h1{font-size:54px;line-height:.76;margin:13px 0 18px;letter-spacing:-.07em}.logo h1 em{font-size:.38em;color:#e6b94e;font-style:normal}.logo p{font-size:9px;letter-spacing:.18em}.logo button{display:block;width:100%;padding:8px;margin:6px 0;border:1px solid #ffffff2b;border-radius:9px;background:#0b111be8;font-weight:900}.logo #newGame{background:#f4f1e9;color:#101317}
#world{width:100%;height:100%;display:block;background:#181b1c}.hud{position:absolute;background:#080d12e8;border:1px solid #ffffff24;box-shadow:0 5px 18px #0008;backdrop-filter:blur(5px)}.stats{left:8px;top:7px;border-radius:10px;display:flex}.stats span{padding:6px 9px;font-size:10px;font-weight:900;border-right:1px solid #ffffff17}.stats span:last-child{border:0}.clock{right:52px;top:7px;border-radius:10px;padding:5px 10px;text-align:center;font-size:9px}.clock span{display:block}.quest{left:8px;top:47px;width:205px;border-radius:10px;padding:7px;font-size:8px}.quest b{color:#e8bb4d;display:block}.quest span,.quest small{display:block;margin-top:3px}.quest small{opacity:.8}
#pauseBtn{position:absolute;right:9px;top:8px;width:35px;height:35px;border-radius:50%;border:1px solid #ffffff35;background:#0b121be8;font-weight:950}
.dpad{position:absolute;left:14px;bottom:12px;width:112px;height:112px;border-radius:50%;background:#0b1119d8;border:2px solid #ffffff25;box-shadow:0 6px 20px #0009}.dpad button{position:absolute;width:38px;height:38px;border:0;background:transparent;font-size:13px}.dpad button:nth-child(1){left:36px}.dpad button:nth-child(2){left:0;top:36px}.dpad button:nth-child(3){right:0;top:36px}.dpad button:nth-child(4){left:36px;bottom:0}
.actions{position:absolute;right:14px;bottom:15px;display:grid;grid-template-columns:55px 70px 55px;gap:7px;align-items:end}.actions button{border-radius:50%;aspect-ratio:1;border:2px solid #ffffff2d;background:#132030e8;font-size:18px;font-weight:900}.actions #talkBtn{width:70px}.actions small,.quick small{display:block;font-size:7px;margin-top:2px}
.quick{position:absolute;left:50%;bottom:9px;transform:translateX(-50%);display:flex;background:#091018e8;border:1px solid #ffffff26;border-radius:11px;overflow:hidden}.quick button{width:60px;padding:7px 2px;border:0;border-right:1px solid #ffffff1d;background:transparent;font-size:15px}.quick button:last-child{border:0}
#toast{position:absolute;left:50%;top:10px;transform:translateX(-50%);background:#080d12ef;border:1px solid #ffffff24;border-radius:9px;padding:6px 10px;font-size:9px;opacity:0;transition:.2s;pointer-events:none}
.dialog{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);width:min(570px,65vw);display:flex;gap:9px;padding:8px;background:#080d12f4;border:1px solid #ffffff2d;border-radius:12px;box-shadow:0 10px 30px #000b}.dialog canvas{border-radius:9px;background:#19232b}.dialog>div{flex:1}.dialog b{color:#e8bb4d;font-size:10px}.dialog p{font-size:11px;margin:3px 0 5px}.dialog button{font-size:8px;padding:5px 7px;margin:2px;border:1px solid #ffffff25;border-radius:7px;background:#1b2733}
.work{position:absolute;right:8px;top:51px;width:175px;background:#080d12e8;border:1px solid #ffffff22;border-radius:10px;padding:8px;font-size:8px}.work span{display:block;margin:4px 0}.bar{height:5px;background:#ffffff1d;border-radius:4px}.bar i{display:block;width:0;height:100%;background:#e8bb4d;border-radius:4px}
.panel{position:absolute;right:9%;top:8%;width:270px;max-height:80%;overflow:auto;background:#0b1119f7;border:2px solid #05080c;border-radius:16px;padding:12px;box-shadow:0 12px 35px #000b}.panel h3{margin:0 0 8px;color:#e8bb4d}.panel p,.panel li{font-size:9px}.panel button{width:100%;padding:7px;border:1px solid #ffffff22;border-radius:8px;background:#1b2631}
.overlay{position:absolute;inset:0;background:#0009;display:grid;place-items:center;z-index:30}.pauseCard,.settingsCard{width:245px;background:#0b1119f7;border:1px solid #ffffff2b;border-radius:15px;padding:12px;box-shadow:0 18px 45px #000}.pauseCard h2,.settingsCard h2{text-align:center;color:#e8bb4d;font-size:16px}.pauseCard button,.settingsCard button{display:block;width:100%;padding:8px;margin:5px 0;border:1px solid #ffffff24;border-radius:8px;background:#151f29;font-size:9px;font-weight:900}.pauseCard .danger{color:#ff6d6d}.settingsCard label{display:block;font-size:8px;margin:10px 0}.settingsCard label span{float:right}.settingsCard input{display:block;width:100%;margin-top:4px}
#rotate{display:none;position:fixed;z-index:99;inset:0;background:#080b0f;place-items:center;font-weight:900}@media(orientation:portrait){#rotate{display:grid}}@media(max-height:430px){.quest{display:none}.quick button{width:53px}.logo h1{font-size:43px}}
.setupScreen{position:fixed;inset:0;z-index:20;background:#090d13 url("approved_visual_target.png") center/cover no-repeat;display:grid;place-items:center}.setupScreen:before{content:"";position:absolute;inset:0;background:#05080dbd}.setupCard{position:relative;width:min(620px,88vw);background:#091018ed;border:1px solid #ffffff2c;border-radius:18px;padding:18px;box-shadow:0 20px 60px #000}.setupCard>small{color:#e8bb4d;font-weight:900;letter-spacing:.25em}.setupCard h2{text-align:center;font-size:26px;margin:5px 0 15px}.charSelect{display:grid;grid-template-columns:1fr 1fr;gap:12px}.charSelect button{min-height:110px;border:1px solid #ffffff2d;border-radius:14px;background:#121c27e8;padding:18px}.charSelect b{display:block;color:#e8bb4d;font-size:20px}.charSelect span{display:block;font-size:10px;margin-top:7px;opacity:.8}.customize{text-align:center}.customize h3{margin:2px 0 8px;color:#e8bb4d}.preview{display:inline-grid;place-items:center;width:110px;height:115px;background:#151e27;border-radius:14px}.customGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}.customGrid label{font-size:8px;text-align:left;font-weight:900}.customGrid select{display:block;width:100%;margin-top:4px;padding:7px;background:#17222d;color:#fff;border:1px solid #ffffff28;border-radius:7px}.customize>button{padding:8px 20px;border:1px solid #ffffff2c;border-radius:8px;background:#e8bb4d;color:#111;font-weight:900}.customize>.ghost{background:#17222d;color:#fff}.dialog{z-index:12} @media(max-height:430px){.setupCard{padding:10px}.charSelect button{min-height:80px}.preview{height:90px}.customGrid{margin:5px 0}.setupCard h2{font-size:20px;margin:2px 0 7px}}
/* V0.7.2a mobile landscape customization hotfix */
.setupScreen{padding:max(6px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));overflow:auto;align-items:center}
.setupCard{width:min(600px,92vw);max-height:calc(100dvh - 12px);overflow:auto;padding:10px 14px;border-radius:14px}
.setupCard>small{font-size:7px}.setupCard h2{font-size:20px;margin:1px 0 7px}.customize h3{font-size:15px;margin:0 0 4px}.preview{width:82px;height:78px}.preview canvas{width:82px;height:94px}.customGrid{gap:6px;margin:5px 0}.customGrid label{font-size:7px}.customGrid select{margin-top:2px;padding:5px;font-size:9px}.customize>button{padding:6px 16px;font-size:9px;margin:1px 3px}.charSelect button{min-height:72px;padding:10px}.charSelect b{font-size:16px}.charSelect span{font-size:8px;margin-top:3px}
@media(max-height:500px){.setupCard{max-height:96dvh}.setupCard>small{position:absolute;left:14px;top:10px}.setupCard h2{font-size:17px}.preview{width:72px;height:65px}.preview canvas{width:72px;height:83px}.customGrid{margin:3px 0}.customGrid select{padding:4px}.customize>button{padding:5px 14px}}
@media(max-height:390px){.setupCard{padding:7px 10px}.setupCard h2{font-size:15px;margin:0 0 3px}.customize h3{font-size:13px}.preview{width:60px;height:52px}.preview canvas{width:60px;height:69px}.customGrid select{padding:3px;font-size:8px}.customize>button{padding:4px 12px}}
/* V0.7.2b: true landscape layout — no scrolling required */
@media (orientation: landscape) and (max-height: 700px){
  .setupScreen{overflow:hidden!important;padding:8px 12px!important;place-items:center!important}
  .setupCard{width:min(760px,88vw)!important;max-height:calc(100dvh - 16px)!important;overflow:hidden!important;padding:10px 14px!important}
  .setupCard>small{position:absolute!important;left:14px!important;top:10px!important;font-size:7px!important}
  .setupCard h2{font-size:18px!important;line-height:1!important;margin:0 0 6px!important}
  .customize{display:grid!important;grid-template-columns:120px minmax(300px,1fr) 105px;grid-template-rows:auto 1fr auto;column-gap:12px;row-gap:4px;align-items:center;text-align:left}
  .customize.hidden{display:none!important}
  .customize h3{grid-column:1 / -1;grid-row:1;text-align:center;font-size:14px!important;line-height:1!important;margin:0 0 2px!important}
  .preview{grid-column:1;grid-row:2 / 4;justify-self:center;width:100px!important;height:116px!important;margin:0!important}
  .preview canvas{width:100px!important;height:116px!important;display:block}
  .customGrid{grid-column:2;grid-row:2 / 4;display:grid!important;grid-template-columns:1fr!important;gap:4px!important;margin:0!important;width:100%}
  .customGrid label{font-size:7px!important;display:grid!important;grid-template-columns:50px 1fr;align-items:center;gap:5px}
  .customGrid select{margin:0!important;padding:5px 7px!important;font-size:10px!important;height:28px!important}
  .customize>button{grid-column:3;width:100%!important;margin:0!important;padding:8px 4px!important;font-size:9px!important;align-self:end}
  #beginLife{grid-row:2;background:#e8bb4d!important;color:#111!important}
  #backSelect{grid-row:3;align-self:start!important;margin-top:4px!important}
  .charSelect{max-width:620px;margin:0 auto}
}

/* V0.7.2c: short-landscape setup hard lock */
@media (orientation: landscape) and (max-height: 600px){
  .setupScreen{place-items:stretch center!important;overflow:hidden!important;padding:4px 8px!important;box-sizing:border-box!important}
  .setupCard{width:min(920px,96vw)!important;height:calc(100dvh - 8px)!important;max-height:calc(100dvh - 8px)!important;overflow:hidden!important;padding:8px 12px!important;border-radius:12px!important;box-sizing:border-box!important}
  .setupCard>small{position:absolute!important;left:12px!important;top:8px!important;font-size:6px!important}
  .setupCard h2{font-size:15px!important;line-height:1!important;margin:0 0 4px!important}
  .customize{height:calc(100% - 22px)!important;display:grid!important;grid-template-columns:100px minmax(260px,1fr) 92px!important;grid-template-rows:20px 1fr 1fr!important;gap:5px 10px!important;align-items:center!important;text-align:left!important}
  .customize.hidden{display:none!important}
  .customize h3{grid-column:1/-1!important;grid-row:1!important;text-align:center!important;font-size:13px!important;margin:0!important}
  .preview{grid-column:1!important;grid-row:2/4!important;width:90px!important;height:100px!important;align-self:center!important}
  .preview canvas{width:86px!important;height:100px!important}
  .customGrid{grid-column:2!important;grid-row:2/4!important;display:grid!important;grid-template-columns:1fr!important;gap:5px!important;margin:0!important}
  .customGrid label{display:grid!important;grid-template-columns:48px 1fr!important;align-items:center!important;gap:5px!important;font-size:7px!important}
  .customGrid select{height:27px!important;margin:0!important;padding:3px 6px!important;font-size:9px!important}
  .customize>button{grid-column:3!important;width:100%!important;height:34px!important;margin:0!important;padding:4px!important;font-size:8px!important}
  #beginLife{grid-row:2!important;align-self:end!important}
  .customize>.ghost{grid-row:3!important;align-self:start!important}
}