/* =============================================================
   わんこ着せ替え（kisekae.html）だけの見た目
   ・ほかのページと共通の見た目は style.css。前の5ページの CSS（fitting-3d・fitting-page・
     measure・nametag・style-lab）も、そのまま読んで使っています。ここは足りない分だけ。
   ============================================================= */

.page-kisekae .kz-head{padding-bottom:clamp(16px,2.4vw,28px);}

/* ---- 最初の3択 ---- */
.kz-start{padding-top:clamp(18px,2.6vw,30px);}
.kz-start .h-md{margin:0;}
.kz-start-lead{font-size:.8125rem;color:var(--ink-mid);letter-spacing:.06em;margin:.6em 0 clamp(18px,2.4vw,28px);}
.kz-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,2vw,24px);}
/* 2026-11-08 入口は2択（生地・柄から／体格から）。カードが横に広がりすぎないよう幅をしぼる */
.kz-modes-2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:980px;}
.kz-mode{
  display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;
  background:var(--paper-2);border:1px solid var(--line);padding:0 0 18px;cursor:pointer;
  color:var(--ink);font:inherit;min-width:0;overflow:hidden;
  transition:border-color .25s,transform .25s,box-shadow .25s;
}
/* 写真は枠の比率を決めて切り抜く（どの画面でも高さが暴れないように） */
.kz-mode-im{display:block;width:100%;aspect-ratio:4/3;overflow:hidden;background:var(--paper-3);margin-bottom:10px;}
.kz-mode-im img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 55%;transition:transform .5s;}
.kz-mode .no{font-family:var(--latin);font-style:italic;color:var(--accent);font-size:1.15rem;padding:0 18px;}
.kz-mode b{font-family:var(--serif);font-weight:500;font-size:clamp(1.05rem,1.6vw,1.25rem);letter-spacing:.12em;padding:0 18px;}
.kz-mode>span:last-child{font-size:.8125rem;line-height:1.9;color:var(--ink-mid);padding:0 18px;}
.kz-mode[aria-pressed="true"]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);}
.kz-mode:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
@media(hover:hover){
  .kz-mode:hover{border-color:var(--accent);transform:translateY(-3px);}
  .kz-mode:hover .kz-mode-im img{transform:scale(1.03);}
}

/* ---- 手順のバー ---- */
.kz-studio{padding-top:clamp(10px,1.6vw,18px);}
.kz-bar{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;flex-wrap:wrap;
  border-bottom:1px solid var(--line);margin-bottom:clamp(16px,2.4vw,26px);}
.kz-steps{display:flex;flex-wrap:wrap;gap:0 4px;list-style:none;margin:0;padding:0;}
.kz-steps button{
  border:0;border-bottom:2px solid transparent;background:transparent;color:var(--ink-mid);
  font:inherit;font-size:.875rem;letter-spacing:.08em;padding:12px 10px 10px;cursor:pointer;margin-bottom:-1px;
}
.kz-steps button span{font-family:var(--latin);font-style:italic;margin-right:6px;color:var(--ink-soft);}
.kz-steps button[aria-current="step"]{color:var(--accent);border-color:var(--accent);}
.kz-steps button[aria-current="step"] span{color:var(--accent);}
.kz-change{background:transparent;border:0;border-bottom:1px solid var(--ink-soft);font:inherit;font-size:.75rem;padding:6px 0;cursor:pointer;color:var(--ink-mid);}

/* ---- 3Dの下：選んでいるもの・概算 ---- */
.kz-selection{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 16px;}
.kz-live{margin:0;font-size:.75rem;letter-spacing:.06em;white-space:nowrap;}
.kz-live b{font-family:var(--latin);font-size:1.35rem;font-weight:500;color:var(--accent);margin:0 4px;font-variant-numeric:tabular-nums;}
.kz-live small{font-size:.6875rem;color:var(--ink-mid);}
.kz-live[hidden]{display:none;}
.kz-help{margin:.8em 0 0;}

/* ---- 右の中身 ---- */
.kz-panels{min-width:0;}
.kz-panel[hidden]{display:none!important;}
.kz-sub{display:flex;gap:0;margin:0 0 18px;border:1px solid var(--line);width:max-content;max-width:100%;}
.kz-sub button{border:0;background:transparent;font:inherit;font-size:.8125rem;letter-spacing:.1em;padding:10px 18px;cursor:pointer;color:var(--ink-mid);}
.kz-sub button[aria-selected="true"]{background:var(--ink);color:var(--paper);}
.kz-lead{font-size:.8125rem;line-height:1.9;color:var(--ink-mid);margin:-.2em 0 1em;}
.kz-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.kz-empty{font-size:.8125rem;color:var(--ink-mid);margin:.6em 0;}

