/* =====================================================================
   動画編集 案件管理システム — "POKÉ GAME" Design System
   White base · #E01E5A (Crimson Pink) × #36C5F0 (Sky Blue)
   Bold outlines · chunky 3D buttons · game-menu windows
   ===================================================================== */
:root {
  --pk-red:#E01E5A; --pk-red-dk:#B5103F; --pk-red-lt:#FFE7EE; --pk-red-md:#FFC2D4;
  --pk-blue:#36C5F0; --pk-blue-dk:#1E9BC4; --pk-blue-lt:#E4F7FD; --pk-blue-md:#B9EAFA;
  --yel:#FFCB05; --yel-dk:#C7960B; --grn:#4ADE80; --grn-dk:#15803D; --grn-lt:#EAFBF0;
  --vio:#8B5CF6; --vio-lt:#F1EBFF; --org:#FB923C; --org-lt:#FFF1E6; --pink:#F472B6; --pink-lt:#FDEBF5; --amb:#F59E0B; --amb-lt:#FFF7E0;
  --ink:#1F2937; --ink-2:#374151; --muted:#6B7280; --faint:#9CA3AF;
  --line:#1F2937; --line-soft:#E6EAF0; --line-card:#D6DCE6; --bg:#F4F6FA; --panel:#FFFFFF;
  --radius:16px; --radius-sm:12px;
  --bw:2px; /* outline width (buttons / accents) */
  --shadow-flat:0 3px 0 var(--ink);
  --shadow-card:0 2px 0 rgba(31,41,55,.04), 0 8px 24px rgba(31,41,55,.07);
  --font-game:"M PLUS Rounded 1c", "Noto Sans JP", system-ui, sans-serif;
}
html { scroll-behavior:smooth; }
body {
  background:
    radial-gradient(circle at 10% 10%, rgba(54,197,240,.10) 0 160px, transparent 161px),
    radial-gradient(circle at 92% 90%, rgba(224,30,90,.07) 0 200px, transparent 201px),
    var(--bg);
  color:var(--ink-2); font-family:var(--font-game); font-size:15px; line-height:1.55;
}
#main-content { max-width:1600px; }
.text-xs { font-size:12.5px !important; } .text-sm { font-size:14px !important; }
::selection { background:var(--pk-blue-md); }
* { scrollbar-width:thin; scrollbar-color:var(--pk-blue-md) transparent; }
*::-webkit-scrollbar { height:10px; width:10px; } *::-webkit-scrollbar-thumb { background:var(--pk-blue-md); border-radius:10px; border:2px solid #fff; }
h1, h2, h3, h4, .font-bold, .font-semibold { font-family:var(--font-game); }
.tabular-nums { font-variant-numeric:tabular-nums; font-weight:700; }

/* ---------- Sidebar (menu window) ---------- */
#sidebar { background:#fff; color:var(--ink); border-right:2px solid var(--line-card); position:relative; }
#sidebar::before { content:""; position:absolute; inset:0 0 auto 0; height:8px; background:repeating-linear-gradient(90deg, var(--pk-red) 0 24px, var(--pk-blue) 24px 48px); }
#sidebar h1 { color:var(--ink); letter-spacing:.02em; font-weight:900; margin-top:8px; }
#sidebar h1 span.block { color:var(--pk-red) !important; letter-spacing:.2em; font-weight:800; }
#sidebar h1 > span:first-child { background:conic-gradient(from 180deg, var(--pk-red) 0 50%, #fff 50% 100%) !important; border:var(--bw) solid var(--ink); box-shadow:var(--shadow-flat) !important; color:transparent !important; position:relative; }
#sidebar h1 > span:first-child::after { content:""; position:absolute; left:50%; top:50%; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; background:#fff; border:var(--bw) solid var(--ink); box-shadow:0 0 0 2px #fff inset; }
#sidebar h1 > span:first-child i { display:none; }
#sidebar footer { border-top:2px dashed var(--line-soft) !important; }
#sidebar footer p, #sidebar footer button { color:var(--ink-2) !important; }
#sidebar footer .text-slate-400 { color:var(--muted) !important; }
#sidebar footer button:hover { color:var(--pk-red) !important; }
#sidebar footer > div > span:first-child { background:var(--yel) !important; color:var(--ink) !important; font-weight:900; }
.nav-link { display:flex; align-items:center; gap:10px; padding:11px 14px; border-radius:var(--radius-sm); color:var(--ink-2); font-size:15px; font-weight:700; transition:.12s; position:relative; border:2px solid transparent; }
.nav-link i { color:var(--faint); width:20px; text-align:center; transition:.12s; }
.nav-link:hover { background:var(--pk-blue-lt); color:var(--ink); border-color:var(--pk-blue-md); }
.nav-link:hover i { color:var(--pk-blue-dk); }
.nav-link.active { background:var(--pk-red); color:#fff; border-color:var(--pk-red-dk); box-shadow:0 3px 0 var(--pk-red-dk); }
.nav-link.active::before { display:none; }
@keyframes cursorBlink { 50% { opacity:0; } }
.nav-link.active i { color:#fff; }
.mobile-nav { background:#fff !important; border-bottom:2px solid var(--line-card); }
.mobile-nav .nav-link { color:var(--ink-2); white-space:nowrap; }
.mobile-nav .nav-link.active::before { display:none; }
.nav-badge { margin-left:auto; background:var(--yel); color:var(--ink); font-size:11.5px; font-weight:900; min-width:22px; height:22px; padding:0 6px; border-radius:999px; display:inline-flex; align-items:center; justify-content:center; }

/* ---------- Typography ---------- */
h1.text-2xl { font-size:1.55rem; letter-spacing:.01em; color:var(--ink); font-weight:900; position:relative; }
h1.text-2xl::after { content:""; display:block; height:5px; width:110px; background:linear-gradient(90deg, var(--pk-red) 50%, var(--pk-blue) 50%); border-radius:6px; margin-top:6px; }
#main-content header h1.text-2xl::after { display:none; }
#main-content header { padding:12px 18px; margin-bottom:20px !important; background:#fff; border:2px solid var(--line-card); border-radius:var(--radius); box-shadow:var(--shadow-card); }
#main-content header h1.text-2xl { padding-left:30px; }
#main-content header h1.text-2xl::before { content:""; position:absolute; left:0; top:50%; width:20px; height:20px; margin-top:-10px; border-radius:50%; border:2.5px solid var(--ink); background:linear-gradient(180deg, var(--pk-red) 0 50%, #fff 50% 100%); }
.text-slate-900 { color:var(--ink) !important; } .text-slate-800, .text-slate-700 { color:var(--ink-2) !important; }
.text-slate-600, .text-slate-500 { color:var(--muted) !important; } .text-slate-400, .text-slate-300 { color:var(--faint) !important; }

/* ---------- Cards (game windows) ---------- */
.card { background:var(--panel); border-radius:var(--radius); border:2px solid var(--line-card); box-shadow:var(--shadow-card); padding:22px; transition:transform .15s, box-shadow .15s, border-color .15s; position:relative; }
button.card:hover, .card.kanban-card:hover { transform:translateY(-2px); box-shadow:0 10px 28px rgba(31,41,55,.12); border-color:var(--pk-blue-dk); }
.card h2.font-bold, .card h3.font-bold { color:var(--ink); display:flex; align-items:center; font-weight:900; font-size:1.05rem; }
.card h2.font-bold i, .card h3.font-bold i { color:var(--pk-blue-dk) !important; }
.card .ring-2 { box-shadow:0 0 0 3px var(--pk-blue), var(--shadow-card) !important; }
.ring-blue-300 { --tw-ring-color: var(--pk-blue) !important; }
.card.\!p-0 { padding:0; overflow:hidden; }

/* KPI tiles → Pokédex counters */
.card > p.text-2xl, .card > p.text-xl { letter-spacing:-.01em; color:var(--ink); font-weight:900; }
#status-summary .card { padding:12px 14px; border-radius:14px; }
#status-summary .card p.text-xs { font-weight:800; letter-spacing:.04em; color:var(--ink-2); }
#status-summary .card::after { content:""; position:absolute; right:12px; top:12px; width:9px; height:9px; border-radius:50%; background:var(--line-card); }
#status-summary .card:first-child { background:var(--pk-blue-lt); }
#status-summary .card:first-child::after { background:var(--pk-blue); box-shadow:0 0 0 3px rgba(54,197,240,.35); }
#status-summary .card:first-child p.text-2xl { color:var(--pk-blue-dk) !important; }

/* ---------- Inputs ---------- */
.input { width:100%; border:2px solid #C9D1DD; border-radius:var(--radius-sm); padding:10px 13px; font-size:15px; background:#fff; color:var(--ink); transition:.12s; font-family:var(--font-game); font-weight:600; }
.input::placeholder { color:var(--faint); font-weight:400; }
.input:hover { border-color:var(--pk-blue-dk); }
.input:focus { outline:none; border-color:var(--pk-blue-dk); box-shadow:0 0 0 4px var(--pk-blue-md); }
.input:disabled, .input.bg-slate-50 { background:var(--bg) !important; color:var(--muted); border-color:var(--line-soft); box-shadow:none; }
select.input { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='%231F2937'%3E%3Cpath d='M12 16 4 8h16z'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 12px center; padding-right:34px; }
input[type=checkbox] { accent-color:var(--pk-red); width:17px; height:17px; }
.label { display:block; font-size:12.5px; font-weight:800; color:var(--muted); margin-bottom:6px; letter-spacing:.03em; }

/* ---------- Buttons (chunky game buttons) ---------- */
.btn { display:inline-flex; align-items:center; gap:7px; padding:10px 18px; border-radius:14px; font-size:14.5px; font-weight:800; cursor:pointer; border:var(--bw) solid var(--ink); transition:transform .08s, box-shadow .08s, background .12s; line-height:1.2; white-space:nowrap; font-family:var(--font-game); letter-spacing:.02em; position:relative; }
.btn::after { content:""; position:absolute; left:10px; right:10px; top:3px; height:35%; border-radius:999px; background:rgba(255,255,255,.35); pointer-events:none; }
.btn:active { transform:translateY(4px); box-shadow:0 0 0 var(--ink) !important; }
.btn-primary { background:var(--pk-red); color:#fff; border-color:var(--pk-red-dk); box-shadow:0 4px 0 var(--pk-red-dk); }
.btn-primary:hover { background:#F0336D; transform:translateY(-1px); box-shadow:0 5px 0 var(--pk-red-dk); }
.btn-secondary { background:#fff; color:var(--ink); border-color:#C9D1DD; box-shadow:0 3px 0 #C9D1DD; }
.btn-secondary:hover { background:var(--pk-blue-lt); border-color:var(--pk-blue-dk); transform:translateY(-1px); box-shadow:0 4px 0 var(--pk-blue-dk); }
.btn-secondary::after { display:none; }
.btn-danger { background:#fff; color:var(--pk-red); border-color:var(--pk-red-md); box-shadow:0 3px 0 var(--pk-red-md); }
.btn-danger::after { display:none; }
.btn-danger:hover { background:var(--pk-red-lt); border-color:var(--pk-red); transform:translateY(-1px); box-shadow:0 4px 0 var(--pk-red); }
.btn-success { background:var(--pk-blue); color:var(--ink); border-color:var(--pk-blue-dk); box-shadow:0 4px 0 var(--pk-blue-dk); }
.btn-success:hover { background:#5ED3F5; transform:translateY(-1px); box-shadow:0 5px 0 var(--pk-blue-dk); }
.btn-sm { padding:6px 12px; font-size:12.5px; border-radius:10px; }
.btn-sm.btn-primary, .btn-sm.btn-success { box-shadow:0 3px 0 var(--pk-red-dk); } .btn-sm.btn-success { box-shadow:0 3px 0 var(--pk-blue-dk); }
.btn-sm:active { transform:translateY(3px); }
.btn-sm::after { top:2px; left:8px; right:8px; }
.btn[disabled] { opacity:.5; cursor:not-allowed; }
.btn-primary[style*="5865F2"] { color:#fff !important; }

/* ---------- Tables ---------- */
table.tbl { width:100%; border-collapse:separate; border-spacing:0; font-size:14.5px; }
table.tbl th { text-align:left; background:#F1F4F9; padding:12px 12px; font-weight:800; color:var(--ink-2); white-space:nowrap; font-size:12.5px; letter-spacing:.04em; position:sticky; top:0; z-index:1; border-bottom:2px solid var(--line-card); }
table.tbl th:first-child { border-top-left-radius:10px; } table.tbl th:last-child { border-top-right-radius:10px; }
.card.\!p-0 table.tbl th:first-child, .card.\!p-0 table.tbl th:last-child { border-radius:0; }
table.tbl td { padding:14px 12px; border-bottom:1.5px solid var(--line-soft); vertical-align:middle; color:var(--ink-2); line-height:1.5; }
table.tbl tbody tr:last-child td { border-bottom:0; }
table.tbl tbody tr { transition:background .1s; }
table.tbl tbody tr:hover td { background:var(--pk-blue-lt) !important; }
table.tbl tbody tr.cursor-pointer:hover td:first-child { box-shadow:inset 4px 0 0 var(--pk-red); }
table.tbl tfoot td { background:var(--pk-blue-lt); font-weight:900; color:var(--ink); border-top:2px solid var(--pk-blue-dk); }
table.tbl td .text-xs { font-size:12px !important; }
table.tbl td .font-semibold { color:var(--ink); font-weight:800; }

/* ---------- Status badges (type badges) ---------- */
.status-badge { display:inline-flex; align-items:center; gap:6px; padding:4px 11px; border-radius:999px; font-size:12.5px; font-weight:800; white-space:nowrap; line-height:1.4; border:1.5px solid rgba(31,41,55,.12); background:#fff; color:var(--ink); font-family:var(--font-game); }
.status-badge::before { content:""; width:8px; height:8px; border-radius:50%; background:currentColor; }
.status-badge.bg-amber-100::before, .status-badge.bg-green-100::before, .status-badge.bg-red-100::before, .status-badge.bg-blue-100::before, .status-badge.bg-purple-100::before, .status-badge.bg-indigo-100::before, .status-badge.bg-slate-100::before, .status-badge.bg-pink-100::before, .status-badge.bg-sky-100::before, .status-badge.bg-indigo-50::before { display:none; }
.st-未着手 { background:#F3F4F6; color:var(--muted); }
.st-編集中 { background:var(--pk-blue-lt); color:var(--pk-blue-dk); }
.st-初稿提出済み { background:var(--pk-blue-md); color:#0E6C8C; }
.st-修正中 { background:var(--pk-red-lt); color:var(--pk-red); }
.st-先方提出 { background:var(--vio-lt); color:#6D28D9; }
.st-先方修正 { background:var(--org-lt); color:#C2410C; }
.st-納品 { background:var(--yel); color:var(--ink); }
.st-納品::before { content:"★"; width:auto; height:auto; border:0; background:none; font-size:10px; }

/* ---------- Deadlines ---------- */
.overdue { color:var(--pk-red) !important; font-weight:900; } .overdue::before { content:"!! "; }
.soon { color:#C2410C !important; font-weight:900; }

/* ---------- Modal (dialog window) ---------- */
.modal-bg { position:fixed; inset:0; background:rgba(31,41,55,.55); backdrop-filter:blur(4px); z-index:50; display:flex; align-items:flex-start; justify-content:center; padding:40px 16px; overflow-y:auto; animation:fade .18s ease-out; }
.modal { background:#fff; border-radius:20px; width:100%; max-width:960px; padding:30px; box-shadow:0 30px 70px rgba(31,41,55,.35); border:2px solid var(--line-card); animation:pop .22s cubic-bezier(.2,.9,.3,1.3); color:var(--ink-2); position:relative; }
.modal > header { padding-bottom:14px; border-bottom:2px solid var(--line-soft); position:relative; }
.modal h2.text-xl { font-size:1.35rem; }
.modal h2.text-xl { color:var(--ink); font-weight:900; }
@keyframes fade { from{opacity:0} to{opacity:1} }
@keyframes pop { from{opacity:0; transform:translateY(16px) scale(.96)} to{opacity:1; transform:none} }

/* ---------- Toast (battle message box) ---------- */
.toast { padding:12px 18px; border-radius:14px; color:var(--ink); font-size:14.5px; font-weight:800; min-width:260px; animation:pop .2s; display:flex; align-items:center; gap:10px; background:#fff; border:2px solid var(--line-card); box-shadow:0 12px 30px rgba(31,41,55,.2); font-family:var(--font-game); }
.toast::before { width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-weight:900; font-size:13px; border:2px solid var(--ink); }
.toast-ok::before { content:"✓"; background:var(--pk-blue); } .toast-err::before { content:"!"; background:var(--pk-red); color:#fff; }

/* ---------- Sections / misc ---------- */
.round-box { border:2px solid var(--line-card); border-radius:var(--radius); padding:16px; background:#fff; position:relative; }
.round-box h4 { color:var(--ink); font-weight:900; } .round-box h4 i { color:var(--pk-red) !important; }
.kanban-col { background:#F1F4F9; border-radius:var(--radius); padding:10px; min-width:230px; border:2px solid var(--line-card); }
.kanban-card { background:#fff; border-radius:var(--radius-sm); padding:12px; margin-bottom:8px; font-size:14px; cursor:pointer; border:2px solid var(--line-card); transition:.12s; color:var(--ink-2); box-shadow:0 2px 6px rgba(31,41,55,.06); }
.kanban-card p.font-semibold { color:var(--ink); font-weight:800; }
.kanban-card:hover { transform:translateY(-2px); border-color:var(--pk-blue-dk); background:var(--pk-blue-lt); }
details > summary { list-style:none; cursor:pointer; } details > summary::-webkit-details-marker { display:none; }
details > summary::before { content:"▶"; display:inline-block; margin-right:6px; transition:.15s; color:var(--pk-red); font-size:10px; }
details[open] > summary::before { transform:rotate(90deg); }
.rounded-lg.border, .rounded-xl.border, .rounded.border, figure.border, li.border { border-width:2px !important; border-color:var(--line-card) !important; background:#fff; }
.bg-white { background:#fff !important; }
.bg-white\/80 { background:rgba(255,255,255,.9) !important; }
.bg-slate-50, .bg-slate-100 { background:#F3F4F6 !important; } .bg-slate-200 { background:#E5E7EB !important; }
.border-t, .border-b { border-color:var(--line-soft) !important; }
.border-slate-800 { border-color:var(--ink) !important; } .border-slate-400 { border-color:var(--faint) !important; }
.hover\:bg-blue-50:hover { background:var(--pk-blue-lt) !important; }

/* Auth screen (title screen) */
#auth-card { box-shadow:0 30px 60px rgba(31,41,55,.2); overflow:hidden; border:2px solid var(--line-card) !important; }
#auth-card::after { content:""; position:absolute; inset:0 0 auto 0; height:10px; background:repeating-linear-gradient(90deg, var(--pk-red) 0 28px, var(--pk-blue) 28px 56px); }
#auth-card > div:first-child { margin-top:8px; }
#auth-card > div:first-child span { background:conic-gradient(from 180deg, var(--pk-red) 0 50%, #fff 50% 100%) !important; border:var(--bw) solid var(--ink); box-shadow:0 5px 0 var(--ink) !important; color:transparent !important; position:relative; }
#auth-card > div:first-child span::after { content:""; position:absolute; left:50%; top:50%; width:16px; height:16px; margin:-8px 0 0 -8px; border-radius:50%; background:#fff; border:var(--bw) solid var(--ink); }
#auth-card > div:first-child span i { display:none; }
#auth-card h1 { color:var(--ink); font-weight:900; text-align:center; } #auth-card h1::after { margin:8px auto 0; }
#auth-card p.text-center { text-align:center; }
nav.bg-slate-200 { background:#EEF1F6 !important; border-radius:14px !important; padding:4px !important; }
nav.bg-slate-200 button { border-radius:10px !important; font-weight:800; font-size:14px !important; padding:9px 16px !important; }
nav.bg-slate-200 button.bg-white { background:#fff !important; color:var(--pk-red) !important; box-shadow:0 2px 8px rgba(31,41,55,.12); }

/* Semantic color remaps (Tailwind utilities used in app.js) → brand palette */
.text-blue-500, .text-blue-600, .text-blue-700, .text-indigo-500, .text-indigo-600, .text-indigo-700, .text-sky-800 { color:var(--pk-blue-dk) !important; }
.text-blue-800, .text-indigo-800, .text-indigo-900 { color:#15718F !important; }
.text-purple-500, .text-purple-700, .text-purple-800, .text-purple-900 { color:#6D28D9 !important; }
a.text-blue-600 { font-weight:700; } a.text-blue-600:hover { text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:2px; }
.bg-blue-50, .bg-indigo-50, .bg-indigo-50\/40, .bg-indigo-50\/50, .bg-sky-100 { background:var(--pk-blue-lt) !important; }
.bg-blue-100, .bg-indigo-100 { background:var(--pk-blue-md) !important; }
.bg-purple-50 { background:var(--vio-lt) !important; } .bg-purple-100 { background:#E9DDFF !important; }
.border-blue-200, .border-indigo-200 { border-color:var(--pk-blue-dk) !important; } .border-purple-200 { border-color:var(--vio) !important; }
.text-green-600, .text-green-700, .text-green-800 { color:var(--grn-dk) !important; }
.bg-green-50 { background:var(--grn-lt) !important; } .bg-green-100 { background:#D1FADF !important; } .border-green-200 { border-color:var(--grn-dk) !important; }
.bg-green-500 { background:var(--grn) !important; color:var(--ink) !important; }
.text-amber-500, .text-amber-600, .text-amber-700, .text-amber-800 { color:#B45309 !important; }
.bg-amber-50 { background:var(--amb-lt) !important; } .bg-amber-100 { background:#FDE68A !important; } .border-amber-200 { border-color:var(--amb) !important; } .border-amber-400 { border-color:var(--amb) !important; }
.text-red-500, .text-red-600, .text-red-700, .text-red-800 { color:var(--pk-red) !important; }
.bg-red-50 { background:var(--pk-red-lt) !important; } .bg-red-100 { background:var(--pk-red-md) !important; } .border-red-200 { border-color:var(--pk-red) !important; }
.bg-red-500, .bg-red-600 { background:var(--pk-red) !important; color:#fff !important; }
.text-orange-500, .text-orange-600, .text-orange-700, .text-orange-800 { color:#C2410C !important; } .bg-orange-100 { background:var(--org-lt) !important; }
.text-pink-500, .text-pink-600, .text-pink-700, .text-pink-800 { color:#DB2777 !important; } .bg-pink-100 { background:var(--pink-lt) !important; }
.from-blue-500 { --tw-gradient-from:var(--pk-blue) !important; } .to-blue-300 { --tw-gradient-to:var(--pk-blue-md) !important; }

/* Project detail blocks */
#project-deliverables { background:#F4FBFE !important; border:2px solid var(--pk-blue-md) !important; border-radius:var(--radius) !important; }
#project-deliverables .bg-white { border:2px solid var(--line-card) !important; }
#project-deliverables .bg-white .label { color:var(--ink-2); font-size:12.5px; }
#project-instructions > div { background:var(--amb-lt) !important; border:2px solid #F3D98B !important; border-radius:var(--radius-sm); color:var(--ink); position:relative; font-weight:500; font-size:15px !important; line-height:1.7; padding:14px 16px !important; }
#project-meta { background:#F7F9FC; border-radius:var(--radius-sm); padding:14px 16px; gap:14px 20px !important; }
#project-meta .label { color:var(--muted); margin-bottom:2px; } #project-meta p.text-sm { color:var(--ink); font-weight:800; font-size:15px !important; }
#project-thread a { border:2px solid transparent; }
.modal h2.text-xl { line-height:1.3; }

/* Decline alert (warning box) */
.decline-alert { background:var(--pk-red-lt); border:2px solid var(--pk-red); border-radius:var(--radius); padding:16px 18px; animation:pop .25s; }
@keyframes shake { 0%,100%{transform:translateX(0)} 20%{transform:translateX(-5px)} 40%{transform:translateX(5px)} 60%{transform:translateX(-3px)} 80%{transform:translateX(3px)} }
.decline-alert h2 { color:var(--pk-red) !important; font-weight:900; } .decline-alert > div > span:first-child { background:var(--pk-red) !important; color:#fff !important; }

/* Invoice document — paper for print */
#invoice-doc { background:#fff !important; color:#111827 !important; border:1px solid #d1d5db !important; border-radius:6px !important; font-family:"Noto Sans JP", sans-serif !important; }
#invoice-doc * { font-family:"Noto Sans JP", sans-serif !important; }

/* Loading */
.fa-spinner { color:var(--pk-red); }

/* Responsive */
@media (max-width: 768px) {
  .sidebar { display:none; } .mobile-nav { display:flex; }
  .card { padding:14px; border-radius:14px; } .modal { padding:18px; border-radius:16px; }
  h1.text-2xl { font-size:1.3rem; }
  #main-content header { padding:8px 12px; }
}
@media (min-width: 769px) { .mobile-nav { display:none; } }
@media print { body { background:#fff !important; } .no-print, #sidebar, .mobile-nav { display:none !important; } .modal { box-shadow:none; border:0; } .modal::before { display:none; } }

/* Auth tabs (game menu tabs) */
#auth-card > div.flex.bg-slate-100 { border-radius:14px !important; padding:4px !important; background:#EEF1F6 !important; }
#auth-card > div.flex.bg-slate-100 button { border-radius:10px !important; font-weight:800; }
#auth-card > div.flex.bg-slate-100 button.bg-white { background:#fff !important; color:var(--pk-red) !important; box-shadow:0 2px 8px rgba(31,41,55,.12) !important; }

/* ---------- Director check form ---------- */
.check-form { border:2px dashed #D8C47A; border-radius:14px; padding:16px; background:#FFFDF5; }
.check-form-title { font-weight:900; color:var(--ink); font-size:13px; margin-bottom:10px; display:flex; align-items:center; }
.check-form-title i { color:var(--pk-blue-dk); }
.check-result { display:grid; grid-template-columns:1fr; gap:8px; }
.check-result-opt { position:relative; display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:8px; padding:10px 14px; border:2px solid var(--ink); border-radius:12px; background:#fff; cursor:pointer; box-shadow:0 3px 0 var(--ink); transition:.1s; text-align:center; }
.check-result-opt input { position:absolute; opacity:0; inset:0; cursor:pointer; margin:0; }
.check-result-opt span { font-weight:900; font-size:14px; white-space:nowrap; color:var(--ink); display:flex; align-items:center; gap:5px; }
.check-result-opt small { font-size:11px; color:var(--muted); font-weight:700; white-space:nowrap; }
.check-result-opt:hover { transform:translateY(-1px); box-shadow:0 4px 0 var(--ink); }
.check-result-opt:has(input:checked) { transform:translateY(2px); box-shadow:0 1px 0 var(--ink); }
.check-result-opt.ok:has(input:checked) { background:var(--pk-blue); } .check-result-opt.ok:has(input:checked) small { color:var(--ink); }
.check-result-opt.ng:has(input:checked) { background:var(--pk-red); } .check-result-opt.ng:has(input:checked) span, .check-result-opt.ng:has(input:checked) small { color:#fff; }
.check-form .label { font-size:12px; }
.round-box .text-xs.text-slate-500 { font-size:12px; }


/* ---------- Readability pass (v17) ---------- */
.card .grid > .card, #status-summary .card, #team-summary .card, #earnings-summary .card { padding:16px 18px; }
.card p.text-xs.text-slate-500 { font-weight:700; color:var(--muted) !important; }
.card > p.text-2xl { font-size:1.75rem; line-height:1.2; margin-top:4px; }
#project-table table.tbl td, #project-table table.tbl th { padding-left:10px; padding-right:10px; }
#project-table td .text-xs { margin-top:3px; }
.tbl td.font-semibold, .tbl td .font-semibold { font-size:15px; }
.label + .input { margin-top:0; }
details > summary { font-size:14.5px; }
#project-submissions > h3 .text-xs, #project-deliverables h3 .text-xs { font-weight:600; }
.modal footer.border-t { border-color:var(--line-soft) !important; }
p.label { line-height:1.4; }