:root{
  --bg:#f7f3ea;--paper:#fffdf8;--ink:#172233;--sub:#687181;--navy:#0e2a4d;
  --gold:#b88a2c;--line:#e4dccd;--soft:#f1e7d4;--ok:#176b4d;--warn:#a35a16;
  --mincho:"Shippori Mincho","Yu Mincho",serif;--sans:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);line-height:1.7}
a{color:inherit}
.bar{background:#0b1626;color:#fff;border-bottom:3px solid var(--gold)}
.bar-inner{width:min(1100px,calc(100% - 32px));margin:auto;min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{font-family:var(--mincho);letter-spacing:.08em}.brand small{display:block;color:#d8b15a;font-size:10px;letter-spacing:.16em}
.back{font-size:13px;text-decoration:none;border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:8px 14px}
.hero{width:min(1100px,calc(100% - 32px));margin:0 auto;padding:44px 0 26px;display:grid;grid-template-columns:1.05fr .95fr;gap:30px;align-items:end}
.ey{font-family:var(--mincho);font-style:italic;color:var(--gold);letter-spacing:.24em;font-size:13px;text-transform:uppercase}
h1{font-family:var(--mincho);font-size:clamp(28px,4.6vw,48px);line-height:1.25;margin:10px 0 12px}
.lead{color:var(--sub);font-size:14.5px;max-width:680px;margin:0}
.hero-card{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:18px;box-shadow:0 16px 38px rgba(14,42,77,.09)}
.hero-card b{display:block;color:var(--navy);font-family:var(--mincho);font-size:18px}.hero-card span{display:block;margin-top:6px;color:var(--sub);font-size:13px}
.hero-visual{margin-top:14px;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#fff}
.hero-visual svg{display:block;width:100%;height:auto}
.app{width:min(1100px,calc(100% - 32px));margin:0 auto 54px;display:grid;grid-template-columns:360px 1fr;gap:22px}
.panel{min-width:0;background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 34px rgba(14,42,77,.08)}
.form{padding:20px;position:sticky;top:18px;align-self:start}
.panel h2{font-family:var(--mincho);font-size:20px;margin:0 0 14px;color:var(--navy)}
.field{display:grid;gap:6px;margin:0 0 12px}.field label{font-size:12px;color:var(--sub);font-weight:700}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:8px;background:#fff;padding:10px 11px;font:inherit;font-size:14px;color:var(--ink)}.field textarea{min-height:86px;resize:vertical}
.actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px}.btn{border:0;border-radius:8px;padding:10px 14px;font-weight:700;cursor:pointer}.primary{background:var(--navy);color:#fff}.ghost{background:var(--soft);color:#5b4214}
.list{padding:20px}.tools{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}.pill{border:1px solid var(--line);background:var(--soft);border-radius:999px;padding:6px 11px;font-size:12px;color:#5b4214;font-weight:700}
.table-wrap{max-width:100%;overflow:auto;border:1px solid var(--line);border-radius:10px;background:#fff}table{width:100%;border-collapse:collapse;min-width:680px}th,td{padding:11px 12px;border-bottom:1px solid #eee6d8;text-align:left;font-size:13px;vertical-align:top}th{background:#fbf6ea;color:#604613;font-size:12px;white-space:nowrap}tr:last-child td{border-bottom:0}
.status{display:inline-flex;border-radius:999px;padding:3px 9px;font-size:12px;font-weight:700;background:#eef4ff;color:#244b83}.status.done{background:#e8f6ee;color:var(--ok)}.status.warn{background:#fff0dc;color:var(--warn)}
.empty{color:var(--sub);font-size:14px;padding:24px;text-align:center}
.note{margin-top:14px;color:var(--sub);font-size:12.5px;line-height:1.8}
@media(max-width:860px){.hero{grid-template-columns:1fr}.app{grid-template-columns:1fr}.form{position:static}table{min-width:620px}}