/* 生地をしぼる */
.kz-find{margin:0 0 14px;}
.kz-find[hidden]{display:none;}
.kz-find input{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--line);background:var(--paper);font:inherit;font-size:.875rem;}
.kz-colors{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;}
.kz-color{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--paper);font:inherit;font-size:.6875rem;padding:5px 9px;cursor:pointer;color:var(--ink-mid);}
.kz-color i{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.12);}
.kz-color[aria-pressed="true"]{border-color:var(--accent);color:var(--accent);background:var(--blush);}
.page-kisekae .co-tabs{flex-wrap:wrap;}

/* 選んだ生地 */
.kz-picked{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;margin:16px 0 0;padding:12px;background:var(--paper-2);border:1px solid var(--line);}
.kz-picked[hidden]{display:none;}
.kz-picked-im{width:64px;height:64px;background-size:96px;background-repeat:repeat;border:1px solid var(--line);}
.kz-picked-name{margin:0;font-size:.875rem;}
.kz-picked-note{margin:.2em 0 0;font-size:.75rem;line-height:1.8;color:var(--ink-mid);}
.kz-fav[aria-pressed="true"]{background:var(--blush);border-color:var(--accent);color:var(--accent-deep);}
.kz-fav[hidden]{display:none;}

.kz-works{margin-top:22px;}
.kz-works-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;}
.kz-works-grid figure{margin:0;}
.kz-works-grid img{display:block;width:100%;aspect-ratio:1;object-fit:cover;}
.kz-works-grid figcaption{font-size:.625rem;color:var(--ink-soft);margin-top:2px;}
.kz-links{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:18px;}
.kz-head .kz-links{margin:22px 0 0;}

/* 雰囲気から */
.page-kisekae .lab-tastes-box{margin-bottom:24px;}
.page-kisekae .lab-disclaimer{font-size:.6875rem;line-height:1.8;color:var(--ink-soft);margin:12px 0 0;}

/* 体格・仕立て（前のお見積りページの見た目を、右の欄の幅に合わせる） */
.page-kisekae #calc .q:first-child{padding-top:0;}
.page-kisekae #calc .measure-guide{grid-template-columns:1fr;}
.kz-breed select{width:100%;max-width:420px;padding:10px 12px;border:1px solid var(--line);background:var(--paper);font:inherit;}
.kz-breed-note{margin-top:.8em;}
.kz-auto{display:flex;align-items:center;gap:8px;font-size:.8125rem;margin:.2em 0 .6em;cursor:pointer;}
.kz-auto-note{margin:0 0 .8em;color:var(--accent-deep);}
.kz-auto-note:empty{display:none;}

/* ネームタグ */
.kz-tag-intro{display:grid;grid-template-columns:140px 1fr;gap:16px;align-items:center;margin-bottom:16px;}
.kz-tag-intro img{display:block;width:100%;height:auto;}
.kz-tag-intro .txt{margin:0;font-size:.8125rem;line-height:2;}
.kz-tag-on{display:inline-flex;margin:0 0 18px;}
.kz-nt{margin:0 0 clamp(22px,3vw,34px);}
.page-kisekae .nt-pick{margin-top:8px;}

/* お見積り */
.kz-prices{margin-top:28px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.kz-prices>summary{cursor:pointer;font-size:.875rem;padding:16px 0;letter-spacing:.08em;}
.kz-prices>div{padding-bottom:20px;}
.kz-summary{margin-top:28px;}
.kz-h3{font-family:var(--serif);font-size:.95rem;letter-spacing:.14em;margin:0 0 .9em;font-weight:500;}
.kz-sum{display:grid;grid-template-columns:max-content 1fr;gap:10px 18px;margin:0 0 16px;font-size:.8125rem;line-height:1.9;
  background:var(--paper-2);padding:16px 18px;}
.kz-sum dt{color:var(--ink-mid);}
.kz-sum dd{margin:0;min-width:0;overflow-wrap:anywhere;}
.kz-sum .yet{color:var(--ink-soft);}

.kz-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:28px;padding-top:20px;border-top:1px solid var(--line);}
.kz-nav #kzNextStep{margin-left:auto;}
.kz-nav [hidden]{display:none;}

