:root{--w:760px;--brand:#0066cc;--brand-2:#004499;--fg:#111827;--bg:#fff;--muted:#6b7280;--card:#f8fafc;--line:#e5e7eb;--ok:#22c55e;--warn:#f59e0b;--err:#ef4444;--radius:10px;--space:16px}
*{box-sizing:border-box}html{font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",Meiryo,sans-serif}
body{margin:0;background:var(--bg);color:var(--fg);opacity:0;transition:opacity .25s}body.loaded{opacity:1}
.container{max-width:var(--w);margin:0 auto;padding:0 var(--space)}
.topbar{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.95);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.topbar .container{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.topbar h1{margin:0;font:600 18px/1 inherit}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space);margin:var(--space) 0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;background:var(--brand);color:#fff;border:none;border-radius:12px;font:600 14px/1 inherit;cursor:pointer;transition:.15s;user-select:none;text-decoration:none}
.btn:hover{background:var(--brand-2);transform:translateY(-1px)}.btn.secondary{background:#fff;color:var(--brand);border:1px solid var(--brand)}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.stepbar{display:flex;align-items:center;justify-content:center;gap:8px;margin:16px 0}
.stepbar .dot{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#e5e7eb}.stepbar .dot.now{background:var(--brand);color:#fff}.stepbar .dot.done{background:var(--ok);color:#fff}
.stepbar .line{flex:1;height:2px;background:#e5e7eb;max-width:60px}
.form-group{margin:16px 0}.form-group label{display:block;margin-bottom:8px;font-weight:600}
.form-group input,.form-group textarea,.form-group select{width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;font:inherit}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(0,102,204,.1)}
.muted{color:var(--muted);font-size:14px}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{background:#eef2f7;border:1px solid var(--line);padding:6px 12px;border-radius:999px;font-size:13px;cursor:pointer}.chip.active{background:var(--brand);color:#fff;border-color:var(--brand)}
.image-upload{border:2px dashed var(--line);padding:36px;border-radius:12px;text-align:center;cursor:pointer}
.image-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:12px}
.image-preview img{width:100%;height:120px;object-fit:cover;border-radius:10px}
.pager{position:fixed;left:0;right:0;bottom:0;background:rgba(255,255,255,.95);backdrop-filter:blur(6px);border-top:1px solid var(--line);padding:10px 0}.pager .container{display:flex;justify-content:space-between;gap:12px}.pager .btn{flex:1}
.toast{position:fixed;left:50%;bottom:80px;transform:translateX(-50%);background:#fff;border:1px solid var(--line);padding:10px 14px;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);z-index:50}
.toast.ok{border-color:var(--ok);background:#effaf1}.toast.warn{border-color:var(--warn);background:#fff6e6}.toast.err{border-color:var(--err);background:#ffecec}
