:root{--bg: #f9fafb;--surface: #ffffff;--text: #111827;--text-secondary: #6b7280;--text-tertiary: #9ca3af;--border: #e5e7eb;--shadow: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);--radius: 12px;--draft-text: #4b5563;--draft-bg: #f3f4f6;--ready-text: #1d4ed8;--ready-bg: #dbeafe;--shot-text: #047857;--shot-bg: #dcfce7;--posted-text: #6d28d9;--posted-bg: #ede9fe;--toggle-unchecked: #d1d5db;--toggle-checked: #047857}*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;background:var(--bg);color:var(--text);min-height:100dvh;-webkit-font-smoothing:antialiased}#grid-view,#detail-view{min-height:100dvh}#detail-view[hidden],#grid-view[hidden]{display:none!important}#app-header{position:sticky;top:0;z-index:10;background:var(--surface);padding:12px 16px;border-bottom:1px solid var(--border);box-shadow:var(--shadow)}.header-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.header-top h1{font-size:1.15rem;font-weight:700}.search-wrap{position:relative}.search-wrap input{width:140px;padding:6px 10px 6px 30px;border:1px solid var(--border);border-radius:8px;font-size:.8rem;background:var(--bg);color:var(--text);transition:width .2s}.search-wrap input:focus{width:180px;outline:none;border-color:var(--ready-text)}.search-wrap:before{content:"🔍";position:absolute;left:8px;top:50%;transform:translateY(-50%);font-size:.7rem;pointer-events:none}.filter-chips{display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px}.filter-chips::-webkit-scrollbar{display:none}.chip{flex-shrink:0;padding:5px 14px;border-radius:999px;font-size:.75rem;font-weight:500;cursor:pointer;border:1px solid var(--border);background:var(--surface);color:var(--text-secondary);white-space:nowrap;transition:all .15s}.chip.active{border-color:transparent}.chip[data-status=all].active{background:var(--text);color:#fff}.chip[data-status=draft].active{background:var(--draft-bg);color:var(--draft-text);border-color:var(--draft-text)}.chip[data-status=ready].active{background:var(--ready-bg);color:var(--ready-text);border-color:var(--ready-text)}.chip[data-status=shot].active{background:var(--shot-bg);color:var(--shot-text);border-color:var(--shot-text)}.chip[data-status=posted].active{background:var(--posted-bg);color:var(--posted-text);border-color:var(--posted-text)}.progress-row{display:flex;align-items:center;gap:8px;margin-top:8px;font-size:.75rem;color:var(--text-tertiary)}.progress-row .bar{flex:1;height:4px;background:var(--border);border-radius:2px;overflow:hidden}.progress-row .fill{height:100%;background:var(--shot-text);border-radius:2px;transition:width .3s ease;width:0%}#card-grid{display:grid;grid-template-columns:1fr;gap:10px;padding:12px 16px;max-width:600px;margin:0 auto}@media(min-width:768px){#card-grid{grid-template-columns:1fr 1fr;max-width:800px}}.card{background:var(--surface);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow);border:1px solid var(--border);cursor:pointer;transition:transform .1s ease;position:relative}.card:active{transform:scale(.98)}.card-row-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.card-ep{font-size:.7rem;font-weight:700;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-family:monospace}.status-chip{font-size:.65rem;font-weight:600;padding:2px 8px;border-radius:999px;text-transform:capitalize;letter-spacing:.2px}.status-chip.draft{background:var(--draft-bg);color:var(--draft-text)}.status-chip.ready{background:var(--ready-bg);color:var(--ready-text)}.status-chip.shot{background:var(--shot-bg);color:var(--shot-text)}.status-chip.posted{background:var(--posted-bg);color:var(--posted-text)}.card-topic{font-size:1rem;font-weight:600;line-height:1.35;margin-bottom:4px}.card-mechanism{font-size:.85rem;color:var(--text-secondary);margin-bottom:6px}.card-schedule{font-size:.8rem;color:var(--text-tertiary)}.card-bottom{display:flex;justify-content:flex-end;margin-top:10px}.toggle-check{width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;background:none;padding:0;-webkit-tap-highlight-color:transparent}.toggle-check .box{width:24px;height:24px;border-radius:6px;border:2px solid var(--toggle-unchecked);display:flex;align-items:center;justify-content:center;transition:all .2s ease}.toggle-check.checked .box{background:var(--toggle-checked);border-color:var(--toggle-checked)}.toggle-check .box svg{width:14px;height:14px;stroke:#fff;stroke-width:3;fill:none;opacity:0;transition:opacity .15s}.toggle-check.checked .box svg{opacity:1}.card.is-shot .card-topic,.card.is-shot .card-mechanism,.card.is-shot .card-schedule,.card.is-shot .card-ep{text-decoration:line-through;opacity:.55}.card.is-posted .card-topic,.card.is-posted .card-mechanism,.card.is-posted .card-schedule,.card.is-posted .card-ep{text-decoration:line-through;opacity:.4}#detail-view{background:var(--surface);display:flex;flex-direction:column;height:100dvh;max-width:600px;margin:0 auto}.detail-top-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid var(--border);flex-shrink:0;background:var(--surface)}.back-btn{border:none;background:none;font-size:.9rem;cursor:pointer;color:var(--ready-text);font-weight:500;padding:6px 0;-webkit-tap-highlight-color:transparent}.ep-nav{display:flex;align-items:center;gap:8px}.ep-nav-btn{width:36px;height:36px;border:1px solid var(--border);background:var(--bg);border-radius:8px;font-size:1.2rem;font-weight:700;cursor:pointer;color:var(--text);display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent}.ep-nav-btn:disabled{opacity:.3;cursor:default}.ep-nav-btn:active:not(:disabled){background:var(--border)}.ep-indicator{font-size:.8rem;font-weight:600;color:var(--text-secondary);min-width:50px;text-align:center}.detail-hero{padding:14px 16px 10px;border-bottom:1px solid var(--border);flex-shrink:0}.detail-hero h2{font-size:1.25rem;font-weight:700;line-height:1.35}.detail-hero .meta{font-size:.78rem;color:var(--text-secondary);margin-top:6px;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}.tab-row{display:flex;border-bottom:1px solid var(--border);overflow-x:auto;scrollbar-width:none;flex-shrink:0}.tab-row::-webkit-scrollbar{display:none}.tab-btn{flex-shrink:0;padding:10px 16px;border:none;background:none;font-size:.8rem;font-weight:500;color:var(--text-secondary);cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap}.tab-btn.active{color:var(--ready-text);border-bottom-color:var(--ready-text);font-weight:600}.tab-content-area{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:16px}.tab-pane{display:none}.tab-pane.active{display:block}.tab-pane{font-size:1.05rem;line-height:1.85}.tab-pane h3{font-size:1.05rem;font-weight:700;margin:24px 0 10px;color:var(--ready-text)}.tab-pane h3:first-child{margin-top:0}.tab-pane strong{font-weight:700;color:var(--text)}.tab-pane em{font-style:italic;color:var(--text-secondary);font-size:.95rem}.tab-pane p{margin-bottom:10px}.tab-pane table{width:100%;border-collapse:collapse;font-size:.9rem;margin:12px 0 18px;display:block;overflow-x:auto}.tab-pane th,.tab-pane td{padding:8px 10px;border:1px solid var(--border);text-align:left;white-space:nowrap}.tab-pane th{background:var(--bg);font-weight:600}.tab-pane ul{padding-left:20px;margin:8px 0}.tab-pane li{margin:4px 0;line-height:1.7}.action-bar{padding:10px 16px;padding-bottom:max(10px,env(safe-area-inset-bottom));border-top:1px solid var(--border);background:var(--surface);flex-shrink:0}.action-btn{display:block;width:100%;padding:14px;border:none;border-radius:10px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .15s}.action-btn.ready{background:var(--shot-text);color:#fff}.action-btn.shot{background:var(--bg);color:var(--text-secondary);border:1px solid var(--border)}.action-btn:active{transform:scale(.98)}.prompt-bar{display:flex;gap:6px;margin-bottom:16px;flex-wrap:wrap}.prompt-btn{padding:10px 16px;border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:10px;font-size:.85rem;font-weight:600;cursor:pointer;-webkit-tap-highlight-color:transparent;flex:1;min-width:0;text-align:center}.prompt-btn.prompt-play{background:var(--ready-bg);color:var(--ready-text);border-color:var(--ready-text);flex:1.5}.prompt-btn:active{opacity:.7;transform:scale(.97)}.empty-state{text-align:center;padding:48px 16px;color:var(--text-tertiary);font-size:.88rem}