.kz-saved{margin-top:clamp(30px,4vw,44px);}
.kz-tip{margin-top:clamp(26px,3.4vw,38px);}

/* ---- 生地から（assets/kisekae-fabric.js） ---- */
.kzf .kz-find{margin:0 0 18px;}
.kzf-genres{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 10px;}
.kzf-genre{display:flex;align-items:center;gap:10px;text-align:left;min-width:0;padding:8px;border:1px solid var(--line);
  background:var(--paper);font:inherit;color:var(--ink);cursor:pointer;transition:border-color .2s,background .2s;}
.kzf-genre .mini{flex:0 0 auto;display:grid;grid-template-columns:1fr 1fr;width:44px;height:44px;gap:1px;}
.kzf-genre .mini i{display:block;background-size:cover;background-position:center;background-color:var(--paper-3);}
.kzf-genre .nm{min-width:0;font-size:.8125rem;line-height:1.5;letter-spacing:.04em;overflow-wrap:anywhere;}
.kzf-genre .nm small{display:block;font-size:.6875rem;color:var(--ink-soft);letter-spacing:.06em;}
.kzf-genre[aria-pressed="true"]{border-color:var(--accent);background:var(--blush);}
.kzf-genre:focus-visible{outline:2px solid var(--accent);outline-offset:1px;}
@media(hover:hover){.kzf-genre:hover{border-color:var(--accent);}}
/* 種類を開いたら、入口は横に流れる1列に縮める（行き来はできるまま） */
.kzf-genres.is-compact{display:flex;overflow-x:auto;scrollbar-width:thin;padding-bottom:6px;gap:6px;}
.kzf-genres.is-compact .kzf-genre{flex:0 0 auto;padding:5px 10px 5px 5px;gap:8px;}
.kzf-genres.is-compact .mini{width:30px;height:30px;}
.kzf-genres.is-compact .nm{white-space:nowrap;font-size:.75rem;}
.kzf-genres.is-compact .nm small{display:inline;margin-left:4px;}
.kzf-hint[hidden],.kzf-list[hidden]{display:none;}
.kzf-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px 16px;flex-wrap:wrap;margin:12px 0 8px;}
.kzf-back{border:0;border-bottom:1px solid var(--ink-soft);background:transparent;font:inherit;font-size:.75rem;padding:4px 0;cursor:pointer;color:var(--ink-mid);}
.kzf-title{margin:0;font-size:.875rem;letter-spacing:.08em;}
.kzf-title small{margin-left:8px;font-size:.75rem;color:var(--ink-soft);}
.kzf-breed{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px;padding:8px 12px;
  background:var(--blush);font-size:.75rem;line-height:1.8;}
.kzf-breed[hidden]{display:none;}
.kzf-breed button{flex:0 0 auto;border:1px solid var(--accent);background:var(--paper);color:var(--accent-deep);font:inherit;font-size:.75rem;padding:4px 10px;cursor:pointer;}
.kzf-filters{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:0 0 12px;}
.kzf-filters[hidden]{display:none;}
.kzf-filters>summary{cursor:pointer;font-size:.8125rem;padding:10px 0;letter-spacing:.06em;}
.kzf-filters>summary span{color:var(--accent);margin-left:4px;}
.kzf-row{display:grid;grid-template-columns:5.5em 1fr;gap:8px;align-items:start;margin:0 0 10px;}
.kzf-row[hidden]{display:none;}
.kzf-row .lb{font-size:.75rem;color:var(--ink-mid);padding-top:5px;}
.kzf-row .kz-colors{margin:0;}
.kzf-chips{display:flex;flex-wrap:wrap;gap:6px;}
.kzf-chip{border:1px solid var(--line);background:var(--paper);font:inherit;font-size:.75rem;padding:5px 12px;cursor:pointer;color:var(--ink-mid);}
.kzf-chip[aria-pressed="true"]{border-color:var(--accent);color:var(--accent);background:var(--blush);}
/* 2026-11-10 UX-02：未登録の生地も含める（既定は含める）と、その件数 */
.kzf-untag{display:flex;align-items:flex-start;gap:8px;font-size:.75rem;color:var(--ink-mid);line-height:1.6;margin:2px 0 12px;cursor:pointer;}
.kzf-untag input{margin:3px 0 0;accent-color:var(--accent);flex:0 0 auto;}
.kzf-untag-note{font-size:.75rem;color:var(--ink-mid);line-height:1.7;margin:-4px 0 12px;}
.kzf-untag-note[hidden]{display:none;}
.kzf-clear{border:0;border-bottom:1px solid var(--ink-soft);background:transparent;font:inherit;font-size:.6875rem;padding:2px 0;margin:0 0 12px;cursor:pointer;color:var(--ink-mid);}
.kzf-more{display:block;width:100%;margin-top:10px;}
.kzf-more[hidden]{display:none;}
.page-kisekae .kzf .co-sw{position:relative;}
.kzf-fav-mark{position:absolute;left:4px;top:4px;background:var(--accent);color:var(--paper);font-size:.5625rem;letter-spacing:.06em;padding:2px 5px;line-height:1.4;}
/* 選んだ生地は、大きめの見本と札で */
.kz-picked{grid-template-columns:96px 1fr;align-items:start;}
.kz-picked-im{width:96px;height:96px;background-size:cover;background-position:center;}
.kz-picked .kz-fav{grid-column:1/-1;justify-self:stretch;padding:12px;font-size:.875rem;}
.kz-picked-tags{display:flex;flex-wrap:wrap;gap:4px;margin:.4em 0 0;}
.kz-picked-tags span{font-size:.6875rem;border:1px solid var(--line);padding:1px 7px;color:var(--ink-mid);background:var(--paper);}
.kz-picked-tags:empty,.kz-picked-note:empty{display:none;}

