/* ============================================================
   OBELIS canon.css v2.0(8/23・条文を1枚へ焼く=D-2522-2)——パーツ正典の実装単一源
   律: 全面この1本を読み込み、釦・リンク・カード・選択部品の
   自前CSS定義は全削除(このクラスを使う・上書き禁止)。
   ★書面=創造D / 値=工房窓(★下の値はすべて**この1枚の宣言**と一致・実描画で実測済み)。
   ★複製: index.html / crm.html の inline は**この1枚のbyte写し**(test_canon_inline が機械強制)。
   ------------------------------------------------------------
   第1条|一般札  .card = 地 var(--card-grad) / 縁 1px var(--card-line)=#26241F
                 / 角 var(--ob-card-r)=10 / 影 var(--card-lift)
   第2条|題内蔵カード(九条=有効・D-2492)
                 節=**1枚のカード**。中に [題(+›)] → [罫線] → [内容]。
                 内容が複数なら中に札(#1B1A16)を並べる。★題を札の外に置かない。
                 ★★型の2つ目(D-2543-1): 内容が**一覧(label:value の行)**の時は
                 **罫線区切りの行**(padding-bottom:12px; border-bottom:1px var(--line))で正。
                 ★札(#1B1A16)にしない。例=導線の「商品・サービスとLP」/工房の「接続」「サポート」。
                 原器=顧客タブ「人が巡る流れ」／ホーム「運用設定」。
   第3条|隙間    g=var(--card-g)=10 / 題↔罫線=var(--card-hr)=4
                 ★上縁↔題 10 ／ 罫線↔内容 10 ／ 札同士 10 ／ 最後の札↔下縁 10 ／ 題↔罫線 4。
   第4条|末尾    最下部カードの下縁 →32→ [ページトップへ](白枠1px・角10・44高・中央)
                 →24→ ▲OBELIS →32(+safe)→ タブバー上縁。★タブ間で値の差=0。
                 ★実装 .ob-totop{margin:32px auto 0} / footer{margin-top:0;padding-top:24px}
                 ★(▲→タブバー)は経路の是正の後に prod で留める(D-2522-3・未留め)。
   淵の3段       ①金縁 1px #E8D4A0 = **ポップアップの札**(重なって出る確認と結果)
                 =.ob-toast/.ob-modal/.ob-confirm。地=T2の勾配・角12・影 card-lift-gold。
                 ★通常のカードには使わない(ホーム含む)。
                 ②金の薄縁 rgba(201,162,75,.25) = 主役だが押さない札(=.tile/T2)
                 ③静かな縁 #26241F + 勾配 + 影 = 一般札(=.card)
                 ★①が同一画面に2枚以上=違反。
   第5条|押した返し  押せる札(印=.is-tap)だけ :active で**地を1段明るく**(80ms)。
                 transform/影の変化=0。★押せない札には付けない。
   輪            :focus-visible = 外側2px rgba(201,162,75,.45)・角は札と同じ。
                 ★マウス(:focus)では出さない。釦/入力/チップ/択の帯/札の全部。
   択の帯        `.crm-chips`+`.chip`(実体)。等幅・全幅・gap 8・中央・同高44・字13px。
                 5枚までn等分／6枚以上は折り返し可で全札同幅。選択中=金地#C9A24B/字#1B1A16/500。
                 ★選択中の金地は**帯の中だけ**(帯の外の .chip.on は金縁=D-2456 §2b)。
   トースト      .ob-toast = 地 var(--card) / 縁 1px var(--line) / 角10 / 字13
                 / **画面下中央**(タブバーの上32) / 2秒 / フェード200ms。★保存の告知はこれ1種。
   T2            .tile の質感は**ホーム上段3節だけ**。他タブの外カード=一般札(.card)。
   ============================================================ */
