:root{
    --sky-top:#AEDBF3;
    --sky-mid:#D3ECFA;
    --sky-low:#F3F9FC;
    --cream:#FFFBF2;
    --paper:#FFFDF8;
    --apricot:#F6A952;
    --apricot-deep:#E07F3B;
    --apricot-pale:#FCE1B8;
    --leaf:#8FBF6A;
    --leaf-deep:#6B9C4C;
    --blossom:#FBDCD8;
    --ink:#4A3F35;
    --ink-soft:#8A7C6C;
    --line:#EADFC9;
    --nav-h:60px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:"Zen Kaku Gothic New","Zen Maru Gothic",sans-serif;
    color:var(--ink);
    background:linear-gradient(180deg,var(--sky-top) 0%,var(--sky-mid) 40%,var(--sky-low) 70%,var(--cream) 100%);
    padding-top:var(--nav-h);
    overflow-x:hidden;
  }
  a{color:inherit;}
  img{max-width:100%;display:block;}

  .wrap{max-width:480px;margin:0 auto;position:relative;}

  /* ===== fixed top navigation ===== */
  .site-nav{
    position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:100;
    background:rgba(255,251,242,.92);backdrop-filter:blur(6px);
    border-bottom:1px solid var(--line);
    box-shadow:0 6px 14px -8px rgba(120,95,55,.18);
    display:flex;align-items:center;justify-content:center;
  }
  .site-nav__inner{
    width:100%;max-width:480px;height:100%;
    display:flex;align-items:center;justify-content:space-around;
    padding:0 6px;
  }
  .nav-item{
    display:flex;flex-direction:column;align-items:center;gap:2px;
    font-family:"Klee One";font-size:10px;color:var(--ink-soft);
    text-decoration:none;
  }
  .nav-item.is-active{color:var(--apricot-deep);}
  .nav-item svg{width:19px;height:19px;}

  /* ===== decorative sky elements ===== */
  .deco-layer{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;}
  .cloud{position:absolute;background:#fff;border-radius:50%;opacity:.75;}
  .branch{position:absolute;z-index:1;pointer-events:none;}

  /* ===== shared section styling ===== */
  .section{position:relative;z-index:2;padding:26px 18px 6px;}
  .card{
    background:var(--paper);
    border-radius:26px;
    box-shadow:0 14px 30px -12px rgba(120,95,55,.18), 0 0 0 1px rgba(234,223,201,.7) inset;
    padding:22px 20px 26px;
    position:relative;
  }
  .sec-label{
    display:inline-flex;align-items:center;gap:6px;
    font-family:"Klee One";color:var(--apricot-deep);
    font-size:12px;letter-spacing:.14em;margin-bottom:4px;
  }
  .sec-title{
    font-family:"Zen Maru Gothic";font-weight:900;font-size:22px;
    margin:0 0 16px;display:flex;align-items:center;gap:8px;
  }
  .apricot-mark{width:20px;height:20px;flex:0 0 auto;}

  /* ===== hero ===== */
  .hero{padding:44px 18px 20px;text-align:center;position:relative;z-index:2;}
  .hero .eyebrow{
    font-family:"Klee One";background:var(--paper);display:inline-block;
    padding:6px 16px;border-radius:999px;font-size:12px;color:var(--apricot-deep);
    box-shadow:0 4px 10px rgba(120,95,55,.12);
  }
  .hero .char-stage{position:relative;width:280px;height:280px;margin:18px auto 6px;max-width:70vw;max-height:70vw;}
  .hero .char-glow{
    position:absolute;inset:8%;
    background:radial-gradient(circle,#fff 0%, rgba(255,255,255,0) 70%);
    border-radius:50%;
  }
  .hero img.char{
    position:relative;z-index:2;width:100%;height:100%;object-fit:contain;
    filter:drop-shadow(0 18px 20px rgba(120,95,55,.25));
  }
  .hero h1{
    font-family:"Zen Maru Gothic";font-weight:900;font-size:clamp(30px,8vw,40px);
    margin:6px 0 4px;letter-spacing:.02em;
  }
  .hero .name-sub{font-size:11px;color:var(--ink-soft);letter-spacing:.2em;margin-bottom:14px;}
  .hero .catch{
    font-family:"Zen Maru Gothic";font-weight:700;font-size:16px;color:var(--apricot-deep);
    margin:0 10px 10px;line-height:1.7;
  }
  .hero .desc{font-size:13px;color:var(--ink-soft);line-height:1.9;margin:0 12px 22px;}
  .scroll-cue{
    font-family:"Klee One";font-size:12px;color:var(--ink-soft);
    display:flex;flex-direction:column;align-items:center;gap:4px;
    animation:bob 2.2s ease-in-out infinite;
  }
  @keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(6px);}}

  /* ===== news ===== */
  .news-item{display:flex;gap:12px;align-items:flex-start;padding:14px 0;border-bottom:1px dashed var(--line);}
  .news-item:last-child{border-bottom:none;}
  .news-date{
    flex:0 0 auto;font-family:"Zen Maru Gothic";font-weight:700;font-size:11px;
    color:#fff;background:var(--apricot);border-radius:12px;padding:6px 8px;
    text-align:center;line-height:1.3;min-width:52px;
  }
  .news-date b{display:block;font-size:14px;}
  .news-tag{
    display:inline-block;font-size:10px;font-family:"Klee One";
    background:var(--blossom);color:var(--apricot-deep);border-radius:8px;
    padding:2px 8px;margin-bottom:4px;
  }
  .news-title{font-size:13px;line-height:1.6;color:var(--ink);}

  /* ===== profile ===== */
  .profile-top{display:flex;gap:14px;align-items:center;margin-bottom:16px;}
  .profile-top img{width:104px;height:104px;object-fit:contain;filter:drop-shadow(0 8px 10px rgba(120,95,55,.2));flex:0 0 auto;}
  .bubble{
    position:relative;background:var(--apricot-pale);border-radius:16px;
    padding:10px 12px;font-family:"Klee One";font-size:12.5px;line-height:1.7;color:var(--ink);
    flex:1;
  }
  .bubble:after{
    content:"";position:absolute;left:-8px;top:22px;border-width:8px 10px 8px 0;
    border-style:solid;border-color:transparent var(--apricot-pale) transparent transparent;
  }
  .profile-body{font-size:12.5px;line-height:1.9;color:var(--ink);margin:0 0 18px;}
  .prof-table{width:100%;border-collapse:collapse;font-size:12.5px;}
  .prof-table th{
    text-align:left;color:var(--apricot-deep);font-family:"Klee One";font-weight:600;
    width:76px;vertical-align:top;padding:8px 8px 8px 0;white-space:nowrap;
  }
  .prof-table td{padding:8px 0;color:var(--ink);line-height:1.7;border-top:1px dashed var(--line);}
  .prof-table tr:first-child td{border-top:none;}
  .prof-table tr:first-child th{padding-top:0;}

  /* ===== goods ===== */
  .goods-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
  .goods-card{
    background:var(--cream);border-radius:18px;padding:12px 10px 14px;text-align:center;
    box-shadow:0 6px 14px -8px rgba(120,95,55,.2);
  }
  .goods-thumb{
    width:100%;aspect-ratio:1/1;border-radius:14px;
    background:linear-gradient(160deg,var(--blossom),var(--apricot-pale));
    display:flex;align-items:center;justify-content:center;margin-bottom:8px;overflow:hidden;
  }
  .goods-thumb img{width:62%;object-fit:contain;filter:drop-shadow(0 6px 6px rgba(120,95,55,.18));}
  .goods-name{font-size:11.5px;font-weight:700;color:var(--ink);margin-bottom:2px;}
  .goods-price{font-size:10.5px;color:var(--ink-soft);margin-bottom:8px;}
  .btn-mini{
    display:inline-block;font-family:"Klee One";font-size:10.5px;color:#fff;
    background:var(--apricot-deep);padding:6px 12px;border-radius:999px;text-decoration:none;
  }
  .goods-more{
    display:flex;align-items:center;justify-content:center;gap:6px;
    margin-top:16px;padding:12px;border-radius:999px;border:1.4px solid var(--apricot);
    font-family:"Klee One";font-size:12.5px;color:var(--apricot-deep);text-decoration:none;
  }

  /* ===== download ===== */
  .dl-item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px dashed var(--line);}
  .dl-item:last-child{border-bottom:none;}
  .dl-icon{
    width:44px;height:44px;border-radius:12px;background:var(--blossom);
    display:flex;align-items:center;justify-content:center;flex:0 0 auto;
  }
  .dl-text{flex:1;}
  .dl-title{font-size:12.5px;font-weight:700;}
  .dl-sub{font-size:10.5px;color:var(--ink-soft);}
  .dl-btn{
    font-family:"Klee One";font-size:10.5px;color:var(--apricot-deep);
    border:1.4px solid var(--apricot);border-radius:999px;padding:6px 12px;
    white-space:nowrap;text-decoration:none;
  }

  /* ===== sns ===== */
  .sns-item{display:flex;align-items:center;gap:12px;padding:6px 0;}
  .sns-icon{
    width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    color:#fff;font-size:17px;flex:0 0 auto;
  }
  .sns-name{font-size:12.5px;font-weight:700;}
  .sns-handle{font-size:10.5px;color:var(--ink-soft);}
  .sns-follow{
    margin-left:auto;font-family:"Klee One";font-size:10.5px;color:#fff;
    background:var(--leaf-deep);padding:6px 12px;border-radius:999px;text-decoration:none;
  }

  /* ===== footer ===== */
  .footer{padding:30px 18px 46px;text-align:center;position:relative;z-index:2;}
  .footer-mark{width:34px;margin-bottom:10px;}
  .footer p{font-size:10.5px;color:var(--ink-soft);line-height:1.9;}

  /* ===== side decorations (very wide screens only) ===== */
  .side-deco{
    display:none;position:fixed;bottom:8vh;z-index:1;pointer-events:none;
    width:170px;opacity:.85;
  }
  .side-deco--left{left:3vw;}
  .side-deco--right{right:3vw;transform:scaleX(-1);}

  /* ============================================================
     RESPONSIVE — tablet
  ============================================================ */
  @media (min-width:700px){
    :root{--nav-h:68px;}
    .wrap{max-width:640px;}
    .site-nav__inner{max-width:640px;}
    .hero{padding:56px 24px 30px;}
    .hero .char-stage{width:300px;height:300px;max-width:300px;max-height:300px;}
    .hero h1{font-size:42px;}
    .hero .catch{font-size:17px;}
    .card{padding:28px 26px 32px;}
    .sec-title{font-size:24px;}
    .profile-top img{width:112px;height:112px;}
  }

  /* ============================================================
     RESPONSIVE — desktop
  ============================================================ */
  @media (min-width:1040px){
    :root{--nav-h:76px;}
    .wrap{max-width:900px;}
    .site-nav__inner{max-width:900px;padding:0 24px;}
    .nav-item{flex-direction:row;gap:6px;font-size:13px;}
    .nav-item svg{width:17px;height:17px;}

    .hero{padding:84px 40px 56px;text-align:left;}
    .hero .eyebrow{margin-left:0;}
    .hero-row{display:flex;align-items:center;gap:56px;}
    .hero-text{flex:1;min-width:0;}
    .hero .char-stage{width:340px;height:340px;max-width:340px;max-height:340px;margin:18px 0 0;}
    .hero h1{font-size:48px;}
    .hero .catch{font-size:20px;margin:0 0 14px;}
    .hero .desc{font-size:14.5px;margin:0 0 26px;max-width:440px;}
    .scroll-cue{align-items:flex-start;}

    .card{padding:36px 40px 42px;}
    .sec-title{font-size:27px;}
    .news-item{padding:18px 0;}
    .news-title{font-size:14px;}
    .profile-top img{width:126px;height:126px;}
    .bubble{font-size:13.5px;padding:12px 14px;}
    .profile-body{font-size:13.5px;}
    .prof-table{font-size:13.5px;}
    .goods-grid{gap:24px;}
    .goods-card{padding:18px 16px 20px;}
    .goods-name{font-size:13px;}
    .dl-item{padding:16px 0;}
  }

  @media (min-width:1360px){
    .side-deco{display:block;}
  }