/* ---- スマホ ---- */
@media(max-width:900px){
  /* 生地から：入口は横に流れる2段にして、3Dを押し流さない */
  .kzf-genres{display:grid;grid-auto-flow:column;grid-template-rows:repeat(2,auto);grid-auto-columns:minmax(150px,46%);
    grid-template-columns:none;overflow-x:auto;padding-bottom:6px;}
  .kzf-genres.is-compact{display:flex;}
  .kz-picked{grid-template-columns:72px 1fr;}
  .kz-picked-im{width:72px;height:72px;}
  .page-kisekae .kzf .co-grid{max-height:44svh;overflow-y:auto;}
  /* 3択は、写真を左・言葉を右にした横長のカードを縦に並べる */
  .kz-modes{grid-template-columns:1fr;gap:10px;}
  .kz-mode{display:grid;grid-template-columns:38% 1fr;grid-template-rows:auto auto 1fr;column-gap:14px;row-gap:2px;padding:0;align-items:start;}
  .kz-mode-im{grid-row:1/4;aspect-ratio:1/1;height:100%;margin:0;}
  .kz-mode .no,.kz-mode b,.kz-mode>span:last-child{padding:0 12px 0 0;}
  .kz-mode .no{padding-top:12px;font-size:1rem;}
  .kz-mode b{font-size:1rem;letter-spacing:.08em;}
  .kz-mode>span:last-child{font-size:.75rem;line-height:1.75;padding-bottom:12px;}

  .kz-steps{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;width:100%;}
  .kz-steps::-webkit-scrollbar{display:none;}
  .kz-steps button{white-space:nowrap;padding:10px 8px 8px;font-size:.8125rem;}
  .kz-change{margin-bottom:8px;}

  /* 体格・ネームタグ・お見積りは長いので、3Dを上に貼りつけない */
  .kz-compact .co-sticky{position:static;box-shadow:none;}
  .kz-compact #fitting3d{height:min(34svh,280px);}
  .kz-help{display:none;}
  /* 右下の「ページの上へ」の丸いボタン（約60px）と重ならないよう、右を空ける */
  .kz-nav{position:sticky;bottom:0;background:var(--paper);padding:10px 68px 10px 0;z-index:40;margin-top:18px;}
  .kz-nav .btn{padding:12px 18px;font-size:.8125rem;}
  .kz-tag-intro{grid-template-columns:96px 1fr;gap:12px;}
  .kz-sum{grid-template-columns:1fr;gap:2px;}
  .kz-sum dd{margin-bottom:8px;}

  /* 2026-11-10 UX-01：着せ替え（1）で上に貼りつく3Dが高さの4割を取り、生地の升目が画面に入りきらず、
     上の段や「色・柄の大きさ・季節でしぼる」がいつも3Dの下に半分隠れていた。
     ・背景／地面の切り替えと「向きを戻す」を3Dの上に重ねて、別の段を取らない
     ・3Dの高さを --kz-mv に決め、升目はその残りに入りきる高さにする
     ・前の段にもどる・柄の種類を選ぶ、で上へ送るときは、3Dの下に止める（scroll-margin） */
  .page-kisekae .co:not(.kz-compact){--kz-mv:clamp(140px,25svh,210px);}
  .page-kisekae .co:not(.kz-compact) .co-sticky{padding:6px 0 4px;}
  .page-kisekae .co:not(.kz-compact) #fitting3d model-viewer{height:var(--kz-mv);min-height:0;max-height:none;}
  /* 重ねるのは、3D（model-viewer）が入ってから。読み込み前・読み込めなかったときは、いままでどおり縦に並べる */
  .page-kisekae .co:not(.kz-compact) .kz-3d:has(#fitting3d model-viewer){position:relative;}
  .page-kisekae .co:not(.kz-compact) .kz-3d:has(#fitting3d model-viewer) .fitting-scene-controls{
    position:absolute;top:6px;left:6px;right:6px;z-index:2;margin:0;
    display:flex;gap:6px;pointer-events:none;
  }
  .page-kisekae .co:not(.kz-compact) .kz-3d:has(#fitting3d model-viewer) .fitting-scene-controls button{
    pointer-events:auto;min-height:34px;padding:4px 8px;gap:5px;background:var(--paper);font-size:11px;
  }
  .page-kisekae .co:not(.kz-compact) .kz-3d:has(#fitting3d model-viewer) .fitting-scene-controls button>span:first-child{font-size:10px;}
  .page-kisekae .co:not(.kz-compact) #fitting3d:has(model-viewer) .fitting-3d-tools{
    position:absolute;right:6px;top:calc(var(--kz-mv) - 40px);z-index:2;min-height:0;padding:0;
  }
  .page-kisekae .co:not(.kz-compact) #fitting3d:has(model-viewer) .fitting-3d-tools>span{display:none;}
  .page-kisekae .co:not(.kz-compact) #fitting3d:has(model-viewer) .fitting-3d-tools button{
    min-height:34px;padding:4px 10px;border:1px solid var(--line);background:var(--paper);font-size:11px;
  }
  .page-kisekae .co:not(.kz-compact) .fitting-3d-note{margin:4px 0 0;}
  .page-kisekae .co:not(.kz-compact) .kzf .co-grid{
    max-height:max(150px,calc(100svh - var(--navh) - var(--kz-mv) - 190px));
  }
  /* 升目の中のカードには付けない（升目の中のスクロールまで、この余白でずれるため） */
  .page-kisekae .co:not(.kz-compact) .kz-panel :is(.kz-sec-h,.kzf-genres,.kzf-list,.kzf-head,.kzf-filters,.co-tabnote,.kz-picked,.lab-ai){
    scroll-margin-top:calc(var(--navh) + var(--kz-mv) + 80px);scroll-margin-bottom:84px;
  }
}
@media(max-width:380px){
  .kz-mode{grid-template-columns:34% 1fr;}
}
@media(prefers-reduced-motion:reduce){
  .kz-mode,.kz-mode-im img{transition:none;}
}

