:root{--ink:#1b2a41;--paper:#f3f6fa;--ribbon:#d7263d;--teal:#0f8b8d;--gold:#f2b134;--line:#d9e0ea;--muted:#5d6b80}
*{box-sizing:border-box}
body{margin:0;font-family:'Plus Jakarta Sans',system-ui,sans-serif;background:var(--paper);color:var(--ink);line-height:1.55}
a{color:inherit}
.wrap{max-width:1000px;margin:0 auto;padding:24px}
.hero{background:var(--ink);color:#fff;position:relative;overflow:hidden;padding:64px 24px 96px}
.hero::before,.hero::after{content:"";position:absolute;background:var(--ribbon)}
.hero::before{left:0;right:0;top:50%;height:36px;transform:translateY(-50%);opacity:.9}
.hero::after{top:0;bottom:0;right:14%;width:36px;opacity:.9}
.hero .in{position:relative;z-index:1;max-width:1000px;margin:auto}
.hero h1{font-size:clamp(2rem,6vw,3.6rem);line-height:1.08;margin:0 0 12px;max-width:14ch;background:var(--ink);display:inline-block;padding:6px 14px 8px 0;font-weight:800}
.hero p{background:var(--ink);display:inline-block;max-width:44ch;color:#cdd7e5;margin:0;padding:6px 14px 6px 0}
.menu{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-top:-56px;position:relative;z-index:2}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px}
.card h2{margin:0 0 6px;font-size:1.3rem}
.card p{color:var(--muted);margin:0 0 18px}
.btn{display:inline-block;border:0;cursor:pointer;background:var(--ribbon);color:#fff;font:700 1rem inherit;font-family:inherit;padding:12px 22px;border-radius:10px;text-decoration:none}
.btn.alt{background:var(--teal)}.btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn:hover{filter:brightness(1.08)}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
#qr{display:none;margin-top:16px;text-align:center}
#qr.show{display:block}
#qr canvas,#qr img{margin:auto;border:10px solid #fff;outline:1px solid var(--line);border-radius:6px}
#qr small{display:block;color:var(--muted);margin-top:8px;word-break:break-all}
label{display:block;font-weight:700;margin:16px 0 6px}
input[type=text],input[type=tel],textarea,input[type=password]{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font:inherit;background:#fff}
input[type=file]{width:100%;padding:12px;border:2px dashed var(--line);border-radius:10px;background:#fff}
.hint{font-size:.85rem;color:var(--muted);margin-top:4px}
.alert{padding:12px 16px;border-radius:10px;margin:16px 0;font-weight:600}
.alert.err{background:#fde8eb;color:#9b1428}.alert.ok{background:#e0f4f1;color:#0a6264}
.narrow{max-width:560px;margin:0 auto}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:20px}
.top h1{margin:0;font-size:1.5rem}
.tablebox{overflow-x:auto;background:#fff;border:1px solid var(--line);border-radius:14px}
table{border-collapse:collapse;width:100%;min-width:820px}
th,td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;font-size:.92rem}
th{background:#eaf0f7}
td img{width:72px;height:54px;object-fit:cover;border-radius:6px;border:1px solid var(--line)}
.stat{font-size:2rem;font-weight:800;color:var(--ribbon)}
@media (prefers-reduced-motion:no-preference){.hero h1{animation:in .6s ease-out}@keyframes in{from{opacity:0;transform:translateY(10px)}}}
