/* master.html 専用スタイル
   元コード: web/master.html:11-99（分割時点の HEAD 基準・2026-07-19） */
/* 2026-07-23 (Round 14 CSS-Agent R1-HC #32): 100dvh 併記で iOS Safari URL バー分の見切れを回避。 */
body { background:#0a0a14; color:#fff; font-family:-apple-system,sans-serif; padding:0; margin:0; min-height:100vh; min-height:100dvh; }
.wrap { max-width:1100px; margin:0 auto; padding:40px 20px; }
.hero { text-align:center; padding:28px 0; margin-bottom:30px; }
.hero h1 { margin:0 0 8px; color:#f0b73a; font-size:28px; }
.hero p { margin:0; color:#888; font-size:14px; }
.lock-card { max-width:420px; margin:60px auto; padding:30px; border-radius:14px; background:#1a1a2e; border:1px solid #2a2a4a; text-align:center; }
.lock-card h2 { color:#f0b73a; margin:0 0 16px; }
.lock-card input { width:100%; padding:14px; font-size:18px; text-align:center; letter-spacing:0.4em; background:#0a0a14; border:1px solid #2a2a4a; border-radius:8px; color:#fff; box-sizing:border-box; margin:14px 0; }
.lock-card button { width:100%; padding:14px; font-size:16px; background:linear-gradient(135deg,#5b8cff,#7c3aed); border:0; border-radius:8px; color:#fff; font-weight:bold; cursor:pointer; }
.lock-card .hint { font-size:12px; color:#666; margin-top:14px; }
.lock-card .err { color:#f87171; font-size:13px; margin-top:10px; min-height:18px; }
/* sm0006: 初期設定画面 (Step 1/2 とも) は 32 文字 Base32 秘密鍵を収めるため幅拡張 */
#init-view.lock-card,
#init-confirm-view.lock-card { max-width:560px; }
#init-view #init-secret-input,
#init-confirm-view #init-secret-display { font-size:14px; letter-spacing:0.12em; text-align:center; padding:12px 10px; }
#init-confirm-view #init-secret-display { color:#9ca3af; cursor:not-allowed; background:#0a0a14; }
#init-confirm-view #init-qr-canvas { max-width:100%; height:auto; background:#fff; border-radius:8px; }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:18px; }
/* 2026-07-23 (Round 13-2 B-5): transition: all を明示リスト化 */
.co-card { background:linear-gradient(135deg,#1a1a2e,#15192a); border:1px solid #2a2a4a; border-radius:14px; padding:24px 20px; cursor:pointer; text-align:center; transition: transform .15s, background .15s, border-color .15s, box-shadow .15s, color .15s, opacity .15s; position:relative; }
.co-card:hover { transform:translateY(-3px); border-color:#5b8cff; box-shadow:0 8px 20px rgba(91,140,255,.3); }
.co-card .logo { width:64px; height:64px; border-radius:16px; display:grid; place-items:center; font-size:30px; font-weight:bold; color:#fff; margin:0 auto 14px; overflow:hidden; }
/* 2026-07-24 (Round T3-HC #25): object-position 明示。デフォルト値 (50% 50%) と同一のため
   視覚差ゼロだが、横長ロゴ (aspect > 1) のクロップ位置がブラウザ間で微差ある問題を根絶。 */
.co-card .logo img { width:100%; height:100%; object-fit:cover; object-position:center; border-radius:16px; }
.co-card .name { font-size:14px; font-weight:700; margin-bottom:6px; }
.co-card .id { font-size:10px; color:#666; }
.co-card .badge { position:absolute; top:8px; right:8px; font-size:10px; padding:3px 7px; border-radius:999px; background:rgba(74,222,128,.2); color:#4ade80; }
.co-card .upload-btn { position:absolute; top:8px; left:8px; font-size:11px; padding:4px 8px; border-radius:999px; background:rgba(91,140,255,.2); color:#5b8cff; cursor:pointer; opacity:0; transition:opacity .2s; border:0; }
.co-card:hover .upload-btn { opacity:1; }
.co-card .del-btn { position:absolute; bottom:8px; right:8px; font-size:11px; padding:4px 8px; border-radius:999px; background:rgba(248,113,113,.18); color:#f87171; cursor:pointer; opacity:0; transition:opacity .2s; border:0; font-weight:bold; }
.co-card:hover .del-btn { opacity:1; }
.co-card .del-btn:hover { background:#7f1d1d; color:#fff; }
.co-card .num-badge { position:absolute; bottom:8px; left:8px; font-size:11px; padding:3px 8px; border-radius:6px; background:rgba(240,183,58,.15); color:#f0b73a; font-family:Menlo,Consolas,monospace; font-weight:bold; letter-spacing:.04em; cursor:pointer; }
.co-card .num-badge:hover { background:rgba(240,183,58,.3); }
/* 2026-07-23 (Round 15 CSS-Agent S3-HC #18): `initial` は仕様上 `serif` に revert する誤用。
   `revert` は継承チェーン (body → :root → UA default) を辿るため意図と合致。
   絵文字 ✏️ の描画は font-family に依存せず OS emoji font にフォールバックするため視覚差ゼロ。 */
.co-card .num-badge::before { content:'✏️ '; opacity:0; transition:opacity .15s; font-family:revert; }
.co-card:hover .num-badge::before { opacity:1; }
.co-card.add { background:rgba(91,140,255,.05); border:2px dashed #2a2a4a; }
.co-card.add:hover { border-color:#4ade80; background:rgba(74,222,128,.05); }
.co-card.add .logo { background:none; font-size:36px; color:#4ade80; }
.toolbar { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; gap:10px; flex-wrap:wrap; }
.toolbar .info { font-size:13px; color:#888; }
.toolbar button { background:#2a2a4a; color:#fff; border:0; padding:8px 14px; border-radius:6px; cursor:pointer; font-size:13px; }
.toolbar button:hover { background:#3a3a5a; }

/* ===== 会社を新しく作る モーダル(2026-06-15 オーナー主導線・行き止まりゼロ) ===== */
.cc-overlay { position:fixed; inset:0; background:rgba(0,0,0,.72); z-index:10000; display:none; align-items:flex-start; justify-content:center; padding:24px 16px; overflow-y:auto; -webkit-overflow-scrolling:touch; }
.cc-overlay.show { display:flex; }
.cc-modal { background:#1a1a2e; border:1px solid #2a2a4a; border-radius:16px; width:100%; max-width:520px; margin:auto; padding:28px 26px; color:#fff; box-sizing:border-box; box-shadow:0 16px 50px rgba(0,0,0,.5); }
.cc-modal h2 { margin:0 0 6px; color:#4ade80; font-size:22px; }
.cc-modal .lead { margin:0 0 22px; font-size:13px; color:#9aa3b8; line-height:1.7; }
.cc-field { margin-bottom:18px; }
.cc-field label { display:block; font-size:14px; font-weight:700; margin-bottom:7px; color:#e6edf3; }
.cc-field label .req { color:#f0b73a; font-size:12px; margin-left:6px; }
.cc-field label .opt { color:#6b7280; font-size:12px; margin-left:6px; font-weight:normal; }
.cc-field .desc { font-size:12px; color:#8a93a8; margin:0 0 8px; line-height:1.6; }
.cc-field input[type=text], .cc-field input[type=email] { width:100%; box-sizing:border-box; padding:13px 14px; font-size:16px; background:#0a0a14; border:1px solid #2a2a4a; border-radius:9px; color:#fff; }
.cc-field input:focus { outline:none; border-color:#5b8cff; }
/* 2026-07-23 (Round 14 CSS-Agent R2-HC #33 / R3-HC #9): キーボード focus 時のみ outline を復活 (WCAG 2.4.7)。
   マウス click 時は :focus のみ発火 → outline:none 維持。Tab キーで移動時は :focus-visible が発火して視認可能に。 */
.cc-field input:focus-visible { outline:2px solid #5b8cff; outline-offset:2px; }
.cc-logo-row { display:flex; gap:14px; align-items:center; }
.cc-logo-preview { width:60px; height:60px; min-width:60px; border-radius:14px; display:grid; place-items:center; font-size:28px; font-weight:bold; color:#fff; background:#5b8cff; overflow:hidden; }
/* 2026-07-24 (Round T3-HC #25): object-position 明示。ロゴプレビューのクロップ位置を中央に固定。 */
.cc-logo-preview img { width:100%; height:100%; object-fit:cover; object-position:center; }
.cc-logo-inputs { flex:1; display:flex; flex-direction:column; gap:10px; }
.cc-logo-inputs .row2 { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.cc-emoji-input { width:74px; box-sizing:border-box; padding:11px 10px; font-size:20px; text-align:center; background:#0a0a14; border:1px solid #2a2a4a; border-radius:9px; color:#fff; }
.cc-color-input { width:54px; height:44px; padding:0; border:1px solid #2a2a4a; border-radius:9px; background:#0a0a14; cursor:pointer; }
.cc-logo-hint { font-size:11px; color:#6b7280; }
.cc-upload-btn { background:#23314f; color:#bcd0ff; border:0; padding:10px 14px; border-radius:8px; font-size:13px; cursor:pointer; }
.cc-upload-btn:hover { background:#2c3d63; }
.cc-err { color:#f87171; font-size:13px; margin:4px 0 0; min-height:18px; line-height:1.6; }
.cc-actions { display:flex; gap:10px; margin-top:24px; flex-wrap:wrap; }
.cc-actions .cc-cancel { background:#374151; color:#fff; border:0; padding:13px 18px; border-radius:9px; font-size:14px; cursor:pointer; }
.cc-actions .cc-submit { flex:1; min-width:180px; background:linear-gradient(135deg,#4ade80,#22c55e); color:#06240f; border:0; padding:14px 18px; border-radius:9px; font-size:15px; font-weight:bold; cursor:pointer; }
.cc-actions .cc-submit:disabled { opacity:.6; cursor:wait; }
/* 成功パネル */
.cc-done { text-align:center; }
.cc-done .done-logo { width:72px; height:72px; border-radius:18px; display:grid; place-items:center; font-size:34px; font-weight:bold; color:#fff; margin:4px auto 14px; overflow:hidden; }
/* 2026-07-24 (Round T3-HC #25): object-position 明示。完了画面ロゴのクロップ位置を中央に固定。 */
.cc-done .done-logo img { width:100%; height:100%; object-fit:cover; object-position:center; }
.cc-done h2 { color:#4ade80; }
.cc-done .done-co { font-size:20px; font-weight:800; margin:2px 0 2px; }
.cc-done .done-owner { font-size:13px; color:#9aa3b8; margin:0 0 22px; }
.cc-enter-btn { display:block; width:100%; box-sizing:border-box; text-align:center; text-decoration:none; background:linear-gradient(135deg,#5b8cff,#7c3aed); color:#fff; font-weight:bold; font-size:17px; padding:18px; border-radius:12px; margin-bottom:14px; }
.cc-enter-btn:active { transform:scale(.99); }
.cc-copy-row { display:flex; gap:8px; align-items:stretch; margin-bottom:8px; }
.cc-copy-row input { flex:1; box-sizing:border-box; padding:11px 12px; font-size:12px; background:#0a0a14; border:1px solid #2a2a4a; border-radius:8px; color:#9bb4ff; }
.cc-copy-row button { background:#23314f; color:#bcd0ff; border:0; padding:0 16px; border-radius:8px; font-size:13px; cursor:pointer; white-space:nowrap; }
.cc-done .note { font-size:12px; color:#8a93a8; line-height:1.7; margin:8px 0 0; }
.cc-done .close2 { margin-top:18px; background:#374151; color:#fff; border:0; padding:11px 22px; border-radius:9px; font-size:14px; cursor:pointer; }
@media (max-width:520px) {
  .cc-overlay { padding:14px 10px; }
  .cc-modal { padding:22px 16px; border-radius:14px; }
  .cc-modal h2 { font-size:20px; }
  .cc-logo-row { flex-direction:column; align-items:stretch; }
  .cc-logo-preview { margin:0 auto; }
  .cc-actions { flex-direction:column-reverse; }
  .cc-actions .cc-cancel, .cc-actions .cc-submit { width:100%; }
}