/* 体格・仕立てを開いているあいだは、左の3Dを出さず、欄を横いっぱいに（2026-11-08） */
.co.kz-no3d{display:block;}
.co.kz-no3d>div:first-child{display:none;}
.co.kz-no3d .kz-panels{max-width:880px;margin:0 auto;}
/* 雰囲気から（生地・柄からにまとめた）の欄は出さない */
.kz-retired{display:none !important;}
/* AIの着用イメージは、生地の欄の下に区切って置く */
#kzPanelFabric .lab-ai{margin-top:clamp(28px,4vw,44px);padding-top:clamp(22px,3vw,32px);border-top:1px solid var(--line);}

/* 2026-11-08 生地の欄の見出し（柄の種類から選ぶ／AIで、着ているところを見る）は、区切りのはっきりした太字の見出しにする */
.kz-sec-h{font-family:var(--serif);font-weight:700;font-size:clamp(1.05rem,1.4vw,1.2rem);letter-spacing:.12em;line-height:1.6;
  margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--line);}
/* 「全部この生地に」などは、見出しのすぐ下 */
.kz-actions-top{margin:0 0 16px;}
.kz-actions-top .kz-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:0;}
/* AIは、ひとふた アカウント（無料）の方だけ、の説明 */
.kz-ai-acct{border:1px solid var(--accent);background:var(--blush);padding:14px 16px;margin:0 0 14px;}
.kz-ai-acct p{margin:0;font-size:.8125rem;line-height:1.9;letter-spacing:.04em;}
.kz-ai-acct .kz-ai-acct-h{font-weight:700;color:var(--accent);margin-bottom:4px;}

