/* ==========================================================================
   plaisir_app 共通スタイル（kyouwadx_app の配色・作法に合わせる）
   幅375px（スマホ）で横はみ出しなく操作できること。タップ対象は最小44px。
   表は横スクロール枠に入れる。
   ========================================================================== */
:root{
  --bg:#f4f6f8; --panel:#fff; --ink:#1c2733; --sub:#5b6b7c; --line:#dbe2ea;
  --accent:#1f6feb; --accent-d:#1656bb; --ok:#127a3d; --ok-bg:#e6f4ec;
  --warn:#9a6400; --warn-bg:#fff5e0; --bad:#b3261e; --bad-bg:#fdecea;
  --gray:#8b98a5; --gray-bg:#eef1f4; --now:#1f6feb; --now-bg:#e8f0fe;
  --radius:10px; --tap:44px;
  --shadow:0 1px 2px rgba(16,32,48,.06), 0 2px 8px rgba(16,32,48,.05);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg); color:var(--ink);
  font:15px/1.65 "Segoe UI","Yu Gothic UI","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
  -webkit-text-size-adjust:100%; overflow-x:hidden}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{line-height:1.35; margin:0 0 .5em}
h1{font-size:19px} h2{font-size:16.5px} h3{font-size:15px; margin-top:.8em}
p{margin:.4em 0}
.sub{color:var(--sub); font-size:13px}
.src{color:var(--gray); font-size:11.5px}

