/* 代替書体の字面を本書体に合わせる（2026-09-16） */ /* 本書体が届く前に組む代替書体の「1行の高さ」を、本書体と同じにする。 代替書体のほうが1行あたり約11.5%背が高く、本書体が届いた瞬間に 全行が縮んでページがずれるため。ずれの量は本書体の到着が早くなっても減らない。 グリフは代替書体のままで、変えるのは高さだけ。本書体が届いた後の見え方は変わらない。 size-adjust は 100% のまま。和文はどちらも全角1em送りで、 100%以外にすると字送りが変わって折返し位置が動く。 */ @font-face{ font-family:"NSJP metric fallback"; src:local("Yu Mincho"),local("YuMincho"),local("游明朝"), local("Hiragino Mincho ProN"),local("Hiragino Mincho Pro"), local("MS Mincho"),local("Noto Serif CJK JP"),local("Noto Serif JP"); font-style:normal; font-weight:100 900; size-adjust:100%; ascent-override:115.1%; descent-override:28.6%; line-gap-override:0%; } /* 代替書体の字面ここまで */ /* auth-style.css — 既存サイトのデザイントークンを継承した共通スタイル */ :root { --bg:#DDDDDB; --bg-alt:#E6E5E2; --surface:#F7F6F4; --ink:#191919; --ink-mid:#3B3B3B; --ink-muted:#5F5F5F; --silver:#A8A8A8; --silver-lt:#C8C7C3; --gold-rim:rgba(215,192,120,0.42); --font:"Noto Serif JP","NSJP metric fallback","Yu Mincho","游明朝",Georgia,serif; --ease:cubic-bezier(.4,0,.2,1); } *,*::before,*::after{box-sizing:border-box;margin:0;padding:0} body{font-family:var(--font);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;min-height:100vh} /* focus-visible共通リング（・）：キーボード操作時のみ金の淡い輪郭を表示 */ a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold-rim);outline-offset:3px} header{position:fixed;top:0;left:0;right:0;z-index:400;padding:15px 48px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(180deg,rgba(247,246,244,0.97) 0%,rgba(232,231,227,0.97) 100%);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(215,192,120,0.42);box-shadow:0 1px 16px rgba(60,50,20,0.07)} .logo{font-size:.88rem;font-weight:300;letter-spacing:.45em;color:#191919;text-decoration:none} .logo-sub{display:block;font-size:.55rem;letter-spacing:.55em;color:#5F5F5F;margin-top:3px} nav{display:flex;gap:30px;flex-wrap:wrap} nav a{font-size:.62rem;letter-spacing:.3em;color:#3B3B3B;text-decoration:none} nav a:hover{color:#6F5A16} .wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:140px 24px 60px} .panel{width:100%;max-width:460px;background:var(--surface);border:1px solid var(--silver-lt);padding:40px 44px;box-shadow:0 2px 40px rgba(0,0,0,0.04);position:relative} .c-orn{position:absolute;width:16px;height:16px;border-color:var(--silver-lt);border-style:solid} .c-orn.tl{top:14px;left:14px;border-width:1px 0 0 1px} .c-orn.tr{top:14px;right:14px;border-width:1px 1px 0 0} .c-orn.bl{bottom:14px;left:14px;border-width:0 0 1px 1px} .c-orn.br{bottom:14px;right:14px;border-width:0 1px 1px 0} .panel-title{font-size:.9rem;font-weight:300;letter-spacing:.4em;text-align:center;color:var(--ink-mid)} .panel-sub{font-size:.55rem;letter-spacing:.5em;color:var(--ink-muted);text-align:center;margin-top:8px;line-height:1.9} /* 呼名と刻の挨拶。account.html/moon.html/compatibility.htmlで共用。 押し付けがましくならないよう控えめなトーンに留める（「気づく人だけ気づく」水準） */ .tenkei-greeting{font-size:.64rem;font-weight:300;letter-spacing:.16em;color:var(--ink-muted);text-align:center;margin-top:10px;line-height:1.9} .field{display:flex;flex-direction:column;gap:7px;margin-top:18px} .field label{font-size:.58rem;letter-spacing:.4em;color:var(--ink-muted)} .opt-note{letter-spacing:.15em;color:var(--ink-muted);font-size:.9em} .intro-note{display:block;margin-top:8px;font-size:.9em;letter-spacing:.08em;color:var(--ink-muted)} .field input{font-family:var(--font);font-size:.82rem;letter-spacing:.1em;padding:9px 12px;background:var(--bg);border:1px solid var(--silver-lt);color:var(--ink);outline:none;-webkit-appearance:none;appearance:none} .field input:focus{border-color:var(--silver)} .field input::placeholder{color:var(--ink-muted)} .btn{display:block;width:100%;margin-top:24px;padding:13px;border:1px solid var(--ink);background:transparent;font-family:var(--font);font-size:.7rem;letter-spacing:.5em;color:var(--ink);cursor:pointer;text-align:center;text-decoration:none;position:relative;overflow:hidden} .btn::after{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease);z-index:0} .btn span{position:relative;z-index:1;transition:color .4s} .btn:hover::after{transform:scaleX(1)} .btn:hover span{color:#fff} .btn:hover:not(:has(span)){color:#fff} .btn.primary{background:linear-gradient(135deg,#6F5A16,#83691E,#77621B);border-color:#A0761E;color:#fff} .btn.primary::after{display:none} .btn.primary:hover{filter:brightness(1.06)} .btn:disabled{opacity:.4;cursor:not-allowed} .btn:disabled::after{display:none} .switch-line{text-align:center;margin-top:18px;font-size:.62rem;letter-spacing:.1em;color:var(--ink-muted)} .switch-line a{color:var(--ink-mid);text-decoration:underline} .msg{font-size:.65rem;letter-spacing:.08em;line-height:1.9;text-align:center;margin-top:14px;min-height:1.4em;color:var(--ink-muted)} .msg.warn{color:#9E3A3A} .msg.ok{color:#3A7A4E} .status-row{display:flex;justify-content:space-between;font-size:.7rem;letter-spacing:.15em;padding:10px 0;border-bottom:1px solid var(--silver-lt)} .status-row span:first-child{color:var(--ink-muted);letter-spacing:.4em} /* 2026-08-23是正（F-1）：モバイル390px幅で、キャンペーン中の長文値 「―（現在は準備期間のため、ご契約は不要です）」等がラベルと横読みで 交錯して見える崩れの対策。480px以下ではラベル→値の縦積みへ切り替える （文字被りと同族の「長文値×flex行」問題。9/1後の平時値 「守護の契り（月額330円）」でも同じレイアウトで崩れない）。 */ @media(max-width:480px){ .status-row{flex-direction:column;align-items:flex-start;gap:2px} .status-row span:first-child{letter-spacing:.15em} .status-row span:last-child{text-align:left} } .badge{display:inline-block;padding:2px 10px;font-size:.58rem;letter-spacing:.25em;border:1px solid var(--silver-lt)} .badge.trialing{color:#A0761E;border-color:#A0761E} .badge.active{color:#3A7A4E;border-color:#3A7A4E} .badge.past_due,.badge.canceled,.badge.none{color:#9E3A3A;border-color:#9E3A3A} .legal-body{max-width:680px;margin:0 auto;padding:140px 24px 80px;font-size:.78rem;line-height:2.2;color:var(--ink-mid)} .legal-body h1{font-size:1.05rem;font-weight:300;letter-spacing:.42em;margin-bottom:34px;color:var(--ink-mid)} .legal-body h2{font-size:.72rem;font-weight:300;letter-spacing:.32em;color:var(--ink-mid);text-transform:none} .legal-body table{width:100%;border-collapse:collapse;margin-top:10px} .legal-body th,.legal-body td{text-align:left;padding:10px;border-bottom:1px solid var(--silver-lt);font-size:.72rem;vertical-align:top} .legal-body th{width:34%;color:var(--ink-muted);font-weight:300;letter-spacing:.12em} .legal-body ul{margin:14px 0 14px 1.5em} .legal-body li{margin-bottom:10px;line-height:2} .trial-note{background:var(--bg-alt);border:1px solid var(--silver-lt);padding:16px 20px;font-size:.65rem;line-height:2;color:var(--ink-mid);margin-top:20px} /* 2026-07-31④：注記の中のリンク。共通CSSに a の色指定が無いためブラウザ既定の 青(#0000EE)で描かれ、§7の配色から外れていた（退会案内の追加で顕在化）。 nav等で使っている #6F5A16 に揃え、下線で「押せる」ことを色以外でも示す。 */ .trial-note a{color:#6F5A16;text-decoration:underline;text-underline-offset:3px} .trial-note a:hover,.trial-note a:focus-visible{color:var(--ink)} /* ═══ 4層プランカード（2026-07-02追加） ═══ */ .interval-toggle{display:flex;justify-content:center;gap:0;margin:26px auto 0;max-width:280px;border:1px solid var(--silver-lt);background:var(--bg)} .interval-toggle button{flex:1;padding:10px 8px;font-family:var(--font);font-size:.62rem;letter-spacing:.25em;background:transparent;border:none;color:var(--ink-muted);cursor:pointer;transition:background .25s,color .25s} .interval-toggle button.active{background:linear-gradient(135deg,#6F5A16,#83691E,#77621B);color:#fff} .interval-note{text-align:center;font-size:.58rem;letter-spacing:.1em;color:var(--ink-muted);margin-top:10px} .plan-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:28px} @media(max-width:760px){.plan-grid{grid-template-columns:1fr}} .plan-card{position:relative;background:var(--surface);border:1px solid var(--silver-lt);padding:26px 20px;text-align:center;cursor:pointer;transition:border-color .25s,box-shadow .25s;display:flex;flex-direction:column} .plan-card:hover{border-color:var(--silver)} .plan-card.selected{border-color:#A0761E;box-shadow:0 0 0 1px #A0761E,0 8px 24px rgba(160,118,30,0.15)} .plan-card .plan-name{font-size:.72rem;letter-spacing:.3em;color:var(--ink-mid);font-weight:400} .plan-card .plan-name-en{font-size:.5rem;letter-spacing:.2em;color:var(--ink-muted);margin-top:4px} .plan-card .plan-price{font-size:1.5rem;letter-spacing:.05em;color:var(--ink);margin-top:16px;font-weight:300} .plan-card .plan-price small{font-size:.55rem;letter-spacing:.1em;color:var(--ink-muted)} .plan-card .plan-yearly-note{font-size:.55rem;letter-spacing:.05em;color:#A0761E;margin-top:4px;min-height:1.4em} .plan-card .plan-desc{font-size:.62rem;letter-spacing:.06em;line-height:1.9;color:var(--ink-muted);margin-top:14px;flex:1} .plan-card .plan-radio{width:16px;height:16px;border:1px solid var(--silver);border-radius:50%;margin:16px auto 0;position:relative} .plan-card.selected .plan-radio::after{content:"";position:absolute;inset:3px;border-radius:50%;background:#A0761E} /* ═══ HAMBURGER BUTTON ═══ */ .hamburger{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:38px;height:38px;background:transparent;border:none;cursor:pointer;padding:4px;margin-left:20px;flex-shrink:0;z-index:500} .hamburger span{display:block;width:22px;height:1px;background:#3B3B3B;transition:transform .35s cubic-bezier(.4,0,.2,1),opacity .25s;transform-origin:center} .hamburger.open span:nth-child(1){transform:translateY(6px) rotate(45deg)} .hamburger.open span:nth-child(2){opacity:0;transform:scaleX(0)} .hamburger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)} /* ═══ MOBILE MENU スライドダウン ═══ */ .mobile-menu{position:fixed;top:56px;left:0;right:0;z-index:380;background:linear-gradient(180deg,rgba(247,246,244,0.995) 0%,rgba(233,232,228,0.995) 100%);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(215,192,120,0.42);box-shadow:0 10px 30px rgba(60,50,20,0.13);display:flex;flex-direction:column;gap:0;transform:translateY(-110%);transition:transform .38s cubic-bezier(.4,0,.2,1);visibility:hidden;pointer-events:none} .mobile-menu.open{transform:translateY(0);visibility:visible;pointer-events:auto} .mobile-menu a{display:block;padding:17px 28px;font-size:.78rem;letter-spacing:.42em;color:#2A2A2A;text-decoration:none;border-bottom:1px solid rgba(168,168,168,0.32);transition:color .2s,background .2s} .mobile-menu a:last-child{border-bottom:none} .mobile-menu a:hover,.mobile-menu a:active{color:#6F5A16;background:rgba(215,192,120,0.14)} @media(max-width:768px){ header{padding:14px 20px} nav{display:none} .hamburger{display:flex!important} } /* === UI/UX改修（ヘッダー共通）2026-07-30 ================================ ・ロゴ「SANCTUARY OF THE ORACLE」が折り返してnavに重なる被りの防止 （flex内の固定要素は縮めない＝と同型の対策） ・navが語中で改行し2〜3行に割れる問題の解消 ・A系統・B系統・column系統でばらついていたハンバーガー切替を1系統へ統一 ⚠ 2026-07-31（ナビ改修 14→5+1）で切替閾値を 1240px → 899px へ引き下げた。 項目が13→5に減り、実測でnavの実幅が compact段で約400px（旧約900px）になったため。 段の境界も 1241/1400/1600 → 900/1200/1440 へ移した。数値は実測に基づく（制作メモ参照）。 このコメントから閉じコメントまでを削除すれば改修前の挙動へ戻る。 ============================================================================ */ .logo{flex-shrink:0} .logo-sub{white-space:nowrap} nav a{white-space:nowrap} @media(max-width:899px){ header{padding:14px 20px} nav{display:none} .hamburger{display:flex!important} } @media(min-width:900px){ .hamburger{display:none!important} header{padding:14px 20px} nav{display:flex;flex-wrap:nowrap;gap:14px} nav a,nav .nav-drop-btn{letter-spacing:.10em;font-size:.585rem} } @media(min-width:1200px){ header{padding:15px 32px} nav{gap:20px} nav a,nav .nav-drop-btn{letter-spacing:.18em;font-size:.61rem} } @media(min-width:1440px){ header{padding:15px 48px} nav{gap:28px} nav a,nav .nav-drop-btn{letter-spacing:.26em;font-size:.64rem} } /* === UI/UX改修（ヘッダー共通）ここまで ================================ */ /* === ナビ改修 意匠（加護の間・層の可視化）2026-07-31 ================== §3-2 ・.nav-drop 系 … ヘッダーの「加護の間」ドロップダウン（層II） ・.mm-group / .mm-note … モバイルメニューで層Iと層IIを見た目で分ける ・footer > .f-copy:first-child … 層III「お社について」の導線行 ⚠ .nav-drop-note / .mm-note の文言は HTML 側の静的既定値（平時＝「ご契約で開きます」） が正。キャンペーン中の文言は free-campaign.js の data-fc-text が上書きする。 CSSにもHTMLにもキャンペーン文言を焼き込まないこと（法務C4-2）。 ⚠ このドロップダウンの傘下に層I（今日の神託・日々の栞・守護の紋）を入れないこと（法務C4-1）。 このコメントから閉じコメントまでを削除すれば、この意匠だけが外れる。 ============================================================================ */ /* --- 層II：加護の間（ヘッダー） -------------------------------------------- */ .nav-drop{position:relative;display:flex;align-items:center} .nav-drop-btn{display:inline-flex;align-items:center;gap:.5em;margin:0;padding:0; background:none;border:0;border-radius:0;cursor:pointer; -webkit-appearance:none;appearance:none; font-family:inherit;font-weight:inherit;line-height:inherit; font-size:.62rem;letter-spacing:.3em;color:#3B3B3B;white-space:nowrap} .nav-drop-btn:hover,.nav-drop.open>.nav-drop-btn{color:#6F5A16} /* 山形は字ではなく罫で描く（環境依存の豆腐を出さないため。字は font-size:0 で隠す） */ .nav-drop-caret{position:relative;display:inline-block;flex:0 0 auto;width:9px;height:9px; font-size:0;line-height:0;transition:transform .3s cubic-bezier(.4,0,.2,1)} .nav-drop-caret::before{content:"";position:absolute;left:1px;top:0;width:5px;height:5px; border-right:1px solid currentColor;border-bottom:1px solid currentColor; transform:rotate(45deg);opacity:.72} .nav-drop.open>.nav-drop-btn .nav-drop-caret{transform:rotate(180deg)} .nav-drop-panel{position:absolute;top:calc(100% + 15px);left:50%; transform:translateX(-50%) translateY(-7px); min-width:212px;max-width:calc(100vw - 32px);padding:2px 0 0;z-index:12; background:linear-gradient(180deg,#F7F6F4 0%,#EDECE8 100%); border:1px solid rgba(215,192,120,0.42); box-shadow:0 14px 34px rgba(60,50,20,0.16),inset 0 1px 0 rgba(255,255,255,0.72); opacity:0;visibility:hidden;pointer-events:none; transition:opacity .26s ease,transform .26s cubic-bezier(.4,0,.2,1),visibility 0s linear .26s} .nav-drop.open>.nav-drop-panel{opacity:1;visibility:visible;pointer-events:auto; transform:translateX(-50%) translateY(0);transition-delay:0s} /* ボタンとパネルの隙間を渡る不可視の橋（ホバー移動の途中で閉じないため） */ .nav-drop-panel::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px} .nav-drop-panel a{display:block;padding:11px 22px; font-size:.6rem;letter-spacing:.26em;line-height:1.5; color:#2A2A2A;text-decoration:none;white-space:nowrap; border-bottom:1px solid rgba(168,168,168,0.26); transition:color .2s,background .2s} .nav-drop-panel a:last-of-type{border-bottom:none} .nav-drop-panel a:hover,.nav-drop-panel a:focus-visible{color:#6F5A16;background:rgba(215,192,120,0.13)} .nav-drop-note{margin:0;padding:10px 22px 12px; font-size:.55rem;letter-spacing:.13em;line-height:1.85;color:#4F4F4F; border-top:1px solid rgba(215,192,120,0.42);background:rgba(215,192,120,0.05)} /* --- 層I／層IIをモバイルメニューで見た目で分ける --------------------------- */ /* 短い画面でも最後の項目まで手が届くように（項目数が増えても下端で切れない） */ .mobile-menu{max-height:calc(100vh - 56px);overflow-y:auto;overscroll-behavior:contain} .mobile-menu a{position:relative} .mm-group{display:block;padding:16px 28px 9px; font-size:.6rem;letter-spacing:.42em;color:#6F5A16; border-top:1px solid rgba(215,192,120,0.42); border-bottom:1px solid rgba(168,168,168,0.24); background:rgba(215,192,120,0.07)} /* 加護の間の傘下（.mm-note より前のリンク）は一段内側へ寄せ、頭に短い金の罫を置く */ .mobile-menu .mm-group ~ a{padding-left:46px;color:#3B3B3B} .mobile-menu .mm-group ~ a::before{content:"";position:absolute;left:28px;top:50%; width:9px;height:1px;background:rgba(215,192,120,0.75);transform:translateY(-50%)} .mm-note{margin:0;padding:12px 28px 13px; font-size:.62rem;letter-spacing:.13em;line-height:1.8;color:#4F4F4F; background:rgba(215,192,120,0.05); border-bottom:1px solid rgba(168,168,168,0.32)} /* 傘下はここで終わり。以降（ログイン）は層の外へ戻す */ .mobile-menu .mm-note ~ a{padding-left:28px;color:#2A2A2A} .mobile-menu .mm-note ~ a::before{content:none} /* --- 層III：お社について（フッター最上段） ---------------------------------- */ footer{flex-wrap:wrap} footer > .f-copy:first-child{text-align:center; font-size:.58rem;letter-spacing:.24em;line-height:2;color:var(--ink-mid)} footer > .f-copy:first-child a{color:inherit} footer > .f-copy:first-child a:hover{color:#6F5A16} @media(min-width:769px){ footer > .f-copy:first-child{flex:0 0 100%; padding-bottom:13px;margin-bottom:5px; border-bottom:1px solid var(--gold-rim)} } @media(prefers-reduced-motion:reduce){ .nav-drop-panel,.nav-drop-caret{transition:none} } /* === ナビ改修 意匠 ここまで =========================================== */ /* ===== 案C-BEGIN ===== */ /* ============================================================================ §V タイポグラフィ共通規格（案C・2026-08-06 追記／既存セレクタ非改変） 21書§0-4 が定めながら実装が1件も無かった（全CSS grep 0件）ものを実装する。 字間・文字数・文言には一切触れず、カーニングと折返しだけを底上げする。 すべて Baseline 済み or 非対応ブラウザで自然縮退する宣言のみ。 ============================================================================ */ /* §V-1. 見出しの詰め組みと行割れ防止（本文はベタ組みのまま＝長文の可読性優先） */ h1, h2, h3, .sect-title, .panel-title, .hx-band-caption__title, .hx-door__name, .kt-book__theme, .kt-book__section-title, .wk-book__title, .wk-days__date{ font-kerning: normal; font-feature-settings: "palt" 1; text-wrap: balance; } /* §V-2. 段末の一字残り（オーファン）の軽減。Chrome117+、非対応は無害 */ p, li, .sect-lead, .hx-band-caption__lead, .hx-door__desc, .hx-door__state, .kt-book__text, .kt-book__closing-text, .wk-days__text, .wk-legend__note, .disclaimer-body, .disclaimer-note{ text-wrap: pretty; } /* §V-3. 禁則の厳格化（行頭の音引き・拗促音） */ body{ line-break: strict; } /* §V-4. 数値の等幅（桁が揺れない） */ .hx-num, .wk-legend__range, .wk-days__score, .wk-chart__value-label{ font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; } /* §V-5.「読む面」の行長規律（共通規定 38em の適用クラス） */ .hx-prose{ max-width: 38em; margin-inline: auto; line-height: 2.0; hanging-punctuation: first allow-end; /* Safariのみ効く累進強化 */ } .hx-prose--letter{ line-height: 2.2; } /* ============================================================================ §W 整流ブロック（案C・2026-08-06） 実測で確定した「読めない・揃わない」を、値の追加だけで根治する。 ============================================================================ */ /* ---- §W-1. 紙の島には、紙の墨を ------------------------------------------ 夜相ページ（body.night / .kt-page / .wk-page）の中に置かれた cream パネル （.kt-book / .wk-book ＝ --night-paper #F4F2ED）の子孫が、ページ側の夜相 インク（--night-ink #E9E6DE）を継承したままだった。実測： weekly .rite-nav-list a 1.11:1（事実上不可視） weekly .wk-legend__* 2.28:1 同型は kantei.html の [data-koku="yoru"]（夜）でも構造的に成立する。 子孫のCSSを1行も書き換えず、容器側でトークンの値だけを差し替える （＝この宣言ブロックを消せば完全に元へ戻る）。 */ .kt-book, .wk-book{ --night-ink: var(--ext-paper-ink, #191919); /* on #F4F2ED = 15.71:1 */ --night-ink-muted: var(--ext-paper-ink-muted, #5F5F5F); /* = 5.71:1 */ --night-gold: var(--ext-paper-gold, #6F5A16); /* = 5.96:1 */ --night-gold-lt: var(--ext-paper-gold-lt, #83691E); /* = 4.86:1 */ --ink: var(--ext-paper-ink, #191919); --ink-mid: var(--ext-paper-ink, #191919); --ink-muted: var(--ext-paper-ink-muted, #5F5F5F); --gold: var(--ext-paper-gold, #6F5A16); --gold-lt: var(--ext-paper-gold-lt, #83691E); } /* 紙の上に載る「夜のカード」＝非会員ロックだけは夜の墨へ戻す （地が --night-surface の濃紺のため。戻さないと暗地に暗字になる） */ .kt-book .hx-lock__card, .wk-book .hx-lock__card{ --night-ink:#E9E6DE; --night-ink-muted:#A5A29B; --night-gold:#C9A84C; --night-gold-lt:#D7C078; --ink:#E9E6DE; --ink-mid:#E9E6DE; --ink-muted:#A5A29B; --gold:#C9A84C; --gold-lt:#D7C078; } /* ---- §W-1b. トークン再割当てだけでは届かない「継承してくる墨」を止める -------- 🔴 2026-08-06 統合時に全刻走査で発見（案A/B/Cいずれも検出していない既存欠陥）。 実測：kantei.html を data-koku="yoru" にすると、紙パネル .kt-book の中で .kt-book__period-name（「朝」「昼」「夕」「夜」） CR 1.01:1 .kt-book__guard（その刻の守護＝会員向け本文） CR 1.01:1 .kt-book__guard-label（「この刻の守護」） CR 1.81:1 が事実上不可視だった（12件）。※この欠陥は夜の刻にしか現れない。 なぜ §W-1 のトークン再割当てで直らなかったか： body.kt-page は `color:var(--night-ink)` を **body 自身に**宣言している。 var() は宣言のある要素で解決されるため、body の color は #E9E6DE に 確定してから子孫へ **計算値のまま継承**される。子孫が自前の color 宣言を 持たない限り、途中で --night-ink を差し替えても再評価は起きない。 → 「自前の color を持つ要素」（rite-nav・凡例等）は §W-1 で直り、 「継承だけの要素」（刻名・守護文）は直らなかった、という差が出ていた。 処置：紙パネル自身に color を宣言させ、継承の起点を紙の墨へ置き換える。 あわせて刻アクセント（--kt-koku-accent）は body 側で夜の金のままなので、 紙の上では紙用の金へ落とす。いずれも値の追加のみで子孫CSSは無改変。 */ .kt-book, .wk-book{ color: var(--ink); /* 継承の起点を紙の墨へ */ --kt-koku-accent: var(--ext-paper-gold, #6F5A16); /* 紙上の金＝5.96:1 */ } /* 夜のカードは地が濃紺なので、継承の起点も夜の墨へ戻す（上の §W-1 と対） */ .kt-book .hx-lock__card, .wk-book .hx-lock__card{ color: var(--ink); --kt-koku-accent:#C9A84C; } /* ---- §W-2. 帯凡例の整流（weekly）----------------------------------------- .wk-legend__item は display:flex のまま flex-wrap を持たず、後から加わった .wk-legend__mood（width:100%）が兄弟を圧殺していた。結果、帯名が 「追い／風の／日」と3行に、数値が「80〜／100」と2行に割れ、5項目めだけが 孤立行になっていた。等幅トラックのグリッドへ置き換え、1件＝1枡に収める。 ページ内