/* AZRION GAME — boot sequence kit (azboot) v1.3.0
   Publisher splash -> notice -> title (KV + START) -> first-run consent ->
   loading (top progress line + %). Shared by all AZRION GAME titles.
   Motion follows the house law: quiet glides, long refined easing, no bounce.
   v1.2.0: the world must stay clearly visible around the cards (the big
   titles keep the scenery readable behind their dialogs), so the shade
   over the key visual is kept light; loading stage gains an optional
   house-promo banner slot at its foot. */
.azboot{
  --azb-accent:#d8b84a;
  --azb-ink:#f2f1fa;
  --azb-dim:rgba(242,241,250,.66);
  --azb-line:rgba(255,255,255,.16);
  --azb-ease:cubic-bezier(.22,.9,.26,1);
  position:fixed;inset:0;z-index:10000;
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP",sans-serif;
  color:var(--azb-ink);
  -webkit-tap-highlight-color:transparent;
  overscroll-behavior:none;
}
.azboot[hidden]{display:none}
.azboot *{margin:0;padding:0;box-sizing:border-box}
.azboot-stage{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:calc(20px + env(safe-area-inset-top)) 22px calc(20px + env(safe-area-inset-bottom));
  opacity:0;pointer-events:none;transition:opacity .55s var(--azb-ease);}
.azboot-stage.on{opacity:1;pointer-events:auto}
.azboot.leaving{opacity:0;transition:opacity .5s var(--azb-ease);pointer-events:none}

/* ---------- top progress line (loading) ---------- */
.azboot-progress{position:absolute;top:0;left:0;right:0;height:3px;background:rgba(255,255,255,.10);opacity:0;transition:opacity .3s}
.azboot-progress.on{opacity:1}
.azboot-progress>i{display:block;height:100%;width:0%;background:var(--azb-accent);border-radius:0 2px 2px 0;
  transition:width .35s var(--azb-ease)}

/* ---------- world backdrop (every stage performs inside the title's world) ----------
   Owner design law (2026-10-30): no generic white/common screens — even the
   splash, notice and loading stages stand inside the title's scenery. */
