/* not/on 共有テーマ — ロゴ下のタグライン、NATURE/ZEN/CYBER のテーマ変数、トースト */

/* ロゴ + タグライン（全ページ共通） */
.brand{display:inline-flex;flex-direction:column;gap:2px;line-height:1;text-decoration:none;user-select:none;}
.brand .mark{font-family:var(--serif);font-weight:600;font-size:22px;letter-spacing:-.02em;color:var(--ink);text-decoration:none;}
.brand .mark em{font-style:italic;color:var(--accent);}
.brand .tagline{font-family:var(--ui);font-size:8.5px;font-weight:700;letter-spacing:.14em;color:var(--faint);cursor:pointer;width:max-content;}
.brand .mark:hover{opacity:.82;}
.brand .tagline:hover{color:var(--accent);}

/* ZEN — モノクロ */
body[data-theme="zen"]{
  --paper:#F3F3F1;--panel:#FFFFFF;--ink:#1A1A1A;--muted:#6B6B6B;--faint:#A6A6A6;
  --line:#E4E4E2;--line-strong:#CFCFCD;--accent:#1F1F1F;--accent-soft:#ECECEC;--live:#555;--live-soft:#ECECEC;
}
body[data-theme="zen"] img,
body[data-theme="zen"] .cover,
body[data-theme="zen"] .hero{filter:grayscale(1);}

/* CYBER — ネオン */
body[data-theme="cyber"]{
  --paper:#0A0B12;--panel:#11131F;--ink:#E7F2FF;--muted:#7E8FB3;--faint:#4C5878;
  --line:#1F2740;--line-strong:#2C3A5E;--accent:#00EEFF;--accent-soft:#0C2A38;--live:#38FF9D;--live-soft:#0C3326;
}
body[data-theme="cyber"] .brand .mark em{text-shadow:0 0 12px rgba(0,238,255,.6);}
body[data-theme="cyber"] .authbtn.primary,
body[data-theme="cyber"] .btn.primary{box-shadow:0 0 14px rgba(0,238,255,.45);}

/* 切替トースト */
#themeToast{position:fixed;inset:0;z-index:99999;pointer-events:none;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .28s ease;}
#themeToast.show{opacity:1;}
#themeToast .msg{font-family:var(--ui);font-weight:700;letter-spacing:.32em;font-size:24px;color:var(--accent);background:var(--panel);border:1px solid var(--accent);padding:16px 30px;border-radius:14px;white-space:nowrap;transform:scale(.96);transition:transform .28s ease;box-shadow:0 8px 30px rgba(0,0,0,.12);}
#themeToast.show .msg{transform:scale(1);}
body[data-theme="cyber"] #themeToast .msg{box-shadow:0 0 30px rgba(0,238,255,.4);text-shadow:0 0 12px rgba(0,238,255,.6);}

/* アイコンボタン + ツールチップ（共有） */
.iconbtn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:34px;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--ink);cursor:pointer;text-decoration:none;transition:border-color .15s,color .15s,background .15s;}
.iconbtn:hover{border-color:var(--accent);color:var(--accent);}
.iconbtn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.iconbtn[data-tip]::after{content:attr(data-tip);position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(-4px);background:var(--ink);color:var(--paper);font-family:var(--ui);font-size:11px;font-weight:600;white-space:nowrap;padding:5px 9px;border-radius:7px;opacity:0;pointer-events:none;transition:opacity .15s ease,transform .15s ease;z-index:200;box-shadow:0 4px 14px rgba(0,0,0,.18);}
.iconbtn[data-tip]:hover::after{opacity:1;transform:translateX(-50%) translateY(0);}