/* ---------- 検証環境の帯（本番でない状態は全画面に出す） ---------- */
.band{background:#6b4a00; color:#ffe6a8; text-align:center; font-size:12.5px; padding:4px 8px; font-weight:700}

/* ---------- ヘッダー・ナビ ---------- */
.hd{position:sticky; top:0; z-index:50; background:#16283c; color:#fff; box-shadow:var(--shadow)}
.hd-top{display:flex; align-items:center; gap:10px; padding:8px 12px; min-height:var(--tap)}
.hd-title{font-weight:700; font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.hd-title a{color:#fff}
.hd-me{margin-left:auto; display:flex; align-items:center; gap:8px; font-size:12.5px; white-space:nowrap}
.hd-me .nm{font-weight:600}
.hd-out{background:rgba(255,255,255,.14); color:#fff; border:0; border-radius:6px; padding:7px 10px;
  font-size:12.5px; cursor:pointer; min-height:34px}
.nav{display:flex; gap:2px; overflow-x:auto; padding:0 6px 6px; scrollbar-width:thin}
.nav a{color:#c9d8e6; padding:9px 12px; border-radius:7px; white-space:nowrap; font-size:14px;
  min-height:40px; display:flex; align-items:center}
.nav a:hover{background:rgba(255,255,255,.10); text-decoration:none; color:#fff}
.nav a.on{background:#2f5f8f; color:#fff; font-weight:600}

/* ---------- レイアウト ---------- */
.wrap{width:100%; max-width:1080px; margin:0 auto; padding:14px 12px 60px}
.card{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius);
  padding:14px; margin:0 0 14px; box-shadow:var(--shadow)}
.card>h2:first-child{margin-top:0}
.row{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
.row.sp{justify-content:space-between}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
@media (max-width:760px){ .grid2{grid-template-columns:1fr} }
.empty{color:var(--gray); font-size:13.5px; padding:6px 0}
.lead{font-size:14px; color:var(--sub); margin:-4px 0 10px}

/* ---------- ボタン・入力 ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:4px;
  background:var(--accent); color:#fff; border:0; border-radius:8px; padding:8px 14px;
  font-size:14px; font-weight:600; cursor:pointer; min-height:var(--tap); font-family:inherit}
.btn:hover{background:var(--accent-d); text-decoration:none}
.btn.sec{background:#fff; color:var(--ink); border:1px solid var(--line)}
.btn.sec:hover{background:var(--gray-bg)}
.btn.sm{min-height:34px; padding:5px 10px; font-size:13px}
.btn.bad{background:var(--bad)}
.btn[disabled]{opacity:.55; cursor:default}
input[type=text],input[type=email],input[type=date],select,textarea{
  width:100%; font:inherit; font-size:16px; padding:9px 10px; border:1px solid var(--line);
  border-radius:8px; background:#fff; color:var(--ink); min-height:var(--tap)}
textarea{min-height:90px; resize:vertical}
label.f{display:block; font-size:13px; color:var(--sub); margin:8px 0 3px}

/* ---------- バッジ ---------- */
.b{display:inline-block; border-radius:10px; padding:1px 8px; font-size:12px; font-weight:600;
  background:var(--gray-bg); color:var(--sub); white-space:nowrap}
.b.them{background:#fdf0e6; color:#8a4b12}
.b.us{background:#e8f0fe; color:#1656bb}
.b.judge{background:#f3e8fd; color:#6a2fa0}
.b.ok{background:var(--ok-bg); color:var(--ok)}
.b.warn{background:var(--warn-bg); color:var(--warn)}
.b.bad{background:var(--bad-bg); color:var(--bad)}

/* ---------- ガント（柱×フェーズ） ---------- */
.scroll{overflow-x:auto; -webkit-overflow-scrolling:touch}
table.plan{border-collapse:separate; border-spacing:4px; width:100%; min-width:680px; table-layout:fixed}
table.plan th{font-size:13px; color:var(--sub); font-weight:600; text-align:left; padding:4px 6px}
table.plan th.pl{width:120px; color:var(--ink); font-size:14px; vertical-align:top; padding-top:10px}
table.plan td{background:var(--gray-bg); border-radius:8px; padding:8px; font-size:12.5px; vertical-align:top; line-height:1.5}
table.plan td.done{background:var(--ok-bg)}
table.plan td.now{background:var(--now-bg); outline:2px solid var(--now)}
table.plan td .tag{display:block; font-size:11.5px; font-weight:700; color:var(--now); margin-bottom:2px}
.here{font-size:15px; font-weight:700}
ul.notes{margin:6px 0 0; padding-left:1.2em; font-size:13.5px}

/* ---------- 一覧 ---------- */
ul.list{list-style:none; margin:0; padding:0}
ul.list>li{border-top:1px solid var(--line); padding:10px 2px}
ul.list>li:first-child{border-top:0}
.ttl{font-weight:600}
.meta{font-size:12.5px; color:var(--sub)}
.item-done .ttl{color:var(--gray); text-decoration:line-through}
.over{color:var(--bad); font-weight:600}

/* ---------- 構想 ---------- */
.concept-title{font-size:18px; font-weight:700; line-height:1.45}
.sec-h{font-size:13px; font-weight:700; color:var(--sub); margin:14px 0 4px; letter-spacing:.05em}
ul.bul{margin:0; padding-left:1.2em}
ul.bul li{margin:3px 0}

/* ---------- チャット ---------- */
.post{border-top:1px solid var(--line); padding:10px 2px}
.post:first-child{border-top:0}
.post .who{font-weight:600; font-size:13.5px}
.post .body{white-space:pre-wrap; word-break:break-word; margin-top:2px}
.post.gone .body{color:var(--gray); font-style:italic}

/* ---------- 資料 ---------- */
.thumb{max-width:100%; max-height:260px; border:1px solid var(--line); border-radius:8px; display:block; margin-top:6px}
.pre{white-space:pre-wrap; word-break:break-word; font-size:14px}

/* ---------- モーダル・トースト ---------- */
.modal{position:fixed; inset:0; background:rgba(16,32,48,.45); z-index:100; display:flex;
  align-items:flex-start; justify-content:center; padding:24px 10px; overflow-y:auto}
.modal .box{background:#fff; border-radius:12px; width:100%; max-width:560px; padding:16px; box-shadow:var(--shadow)}
.modal .foot{display:flex; gap:8px; justify-content:flex-end; margin-top:14px}
.toast{position:fixed; left:50%; bottom:18px; transform:translateX(-50%); z-index:200;
  background:#16283c; color:#fff; padding:10px 16px; border-radius:10px; font-size:14px; max-width:92vw}
.toast.err{background:var(--bad)}
details>summary{cursor:pointer; color:var(--sub); font-size:13px; min-height:32px}

/* ---------- ログイン ---------- */
.login{max-width:420px; margin:40px auto; padding:0 12px}