.ks-article{
      --ks-ink:#303030;
      --ks-ink-soft:#5c5c5c;
      --ks-paper:#ffffff;
      --ks-paper-2:#fdf9f0;
      --ks-paper-3:#fdfaf3;
      --ks-sakura:#1f2f53;
      --ks-sakura-soft:#e2e6ee;
      --ks-sakura-tint:#eef1f6;
      --ks-matcha:#1f2f53;
      --ks-matcha-soft:#eef1f6;
      --ks-line:#e7e0d2;
      --ks-gold:#b58f19;

      color:var(--ks-ink);
      background:var(--ks-paper);
      font-family:"Hiragino Mincho ProN","Yu Mincho",YuMincho,"Noto Serif JP",serif;
      line-height:1.95;
      font-size:16.5px;
      letter-spacing:.02em;
      max-width:760px;
      margin-inline:auto;
      padding:8px 4px 40px;
      -webkit-font-smoothing:antialiased;
    }
    .ks-article *{box-sizing:border-box;}

    /* --- 記事ヘッダー（タイトル＋和のあしらい） --- */
    .ks-hero{
      text-align:center;
      padding:30px 20px 34px;
      margin:4px 0 36px;
      background:
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'><g fill='none' stroke='%23c8d0de' stroke-width='1'><circle cx='30' cy='30' r='14'/><circle cx='0' cy='0' r='14'/><circle cx='60' cy='0' r='14'/><circle cx='0' cy='60' r='14'/><circle cx='60' cy='60' r='14'/></g></svg>") 0 0/30px 30px,
        radial-gradient(circle at 50% -40%, var(--ks-sakura-tint), transparent 62%),
        var(--ks-paper-3);
      border:1px solid var(--ks-line);
      border-radius:14px;
      position:relative;
      overflow:hidden;
    }
    /* 和柄の上に白被膜を敷いて文字の可読性を確保 */
    .ks-hero::after{
      content:"";position:absolute;inset:0;
      background:radial-gradient(ellipse at center, rgba(255,253,249,.92) 38%, rgba(255,253,249,.55) 100%);
      pointer-events:none;
    }
    .ks-hero > *{position:relative;z-index:1;}
    .ks-hero__eyebrow{
      font-size:13px;letter-spacing:.22em;color:var(--ks-gold);
      font-weight:700;margin:0 0 14px;
    }
    .ks-hero__title{
      font-size:27px;font-weight:700;line-height:1.5;
      margin:0;color:var(--ks-ink);
    }
    .ks-hero__title .accent{color:var(--ks-sakura);}
    .ks-hero__rule{
      width:64px;height:0;margin:18px auto 0;
      border-top:2px solid var(--ks-sakura);
      position:relative;
    }
    .ks-hero__rule::before,.ks-hero__rule::after{
      content:"";position:absolute;top:-3px;width:6px;height:6px;
      border-radius:50%;background:var(--ks-sakura);
    }
    .ks-hero__rule::before{left:-10px;}
    .ks-hero__rule::after{right:-10px;}

    .ks-lead{
      font-size:17px;line-height:2.05;
      border-left:3px solid var(--ks-sakura);
      padding:2px 0 2px 18px;margin:0 0 40px;
    }
    .ks-lead p{margin:0 0 14px;}
    .ks-lead p:last-child{margin-bottom:0;}

    /* --- 見出し --- */
    .ks-article h2{
      font-size:23px;font-weight:700;line-height:1.55;color:var(--ks-ink);
      margin:56px 0 24px;padding:0 0 14px 16px;
      border-bottom:1px solid var(--ks-line);position:relative;
    }
    .ks-article h2::before{
      content:"";position:absolute;left:0;top:4px;bottom:14px;
      width:5px;border-radius:3px;
      background:linear-gradient(var(--ks-sakura),var(--ks-gold));
    }
    .ks-article h2::after{
      content:"";position:absolute;left:16px;bottom:-1px;
      width:84px;height:3px;background:var(--ks-sakura);
    }
    .ks-article h3{
      font-size:18.5px;font-weight:700;color:var(--ks-matcha);
      margin:34px 0 14px;
    }
    .ks-article p{margin:0 0 20px;}

    /* --- 目次 --- */
    .ks-toc{
      background:var(--ks-paper-2);border:1px solid var(--ks-line);
      border-radius:12px;padding:20px 30px 22px;margin:0 0 8px;
    }
    .ks-toc__head{
      font-size:13px;letter-spacing:.2em;color:var(--ks-gold);
      font-weight:700;margin:0 0 4px;text-align:center;
    }
    .ks-toc__title{
      font-size:19px;font-weight:700;margin:0 0 12px;
      text-align:center;color:var(--ks-ink);
    }
    .ks-toc ol{list-style:none;margin:0;padding:0;counter-reset:toc;}
    .ks-toc li{
      counter-increment:toc;
      display:flex;align-items:baseline;gap:12px;padding:6px 4px;
      font-size:14.5px;line-height:1.6;color:var(--ks-ink);
    }
    .ks-toc li + li{border-top:1px dashed var(--ks-line);}
    .ks-toc li::before{
      content:counter(toc,decimal-leading-zero);
      font-size:12px;color:var(--ks-sakura);font-weight:700;
      flex:0 0 auto;min-width:22px;
    }
    .ks-toc li a{color:inherit;text-decoration:none;}
    .ks-toc li a:hover{color:var(--ks-sakura);}

    /* --- 囲みカード --- */
    .ks-card{
      background:var(--ks-paper-2);border:1px solid var(--ks-line);
      border-radius:12px;padding:24px 26px;margin:28px 0;
      position:relative;overflow:hidden;
    }
    /* 右上に桜散らしを淡く一角だけ */
    .ks-card::before{
      content:"";position:absolute;right:0;top:0;width:160px;height:160px;
      background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'><g fill='%23dde2ec'><path d='M22 8c2 3.5 1.2 6-1.6 7.6 4-.4 7.4-1.8 9.4-5 .2 4-1.6 6.6-5.4 7.6 4 .8 7.2-.2 10-3-.8 4-3.2 6-7.2 6.4 3.6 1.6 6.8 1.4 10-1-2 3.6-4.8 5-8.8 4.6'/><circle cx='22' cy='22' r='2.6' fill='%23b58f19'/></g></svg>") 0 0/44px 44px;
      -webkit-mask:radial-gradient(circle at top right, #000, transparent 72%);
      mask:radial-gradient(circle at top right, #000, transparent 72%);
      opacity:.7;pointer-events:none;
    }
    .ks-card > *{position:relative;z-index:1;}
    .ks-card p:last-child{margin-bottom:0;}

    /* --- ポイント見出し付き囲み --- */
    .ks-note{
      position:relative;background:var(--ks-matcha-soft);
      border:1px solid #cfe0d4;border-radius:12px;
      padding:22px 24px 22px;margin:26px 0;
    }
    .ks-note__label{
      display:inline-block;font-size:13px;font-weight:700;
      letter-spacing:.08em;color:#fff;background:var(--ks-matcha);
      padding:3px 14px;border-radius:999px;margin:0 0 12px;
    }
    .ks-note p:last-child{margin-bottom:0;}

    /* --- 比較表 --- */
    .ks-tablewrap{margin:24px 0;overflow-x:auto;}
    .ks-table{
      width:100%;border-collapse:separate;border-spacing:0;
      font-size:15.5px;min-width:440px;
      border:1px solid var(--ks-line);border-radius:12px;overflow:hidden;
    }
    .ks-table caption{
      caption-side:top;text-align:left;font-weight:700;
      color:var(--ks-ink);font-size:16px;margin:0 0 10px;padding-left:2px;
    }
    .ks-table th,.ks-table td{
      padding:14px 16px;text-align:left;vertical-align:top;
      border-bottom:1px solid var(--ks-line);line-height:1.8;
    }
    .ks-table thead th{
      background:var(--ks-sakura);color:#fff;font-weight:700;
      border-bottom:none;font-size:15.5px;
    }
    .ks-table thead th:first-child{background:#162338;}
    .ks-table tbody th{
      background:var(--ks-paper-2);color:var(--ks-matcha);
      font-weight:700;white-space:nowrap;width:128px;
    }
    .ks-table tbody tr:last-child th,
    .ks-table tbody tr:last-child td{border-bottom:none;}
    .ks-table tbody td:nth-child(2){background:#fff;}
    .ks-table tbody td:nth-child(3){background:var(--ks-sakura-tint);}

    /* --- 三種カード（創作生かるかん） --- */
    .ks-variants{
      display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0;
    }
    .ks-variant{
      background:var(--ks-paper-3);border:1px solid var(--ks-line);
      border-top:4px solid var(--ks-sakura);border-radius:10px;
      padding:20px 16px;text-align:center;
    }
    .ks-variant:nth-child(2){border-top-color:var(--ks-gold);}
    .ks-variant:nth-child(3){border-top-color:var(--ks-matcha);}
    .ks-variant__name{font-size:17px;font-weight:700;margin:0 0 4px;color:var(--ks-ink);}
    .ks-variant__sub{font-size:13px;color:var(--ks-ink-soft);margin:0;}

    /* --- 選び方3ポイント --- */
    .ks-points{list-style:none;margin:24px 0;padding:0;counter-reset:pt;}
    .ks-points li{
      counter-increment:pt;position:relative;
      background:var(--ks-paper-3);border:1px solid var(--ks-line);
      border-radius:10px;padding:18px 20px 18px 66px;margin:0 0 12px;
    }
    .ks-points li::before{
      content:counter(pt);position:absolute;left:18px;top:18px;
      width:34px;height:34px;border-radius:50%;
      background:var(--ks-sakura);color:#fff;
      font-family:Georgia,serif;font-weight:700;font-size:17px;
      display:flex;align-items:center;justify-content:center;
    }
    .ks-points b{display:block;color:var(--ks-matcha);font-size:16px;margin:0 0 4px;}
    .ks-points p{margin:0;font-size:15px;color:var(--ks-ink-soft);line-height:1.85;}

    /* --- ペアリング表（合う飲み物） --- */
    .ks-pair{
      width:100%;border-collapse:separate;border-spacing:0;margin:22px 0;
      font-size:15.5px;border:1px solid var(--ks-line);border-radius:12px;overflow:hidden;
    }
    .ks-pair th,.ks-pair td{padding:13px 16px;border-bottom:1px solid var(--ks-line);text-align:left;line-height:1.8;}
    .ks-pair thead th{background:var(--ks-matcha);color:#fff;}
    .ks-pair tbody th{background:var(--ks-paper-2);color:var(--ks-matcha);white-space:nowrap;width:150px;font-weight:700;}
    .ks-pair tbody tr:last-child th,.ks-pair tbody tr:last-child td{border-bottom:none;}

    /* --- FAQ --- */
    .ks-faq{margin:8px 0 0;}
    .ks-faq__item{
      border:1px solid var(--ks-line);border-radius:10px;margin:0 0 14px;
      overflow:hidden;background:var(--ks-paper);
    }
    .ks-faq__q{
      margin:0;padding:18px 24px 10px 54px;
      position:relative;font-weight:700;font-size:16.5px;color:var(--ks-ink);
    }
    .ks-faq__q::before{
      content:"Q";position:absolute;left:20px;top:16px;
      width:26px;height:26px;border-radius:50%;background:var(--ks-sakura);color:#fff;
      font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;
      font-family:Georgia,serif;
    }
    .ks-faq__body{padding:4px 24px 22px 54px;color:var(--ks-ink-soft);line-height:1.95;}
    .ks-faq__body p{margin:0;}

    /* --- CTA --- */
    .ks-cta{
      margin:56px 0 0;
      background:
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'><g fill='none' stroke='%23c8d0de' stroke-width='1'><circle cx='30' cy='30' r='14'/><circle cx='0' cy='0' r='14'/><circle cx='60' cy='0' r='14'/><circle cx='0' cy='60' r='14'/><circle cx='60' cy='60' r='14'/></g></svg>") 0 0/30px 30px,
        radial-gradient(circle at 50% 0%, var(--ks-sakura-tint), transparent 60%),
        linear-gradient(180deg,#fff 0%,var(--ks-sakura-soft) 100%);
      border:1px solid var(--ks-line);border-radius:16px;
      padding:42px 32px 38px;text-align:center;position:relative;overflow:hidden;
    }
    .ks-cta::after{
      content:"";position:absolute;inset:0;
      background:radial-gradient(ellipse at center, rgba(255,255,255,.82) 30%, rgba(255,255,255,.4) 100%);
      pointer-events:none;
    }
    .ks-cta > *{position:relative;z-index:1;}
    .ks-cta__eyebrow{font-size:13px;letter-spacing:.18em;color:var(--ks-sakura);font-weight:700;margin:0 0 10px;}
    .ks-cta__title{font-size:23px;font-weight:700;line-height:1.6;margin:0 0 12px;color:var(--ks-ink);}
    .ks-cta__text{font-size:15.5px;color:var(--ks-ink-soft);margin:0 auto 26px;max-width:540px;}
    .ks-cta__buttons{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;}
    .ks-btn{
      display:inline-flex;align-items:center;gap:8px;padding:15px 30px;border-radius:999px;
      font-size:15.5px;font-weight:700;text-decoration:none;
      transition:transform .15s ease,box-shadow .15s ease;
      font-family:"Hiragino Mincho ProN","Yu Mincho",serif;
    }
    .ks-btn--primary{background:var(--ks-sakura);color:#fff;box-shadow:0 4px 14px rgba(31,47,83,.28);}
    .ks-btn--secondary{background:#fff;color:var(--ks-matcha);border:1.5px solid var(--ks-matcha);}
    .ks-btn:hover{transform:translateY(-2px);}
    .ks-btn--primary:hover{box-shadow:0 6px 20px rgba(31,47,83,.4);}
    .ks-btn::after{content:"→";font-size:15px;}
    .ks-cta__lineup{
      list-style:none;margin:26px 0 0;padding:24px 0 0;border-top:1px solid var(--ks-line);
      display:flex;flex-wrap:wrap;gap:10px 18px;justify-content:center;font-size:14.5px;
    }
    .ks-cta__lineup a{color:var(--ks-matcha);text-decoration:none;font-weight:700;}
    .ks-cta__lineup a:hover{color:var(--ks-sakura);text-decoration:underline;}

    @media (max-width:600px){
      .ks-article{font-size:16px;padding:8px 14px 32px;}
      .ks-hero__title{font-size:21px;}
      .ks-article h2{font-size:20px;}
      .ks-toc,.ks-cta{padding-left:20px;padding-right:20px;}
      .ks-variants{grid-template-columns:1fr;}
      .ks-faq__q{padding:16px 18px 8px 50px;}
      .ks-faq__body{padding-left:50px;padding-right:18px;}
      .ks-btn{width:100%;justify-content:center;}
    }
    @media (prefers-reduced-motion:reduce){.ks-article *{transition:none !important;}}