.hero{
    background:
      radial-gradient(circle at 85% -10%, rgba(255,255,255,0.06), transparent 55%),
      var(--indigo-deep);
    color:var(--washi);
    padding:48px 24px 40px;
    position:relative;
    overflow:hidden;
  }
  .hero::after{
    content:"";
    position:absolute;
    right:-40px; bottom:-60px;
    width:260px; height:260px;
    border:1px solid rgba(239,230,214,0.15);
    border-radius:50%;
    pointer-events:none;
  }
  .hero-top-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:14px;
    position:relative;
    z-index:1;
  }
  .hero-eyebrow{
    font-family:'BIZ UDPGothic', 'Noto Sans JP', sans-serif;
    font-size:12px;
    letter-spacing:0.18em;
    color:var(--gold);
    text-transform:uppercase;
    margin-bottom:0;
  }
  .lang-switch select{
    background:var(--indigo-deep);
    color:var(--washi);
    border:1px solid rgba(239,230,214,0.35);
    border-radius:2px;
    padding:5px 10px;
    font-size:12px;
    font-family:'BIZ UDPGothic', 'Noto Sans JP', sans-serif;
    cursor:pointer;
  }
  .hero-title-row{
    display:flex;
    align-items:center;
    gap:10px;
    position:relative;
    z-index:1;
  }
  .hero h1{
    font-family:'Noto Serif JP', serif;
    font-weight:700;
    font-size:clamp(28px, 4vw, 40px);
    margin:0;
    line-height:1.3;
  }
  .info-btn{
    width:22px; height:22px;
    border-radius:50%;
    border:1px solid rgba(239,230,214,0.5);
    background:transparent;
    color:rgba(239,230,214,0.85);
    font-family:'Noto Serif JP', serif;
    font-style:italic;
    font-size:13px;
    line-height:1;
    cursor:pointer;
    flex-shrink:0;
  }
  .info-btn:hover, .info-btn:focus{
    background:rgba(239,230,214,0.15);
  }
  .info-tooltip{
    display:none;
    max-width:640px;
    font-size:13.5px;
    line-height:1.9;
    color:rgba(239,230,214,0.88);
    background:rgba(0,0,0,0.22);
    border:1px solid rgba(239,230,214,0.2);
    border-radius:4px;
    padding:14px 16px;
    margin-top:14px;
  }
  .info-tooltip.open{ display:block; }

  .wrap{ max-width:920px; margin:0 auto; padding:0 24px; }
  .view{
    max-width:640px;
    margin:0 auto;
    padding:18px 18px 90px; /* 下部タブバー分の余白 */
  }
  .view-header{ margin-bottom:14px; }
  .view-header h2{
    font-family:'BIZ UDPGothic', 'Noto Sans JP', sans-serif;
    font-size:18px;
    color:var(--indigo-deep);
    margin:0;
  }
  .view-header .sub{ font-size:12px; color:#8a8578; margin-top:2px; }
  .bottom-tab-bar{
    position:fixed;
    left:0; right:0; bottom:0;
    display:flex;
    background:var(--washi-panel);
    border-top:1px solid rgba(43,40,37,0.12);
    box-shadow:0 -2px 10px rgba(0,0,0,0.08);
    z-index:40;
    padding-bottom:env(safe-area-inset-bottom, 0);
  }
  .tab-btn{
    flex:1;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:2px;
    padding:9px 0 7px;
    background:none;
    border:none;
    cursor:pointer;
    color:#8a8578;
  }
  .tab-btn .tab-icon{ font-size:20px; line-height:1; }
  .tab-btn .tab-label{ font-size:10.5px; font-family:'BIZ UDPGothic', 'Noto Sans JP', sans-serif; }
  .tab-btn.active{ color:var(--vermillion); }

  #viewZukan,#viewSettings{
    max-width:640px;min-height:100vh;margin:0 auto;padding:0 0 100px;
    background:var(--indigo-deep);
  }
  #viewZukan .view-header,#viewSettings .view-header{
    margin:0;padding:28px 18px 20px;text-align:center;color:var(--washi-panel);
    background:radial-gradient(circle at 12% 20%,rgba(173,138,80,.12),transparent 28%),var(--indigo-deep);
  }
  #viewZukan .view-header h2,#viewSettings .view-header h2{
    margin:0;color:#fff;font-size:24px;font-weight:600;letter-spacing:.12em;
  }

  .bottom-tab-bar{
    left:14px;right:14px;bottom:12px;min-height:68px;padding:5px 8px calc(5px + env(safe-area-inset-bottom,0));
    border:1px solid rgba(43,40,37,.13);border-radius:23px;background:rgba(251,247,239,.96);
    box-shadow:0 10px 30px rgba(29,43,79,.2);backdrop-filter:blur(16px);overflow:hidden;
  }
  .tab-btn{min-height:56px;gap:4px;padding:7px 0 5px;border-radius:17px}
  .tab-btn .tab-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center}
  .tab-btn .tab-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .tab-btn .tab-label{font-size:11px;font-weight:500}
  .tab-btn.active{color:var(--vermillion);background:transparent}