.azboot-worldbg{position:absolute;inset:0;overflow:hidden;background:#05060f}
.azboot-worldbg img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.azboot-worldbg::after{content:"";position:absolute;inset:0;background:rgba(5,6,16,.40)}
.azboot-worldbg.deep::after{background:linear-gradient(180deg,rgba(5,6,16,.46),rgba(5,6,16,.30) 45%,rgba(5,6,16,.58))}
.azboot-worldbg.soft::after{background:linear-gradient(180deg,rgba(5,6,16,.38),rgba(5,6,16,.22) 45%,rgba(5,6,16,.55))}
.azboot-stage>*{position:relative;z-index:1}
.azboot-stage>.azboot-worldbg{position:absolute;z-index:0}

/* ---------- 1. splash (publisher mark, inside the world) ---------- */
.azboot-splash{background:#05060f;color:#fff}
.azboot-splash .azb-mark{width:74px;height:auto;opacity:0;transform:translateY(10px) scale(.985);
  filter:drop-shadow(0 4px 22px rgba(0,0,0,.5));
  transition:opacity .8s var(--azb-ease),transform .8s var(--azb-ease)}
.azboot-splash .azb-word{margin-top:16px;font-size:15px;font-weight:700;letter-spacing:.44em;text-indent:.44em;color:#fff;
  text-shadow:0 2px 14px rgba(0,0,0,.6);
  opacity:0;transform:translateY(8px);transition:opacity .8s var(--azb-ease) .12s,transform .8s var(--azb-ease) .12s}
.azboot-splash .azb-sub{margin-top:7px;font-size:9.5px;letter-spacing:.34em;text-indent:.34em;color:rgba(255,255,255,.55);
  opacity:0;transition:opacity .8s var(--azb-ease) .24s}
.azboot-stage.on .azb-mark,.azboot-stage.on .azb-word,.azboot-stage.on .azb-sub{opacity:1;transform:none}

/* ---------- shared card stages (notice / consent) ---------- */
.azboot-dim{background:#05060f}
.azboot-card{width:min(92vw,430px);max-height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch;
  background:rgba(9,11,24,.64);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid var(--azb-line);border-radius:20px;
  padding:26px 24px 22px;box-shadow:0 24px 60px rgba(0,0,0,.45);
  opacity:0;transform:translateY(12px);transition:opacity .6s var(--azb-ease),transform .6s var(--azb-ease)}
.azboot-stage.on .azboot-card{opacity:1;transform:none}
.azboot-kicker{font-size:10px;letter-spacing:.34em;color:var(--azb-accent);font-weight:700}
.azboot-h{margin-top:9px;font-size:20px;font-weight:700;letter-spacing:.06em}
.azboot-body{margin-top:15px;font-size:13.5px;line-height:1.85;color:var(--azb-ink)}
.azboot-body li{margin:0 0 10px 1.15em;line-height:1.8}
.azboot-body p{margin-bottom:10px}
.azboot-note{font-size:11.5px;color:var(--azb-dim);line-height:1.75}
.azboot-btn{pointer-events:auto;display:block;width:100%;margin-top:20px;padding:15px 18px;border:none;border-radius:999px;
  background:var(--azb-accent);color:#171106;font-size:15px;font-weight:700;letter-spacing:.12em;cursor:pointer;
  transition:transform .18s var(--azb-ease),opacity .3s}
.azboot-btn:active{transform:scale(.97)}
.azboot-btn[disabled]{opacity:.45;pointer-events:none}
.azboot-linkbtn{display:block;margin:12px auto 0;padding:8px 14px;background:none;border:none;color:var(--azb-dim);
  font-size:12px;letter-spacing:.08em;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.azboot-links{margin-top:14px;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.azboot-links a{color:var(--azb-dim);font-size:12px;letter-spacing:.06em;text-decoration:underline;text-underline-offset:3px}

/* ---------- 3. title ---------- */
.azboot-title{padding:0;justify-content:flex-end;background:#05060f}
.azboot-kv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;
  opacity:0;transform:scale(1.035);transition:opacity 1.1s var(--azb-ease),transform 2.6s var(--azb-ease)}
.azboot-stage.on .azboot-kv{opacity:1;transform:scale(1)}
.azboot-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,5,14,.34) 0%,rgba(4,5,14,0) 30%,rgba(4,5,14,.18) 58%,rgba(4,5,14,.86) 100%)}
.azboot-brand{position:absolute;top:calc(14px + env(safe-area-inset-top));left:16px;display:flex;align-items:center;gap:8px;opacity:.92}
.azboot-brand img{width:22px;height:auto;display:block}
.azboot-brand span{font-size:10.5px;font-weight:700;letter-spacing:.3em;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.azboot-titlebox{position:relative;width:100%;padding:0 24px calc(26px + env(safe-area-inset-bottom));text-align:center}
.azboot-title-en{font-size:11px;font-weight:700;letter-spacing:.5em;text-indent:.5em;color:var(--azb-accent);text-shadow:0 1px 10px rgba(0,0,0,.55)}
.azboot-title-name{margin-top:8px;font-size:clamp(38px,10.5vw,54px);font-weight:800;line-height:1.12;color:#fff;
  font-family:var(--azb-title-font,inherit);letter-spacing:var(--azb-title-spacing,.05em);
  text-shadow:0 2px 22px rgba(0,0,0,.55)}
.azboot-catch{margin-top:10px;font-size:14px;letter-spacing:.1em;color:rgba(255,255,255,.88);text-shadow:0 1px 10px rgba(0,0,0,.6)}
.azboot-start{pointer-events:auto;margin:26px auto 0;display:flex;flex-direction:column;align-items:center;gap:3px;
  min-width:220px;padding:14px 34px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.35);
  background:linear-gradient(180deg,rgba(16,18,36,.42),rgba(16,18,36,.62));backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  color:#fff;cursor:pointer;transition:transform .18s var(--azb-ease);
  animation:azb-breathe 2.8s ease-in-out infinite}
.azboot-start:active{transform:scale(.96)}
.azboot-start .s1{font-size:19px;font-weight:800;letter-spacing:.34em;text-indent:.34em}
.azboot-start .s2{font-size:10px;letter-spacing:.24em;text-indent:.24em;color:rgba(255,255,255,.72)}
@keyframes azb-breathe{0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,.0)}50%{box-shadow:0 0 26px 2px rgba(255,255,255,.14)}}
.azboot-titlefoot{margin-top:20px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.azboot-titlefoot .l{display:flex;gap:16px}
.azboot-titlefoot a{color:rgba(255,255,255,.62);font-size:11px;letter-spacing:.05em;text-decoration:underline;text-underline-offset:3px}
.azboot-ver{font-size:11px;color:rgba(255,255,255,.55);letter-spacing:.08em;font-variant-numeric:tabular-nums;white-space:nowrap}

/* ---------- 5. loading (the world's scenery stays on stage) ---------- */
.azboot-loading{background:#05060f}
.azboot-load-mark{width:46px;height:auto;opacity:.95;filter:drop-shadow(0 3px 14px rgba(0,0,0,.55))}
.azboot-load-pct{margin-top:20px;font-size:30px;font-weight:700;letter-spacing:.06em;font-variant-numeric:tabular-nums;
  text-shadow:0 2px 16px rgba(0,0,0,.65)}
.azboot-load-pct small{font-size:15px;color:rgba(255,255,255,.75);margin-left:2px}
.azboot-load-msg{margin-top:8px;font-size:11.5px;color:rgba(255,255,255,.78);letter-spacing:.14em;min-height:16px;
  text-shadow:0 1px 10px rgba(0,0,0,.65)}
.azboot-load-title{position:absolute;bottom:calc(22px + env(safe-area-inset-bottom));left:0;right:0;text-align:center;
  font-size:10.5px;letter-spacing:.3em;color:rgba(242,241,250,.4)}

/* ---------- loading foot banner (optional house promo, CFG.banner) ----------
   Rendered only when the title configures it; AZRION's own notices only. */
.azboot-banner{pointer-events:auto;position:absolute;left:50%;transform:translate(-50%,10px);
  bottom:calc(52px + env(safe-area-inset-bottom));
  width:min(92vw,430px);display:flex;align-items:center;gap:11px;
  padding:11px 16px 11px 13px;border-radius:14px;text-decoration:none;color:var(--azb-ink);
  background:rgba(9,11,24,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border:1px solid var(--azb-line);box-shadow:0 14px 34px rgba(0,0,0,.35);
  opacity:0;transition:opacity .6s var(--azb-ease) .25s,transform .6s var(--azb-ease) .25s}
.azboot-stage.on .azboot-banner{opacity:1;transform:translate(-50%,0)}
.azboot-banner:active{transform:translate(-50%,0) scale(.98)}
.azboot-banner img{width:24px;height:auto;display:block;flex:none}
.azb-btxt{display:flex;flex-direction:column;gap:1px;min-width:0;text-align:left}
.azb-b1{font-size:12.5px;font-weight:700;letter-spacing:.14em;color:#fff;white-space:nowrap}
.azb-b2{font-size:10.5px;letter-spacing:.06em;color:var(--azb-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.azb-barrow{margin-left:auto;font-size:19px;line-height:1;color:var(--azb-accent);flex:none}

/* wide image variant (CFG.banner.img): the artwork carries the message.
   Rendered on the loading stage only — never on the title stage
   (KUDAKA law, 2026-10-31; the title stage is one complete viewport).
   RESIZE 2026-10-31: 4:1
   artwork (1560x390), full-bleed — edge to edge, no card chrome, so the
   banner reads at full viewport width (KUDAKA: bigger, clearer). The
   bottom anchor (52px + safe area) is unchanged; the text variant above
   keeps its floating-card form as the fallback. */
.azboot-banner-img{left:0;right:0;transform:translateY(10px);width:100%;max-width:none;
  padding:0;border:none;border-radius:0;background:none;box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;line-height:0}
.azboot-stage.on .azboot-banner-img{transform:translateY(0)}
.azboot-banner-img:active{transform:scale(.995)}
.azboot-banner-img img{width:100%;height:auto}

/* Scroll lock while the boot is up (kit v1.4.1, 2026-10-31): the page
   behind the tap-only stage must not scroll or rubber-band. azboot.js
   adds and removes .azboot-locked on <html> and stops touch/wheel input. */
html.azboot-locked,html.azboot-locked body{overflow:hidden !important;overscroll-behavior:none !important}

@media (prefers-reduced-motion: reduce){
  .azboot *,.azboot-stage,.azboot-card,.azboot-kv{transition-duration:.01s !important;animation:none !important}
}