/* brand.css — 担当者・お客様・ログインなど全画面の「形」をそろえる（§125・§127）
 *  各画面の <style> のあとに読み込む（同じ強さの指定なら、こちらが勝つ）。
 *  §127: 色は各画面の元の色（theme.css の orange・各画面の指定）に戻した。ここで決めるのは形だけ
 *        （角の丸み・影・書体）。入口（ログインなど）の地とホーム画面アプリの帯は白。
 *  §128: 担当者の画面の上の帯（コネオペ・設定・お問い合わせ）はオレンジの地に白い文字（設定・ログアウトのボタンは灰色のまま）。
 *        LP（lp.html）と新規契約（signup.html）はこのファイルを読まない（それぞれの色のまま）。
 */
:root{
  --b-ink:#1f1f1f; --b-sub:#6b6b6b; --b-line:#eaeaea; --b-fill:#f1f1f3;
  --b-shadow:0 1px 2px rgba(20,20,40,.04),0 10px 30px rgba(20,20,40,.06);
  --b-shadow-h:0 2px 4px rgba(20,20,40,.05),0 16px 40px rgba(20,20,40,.10);
  --b-ease:cubic-bezier(.2,.75,.2,1); --b-spring:cubic-bezier(.34,1.4,.5,1);
}
html{-webkit-tap-highlight-color:transparent}
body{font-family:"Noto Sans JP",system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
:focus-visible{outline:3px solid rgba(255,140,58,.55);outline-offset:2px}
h1,h2,h3,.toolbar-title{font-feature-settings:"palt"}

/* ── ボタンの動き（色は各画面のまま）── */
.primary,.save-btn,.copy-btn,.onb-entry .go,.rbtn,.act.solid,.cop-pick-btn,.access-submit,.send-btn{
  transition:transform .25s var(--b-spring),box-shadow .25s var(--b-ease),filter .2s,opacity .2s}
.primary:hover,.save-btn:hover,.copy-btn:hover,.onb-entry .go:hover,.rbtn:hover,.act.solid:hover,.cop-pick-btn:hover,.access-submit:hover,.send-btn:hover{transform:translateY(-1px)}
.primary:active,.save-btn:active,.copy-btn:active,.act.solid:active,.cop-pick-btn:active,.send-btn:active{transform:scale(.98)}

/* ── 上の帯（担当者の画面）: オレンジの地に白い文字・白い線のロゴ ── */
.toolbar{background:#ff8c3a!important;border:0;box-shadow:0 6px 18px rgba(255,140,58,.28)!important;border-radius:18px;color:#fff}
.toolbar-title,.toolbar .title,.toolbar h1{color:#fff!important}
.toolbar .t-full,.toolbar .t-short{color:#fff}
.toolbar .toolbar-logo g{stroke:#fff!important}
.toolbar .toolbar-logo>circle{fill:#fff!important}
.toolbar-logo{width:34px!important;height:34px!important}
.toolbar .logout-btn,.toolbar .back-btn,.toolbar a.back,.toolbar .tb-btn{background:var(--b-fill)!important;color:var(--b-ink)!important;border:0!important;border-radius:999px!important;
  font-weight:700!important;min-height:38px;padding:8px 14px!important;transition:background .2s,transform .2s var(--b-spring)}
.toolbar .logout-btn:hover,.toolbar .back-btn:hover,.toolbar a.back:hover{background:#e6e6ea!important;opacity:1!important}
.toolbar .logout-btn:active,.toolbar .back-btn:active{transform:scale(.96)}
.toolbar .toolbar-title .tt-id,.toolbar .toolbar-title .tt-num{color:#fff}

/* ── お問い合わせ一覧 ── */
.thread-card{border-radius:20px!important;border:1px solid rgba(0,0,0,.04);box-shadow:var(--b-shadow)!important;transition:transform .3s var(--b-spring),box-shadow .3s var(--b-ease)!important}
.thread-card:hover{transform:translateY(-2px)!important;box-shadow:var(--b-shadow-h)!important}
.thread-card:active{transform:scale(.99)!important}
.unreplied-badge,.action-badge,.resolved-badge,.waiting-badge{border-radius:999px!important}
.hide-thread-btn{border-radius:999px!important}
.sort-box select{border-radius:12px!important;min-height:40px;padding:6px 12px!important}
.inq-panel{border-radius:16px!important;border:1px solid rgba(0,0,0,.04)!important;box-shadow:var(--b-shadow)!important}

/* ── カード（設定・事業者情報・お支払いの履歴など）── */
.card{border-radius:22px;border:1px solid rgba(0,0,0,.04);box-shadow:var(--b-shadow)}
.notify-test-btn{border-radius:999px!important}
.onb-entry{border-radius:18px!important}
.url-card{border-radius:16px!important}
#planOptions button{border-radius:16px}
.rbtn{border-radius:999px!important}

/* ── お問い合わせ（担当者）: 上の帯はオレンジ・吹き出しは形だけ ── */
.chat-wrapper>.toolbar{border-radius:0!important;box-shadow:none!important;background:#ff8c3a!important}
.chat-wrapper>.toolbar .more-toggle{background:var(--b-fill)!important;color:var(--b-ink)!important}
.bubble.host{border-radius:18px 18px 6px 18px!important}
.chat-wrapper .bubble.customer,.chat-wrapper .bubble.ai{border-radius:18px 18px 18px 6px!important}
.cop-dmhost-pcbar button{border-radius:999px!important;font-weight:700!important;transition:transform .25s var(--b-spring),box-shadow .25s}
#copPcOpenStrategies:hover,#copPcManual:hover{transform:translateY(-1px)}
.cop-host-modal-confirm,.cop-host-modal-cancel,.ai-handoff-btn,.cop-modal-confirm{border-radius:999px!important}
.more-menu{border-radius:16px!important;box-shadow:0 18px 44px rgba(20,20,40,.16)!important;border:1px solid rgba(0,0,0,.05)!important;overflow:hidden}

/* ── お問い合わせ（お客様）: 上の帯は白 ── */
.chat-wrapper>.header{background:rgba(255,255,255,.94)!important;color:var(--b-ink)!important;border-bottom:1px solid var(--b-line);box-shadow:none!important;
  -webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px)}
.chat-wrapper>.header .header-title{color:var(--b-ink)!important}
.btn-mail-reg-top{background:var(--b-fill)!important;color:var(--b-ink)!important;border:0!important}
.btn-end-inquiry,.btn-mail-reg{border-radius:999px!important}
.chat-wrapper .bubble.customer.mine,body.cust .bubble.customer{border-radius:18px 18px 6px 18px!important}
body.cust .bubble.host,body.cust .bubble.ai{border-radius:18px 18px 18px 6px!important}
body.cust .input-area>button{border-radius:999px!important;font-weight:700}
body.cust .input-area textarea{border-radius:18px!important}

/* ── ログイン・再設定などの入口: 白い地（色はボタン・リンクなど各画面のまま）── */
body.auth{background:#fff!important;color:var(--b-ink)}
body.auth::before{content:"";position:fixed;inset:-20%;z-index:-1;pointer-events:none;filter:blur(60px);opacity:.7;
  background:radial-gradient(30% 30% at 20% 15%,rgba(255,154,90,.30),transparent 70%),radial-gradient(30% 30% at 80% 20%,rgba(255,206,150,.36),transparent 70%)}
body.auth .brand .wordmark .title,body.auth .brand .title{color:var(--b-ink)!important}
body.auth .brand .wordmark .subtitle,body.auth .brand .sub{color:var(--b-sub)!important}
body.auth .card{border-radius:26px!important;border:1px solid rgba(0,0,0,.05);box-shadow:0 1px 2px rgba(20,20,40,.04),0 24px 60px rgba(20,20,40,.10)!important}
body.auth input[type=text],body.auth input[type=password],body.auth input[type=email],body.auth input[type=tel]{min-height:50px;border-radius:14px!important}
body.auth button[type=submit],body.auth .cta,body.auth button.main{border-radius:999px!important;min-height:52px;transition:transform .25s var(--b-spring),box-shadow .25s}
body.auth button[type=submit]:hover{transform:translateY(-1px)}
body.auth button.secondary,body.auth .secondary,body.auth .outline,body.auth a.signup,body.auth .btn-signup-secondary{border-radius:999px!important}

/* ── 料金・ガイド・規約（読み物の画面）: 上の帯は白 ── */
body.doc .header{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.88)!important;-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);
  color:var(--b-ink)!important;box-shadow:0 1px 0 rgba(0,0,0,.06)!important;padding:12px 20px!important;min-height:60px}
body.doc .header a,body.doc .header .back{color:var(--b-ink)!important;background:var(--b-fill);border-radius:999px;padding:6px 14px;font-size:15px!important;font-weight:700;text-decoration:none;white-space:nowrap}
body.doc .header h1{color:var(--b-ink)!important}
body.doc .plan-card{border-radius:24px!important}
body.doc .plan-btn{border-radius:999px!important}
body.doc details,body.doc .faq-item{border-radius:18px}
@media (prefers-reduced-motion:reduce){
  .thread-card,.primary,.save-btn,.copy-btn,.toolbar .logout-btn,.toolbar .back-btn{transition:none!important}
}
/* ホーム画面アプリの上（時計の後ろ）: §132 以前の仕様に戻した。ステータスバーは black-translucent（画面が時計の下まで続く）で、
   各画面の上の余白（safe-area-inset-top）にその画面自身の地や上の帯が見える。画面を切り替えても、上だけ別の色（白）にならない。
   ※ default にすると iOS が時計の場所を画面と別に描き、切り替えのたびに白くなる（§125〜§131 の不具合の原因）。帯を重ねて塗る指定も外した */