/* AIは「犬種と毛の色で作る」「うちの子の写真で作る」のどちらかを選ぶ（2026-11-08） */
.kz-ai-how{border:0;padding:0;margin:0 0 12px;display:flex;flex-wrap:wrap;gap:8px 18px;}
.kz-ai-how legend{font-size:.8125rem;letter-spacing:.08em;margin-bottom:6px;padding:0;}
.kz-ai-how label{display:inline-flex;align-items:center;gap:6px;font-size:.875rem;cursor:pointer;}
#labPhotoBox{margin:0 0 12px;}
/* 生地・柄からのお見積りは、概算の代わりに案内（体格を測らないため） */
/* 体格からは着せ替えを選ばないので、切替を着せ替えから自動で選ぶ仕組みは使わない（手で選ぶ。前のお見積りページと同じ） */
.kz-auto,.kz-auto-note{display:none !important;}
/* .lab-fields などの display 指定より、hidden を優先する */
#labHowBreed[hidden],#labPhotoBox[hidden],#labHowPhoto[hidden]{display:none !important;}

/* 2026-11-08 種類を選んだら、カードの場所に生地を並べる。戻るボタンははっきり見せる */
.kzf-genres[hidden]{display:none!important;}
.kzf-list .kzf-head{margin-top:0;align-items:center;}
.kzf-back{border:1px solid var(--accent)!important;background:var(--blush)!important;color:var(--accent)!important;
  font-size:.875rem!important;padding:10px 16px!important;letter-spacing:.06em;font-weight:700;}
