:root{font-family:"M PLUS Rounded 1c","BIZ UDPGothic",Meiryo,sans-serif;color:#123c55;background:#dff7ff}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:linear-gradient(#bceeff,#eaffe9)}a{text-decoration:none;color:inherit}.adventure{--sea-image:url('../assets/backgrounds/japan.png');max-width:980px;margin:auto;padding:20px}.adventure__header{display:flex;justify-content:space-between;align-items:center}.adventure__header p,.kicker{margin:0;color:#1c7898;font-weight:700}.adventure h1,.home-card h1{margin:.2rem 0;color:#075c82}.pill,.actions a,.home-nav a,.text-link{padding:12px 20px;border-radius:999px;background:#fff;box-shadow:0 4px 15px #12759b25;font-weight:700}.sea-card{position:relative;overflow:hidden;min-height:240px;padding:36px;border-radius:32px;color:#fff;background:linear-gradient(90deg,#005c8fc9,#16a8b088),var(--sea-image) center/cover;margin:20px 0;box-shadow:0 14px 30px #08729a35}.sea-card h2{font-size:clamp(2rem,7vw,4.5rem);margin:.1em 0}.stage-label{letter-spacing:.15em}.progress{height:16px;border-radius:20px;background:#ffffff66;overflow:hidden;margin-top:15px}.progress span{display:block;height:100%;background:linear-gradient(90deg,#ffe76a,#ffac4d);border-radius:inherit;transition:width .7s}.bubbles i{position:absolute;border:3px solid #fff8;border-radius:50%;width:22px;height:22px;animation:float 3s infinite}.bubbles i:nth-child(2){left:70%;top:60%;animation-delay:.8s}.bubbles i:nth-child(3){left:84%;top:20%;width:35px;height:35px}.bubbles i:nth-child(4){left:55%;top:25%;animation-delay:1.3s}@keyframes float{to{transform:translateY(-45px);opacity:0}}.map-panel{background:#fff;padding:22px;border-radius:28px;box-shadow:0 12px 25px #08729a20}.map-heading{text-align:center}.map-heading h2{margin:0}.stage-row{margin:18px 0}.stage-row h3{margin:0 0 8px;color:#147a96}.stage-path{display:grid;grid-template-columns:repeat(10,1fr);gap:7px}.map-cell{position:relative;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:#d5e2e6;color:#79909a;box-shadow:inset 0 -4px #0001;transition:.4s}.map-cell span{font-weight:900}.map-cell small{position:absolute;bottom:-15px;font-size:10px}.map-cell.reached{background:#66d4d0;color:#fff}.map-cell.current{outline:4px solid #ffe052;transform:scale(1.08)}.omochi{position:absolute;top:-20px;width:27px;height:22px;border-radius:50% 50% 45% 45%;background:#fff;color:#f6a44c;border:3px solid #f6a44c;text-align:center;font-size:0;filter:drop-shadow(0 3px 2px #0003)}.omochi:after{content:"••";font-size:13px;color:#345}.is-moving .omochi{animation:walk .35s infinite alternate}@keyframes walk{to{transform:translateY(-8px) rotate(8deg)}}.actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:22px}.primary{border:0;padding:15px 25px;border-radius:999px;background:linear-gradient(135deg,#ffca46,#ff8d4b);color:#713800;font:inherit;font-weight:900;cursor:pointer;box-shadow:0 6px 15px #ef7c3650}.primary:disabled{opacity:.5}.notice{text-align:center;min-height:2em;font-weight:800}.event-overlay{position:fixed;inset:0;display:grid;place-items:center;background:#003852a8;padding:20px;z-index:5}.event-overlay[hidden]{display:none}.event-card{background:#fff;border-radius:30px;padding:35px;max-width:480px;text-align:center;animation:pop .4s}.event-icon{font-size:5rem}.event-card h2{color:#067a9f}.event-card #eventActions{margin-top:24px}.event-card #eventActions>*{display:inline-block}@keyframes pop{from{transform:scale(.4);opacity:0}}.home{display:grid;place-items:center;padding:20px}.home-card{width:min(620px,100%);background:#ffffffde;border-radius:34px;padding:35px;text-align:center;box-shadow:0 18px 50px #08729a35}.current{display:grid;gap:8px;padding:24px;margin:25px 0;border-radius:25px;background:#ddf8fa}.current strong{font-size:2rem;color:#087b98}.home-nav{display:grid;gap:12px}.home-nav .primary{color:#713800}.home-card button{margin:15px}.text-link{display:block;margin-top:12px}@media(max-width:600px){.adventure{padding:10px}.sea-card{padding:25px;min-height:200px}.map-panel{padding:14px}.stage-path{gap:3px}.map-cell small{display:none}.map-cell{font-size:.72rem}.stage-row{margin:13px 0}}
:root .map-cell.current{gap:0;padding:0;margin:0;border-radius:50%}

/* Ver.3.1.15: 現在の海域背景とコンパクトな現在地表示 */
body{
  --sea-image:url('../assets/backgrounds/japan.png');
  background:
    linear-gradient(180deg,rgba(1,46,83,.42),rgba(1,35,68,.72)),
    var(--sea-image) center/cover fixed;
}
.adventure__header{
  padding:12px 16px;
  border:1px solid #ffffff99;
  border-radius:20px;
  background:#f4fcffdf;
  box-shadow:0 10px 25px #002c4f30;
  backdrop-filter:blur(7px);
}
.sea-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:"stage day" "title day" "progress progress";
  align-items:center;
  column-gap:18px;
  min-height:120px;
  padding:16px 22px;
  border-radius:24px;
  margin:12px 0;
  background:linear-gradient(90deg,#005c8fd9,#16a8b09c),var(--sea-image) center/cover;
  box-shadow:0 14px 30px #002c4f55;
}
.sea-card .stage-label{grid-area:stage;margin:0}
.sea-card h2{grid-area:title;font-size:clamp(1.7rem,5vw,2.7rem);line-height:1.1;margin:.05em 0}
.sea-card #dayLabel{grid-area:day;margin:0;padding:8px 12px;border-radius:14px;background:#003a5d80;font-weight:800;white-space:nowrap}
.sea-card .progress{grid-area:progress;height:12px;margin-top:8px}
.map-panel{background:#fffffff0;box-shadow:0 12px 25px #002c4f45;backdrop-filter:blur(5px)}

@media(max-width:600px){
  .adventure__header{padding:9px 11px;border-radius:16px}
  .adventure__header p{display:none}
  .adventure__header h1{font-size:1.35rem}
  .adventure__header .pill{padding:9px 12px;font-size:.78rem}
  .sea-card{min-height:100px;padding:12px 14px;border-radius:19px;column-gap:8px}
  .sea-card h2{font-size:1.65rem}
  .sea-card .stage-label{font-size:.68rem}
  .sea-card #dayLabel{padding:6px 8px;font-size:.72rem}
  .sea-card .progress{height:10px;margin-top:6px}
}

/* Ver.3.1.29 海図＋すごろくマップ */
.map-panel{
  position:relative;
  overflow:hidden;
  padding:22px 24px 24px;
  border:1px solid #ffffffc9;
  background:linear-gradient(145deg,rgba(250,254,255,.97),rgba(220,244,249,.94));
}
.map-heading{display:flex;align-items:end;justify-content:space-between;gap:18px;text-align:left}
.map-heading h2{font-size:clamp(1.35rem,3vw,2rem);color:#075c82}
.map-heading p{margin:0;color:#477183;font-size:.9rem;font-weight:700}
.map-kicker{display:block;margin-bottom:2px;color:#1ca2b9;font-size:.68rem;font-weight:900;letter-spacing:.18em}
.sea-switcher{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;align-items:center;gap:10px;margin:16px 0 12px}
.sea-switcher>button{width:42px;height:42px;border:1px solid #8bc9d7;border-radius:50%;color:#087592;background:#fff;font-size:1.7rem;font-weight:900;box-shadow:0 4px 12px #075c8220;cursor:pointer}
.sea-switcher>button:disabled{opacity:.25;cursor:default}
.sea-dots{display:grid;grid-template-columns:repeat(10,1fr);gap:6px}
.sea-dots button{height:30px;padding:0;border:0;border-radius:999px;color:#547987;background:#cfe3e8;font:800 .72rem/1 inherit;cursor:pointer;transition:.2s}
.sea-dots button.cleared{color:#fff;background:#54bfc3}
.sea-dots button.active{color:#073f59;background:#ffd95a;box-shadow:0 0 0 3px #fff,0 0 0 5px #f4bb32;transform:translateY(-2px)}
.sea-dots button.unreached{opacity:.52}
.map{
  --map-sea-image:url('../assets/backgrounds/japan.png');
  position:relative;
  height:430px;
  overflow:hidden;
  border:1px solid #ffffffa8;
  border-radius:28px;
  background:
    linear-gradient(180deg,rgba(0,48,79,.17),rgba(0,58,93,.48)),
    var(--map-sea-image) center/cover;
  box-shadow:inset 0 0 45px #002e5273,0 12px 25px #075c8229;
}
.map::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 25%,#fff8 0 2px,transparent 3px),radial-gradient(circle at 75% 68%,#fff6 0 3px,transparent 4px);background-size:70px 65px,100px 90px;opacity:.55;pointer-events:none}
.route-line{position:absolute;inset:8% 3%;width:94%;height:84%;overflow:visible}
.route-line polyline{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.route-shadow{stroke:#eafaff9c;stroke-width:15;stroke-dasharray:3 11}
.route-progress{stroke:#ffd95e;stroke-width:7;filter:drop-shadow(0 2px 3px #7f4b00a3)}
.map-cell{
  position:absolute;
  width:68px;
  height:68px;
  aspect-ratio:auto;
  translate:-50% -50%;
  border:3px solid #ffffffdb;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#355966;
  background:linear-gradient(#f5fcff,#c9dce2);
  box-shadow:0 7px 0 #0d466a42,0 10px 18px #001e3d55,inset 0 3px 5px #fff;
  z-index:2;
}
.map-cell span:not(.omochi){font-size:1.25rem;font-weight:1000}
.map-cell small{position:absolute;bottom:-23px;padding:2px 6px;border-radius:999px;color:#fff;background:#003b5da8;font-size:.62rem;font-weight:900;letter-spacing:.03em;white-space:nowrap}
.map-cell.reached{color:#fff;border-color:#dfffff;background:linear-gradient(#62ded3,#119cac);box-shadow:0 7px 0 #05677f,0 10px 18px #001e3d55,inset 0 3px 5px #caffff}
.map-cell.future{filter:saturate(.55);opacity:.78}
.map-cell.current{z-index:4;outline:5px solid #ffe15c;outline-offset:3px;transform:none;animation:currentPulse 1.8s ease-in-out infinite}
.map-cell.treasure,.map-cell.boss{width:78px;height:78px}
.map-cell.treasure{background:linear-gradient(#fff8d8,#ffc54a);border-color:#fff6c9}
.map-cell.boss{background:linear-gradient(#5967a6,#172a64);border-color:#dce9ff;color:#fff}
.map-cell.treasure span:not(.omochi),.map-cell.boss span:not(.omochi){font-size:1.65rem}
.omochi{position:absolute;top:-57px;left:50%;width:67px;height:57px;border:0;background:none;translate:-50% 0;filter:drop-shadow(0 5px 4px #001c3570);z-index:5}
.omochi img{display:block;width:100%;height:100%;object-fit:contain}
.is-moving .omochi{animation:swimOmochi .35s infinite alternate}
@keyframes currentPulse{50%{outline-color:#fff3a6;scale:1.06}}
@keyframes swimOmochi{to{transform:translateY(-9px) rotate(6deg)}}
.map-legend{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin:13px 0 0;color:#426b7c;font-size:.76rem;font-weight:800}
.map-legend span{display:flex;align-items:center;gap:5px}
.legend-reached{width:15px;height:15px;border-radius:50%;background:#35c3c2;border:2px solid #fff;box-shadow:0 0 0 1px #35a7b6}
.overall-progress{margin-top:15px;padding:13px 15px;border:1px solid #a9d5df;border-radius:17px;background:#f8fdffba}
.overall-progress>div:first-child{display:flex;justify-content:space-between;gap:10px;color:#175a75;font-size:.82rem}
.overall-track{height:9px;margin-top:8px;overflow:hidden;border-radius:999px;background:#cfe4e9}
.overall-track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#27bfc0,#ffd45d);transition:width .6s}

@media(max-width:600px){
  .adventure{padding-bottom:110px}
  .map-panel{padding:14px 10px 16px;border-radius:22px}
  .map-heading{display:block;padding:0 5px;text-align:center}
  .map-heading p{margin-top:4px;font-size:.75rem}
  .sea-switcher{grid-template-columns:34px minmax(0,1fr) 34px;gap:5px;margin:12px 0 9px}
  .sea-switcher>button{width:34px;height:34px;font-size:1.35rem}
  .sea-dots{gap:3px}
  .sea-dots button{height:24px;font-size:.61rem}
  .map{height:360px;border-radius:21px}
  .route-line{inset:8% 1%;width:98%}
  .route-shadow{stroke-width:10}
  .route-progress{stroke-width:5}
  .map-cell{width:49px;height:49px;border-width:2px;box-shadow:0 5px 0 #0d466a42,0 7px 12px #001e3d50,inset 0 2px 4px #fff}
  .map-cell span:not(.omochi){font-size:.92rem}
  .map-cell small{bottom:-18px;font-size:.5rem;padding:1px 4px}
  .map-cell.treasure,.map-cell.boss{width:57px;height:57px}
  .map-cell.treasure span:not(.omochi),.map-cell.boss span:not(.omochi){font-size:1.25rem}
  .map-cell.current{outline-width:3px;outline-offset:2px}
  .omochi{top:-43px;width:52px;height:43px}
  .map-legend{gap:11px;font-size:.68rem}
  .overall-progress{padding:10px 12px}
}