:root{--bg:#0A0A0B;--card:#141310;--line:#26241F;--gold:#C9A24B;
--ink:#EDEAE4;--ink-dim:#A8A29A;--err:#D97A6C;
/* ★★D-2499-2（創造D 2026-08-22夜）: ★**択の帯の字＝13px**（★全タブ・`.opt` 系）。
   ★寸法の直値はこの1本だけ＝★面別CSSは参照します。 */
--ob-opt-f:13px;
/* ★★D-2528-B3（創造D 2026-08-23）: ★canon の**実装も1枚へ**。★index.html 側の重複は削除しました。 */
--card-g:10px;--card-hr:4px;--ob-card-r:10px;
/* ★★D-2636-5(あ)（創造D 2026-08-24）: ★**節の間隔＝1値**（★全タブ統一）。
   ★これまで面ごとに 16／24／12 の3値でした。★以後はこの1本を参照します。
   ★★値＝**12**（★D-2641■1 の裁定・★当窓の実測「ホームは元から12」を受けての決着）。
     ★24 は前便 `7c397349` の値＝★**倍に開いた**ため戻しました（★トークン1行）。 */
--ob-gap-card:12px;
/* ★★D-2734■1（創造D 2026-08-25）: ★**入力の器を1本へ**。★地＝`#141310`（★札と同じ地）／
   ★縁＝`rgba(232,226,214,.38)`。★全面の入力（工房 K-30/K-31・顧客の第2層・儀式 幕S・ビルダー）がこれを読む。
   ★★自前の入力CSS＝全削除の律（★各窓が持っている物は、この2値を参照する形へ寄せる）。 */
--ob-input-bg:#141310;--ob-input-line:rgba(232,226,214,.38);--cal-red:#C9744B;

/* ══════════════════════════════════════════════════════════════════════════
   ★★★D-2774■5／D-2765■3-3（創造D 2026-08-26）＝★増える択と日付の器を **canon に1本ずつ**。
   ★値は供給の verbatim をそのまま写しました（★新色0・新しい値0・★当窓の発明0）。
   ★★`.pick`＝閉じた姿（★`.cd-input` と同じ幾何） ／ `.menu`＝開いた姿 ／ `.cal`＝暦。
   ══════════════════════════════════════════════════════════════════════════ */
/* ★★D-2767■3-4／D-2774: ★**基準絵 v1.2 の実体に合わせました**（★子の名＝`.pl`/`.pv`/`.cv`・
   ★器＝`inline-flex`＋`space-between`・★全幅は `.pick.w`・★選択の印は `.menu div.on::after`）。
   ★当窓が先に立てた `.pick-l/.pick-v/.pick-c` は ★**基準絵と名が違いました**＝★基準絵が正。 */
/* ══════════════════════════════════════════════════════════════════════════
   ★★★D-2785■6／D-2792■6: ★**入力の第2層＝`.sheet`** を canon に1本。
   ★★値は ★**製品の現物**（★既存 `_sheet` ＝ `.guide-ov`＋`.card.ob-modal`）を写した物＝★新しい値0。
     ★覆い（`.sheet-ov`）… `.guide-ov` と同値（★地 rgba(0,0,0,.62)・中央・内24＋safe）
     ★札（`.sheet`）… `.ob-modal` と同値（★淵の1段目＝金縁 #E8D4A0・角12・地=勾配・影=card-lift-gold）
   ★★★幅 … ★上限 **480**（D-2792■5「入力の器の幅=(ウ)差なし・上限480の中で」）。
   ★足元 … ★[戻る][主操作]＝**右下**・主操作が最も右（D-2760／D-2774■0-4）。★390は対で等幅。
   ══════════════════════════════════════════════════════════════════════════ */
.sheet-ov{position:fixed;inset:0;background:rgba(0,0,0,.62);z-index:var(--z-veil);
  display:flex;align-items:center;justify-content:center;
  padding:24px calc(24px + var(--safe-r,0px)) calc(24px + var(--safe-b,0px)) calc(24px + var(--safe-l,0px))}
.sheet{width:100%;max-width:480px;max-height:calc(100dvh - 48px);overflow-y:auto;
  background:linear-gradient(168deg,#1B1A16 0%,#141310 48%,#0F0E0C 100%);
  border:1px solid #E8D4A0;border-radius:12px;box-shadow:var(--card-lift-gold);
  padding:var(--card-g) 24px var(--card-g)}
@media (max-width:760px){
  .sheet-ov{align-items:flex-end;padding:0}
  .sheet{max-width:none;max-height:88dvh;border-radius:12px 12px 0 0;border-bottom:0;
    padding:var(--card-g) 24px calc(var(--card-g) + var(--safe-b,0px))}
}
.sheet > .sheet-h{font-size:18px;font-weight:600;color:var(--ink);
  padding:0 0 var(--card-hr);border-bottom:1px solid var(--line);margin-bottom:var(--ob-gap-card)}
.sheet > .sheet-f{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}
@media (max-width:760px){.sheet > .sheet-f{justify-content:stretch}.sheet > .sheet-f > *{flex:1 1 0}}

.pick{display:inline-flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:44px;min-width:200px;box-sizing:border-box;padding:0 14px;
  background:var(--ob-input-bg);border:1px solid var(--ob-input-line);border-radius:10px;
  color:var(--ink);cursor:pointer;text-align:left}
.pick.w{width:100%}
.pick .pl{font-size:13px;color:var(--ink-dim);white-space:nowrap}
.pick .pv{flex:1 1 0;font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pick .cv{flex:0 0 auto;width:10px;height:10px;border-right:1.5px solid var(--ink-dim);
  border-bottom:1.5px solid var(--ink-dim);transform:rotate(45deg) translateY(-3px)}
@media (max-width:760px){.pick{width:100%}}

.menu{position:absolute;left:0;top:calc(100% + 8px);z-index:var(--z-drop,300);
  min-width:100%;width:max-content;max-width:320px;background:var(--card);
  border:1px solid #E8D4A0;border-radius:10px;padding:8px 0;box-shadow:0 12px 40px rgba(0,0,0,.55)}
.menu div{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:0 16px;white-space:nowrap;font-size:15px;color:var(--ink);cursor:pointer}
.menu div.on{color:var(--gold);font-weight:600}
.menu div.on::after{content:"";width:8px;height:14px;border-right:1px solid var(--gold);
  border-bottom:1px solid var(--gold);transform:rotate(45deg)}
.menu .sep{min-height:0;height:1px;background:var(--line);padding:0;margin:4px 0}

.cal{display:block}
.cal > .cal-h{display:flex;align-items:center;gap:12px;min-height:44px}
.cal > .cal-h > .cal-ym{flex:1 1 auto;text-align:center;
  font-size:18px;font-weight:600;color:var(--ink);line-height:1.2}
.cal .cal-w{display:grid;grid-template-columns:repeat(7,1fr);margin-top:8px}
.cal .cal-w > div{height:20px;line-height:20px;text-align:center;
  font-size:13px;font-weight:500;color:var(--ink)}
.cal .cal-w > div.dim{color:var(--ink-dim)}
.cal .cal-g{display:grid;grid-template-columns:repeat(7,1fr);gap:4px 0;margin-top:8px}
.cal .cal-c{height:44px}
.cal .cal-g > button.cal-d{display:flex;align-items:center;justify-content:center;
  width:100%;height:44px;background:none;border:0;padding:0;color:var(--ink);
  font-size:15px;font-weight:500;line-height:1.2;font-variant-numeric:tabular-nums;cursor:pointer}
.cal .cal-g > button.cal-d.dim{color:var(--ink-dim)}
.cal .cal-g > button.cal-d[disabled]{opacity:.35;cursor:default}
.cal .cal-g > button.cal-d.today{width:36px;height:36px;margin:4px auto;border-radius:999px;
  box-shadow:inset 0 0 0 1px var(--line)}
.cal .cal-g > button.cal-d.on{width:36px;height:36px;margin:4px auto;border-radius:999px;
  box-shadow:inset 0 0 0 1.5px var(--gold);background:rgba(var(--gold-rgb),.12);
  color:var(--gold);font-weight:600}

/* ★★D-2774■5: `.tool`（行内の釦）＝**canon の値**（★書面に寸が無く「未定」だった分の供給）。 */
.tool{display:inline-flex;align-items:center;justify-content:center;min-height:44px;
  min-width:68px;
  padding:0 14px;font-size:13px;font-weight:600;color:var(--ink);background:none;
  border:1px solid var(--ob-input-line);border-radius:10px;cursor:pointer;white-space:nowrap}

/* ★★D-2598-3-④（創造D 2026-08-24）: 第9役割「**合図の色**」＝`--sig-*` 族を canon へ**昇格**。
   ★値は1つも変えていません（★index.html の実装値をそのまま名付けただけ＝新色の発明0）。
   ★役 … ok=済み ／ keep=保つ ／ reach=届いた（金） ／ ai=分身の見立て（紫・`.cd-memoai*` 専用）。
   ★★第1〜8役割（主/副/警/暦の赤ほか）とは**別の族**＝★合図であって面の地や字ではありません。 */
--sig-ok:#8FAE8A;--sig-keep:#8db3d6;--sig-keep-line:rgba(141,179,214,.28);--sig-reach:#E8D4A0;--sig-reach-line:rgba(232,212,160,.3);--sig-ai:#7E74C9;--sig-ai-bg:#100F16;--sig-ai-title:#B9B2E6;--sig-ai-tag:#8C84C9;--sig-ai-tag-line:#3A3550;
/* ══════════════════════════════════════════════════════════════════════════
   ★★★D-2844（創造D 2026-08-27）＝★canon が**自分で定義しない値 11種**を index.html から**移設**。
   ★★なぜ … ★canon の値打ちは「★どこに埋めても同じ物が出る」こと。★ところが 11種は
     ★index.html の :root に頼っており、★同じ canon を全文内包している ★`crm.html` では
     ★10種が**未定義**でした＝★実描画で `.card` が ★**padding 0／縁 0／地なし**（★当時は実害0＝
     ★`/crm` は `crm.js` が自前の器で描き `.card` を1枚も作っていなかったため）。
   ★★値は ★index.html の実装値を ★**1バイトも変えずに**写しました（★新しい値0・★当窓の発明0）。
   ★★位置 … ★canon の塊は index.html の :root より**後ろ**ゆえ ★後勝ちで此処が効きます
     （★値が同一ゆえ ★全面の差0＝★1440/390 の実測で確かめました）。
   ★`--card-line` の由来の注釈は ★index.html 側（★26-26再是正・`--line` の説明と同居）に残しています。
   ══════════════════════════════════════════════════════════════════════════ */
--card-line:#26241F;
--card-lift:0 1px 0 rgba(255,255,255,.04) inset, 0 8px 24px rgba(0,0,0,.45);
--card-grad:linear-gradient(165deg,#141310 0%,#0F0E0C 100%);
--gold-rgb:201,162,75;   /* ★下の `--card-lift-gold` が要る値＝★これが無いと影の宣言ごと落ちます */
--card-lift-gold:0 1px 0 rgba(var(--gold-rgb),.12) inset, 0 8px 28px rgba(0,0,0,.5);
--sans:"Noto Sans JP",system-ui,sans-serif; /* 和文/数字・等幅禁止 */
--z-veil:400;   /* ★zの梯子の他の段（nav/bar/drop/modal/toast）は index.html に在ります＝★canon が要るのは此の1段だけ */
/* ★★★D-2879（創造D 2026-08-28）: ★1440の版面＝★**レール240の右を全部使う**。
   ★器（`.main`）の内側＝**24**（★上限 1200 と合わせて ★札の幅 1200−48＝**1152**・★左端 x=**264**）。
   ★★この1値が単一源＝★面別CSSは参照します（★寸法の直値0）。 */
--ob-main-p:24px;
--ob-card-p:16px;
--ob-btn-h-ghost:44px;   /* 副ボタン高(GHOST)=2-8(D 2026-07-25)で主44と統一。低背40未満禁止 */
--ob-btn-f-ghost:13px;   /* 副ボタン字格 */
--ob-input-r:10px;       /* 入力枠角丸 ★憲法v1.5 附則: 旧9→角丸2値(10)へ写像 */
--ob-input-p:8px 12px}

/* ★★D-2774■5 移設①（★一般札）: ★`.card` を **canon へ**。★値は index の自前から**そのまま**写しました
   （★`--card-grad` `--card-lift` `--card-line` `--ob-card-r` `--card-g` `--ob-card-p` `--ob-gap-card` を参照＝新しい値0）。 */
.card{background:var(--card-grad);box-shadow:var(--card-lift);border:1px solid var(--card-line);border-radius:var(--ob-card-r);padding:var(--card-g) var(--ob-card-p) var(--card-g);margin-bottom:var(--ob-gap-card)}

/* ★★D-2774■5 移設②（★入力）: ★`.cd-input` を **canon へ**（★値は index の自前から**そのまま**）。
   ★★D-2734■1 の2値（`--ob-input-bg` `--ob-input-line`）を参照＝★新しい値0。 */

.cd-input{width:100%;background:var(--ob-input-bg);border:1px solid var(--ob-input-line);border-radius:var(--ob-input-r);color:var(--ink);font-family:var(--sans);font-size:15px;padding:var(--ob-input-p);line-height:1.8}

/* ══════════════════════════════════════════════════════════════════════════
   ★★★D-2805（設計者の指摘・2026-08-26）: ★入力の3件を canon で受けます。
   ★R062 … ★入力を押した時の**銅色の枠**＝ブラウザ既定の focus ring。★0 にして、
     ★焦点の縁＝**主文字 `--ink` 1px**（★新色0）。★輪（`:focus-visible`）の金は**そのまま**。
   ★R063 … ★iOS は ★**入力の字が 16px 未満**だと面を自動で拡大します（★フレームとタブがはみ出る）。
     ★∴ ★**390 では入力の字＝16px**（★1章の**例外**・★理由は本注記＋台帳）。★961px 以上は 15 のまま。
   ★R064 … ★label:value の行は ★**baseline** で揃える（★字の高さのずれ）。
   ══════════════════════════════════════════════════════════════════════════ */
.cd-input:focus,.pick:focus,textarea.cd-input:focus{outline:0;border-color:var(--ink)}
.cd-input:focus-visible,.pick:focus-visible{border-color:var(--ink)}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}

/* ★★D-2808■4（供給・verbatim）: ★下タブ＝**画面の底**（safe-area の上）・**高さ64**・**上罫1px**。
   ★値は canon が持ち、★面（並び・位置）は面直し窓。★`--tabbar-h` は他所が高さを読めるように1本。 */
.tabbar{height:64px;padding-bottom:env(safe-area-inset-bottom);border-top:1px solid var(--line)}
/* ★R063 の例外＝**この1本だけ**（★1章の6値の外・★iOS の自動拡大を断つため）。
   ★★1行に畳みます … ★門は**行**で読むため、★`@media{` の次の行に置くと
   ★行が `@media (max-width:760px){` になり ★**例外の目印（.cd-input）が同じ行に無くなります**（★実測で赤）。 */
@media (max-width:760px){.cd-input,textarea.cd-input,.pick .pv{font-size:16px}}
.field,.crm-row,.kb-row{align-items:baseline}


/* ★★D-2774■5 移設③（★節の題）: ★`.section-h` を **canon へ**（★値は index の自前から**そのまま**）。
   ★★D-2805 R060「題内蔵カード＝1つの型（★題18/600）」は ★**面の側の型**＝★本便では**値を変えていません**
     （★変えるなら差0でなくなる＝別便で実測つきに）。★本便は ★**置き場の移設だけ**（★可逆）。 */
.section-h{margin:0 0 12px}

/* 素のbutton禁止(白反転の律) */
button{font:inherit;white-space:nowrap;cursor:pointer;
appearance:none;-webkit-appearance:none;background:transparent;color:inherit;border:0}

/* 釦2種(D-1588実値・全幅共通) */
.btn-gold{background:rgb(201,162,75);border:1px solid rgb(201,162,75);border-radius:10px;
color:rgb(20,19,16);font-size:15px;font-weight:600;line-height:1.2;
padding:12px 16px;min-height:44px}   /* ★★D-2866（創造D 2026-08-27）: ★金釦は **44** が正＝★**戻しました**。
     ★D-2865① の「46」は ★当卓が canon(7).css（★**旧**）を引いた誤り＝★後の裁定 ★**D-2571-4(8/23)＝44** が正。
     ★★白枠 `.btn-line` の 44 は ★この2便とも**1バイトも触っていません**（★陰性対照）。 */
/* ★★D-2571-4 の受入は「★**実測 44**」ゆえ padding も 13→12（★13+18+13+境界2 = 46 でした）。 */
/* ★★D-2571-4（創造D 2026-08-23）: ★金釦の高さ **46 → 44**（★canon v2.0 の律＝44・★統一v1「46=失効」）。
   ★白枠 `.btn-line` の 44 は**不変**（★陰性対照）。★値の変更はこの1つだけ。 */
/* 釦2種=D-1588実値(prod配信バイト一致・確定・近似の終了) */
/* ★★D-2218（2026-08-18）: ★薄い縁統一（D-2209改2）の**製品側**の適用。
   ★v66 が焼いたのは**正典文書**（258e247）＝★製品の canon.css はまだ旧値でした。
   ★★縁だけ #26241F（＝--line と同値の暗い罫）へ。★字色 rgb(237,234,228) は**不触**。 */
.btn-line{background:none;border:1px solid #26241F;border-radius:10px;
color:rgb(237,234,228);font-size:13px;font-weight:600;line-height:1.2;
padding:13px 16px;min-height:44px}
/* 釦2種=全幅共通(PC別寸なし・D-1588)。選択部品のみ390でタップ寸へ */
@media(max-width:760px){.opt,.chip{min-height:44px}}
/* 並立の対: 390=等幅(全幅の器)/1440=右寄せ・内容幅(D-1659③) */
.pair{display:flex;gap:12px;justify-content:flex-end}
@media(max-width:760px){.pair{justify-content:stretch}
.pair>.btn-gold,.pair>.btn-line{flex:1 1 0;min-width:0}}

/* カード内の操作釦=右寄せの律(中央浮きの禁止・動線[商品を追加]等) */
.card-acts{display:flex;justify-content:flex-end;gap:12px;padding-top:12px}

/* 遷移・行内リンク(14px/500)。「›」は字として書く(供給verbatimに含む)——::after禁止(D-1659②逆裁定・二重›の防止) */
.lnk{color:var(--gold);font-size:13px;font-weight:500;cursor:pointer;white-space:nowrap;
background:none;border:0;padding:0}

/* カード(押せる札・確定値は顧客タブ転記までの近似) */
/* ★★D-2479改 A-3（2026-08-22・創造D）: ★ホームの3枚の器を **T2 の値**へ（★発注 verbatim）。
   ★A-10: ★単一源は canon.css・★index.html／crm.html は複製＝**同便で3枚とも**揃えます
   （★片方だけだと `test_canon_inline.py` が赤）。 */
.tile{background:linear-gradient(168deg,#1B1A16 0%,#141310 48%,#0F0E0C 100%);
border:1px solid rgba(201,162,75,.25);border-radius:var(--ob-card-r);/* ★D-2865⑤: 12→10 */
box-shadow:inset 0 1px 0 rgba(201,162,75,.10)}
/* 区分の器もカードは一種のみ(ゴージャス・8/13裁定「廉価カードは存在しない」) */
.panel{background:linear-gradient(168deg,#1D1912 0%,#14110B 48%,#0D0B08 100%);border:1px solid rgba(201,162,75,.35);border-radius:var(--ob-card-r);/* ★D-2865⑤: 16→10 */box-shadow:inset 0 1px 0 rgba(201,162,75,.10)}
/* 見出し下罫の律(例外なし) */
.sect-h{font-size:18px;font-weight:600;padding-bottom:12px;
border-bottom:1px solid var(--line);margin-bottom:14px;white-space:nowrap}

/* 選択3種 */
.tone{display:inline-flex;border:1px solid var(--line);border-radius:999px}
.tone>button{border-radius:999px;color:var(--ink-dim);font-size:12.5px;font-weight:500;
padding:4px 12px;min-height:24px}
.tone>button.on{background:var(--gold);color:#141310;font-weight:600}
.opt{background:var(--bg);border:1px solid var(--line);border-radius:10px;
min-height:36px;min-width:60px;padding:0 14px;font-size:var(--ob-opt-f);color:var(--ink)}
.opt.on{border-color:var(--gold);color:var(--gold);font-weight:600}
/* ★★D-2479改 ①-b（2026-08-22・創造D）: ★`.card` 以外の**白系 rgba の縁**＝0。
   ★対象13件のうち ★**本当に白系なのはこの `.chip` の3枚だけ**でした
   （★残り10件は金 rgba(201,162,75,…)＝★受入の器が**赤の値だけ**で判定するための当たり）。
   ★置き先は製品自身のトークン `--line`（=#26241F・★`.tool` の縁と同じ）＝★新しい色0。 */
.chip{border:1px solid var(--line);border-radius:999px;min-height:36px;
padding:6px 14px;font-size:13px;color:var(--ink);background:none}
/* ★★D-2456 §2b: ★選択チップの**金塗り**→**金縁**（★§0.6「金塗りは1面1本」）。
   ★値は製品が既に持つ v66第2波の宣言 verbatim（★新しい色も太さも作っていません）。
   ★★申告: ★canon のこの1行が**後から**当たり、★v66第2波の裁定を金塗りへ**戻していました**。 */
/* ★★D-2657■3(a)／D-2666■4（創造D 2026-08-25）: ★選択中の一般チップ＝**金地**（★薄金地 .12 から）。
   ★★★例外台帳（★「例外」ではなく**役の分類**）:
     ★① 運用設定の釦 `.main.ob-face .beh .slot-row button.chip.on` ＝ ★**5条の釦**（★金線・金字・塗らない）
        ＝★D-1214 由来・D-2590-2「完全決着」・D-2612 再確認。★チップ族ではありません。
     ★② チップの**形**は2つのまま（★(b)=(ア)現状維持）… ★`.chip`=999（ピル） ／
        ★運用設定の釦=**角10**（★5条「角丸10」）。★canon の 999 は特異度で当たりません＝★意図どおり。 */
.chip.on{background:none;border-color:var(--gold);color:var(--gold);font-weight:600}

/* 札・状態ピル */
.pill{border:1px solid var(--line);border-radius:999px;font-size:12.5px;
color:var(--ink-dim);padding:2px 12px;white-space:nowrap}
.pill.g{border-color:var(--gold);color:var(--gold)}

/* 数字カード */
.numcard{text-align:center;padding:18px 24px;min-width:120px}
.numcard .n{font-size:22px;font-weight:600;color:var(--gold);line-height:1.3;
font-variant-numeric:tabular-nums;display:block}
.numcard .l{font-size:13px;color:var(--ink-dim)}

/* フォーム行(左起点の律) */
.frow{display:flex;align-items:center;gap:16px;padding:14px 0;flex-wrap:wrap}
.frow+.frow{border-top:1px solid var(--line)}
.frow .lb{font-weight:600;white-space:nowrap;min-width:9em}

/* ============================================================
   スクロールバーの律(v1.4追補・D-1782・8/14)
   黒石の上に明色のバーを描かせない。全面共通・例外なし(B-20・儀式・
   ドロワー・モーダルの内部スクロールも同律)。新色の発明なし=既存トークンのみ。
   ============================================================ */
:root{color-scheme:dark}
*{scrollbar-width:thin;scrollbar-color:var(--line) transparent}
*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-track{background:transparent}
*::-webkit-scrollbar-thumb{background:var(--line);border-radius:999px}
/* ★★D-2609-4（創造D 2026-08-24）: ★`:hover` は **`@media (hover:hover)` の中**へ（★膿ごと）。
   ★触る端末で「押した色が残る」を断つ。★**その場で包む**＝★書かれた順は1つも動かしていません。 */
@media (hover:hover){*::-webkit-scrollbar-thumb:hover{background:var(--ink-dim)}}
*::-webkit-scrollbar-corner{background:transparent}

/* iOSの律(v1.6追補・D-1810①・8/15)
   iOS の PWA は暗いつまみでも白い帯が残る。iOSだけバーそのものを消す。
   新色の発明なし=宣言の撤去のみ。Mac/Androidはv1.5の暗バーが残る(意図)。 */
@supports (-webkit-touch-callout: none){
  *{scrollbar-width:none}
  *::-webkit-scrollbar{display:none}
}

/* ── 殻(§0.10)の意匠 ── 追加 2026-08-20 / 新工房窓
   ★JSの殻（_koboShell・工房窓 bf8612ce）が描く**器の意匠**を canon 側に置く。
   ★律: フレーム(L0の眉+題+? / ‹戻る / 8タブ / 版数チップ)は殻だけが描く。
   ★出典 = canon.css v1.4（関所 43ae223d7383）の当該4部品を **verbatim**。
   ★★丸ごとの版上げは**していません**（v1.4 は .btn/.card 等の総入れ替え＝
     他窓の面が一斉に割れる）。★足したのは殻の4部品だけ。 */
/* ★D-2495-2①: ★座席は変数で受けます（★殻が inline で padding を書くと @media が勝てないため）。 */
.l0{padding-top:var(--l0-pt,40px);display:flex;align-items:flex-end;justify-content:space-between}
.l0 .brow{font-size:12.5px;font-weight:600;letter-spacing:.22em;
  color:var(--gold);white-space:nowrap}
.l0 h1{font-size:22px;font-weight:700;letter-spacing:.04em;
  margin-top:6px;white-space:nowrap}
.help{flex:none;width:28px;height:28px;border:1px solid var(--line);
  border-radius:50%;color:var(--ink-dim);display:flex;font-size:13px;
  align-items:center;justify-content:center;position:relative}
/* ★★創造D裁定(束2040)(i)→★★D-2598■2(束039)で(ア)+(ウ)・円28へ確定:
   ★見た目28・字13・当たり判定44。★`*{box-sizing:border-box}` ゆえ
   ★padding では外寸が広がりません（★工房窓の実測: padding:4px でも 元寸のまま）。
   ★∴ 判定だけを疑似要素で外へ8px（★28+8×2=44≡律は不変）。 */
.help::after{content:"";position:absolute;inset:-8px}
/* ★★D-2657■3(g)／D-2666■4: ★[‹戻る]＝**fixed → static**（★全面）。
   ★fixed は**地を持たない釦が流れる中身の上に浮く**形＝★390 で欄名に食い込んでいました。
   ★流れの中に座らせれば重なりません（★下の 961px 以上の宣言と**同じ姿**＝新しい値0）。 */
.back{position:static;margin:0 0 var(--card-g);align-self:flex-start;

  min-height:44px;display:flex;align-items:center;
  padding:0 14px;border:1px solid var(--line);border-radius:10px;
  background:rgba(10,10,11,.85);color:var(--ink);font-size:13px;
  white-space:nowrap}
.back::before{content:"\2039 "}
/* ★★★D-2495-2①（創造D 2026-08-22夕・★工房窓の実測 −236px の是正）:
   ★PC（額縁が立つ幅）では `.back` を ★**流れの中**へ戻します＝
     ★①額縁の**内側** ★②**本文の左端**にそろう ★③**脇列を覆わない**（★fixed をやめるだけ）。
   ★★寸法は**1つも書きません**（★左端は額縁が決めます）＝★新しい値0。
   ★fixed をやめたので**座席は不要**＝`.l0` は canon の 40 に戻します。
   ★モバイル（<961px）は**不変**（★脇列が display:none ゆえ left:16 が正）。 */
@media (min-width:961px){
  .back{position:static;margin:0 0 var(--card-g);align-self:flex-start}
  .l0{padding-top:40px}
}
/* ★フッタの座席(§0.10追補・カルテ04): 中身は必ずフッタの上で終わる */
.ob-shell-body{min-height:1px}
/* ★本紙の版数(機械検問用・全面のDOMに1つ) */
/* ★★★工房窓 2026-08-21（★当窓の退行の是正・prod v257 で実写にて発見）:
   ★この印は canon 自身が「**機械検問用**」と書いています。★ところが塗る規則が無く、
   ★★**「canon v1.4」が生の字で買い手に見えていました**（★工房の全面・実写で確認）。
   ★∴ ★**DOMには残したまま塗らない**（★§0.10 b「.canon-v=各1」の検問は DOM を見るので不変・
     ★新工房窓の陽性対照＝`::after` の字を壊すと赤、も不変）。 */
.canon-v{display:none}
.canon-v::after{content:"canon v1.4"}
/* ★★D-2530-⑰（創造D 2026-08-23）: ★外す印つきのチップ（★44px・縁 var(--line)=#26241F・角999・×）。
   ★`.chip` と同じ族＝★新しい色も角も作っていません（★44 はタップの律）。 */
.chip-x{display:inline-flex;align-items:center;gap:8px;min-height:44px;
  border:1px solid var(--line);border-radius:999px;padding:6px 14px;
  font-size:13px;color:var(--ink);background:none}
.chip-x::after{content:"×";color:var(--ink-dim)}
/* ★★★D-2540-1（創造D 2026-08-23）: ★**択の帯**＝`.crm-chips` ＋ `.chip`（★実体・生成23+32箇所）。
   ★等幅・全幅・gap 8・中央・同高 44・字 13px。
   ★5枚までは n等分／6枚以上は折り返し可で**全札同幅**＝`repeat(auto-fill,minmax(64px,1fr))` の1本で両方。
   ★★`.opt` の 13px（D-2499-2）は**失効**（★当卓の誤指定・★`.opt` は製品でほぼ使われていません）。
   ★★★選択中＝**金地**（#C9A24B / 字 #1B1A16 / 500）。★これは D-2456 §2b（金塗り→金縁）と当たるため、
     ★**帯の中だけ**に限定しました（★帯の外の `.chip.on` は**金縁のまま**＝D-2456 の凍結検問も緑）。 */
/* ★★D-2540 追補①（創造D 2026-08-23）: ★字は**折らない**／★n≤5=1行にn等分／★n≥6=390は3列・1440は6列。 */
.crm-chips{display:grid;grid-template-columns:repeat(3,1fr);
  gap:8px;justify-items:stretch;align-items:stretch}
.crm-chips:has(> :nth-child(1):last-child){grid-template-columns:repeat(1,1fr)}
.crm-chips:has(> :nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}
.crm-chips:has(> :nth-child(3):last-child){grid-template-columns:repeat(3,1fr)}
.crm-chips:has(> :nth-child(4):last-child){grid-template-columns:repeat(4,1fr)}
.crm-chips:has(> :nth-child(5):last-child){grid-template-columns:repeat(5,1fr)}
/* ★D-2540 追補②: ★5段の語は既存供給で3字＝**13px で入る**＝★12px の固定は**外しました**（全部13px）。 */
@media (min-width:961px){.crm-chips{grid-template-columns:repeat(6,1fr)}
  .crm-chips:has(> :nth-child(1):last-child){grid-template-columns:repeat(1,1fr)}
  .crm-chips:has(> :nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}
  .crm-chips:has(> :nth-child(3):last-child){grid-template-columns:repeat(3,1fr)}
  .crm-chips:has(> :nth-child(4):last-child){grid-template-columns:repeat(4,1fr)}
  .crm-chips:has(> :nth-child(5):last-child){grid-template-columns:repeat(5,1fr)}}
.crm-chips>.chip,.crm-chips>button.chip{min-height:44px;font-size:13px;
  display:inline-flex;align-items:center;justify-content:center;text-align:center;
  padding:0 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  height:44px;width:100%}   /* ★同高44を数で（★min-height だと2行の札が45になる＝実測） */
/* ★特異度を `.main:not(:has(>.mail)) button:not(.lnk):not(.kb-lnk){font-weight:600}`(0,4,1) と
   ★同値以上にして後に置く（★当窓は `.primary` で同じ穴を踏んでいます）。 */
.main .crm-chips>button.chip.on:not(.lnk):not(.kb-lnk),
.crm-chips>.chip.on{
  background:var(--gold);border-color:var(--gold);color:#1B1A16;font-weight:500}
/* ★D-2528-B3: ★[ページトップへ]（第4条）も canon へ。★値は移設前と1バイトも変えていません。 */
.ob-totop{display:block;margin:32px auto 0;min-height:var(--ob-btn-h-ghost);padding:0 12px;
  border:1px solid var(--line);border-radius:10px;background:transparent;
  color:var(--ink-dim);font-size:var(--ob-btn-f-ghost);letter-spacing:.04em}
.ob-totop:active{color:var(--gold)}
/* ★★★D-2522-1（創造D 2026-08-23・D-2456 律①の実装先）: ★保存の告知＝**トースト1種のみ**。
   ★地 `--card`(#141310)／縁 1px `--line`(#26241F)／角10／字13／★**画面下中央**／2秒／フェード200ms。
   ★★下の位置 … ★タブバーの上 **32**。★タブバーの高さは**その規則自身**が持つ
     （`padding:8px 3px calc(8px + safe-b)` ＋ 中身＝★**実測 62** ＋ safe）＝★62+32 の**算**。★実描画で 32 を確認しています。
   ★★★現物の #1a1508 / 1.6秒 / 画面中央 は**失効**。 */
/* ★★D-2823（創造D 2026-08-27）: ★トースト＝**画面の中央**（★縦横）。★下タブの上では在りません。
   ★`inset:0;margin:auto` で中央へ（★`height:fit-content` を添えないと縦に伸びます）。
   ★幅＝`min(320px, 100% - 32px)`。★地・縁・角・字・淵の1段目（金縁）は**不変**。 */
.ob-toast{position:fixed;inset:0;margin:auto;height:fit-content;
  width:min(320px, 100% - 32px);z-index:var(--z-toast,500);
  text-align:center;
  background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:10px;
  padding:12px 16px;font-size:13px;line-height:1.7;
  opacity:0;transition:opacity 200ms}
.ob-toast.on{opacity:1}
/* ★★★D-2532（設計者裁定 2026-08-23）: ★淵の**1段目（金縁）＝ポップアップの札**。
   ★画面の上に重なって出る札（★確認と結果）だけが金縁を持つ＝★通常のカードには使いません（ホーム含む）。
   ★地=T2の勾配／縁 1px **#E8D4A0**／角 **12**／影 `var(--card-lift-gold)`。★1画面に同時に1枚（構造上そうなる）。 */
.ob-toast,.ob-modal,.ob-confirm{
  background:linear-gradient(168deg,#1B1A16 0%,#141310 48%,#0F0E0C 100%);
  border:1px solid #E8D4A0;border-radius:12px;box-shadow:var(--card-lift-gold)}
/* ★★★D-2539-2（canon v2.0 第5条・創造D 2026-08-23）: ★**押した返し**（★押せる札だけ）。
   ★印＝`.is-tap` の1クラス（★付け外しは各窓のJS・★当窓は**値だけ**）。
   ★地を1段明るく（★一般札 #141310→#1B1A16 ／ ★T2 は起点 #1B1A16→#26241F）・
   ★★transform と影の変化は **0**・★80ms。★字も寸も不変。★押せない札には付けません。 */
.is-tap{transition:background-color 80ms}
/* ★★D-2636-5(え): ★艶の遷移は**静止側**に置く（★hover側置きは入りが滑らかで**出が瞬断**する）。
   ★全面の `.section.card`＝canon の**1本**。★hover の見え方は `@media (hover:hover)` 側が持ちます。 */
.section.card{transition:box-shadow .2s ease}
.is-tap:active{background-color:#1B1A16}
.tile.is-tap:active{background-image:linear-gradient(168deg,#26241F 0%,#141310 48%,#0F0E0C 100%)}

/* ★★★D-2539-3（canon v2.0・キーボードの輪）: ★PC の Tab 移動で**居場所が見える**。
   ★外側 2px `rgba(201,162,75,.45)`・★角は札と同じ（`outline` は border-radius に沿う）。
   ★★マウス操作では出さない（`:focus` ではなく `:focus-visible` のみ）。 */
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,
.chip:focus-visible,.chip-x:focus-visible,.opt:focus-visible,.tile:focus-visible,.card:focus-visible{
  outline:2px solid rgba(201,162,75,.45);outline-offset:0}
