:root{--green:#3fae6a;--pink:#ec6fa5;--orange:#f6b26b;--blue:#2c5fb3;--sky:#5bc7e0;--ink:#1f2933;--muted:#6b7785;--line:#e3e7ec;--bg:#f5f7fa;--card:#fff}
*{box-sizing:border-box}
body{margin:0;font-family:"Hiragino Sans","Noto Sans JP","Yu Gothic",Meiryo,system-ui,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6}
a{color:var(--blue)}
small{display:block;font-size:.72em;color:var(--muted);font-weight:normal}
h1 small,h2 small{display:inline;margin-left:.5em}
.wrap{max-width:1200px;margin:0 auto;padding:0 16px}
header.top{background:#fff;border-bottom:4px solid;border-image:linear-gradient(90deg,var(--green),var(--pink),var(--orange),var(--sky),var(--blue)) 1}
header.top .wrap{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:10px 16px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font-weight:700}
.brand img{height:36px}
.who{margin-left:auto;color:var(--muted);font-size:.9em}
nav{display:flex;gap:4px;flex-wrap:wrap}
nav a,nav .link{padding:6px 12px;border-radius:6px;text-decoration:none;color:var(--ink);font-size:.92em;background:none;border:0;cursor:pointer;font-family:inherit;text-align:center}
nav a:hover,nav .link:hover{background:var(--bg)}
main{padding:24px 16px 48px}
footer{border-top:1px solid var(--line);background:#fff;color:var(--muted);font-size:.8em;padding:16px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:20px;margin-bottom:20px}
.form h2{font-size:1.05em;border-left:4px solid var(--green);padding-left:8px;margin:24px 0 12px}
.form h2:first-of-type{margin-top:0}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px 20px}
.field{display:block;margin-bottom:12px}
.field>span{display:block;font-weight:600;font-size:.92em;margin-bottom:4px}
.field em{color:#d64545;font-style:normal}
input,select,textarea{width:100%;padding:9px 10px;border:1px solid #cdd4dc;border-radius:6px;font:inherit;background:#fff}
input:focus,select:focus,textarea:focus{outline:2px solid var(--sky);border-color:transparent}
input[type=radio]{width:auto}
.radios{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.radios label{border:1px solid var(--line);border-radius:8px;padding:8px 14px;cursor:pointer;background:#fafbfc}
.radios label:has(input:checked){border-color:var(--green);background:#eef8f1}
.btn{display:inline-block;padding:9px 18px;border-radius:6px;border:1px solid #cdd4dc;background:#fff;color:var(--ink);text-decoration:none;cursor:pointer;font:inherit}
.btn.primary{background:linear-gradient(90deg,var(--green),#2f9a8a);color:#fff;border:0;font-weight:700}
.btn.small{padding:4px 10px;font-size:.85em}
.actions{margin-top:16px;text-align:right}
.inline{display:inline}
.head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.flash{padding:12px 16px;border-radius:8px;margin-bottom:16px}
.flash.ok{background:#eaf7ee;border:1px solid #b8e2c5}
.flash.error{background:#fdecec;border:1px solid #f3c1c1}
.flash ul{margin:0;padding-left:20px}
.tablewrap{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:10px;margin-bottom:20px}
table.list{width:100%;border-collapse:collapse;font-size:.9em}
table.list th,table.list td{padding:10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
table.list th{background:#f0f3f6;white-space:nowrap}
table.list tr[data-href]{cursor:pointer}
table.list tbody tr:hover{background:#f7fbff}
tr.inactive{opacity:.5}
table.detail{width:100%;border-collapse:collapse}
table.detail th{width:34%;text-align:left;color:var(--muted);font-weight:600;padding:8px;border-bottom:1px solid var(--line);vertical-align:top}
table.detail td{padding:8px;border-bottom:1px solid var(--line);word-break:break-all}
.cols{display:grid;grid-template-columns:3fr 2fr;gap:20px}
@media(max-width:800px){.cols{grid-template-columns:1fr}}
.badge{display:inline-block;padding:2px 10px;border-radius:999px;background:#eceff3;font-size:.85em;white-space:nowrap;text-align:center}
.badge small{display:block;font-size:.75em}
.st-new{background:#e7f0fd;color:#1d4f9c}.st-processing{background:#fff4e0;color:#9a5b00}.st-incomplete{background:#fde8ef;color:#a52a5a}
.st-done{background:#e5f6ea;color:#1f7a3f}.st-cancelled{background:#eceff3;color:#555}
.stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin:16px 0}
.stat{padding:12px;border-radius:10px;text-decoration:none;color:inherit;font-size:.9em}
.stat b{display:block;font-size:1.8em;line-height:1.2}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:12px}
.filters input,.filters select{width:auto;flex:1 1 140px}
.login{max-width:420px;margin:40px auto;text-align:center}
.login img{height:56px}
.login .form{text-align:left}
.login .btn{width:100%}
.narrow{max-width:480px}
.hint{color:var(--muted);font-size:.85em}
.empty{color:var(--muted);text-align:center;padding:40px;background:#fff;border-radius:10px;border:1px dashed var(--line)}
.history{list-style:none;padding:0;margin:0;font-size:.88em}
.history li{padding:6px 0;border-bottom:1px dashed var(--line)}
.history time{color:var(--muted);margin-right:6px}
@media(max-width:600px){.who{display:none}h1{font-size:1.4em}}
.chat-log{height:340px;overflow-y:auto;background:#f7f9fb;border:1px solid var(--line);border-radius:8px;padding:10px;margin-bottom:10px}
.msg{margin:6px 0;display:flex;flex-direction:column;align-items:flex-start}
.msg.mine{align-items:flex-end}
.msg .meta{font-size:.72em;color:var(--muted)}
.msg .bubble{white-space:pre-wrap;word-break:break-word;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px 12px;max-width:85%}
.msg.mine .bubble{background:#e3f5ea;border-color:#bfe3cb}
.msg.system{align-items:center}.msg.system .bubble{background:none;border:0;color:var(--muted);font-size:.85em;text-align:center}
.msg.admin:not(.mine) .bubble{background:#e7f0fd;border-color:#c9daf6}
.chat-form{display:flex;gap:8px;align-items:stretch}
.chat-form textarea{flex:1}
.badge.unread{background:#d64545;color:#fff}
.ref{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center;border-left:4px solid var(--pink)}
.ref .copy{display:flex;gap:6px;flex:1 1 380px}
.ref .copy input{flex:1}
.hero{margin-bottom:16px}
.consent{display:block;margin:16px 0;padding:12px;background:#fafbfc;border:1px solid var(--line);border-radius:8px}
.consent input{width:auto;margin-right:6px}
form.amount input{width:100px;padding:4px 6px}
.hint a,.ref input{word-break:break-all;overflow-wrap:anywhere}
.btn.primary small{color:rgba(255,255,255,.85)}
.chat h2,.card>h2{font-size:1.05em;margin:0 0 12px}
body{overflow-x:hidden}
.inbox{list-style:none;margin:0;padding:0}
.inbox li{border-bottom:1px solid var(--line)}
.inbox a{display:block;padding:10px 4px;text-decoration:none;color:inherit}
.inbox a:hover{background:#f7fbff}
.inbox small{margin-top:2px}
nav .badge.unread{padding:0 7px;font-size:.75em}
[hidden]{display:none!important}
nav a,nav .link{padding:6px 10px}
@media(max-width:700px){header.top nav{flex-wrap:nowrap;overflow-x:auto;width:100%;scrollbar-width:none;margin:0 -16px;padding:0 12px}nav a,nav .link{white-space:nowrap}}