:root{
    --sand:#E9E1CE;--teal:#276E6E;--rust:#E2643C;--char:#241F18;
    --ivory:#F7F5EF;--navy:#0E2740;--gold:#B08D57;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html,body{height:100%}
  body{font-family:"Zen Kaku Gothic New",sans-serif;color:#fff;background:var(--navy);overflow:hidden}
  a{color:inherit;text-decoration:none}

  /* parent brand bar */
  .topbar{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;justify-content:center;align-items:center;gap:14px;
    padding:18px 20px;pointer-events:none}
  .topbar .co{font-family:"Shippori Mincho",serif;font-weight:700;letter-spacing:.18em;font-size:.98rem;color:#fff;
    text-shadow:0 1px 10px rgba(0,0,0,.4)}
  .topbar .en{font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.28em;font-size:.6rem;color:rgba(255,255,255,.8);
    text-shadow:0 1px 8px rgba(0,0,0,.4)}
  @media (max-width:640px){.topbar{flex-direction:column;gap:2px;padding:14px}.topbar .en{font-size:.54rem}}

  .split{display:flex;height:100vh;width:100%}
  .panel{position:relative;flex:1;overflow:hidden;transition:flex .55s cubic-bezier(.6,0,.2,1);display:flex;align-items:center;justify-content:center;cursor:pointer}
  .split:hover .panel{flex:.78}
  .split .panel:hover{flex:1.55}
  @media (prefers-reduced-motion:reduce){.panel,.split:hover .panel,.split .panel:hover{transition:none;flex:1}}

  .bg{position:absolute;inset:0;z-index:0;transition:transform .8s ease}
  .panel:hover .bg{transform:scale(1.05)}

  /* left — EBOSHI (boats / surf) */
  .eboshi .bg{background:#12303f}
  .eboshi .bg img{width:100%;height:100%;object-fit:cover;opacity:.72}
  .eboshi::after{content:"";position:absolute;inset:0;z-index:1;
    background:linear-gradient(180deg,rgba(18,48,63,.35),rgba(18,48,63,.78))}
  .eboshi .accent{color:#7fd0d0}

  /* right — YACHT (elegant) */
  .yacht{background:var(--ivory);color:var(--navy)}
  .yacht .bg{background:linear-gradient(180deg,#EEF4F7,#F7F5EF)}
  .yacht::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(247,245,239,0),rgba(247,245,239,.25))}
  .yacht .sail{position:absolute;z-index:1;right:6%;top:50%;transform:translateY(-50%);height:82%;opacity:.5}
  .yacht .accent{color:var(--gold)}

  .inner{position:relative;z-index:3;text-align:center;padding:40px;max-width:520px}
  .eyebrow{font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.34em;font-size:.68rem;font-weight:600;margin-bottom:20px;
    display:inline-flex;align-items:center;gap:12px}
  .eyebrow::before,.eyebrow::after{content:"";width:22px;height:1px;background:currentColor;opacity:.6}

  .eboshi .title{font-family:"Zen Kaku Gothic New",sans-serif;font-weight:700}
  .eboshi .ja{font-size:clamp(2.6rem,6vw,4rem);letter-spacing:.06em;line-height:1}
  .eboshi .en{font-family:"Anton",sans-serif;text-transform:uppercase;letter-spacing:.04em;font-size:clamp(1.1rem,2.4vw,1.7rem);margin-top:10px;color:#7fd0d0}

  .yacht .ja{font-family:"Cormorant Garamond",serif;font-weight:600;font-size:clamp(2.6rem,6vw,4.2rem);letter-spacing:.08em;line-height:1}
  .yacht .en{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(1rem,2.2vw,1.4rem);margin-top:8px;color:var(--gold);letter-spacing:.04em}

  .sub{margin-top:20px;font-size:.9rem;line-height:1.8;opacity:.9}
  .yacht .sub{font-family:"Shippori Mincho",serif;opacity:.85}

  .enter{margin-top:30px;display:inline-flex;align-items:center;gap:10px;
    font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.2em;font-size:.74rem;font-weight:600;
    padding:14px 30px;border:1.5px solid currentColor;transition:background .25s,color .25s,gap .25s}
  .eboshi .enter{color:#fff}
  .eboshi .enter:hover{background:#fff;color:#12303f;gap:16px}
  .yacht .enter{color:var(--navy)}
  .yacht .enter:hover{background:var(--navy);color:var(--ivory);gap:16px}

  /* center divider */
  .divider{position:fixed;top:0;left:50%;width:1px;height:100vh;background:rgba(255,255,255,.18);z-index:10;transition:left .55s cubic-bezier(.6,0,.2,1);pointer-events:none}

  @media (max-width:760px){
    body{overflow:auto}
    .split{flex-direction:column;height:auto}
    .panel{flex:none;min-height:60vh}
    .split:hover .panel,.split .panel:hover{flex:none}
    .divider{display:none}
    .yacht .sail{height:60%;right:2%;opacity:.35}
    .topbar{position:absolute}
  }

  /* ---------- 準備中モード（近日公開） ---------- */
  .panel.is-soon{cursor:default}
  /* 準備中バッジ（ENTERボタンの位置に表示） */
  .soon-badge{margin-top:30px;display:inline-flex;align-items:center;gap:10px;
    font-family:"Oswald",sans-serif;text-transform:uppercase;letter-spacing:.14em;
    font-size:.82rem;font-weight:500;padding:12px 22px;border:1.5px solid currentColor;
    border-radius:2px;opacity:.9;pointer-events:none;position:relative}
  .soon-badge::before{content:"";width:8px;height:8px;border-radius:50%;
    background:currentColor;opacity:.85;box-shadow:0 0 0 0 currentColor;
    animation:soonPulse 2.2s ease-out infinite}
  .eboshi .soon-badge{color:#fff}
  .yacht .soon-badge{color:var(--navy)}
  @keyframes soonPulse{
    0%{box-shadow:0 0 0 0 rgba(255,255,255,.5)}
    70%{box-shadow:0 0 0 9px rgba(255,255,255,0)}
    100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}
  }
  .yacht .soon-badge::before{animation-name:soonPulseNavy}
  @keyframes soonPulseNavy{
    0%{box-shadow:0 0 0 0 rgba(14,39,64,.45)}
    70%{box-shadow:0 0 0 9px rgba(14,39,64,0)}
    100%{box-shadow:0 0 0 0 rgba(14,39,64,0)}
  }
  @media (prefers-reduced-motion:reduce){.soon-badge::before{animation:none}}

  /* クリック時のトースト表示 */
  .soon-toast{position:fixed;left:50%;bottom:40px;transform:translate(-50%,20px);
    background:rgba(20,26,32,.92);color:#fff;font-size:.92rem;letter-spacing:.02em;
    padding:14px 26px;border-radius:40px;box-shadow:0 10px 34px rgba(0,0,0,.3);
    opacity:0;visibility:hidden;transition:opacity .3s,transform .3s,visibility .3s;
    z-index:120;max-width:86vw;text-align:center}
  .soon-toast.show{opacity:1;visibility:visible;transform:translate(-50%,0)}