/* IdolWatch Festival Planner — フロント (Estilo Material AI) */
.fesp-root{
	--blue:#4285F4; --red:#EA4335; --yellow:#FBBC05; --green:#34A853;
	--white:#fff; --grey:#F8F9FA; --line:#e4e6ea; --ink:#3C4043; --muted:#80868b;
	--radius:8px; --shadow:0 2px 12px rgba(0,0,0,.06);
	font-family:"Roboto","Helvetica Neue",Arial,sans-serif; color:var(--ink);
	background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
	box-shadow:var(--shadow); overflow:hidden; max-width:1280px; margin:0 auto; line-height:1.6;
}
.fesp-root *{ box-sizing:border-box; }
.fesp-root .mono{ font-family:"JetBrains Mono",ui-monospace,monospace; }
.fesp-empty{ padding:20px; color:#80868b; text-align:center; font-family:"Roboto",sans-serif; }

/* ヘッダー */
.fesp-head{ display:flex; align-items:center; gap:10px; padding:14px 16px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.fesp-title{ font-weight:700; font-size:1.25rem; margin:0; }
.fesp-sp{ flex:1; }
.fesp-btn{ appearance:none; cursor:pointer; font:600 .875rem "Roboto",sans-serif; border-radius:var(--radius);
	padding:8px 14px; border:1.5px solid var(--line); background:var(--white); color:var(--ink);
	display:inline-flex; align-items:center; gap:6px; transition:background .2s ease-out, box-shadow .2s ease-out, transform .1s ease-out; }
.fesp-btn:hover{ background:var(--grey); }
.fesp-btn:active{ transform:translateY(1px); }
.fesp-btn .ic{ width:16px; height:16px; }
.fesp-btn.primary{ background:var(--blue); color:#fff; border-color:var(--blue); }
.fesp-btn.primary:hover{ background:#3367d6; box-shadow:0 2px 6px rgba(66,133,244,.35); }

/* タブ類 */
.fesp-tabs{ display:flex; gap:6px; padding:10px 16px 0; flex-wrap:wrap; }
.fesp-pill{ appearance:none; cursor:pointer; border:1px solid var(--line); background:var(--white); color:var(--muted);
	font:500 .85rem "Roboto",sans-serif; padding:6px 12px; border-radius:999px; transition:all .2s ease-out; }
.fesp-pill.is-active{ background:#e8f0fe; border-color:var(--blue); color:#174ea6; }
.fesp-seg{ display:inline-flex; border:1px solid var(--line); border-radius:999px; overflow:hidden; }
.fesp-seg button{ appearance:none; cursor:pointer; border:0; background:var(--white); color:var(--muted);
	font:500 .85rem "Roboto",sans-serif; padding:6px 14px; transition:all .2s ease-out; }
.fesp-seg button.is-active{ background:var(--blue); color:#fff; }

/* 凡例 */
.fesp-legend{ display:flex; gap:14px; flex-wrap:wrap; padding:10px 16px 4px; font-size:.78rem; color:var(--muted); }
.fesp-legend i{ width:11px; height:11px; border-radius:3px; display:inline-block; vertical-align:-1px; margin-right:4px; }

/* ===== 全体タイムテーブル（横スクロール許可） ===== */
.fesp-grid-wrap{ overflow-x:auto; padding:8px 16px 16px; -webkit-overflow-scrolling:touch; }
.fesp-grid{ display:flex; gap:6px; width:100%; }
.fesp-gutter{ width:42px; flex:none; position:relative; }
.fesp-gutter .lab{ position:absolute; right:4px; font-size:10px; color:var(--muted); transform:translateY(-50%); }
.fesp-col{ flex:1 0 150px; min-width:150px; }
.fesp-col-head{ position:sticky; top:0; text-align:center; font:500 .8rem "Roboto",sans-serif;
	color:#fff; padding:6px 4px; border-radius:6px 6px 0 0; margin-bottom:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fesp-col-body{ position:relative; border-left:1px solid var(--line); }
.fesp-gridline{ position:absolute; left:0; right:0; border-top:1px dashed #eef0f2; }

.fesp-slot{ position:absolute; left:2px; right:2px; border-radius:6px; padding:2px 5px; overflow:hidden; cursor:pointer;
	border:1px solid rgba(0,0,0,.12); background:var(--white); transition:transform .15s ease-out, box-shadow .2s ease-out; }
.fesp-slot:hover{ box-shadow:0 2px 8px rgba(0,0,0,.15); z-index:5; }
.fesp-slot .nm{ font-size:11px; font-weight:500; line-height:1.15; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fesp-slot .tm{ font-size:9px; opacity:.9; line-height:1.05; white-space:nowrap; font-weight:500; }
.fesp-slot.is-picked{ outline:2px solid var(--blue); outline-offset:-2px; }
.fesp-slot.is-conflict{ outline:2px solid var(--red); outline-offset:-2px; background:#fce8e6; }
.fesp-slot .pick-dot{ position:absolute; top:3px; right:3px; width:8px; height:8px; border-radius:50%; background:var(--blue); display:none; }
.fesp-slot.is-picked .pick-dot{ display:block; }
.fesp-slot.is-conflict .pick-dot{ background:var(--red); }

/* 時間未定枠 */
.fesp-untimed{ padding:0 16px 12px; }
.fesp-untimed h4{ font:500 .8rem "Roboto",sans-serif; color:var(--muted); margin:0 0 6px; }
.fesp-untimed .chips{ display:flex; gap:6px; flex-wrap:wrap; }
.fesp-untimed .chip{ font-size:11px; padding:5px 9px; border-radius:6px; border:1px solid var(--line); cursor:pointer; background:var(--white); }
.fesp-untimed .chip.is-picked{ outline:2px solid var(--blue); outline-offset:-2px; }

/* ===== マイタイムテーブル（1カラム） ===== */
.fesp-my{ padding:14px 16px; }
.fesp-my-head{ display:flex; align-items:baseline; gap:8px; margin-bottom:10px; }
.fesp-my-head h3{ margin:0; font-size:1.1rem; font-weight:700; }
.fesp-my-head .sub{ font-size:.8rem; color:var(--muted); }
.fesp-card{ display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-left-width:5px;
	border-radius:var(--radius); padding:8px 10px; margin-bottom:8px; background:var(--white); }
.fesp-card.is-conflict{ border-color:var(--red); border-left-color:var(--red); background:#fdeeec; }
.fesp-card .ctime{ font-family:"JetBrains Mono",monospace; font-size:13px; font-weight:500; width:96px; flex:none; }
.fesp-card .cmain{ flex:1; min-width:0; }
.fesp-card .cstage{ font-size:11px; color:var(--muted); }
.fesp-card .cname{ font-size:14px; font-weight:500; display:flex; align-items:center; gap:6px; }
.fesp-card .cname a{ color:var(--blue); text-decoration:none; }
.fesp-card img.cthumb{ width:30px; height:30px; border-radius:50%; object-fit:cover; flex:none; }
.fesp-card .crm{ cursor:pointer; color:var(--muted); flex:none; }
.fesp-card .crm:hover{ color:var(--red); }

/* 警告 */
.fesp-warns{ padding:0 16px 14px; }
.fesp-warn{ display:flex; gap:9px; align-items:flex-start; border-radius:var(--radius); padding:9px 12px; margin-top:8px; font-size:.82rem; }
.fesp-warn .ic{ width:16px; height:16px; flex:none; margin-top:2px; }
.fesp-warn.conflict{ background:#fce8e6; color:#c5221f; }
.fesp-warn.travel{ background:#fef7e0; color:#a56300; }
.fesp-warn b{ font-weight:500; }

.fesp-myempty{ text-align:center; color:var(--muted); padding:24px; }

/* 自動保存表示 */
.fesp-foot{ display:flex; gap:8px; align-items:center; padding:9px 16px; border-top:1px solid var(--line); background:var(--grey); font-size:.75rem; color:var(--muted); }
.fesp-foot .ic{ width:14px; height:14px; }

@media (max-width:768px){
	.fesp-title{ font-size:1.1rem; }
	.fesp-col{ flex:0 0 132px; min-width:132px; }
}