.kzf-back:hover{background:#fff!important;}
.kzf-list .kzf-title{font-size:1rem;}
#labMembers{display:none!important;}

/* 2026-11-08 1本道：3 の中で体格を入れると左の3Dの大きさが変わる。最後に見積もり＋アトリエ訪問のチェック */
.kz-size-note{margin:6px 0 0;font-size:.75rem;color:var(--accent);letter-spacing:.04em;}
.kz-size-note[hidden]{display:none;}
.kz-visit{display:flex;gap:12px;align-items:flex-start;margin:22px 0 14px;padding:16px 18px;border:2px solid var(--accent);background:var(--blush);cursor:pointer;}
.kz-visit input{width:22px;height:22px;margin:2px 0 0;flex:0 0 auto;accent-color:var(--accent);}
.kz-visit b{display:block;font-size:.9375rem;letter-spacing:.06em;color:var(--accent-deep,var(--accent));}
.kz-visit small{display:block;margin-top:4px;font-size:.75rem;line-height:1.8;color:var(--ink-mid);}

/* 2026-11-08 AIの欄：ログイン中の表示 */
.kz-ai-in[hidden]{display:none;}
.kz-ai-in{margin:10px 0 0!important;font-weight:700;color:var(--accent);}

/* 2026-11-08 ネームタグの写真をタップで拡大 */
.kz-tag-zoom{position:relative;display:block;padding:0;border:0;background:none;cursor:zoom-in;}
.kz-tag-zoom img{display:block;width:100%;height:auto;}
.kz-tag-zoom-hint{position:absolute;right:0;bottom:0;background:rgba(70,60,52,.78);color:#fff;font-size:.6875rem;letter-spacing:.06em;padding:2px 6px;}
.kz-zoom{padding:0;border:0;background:var(--paper);max-width:min(92vw,563px);width:100%;}
.kz-zoom::backdrop{background:rgba(70,60,52,.7);}
.kz-zoom img{display:block;width:100%;height:auto;}
.kz-zoom-close{display:block;width:100%;padding:12px;border:0;border-top:1px solid var(--line,#d9cfc2);background:var(--paper);font:inherit;font-size:.875rem;letter-spacing:.1em;cursor:pointer;color:var(--ink);}

/* 2026-11-08 胴回り「わからない」 */
.kz-unknown{display:inline-flex;align-items:center;gap:8px;margin:10px 0 4px;font-size:.875rem;letter-spacing:.06em;cursor:pointer;}
.kz-unknown input{width:18px;height:18px;margin:0;accent-color:var(--accent);}

/* 2026-11-08 AIのログインのポップアップ */
.kz-login{padding:0;border:1px solid var(--line,#d9cfc2);background:var(--paper);width:min(94vw,520px);max-height:92vh;}
.kz-login::backdrop{background:rgba(70,60,52,.7);}
.kz-login[open]{display:flex;flex-direction:column;}
.kz-login-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line,#d9cfc2);}
.kz-login-h p{margin:0;font-family:var(--serif);font-size:1rem;letter-spacing:.1em;}
.kz-login-x{border:0;background:none;font:inherit;font-size:.8125rem;letter-spacing:.08em;color:var(--ink);cursor:pointer;padding:6px 4px;}
.kz-login-lead{margin:12px 16px 0;font-size:.8125rem;line-height:1.9;}
.kz-login-frame{display:block;width:100%;height:min(56vh,460px);border:0;background:var(--paper);}
.kz-login-new{margin:0;padding:12px 16px 16px;border-top:1px solid var(--line,#d9cfc2);font-size:.8125rem;line-height:1.9;}
.kz-login-new .btn{margin:6px 0 4px;}
.kz-login-new small{display:block;font-size:.75rem;color:var(--ink-mid);}

/* 2026-11-08 2 のネームタグから先は生地を変えないので、貼り方の案内を出さない */
.kz-studio[data-step="tag"] #coTarget,.kz-studio[data-step="estimate"] #coTarget{display:none;}

/* 2026-11-09 うちの子を選ぶ欄と、＋のかんたん登録 */
.lab-dog{margin:0 0 14px;}
.lab-dog-l{display:block;font-size:.8125rem;letter-spacing:.08em;margin-bottom:6px;}
.lab-dog-sel{display:flex;gap:8px;align-items:stretch;}
.lab-dog-sel select{flex:1 1 auto;min-width:0;font:inherit;font-size:.9375rem;padding:9px 10px;border:1px solid var(--line,#d9cfc2);background:#fff;color:var(--ink);border-radius:2px;}
.lab-dog-add{flex:0 0 44px;width:44px;min-height:44px;border:1px solid var(--accent);background:#fff;color:var(--accent);font-size:1.25rem;line-height:1;cursor:pointer;border-radius:2px;}
.lab-dog-add:hover,.lab-dog-add:focus-visible{background:var(--accent);color:#fff;}
.lab-dog-note{margin:6px 0 0;font-size:.8125rem;color:var(--accent);}
.lab-dog-note[hidden]{display:none;}
.kz-dog-form{padding:14px 16px 18px;display:flex;flex-direction:column;gap:14px;}
.kz-dog-f{display:flex;flex-direction:column;gap:6px;font-size:.8125rem;letter-spacing:.06em;border:0;margin:0;padding:0;}
.kz-dog-f .req{font-weight:400;font-size:.6875rem;color:#fff;background:var(--accent);padding:1px 6px;margin-left:8px;letter-spacing:.06em;}
.kz-dog-f input[type=text],.kz-dog-f select{font:inherit;font-size:1rem;padding:9px 10px;border:1px solid var(--line,#d9cfc2);background:#fff;color:var(--ink);border-radius:2px;}
.kz-dog-f input::placeholder{color:#b9b2aa;opacity:1;}
.kz-dog-sex{flex-direction:row;flex-wrap:wrap;gap:6px 20px;}
.kz-dog-sex legend{width:100%;padding:0;margin-bottom:6px;}
.kz-dog-sex label{display:inline-flex;align-items:center;gap:6px;font-size:.9375rem;cursor:pointer;}
.kz-dog-err{margin:0;font-size:.8125rem;color:var(--accent);font-weight:700;}
.kz-dog-err[hidden]{display:none;}
.kz-dog-hint{margin:0;font-size:.75rem;color:var(--ink-mid);line-height:1.8;}

/* 2026-11-09 1・2・3 を矢羽根（右向きの山形）にして、順番に進むことが分かるようにする（田中様のご指示）。
   いまの段＝えんじ、済んだ段＝えんじを薄く、これからの段＝生成り。影・グラデーションは使わない */
.kz-bar{border-bottom:0;}
.kz-steps{gap:0;padding:10px 0;}
.kz-steps li+li{margin-left:-4px;}
.kz-steps button{margin:0;border:0;padding:11px 26px 11px 28px;background:var(--line-soft);color:var(--ink-mid);
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%,14px 50%);}
.kz-steps li:first-child button{padding-left:18px;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%);}
.kz-steps button.done{background:rgba(162,98,106,.16);color:var(--accent);}
.kz-steps button.done span{color:var(--accent);}
.kz-steps button[aria-current="step"]{background:var(--accent);color:#fff;}
.kz-steps button[aria-current="step"] span{color:#fff;}
.kz-steps button:focus-visible{outline:2px solid var(--ink);outline-offset:-4px;}
@media (max-width:600px){
  .kz-steps button{padding:10px 18px 10px 22px;font-size:.8125rem;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%,10px 50%);}
  .kz-steps li:first-child button{padding-left:12px;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%);}
  .kz-steps button span{margin-right:4px;}
}

/* 2026-11-09 プルダウンの色が分かりにくかった（田中様のご指摘）。白地・焦げ茶の文字・細い枠にそろえ、
   選んだあとの黒い太枠（ブラウザーの標準のフォーカス）は、えんじの細い枠にする */
.kz-breed select,.lab-fields select,.lab-dog-sel select,.kz-dog-f select{
  background-color:#fff;color:var(--ink);border:1px solid var(--line);border-radius:2px;color-scheme:light;}
.kz-breed select option,.lab-fields select option,.lab-dog-sel select option,.kz-dog-f select option{background:#fff;color:var(--ink);}
.kz-breed select:focus,.lab-fields select:focus,.lab-dog-sel select:focus,.kz-dog-f select:focus,.kz-dog-f input:focus{
  outline:1px solid var(--accent);outline-offset:0;border-color:var(--accent);}

/* 2026-11-09 料金表を超えるときの「現地でお見積もり」（数字より小さく、明朝で） */
#total.est-word{font-family:var(--serif);font-size:.5em;letter-spacing:.12em;}

/* 2026-11-09 「ネームタグを付ける」をおすすめとして目立たせる（改善指示書 D-2）。
   付ける前＝えんじの塗りつぶし、付けたあと＝焦げ茶。光らせるのは輪郭線だけで、影は使わない */
.kz-tag-on-wrap{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;margin:0 0 18px;}
.kz-tag-on-wrap .kz-tag-on{margin:0;}
.kz-rec{font-weight:400;font-size:.75rem;letter-spacing:.12em;color:var(--accent);border:1px solid var(--accent);padding:3px 10px;border-radius:2px;background:#fff;}
.kz-tag-on span{background:var(--accent);border-color:var(--accent);color:#fff;}
.kz-tag-on span:hover{border-color:var(--ink);}
.kz-tag-on input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff;}
.kz-tag-on span i{font-style:normal;}
.kz-tag-on span .on{display:none;}
.kz-tag-on input:checked+span .on{display:inline;}
.kz-tag-on input:checked+span .off{display:none;}
.kz-tag-on.glow span{animation:kzTagGlow 1.4s ease-in-out 3;}
@keyframes kzTagGlow{0%,100%{outline:2px solid rgba(162,98,106,0);outline-offset:2px;}50%{outline:2px solid rgba(162,98,106,.55);outline-offset:6px;}}
@media (prefers-reduced-motion: reduce){.kz-tag-on.glow span{animation:none;}}

/* 2026-11-10 UX-04：3D用の絵が無い生地の札（カードの画像のすぐ下。右上の選んだ印と重ならないように）と、選んだ生地の案内 */
.page-kisekae .kzf .co-sw .kzf-color-only{display:block;margin:0;padding:3px 2px;border-bottom:1px solid var(--line);background:var(--paper);
  color:var(--ink);font-size:.6875rem;letter-spacing:.04em;line-height:1.4;text-align:center;}
.kz-picked-only{margin:.4em 0 0;font-size:.75rem;line-height:1.8;color:var(--ink);border-left:2px solid var(--sage);padding-left:.6em;}
/* 2026-11-10 UX-07：税込で出すときの「本体○円＋消費税○円」 */
#breakdown .est-tax{font-size:.875rem;color:var(--ink);letter-spacing:.04em;}
/* 2026-11-10 UX-16：ネームタグを付けないときの「今回は付けない・後で決める」 */
.kz-tag-skip{margin:0;}
.kz-tag-any{margin:-6px 0 18px;color:var(--ink-mid);}
.kz-tag-detail[hidden]{display:none;}
@media (max-width:600px){
  .kz-tag-on-wrap .kz-tag-on,.kz-tag-on-wrap .kz-tag-skip{flex:1 1 100%;}
  .kz-tag-on-wrap .kz-tag-on span{width:100%;justify-content:center;text-align:center;}
}
