/* C×A 1案：最初の画面のキャッチ（2026-10-28 松原さん「A と同じフォント・文字間隔に。目視で中央に」）
   - 「３６０°の感動を。」は A（ab/site.css の .copy-heading h1）と同じ：Noto Sans JP 500・24px・行の高さ29px・
     文字ごとの字間（３６ −5.28／０ −2.64／°の 3.6／感 3.36／動 2.88／を。 0.72）。数字は A と同じ全角。中身は add.js
   - 英文も A と同じ：12px・字間2px・500・行の高さ18px・上に12px。「Beauty, Made for Your Life.」（カンマのあとに空き）
   - 中央：2行と白い円を、すべて画面の中心にそろえる（円はこれまで 4px 左に寄っていた）。
     見た目の中心は文字の形（インク）で測って合わせる。「。」の右の空きと最後の字間で、箱の中心だと左に寄って見えるため */
html[data-variant="3"] .travelling-circle{left:50%!important}
html[data-variant="3"] .portrait-copy{left:0!important;right:0!important;width:auto!important;transform:none!important;display:flex!important;flex-direction:column;align-items:center}
html[data-variant="3"] .portrait-copy h1{font-family:'Noto Sans JP',sans-serif!important;font-weight:500!important;font-size:24px!important;line-height:1.2083!important;height:auto!important;letter-spacing:.03em!important;white-space:nowrap;width:max-content;margin:0!important;color:var(--red);transform:translateX(var(--copy-h1-shift,0px))}
html[data-variant="3"] .portrait-copy h1 span{display:inline!important;font:inherit!important}
html[data-variant="3"] .portrait-copy h1 span:last-child{margin-right:-.03em}
html[data-variant="3"] .portrait-copy p{font-family:'Noto Sans JP',sans-serif!important;font-weight:500!important;font-size:12px!important;line-height:1.5!important;letter-spacing:.1667em!important;width:max-content!important;margin:12px 0 0!important;text-align:center!important;white-space:nowrap;transform:translateX(var(--copy-p-shift,0px))}
/* 測った結果（390px幅・2倍の画素で、インクの左右の端から中心を出す）：見出しは 5.5px、英文は 1px 左に寄っていた → その分だけ右へ
   11-02：字間・行の高さ・寄せを em に（24px で同じ値）。大きさを変えても組み方がそのまま大きくなる（PC・タブレットは add-pc.css で文字の大きさだけ変える） */
html[data-variant="3"] .portrait-copy{--copy-h1-shift:.2292em;--copy-p-shift:.0833em}
/* 16時13分 松原さん「コピーの視認性が少し悪い」→ 白い円を少しだけ濃く（最初の画面で .4 → .5）。
   スクロールで円が広がるときに濃くなる動き（scene.js：.4 → .78）はそのまま。.5 より薄くならないようにしただけ */
html[data-variant="3"] .circle-surface{background:rgba(255,255,255,max(.5,var(--circle-alpha,.4)))!important}