:root { --bg:#f7f7f5; --paper:#fff; --text:#20201e; --muted:#767671; --line:#e8e8e3; --accent:#245548; --accent-soft:#e7f1ec; --warning:#835b11; --warning-soft:#fbf3df; --danger:#a83b34; --radius:12px; font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Noto Sans JP", sans-serif; color:var(--text); background:var(--bg); }
* { box-sizing:border-box; } body { margin:0; } button,input,select,textarea { font:inherit; } button { cursor:pointer; }
.app-shell { max-width:1180px; margin:0 auto; padding:34px 28px 56px; }.topbar,.section-header,.dialog-header,.dialog-footer { display:flex; align-items:center; justify-content:space-between; gap:18px; }.topbar { margin-bottom:24px; }.eyebrow { margin:0 0 6px; color:var(--muted); font-size:11px; letter-spacing:.1em; font-weight:700; }.topbar h1,h2 { margin:0; letter-spacing:-.03em; }.topbar h1 { font-size:25px; }.topbar-actions { display:flex; align-items:center; gap:12px; }.updated-at { color:var(--muted); font-size:12px; }
.summary-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:28px; }.summary-card { min-height:130px; padding:19px; background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); }.summary-card.attention { background:var(--warning-soft); border-color:#eeddae; }.summary-card p,.summary-card small { margin:0; color:var(--muted); font-size:13px; }.summary-card strong { display:inline-block; margin-top:20px; font-size:30px; letter-spacing:-.05em; }.summary-card span { color:var(--muted); font-size:13px; }.summary-card small { display:block; margin-top:8px; }
.tabs { display:flex; gap:4px; border-bottom:1px solid var(--line); margin-bottom:25px; }.tab { padding:10px 14px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--muted); font-size:14px; }.tab.active { border-color:var(--accent); color:var(--text); font-weight:700; }.view { display:none; }.view.active { display:block; }.section-header { margin-bottom:14px; }.section-header h2 { font-size:18px; }.section-header p { margin:6px 0 0; color:var(--muted); font-size:13px; }.filter-label { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:13px; }.filter-label select { border:1px solid var(--line); border-radius:8px; background:#fff; padding:7px 9px; }
.table-wrap { background:var(--paper); border:1px solid var(--line); border-radius:var(--radius); overflow:auto; } table { width:100%; border-collapse:collapse; min-width:720px; } th,td { padding:15px 14px; text-align:left; border-bottom:1px solid var(--line); font-size:13px; } th { color:var(--muted); font-weight:600; background:#fcfcfb; } tr:last-child td { border-bottom:0; }.product-cell strong { display:block; font-size:14px; }.product-cell small { display:block; margin-top:4px; color:var(--muted); }.align-right { text-align:right; }.empty { padding:30px; color:var(--muted); text-align:center; }
.pill { display:inline-flex; padding:4px 8px; border-radius:99px; background:#f1f1ee; font-size:11px; font-weight:700; white-space:nowrap; }.pill.holding { color:var(--accent); background:var(--accent-soft); }.pill.sold { color:var(--muted); }.pill.wait { color:var(--warning); background:var(--warning-soft); }
.button { border:1px solid transparent; border-radius:8px; padding:9px 13px; background:#fff; font-weight:700; font-size:13px; }.button.primary { background:var(--accent); color:#fff; }.button.secondary { border-color:var(--line); color:var(--text); }.button.quiet { padding-inline:6px; color:var(--muted); background:transparent; font-weight:500; }.button.danger { background:var(--danger); color:#fff; }.button:disabled { cursor:not-allowed; opacity:.5; }.row-action { padding:6px 9px; font-size:12px; }
.lot-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:14px; }.lot-card { padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--paper); }.lot-card h3 { margin:8px 0; font-size:15px; }.lot-card dl { display:grid; grid-template-columns:110px 1fr; gap:8px 14px; margin:16px 0 0; font-size:13px; }.lot-card dt { color:var(--muted); }.lot-card dd { margin:0; overflow-wrap:anywhere; }.lot-statuses { display:flex; flex-wrap:wrap; gap:6px; }.lot-actions { display:grid; grid-template-columns:1fr 1.25fr; gap:8px; margin-top:18px; }.lot-actions .button { min-height:42px; }.lot-hint { margin:9px 0 0; color:var(--muted); font-size:11px; line-height:1.5; }.text-link { color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
.dialog { max-width:min(640px,calc(100vw - 30px)); max-height:calc(100vh - 30px); border:1px solid var(--line); border-radius:14px; padding:0; box-shadow:0 18px 60px rgba(0,0,0,.18); }.dialog::backdrop { background:rgba(25,25,22,.32); }.dialog article,.dialog form { padding:22px; }.dialog-header { align-items:flex-start; margin-bottom:18px; }.dialog-header h2 { font-size:20px; }.icon-button { width:32px; height:32px; border:0; border-radius:8px; background:#f4f4f1; color:var(--muted); font-size:23px; line-height:1; }.detail-list { display:grid; grid-template-columns:130px 1fr; gap:10px 16px; margin:0; }.detail-list dt { color:var(--muted); font-size:13px; }.detail-list dd { margin:0; font-size:13px; overflow-wrap:anywhere; }.dialog-footer { margin-top:24px; justify-content:flex-end; }.dialog-note { margin:0 0 16px; color:var(--muted); font-size:13px; line-height:1.7; }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }.form-grid label { display:grid; gap:6px; font-size:13px; font-weight:700; }.form-grid input,.form-grid textarea { width:100%; border:1px solid var(--line); border-radius:8px; padding:9px 10px; background:#fff; color:var(--text); font-weight:400; }.form-grid .full { grid-column:1 / -1; }.sale-preview { display:flex; justify-content:space-between; margin-top:18px; padding:13px; border-radius:8px; background:#f4f4f1; font-size:13px; }.sale-preview strong { font-size:16px; }.confirm-content { color:var(--muted); font-size:14px; line-height:1.8; }.confirm-content strong { color:var(--text); }.toast { position:fixed; right:20px; bottom:20px; max-width:360px; padding:12px 15px; border-radius:9px; color:white; background:#222; box-shadow:0 8px 25px rgba(0,0,0,.2); transform:translateY(20px); opacity:0; pointer-events:none; transition:.2s; font-size:13px; }.toast.show { transform:none; opacity:1; }.toast.error { background:var(--danger); }
.login-dialog { width:min(390px,calc(100vw - 30px)); }.login-dialog::backdrop { background:#f7f7f5; }.login-dialog form { padding:30px; text-align:center; }.login-dialog h2 { margin:0 0 12px; font-size:23px; }.login-mark { display:grid; place-items:center; width:48px; height:48px; margin:0 auto 18px; border-radius:13px; color:var(--accent); background:var(--accent-soft); }.login-mark svg { width:25px; height:25px; }.login-label { display:grid; gap:7px; margin-top:22px; text-align:left; font-size:13px; font-weight:700; }.login-label input { width:100%; border:1px solid var(--line); border-radius:8px; padding:11px; }.login-button { width:100%; margin-top:8px; padding-block:11px; }.login-error { min-height:20px; margin:8px 0 0; color:var(--danger); font-size:12px; }
@media (max-width:680px) { .app-shell { padding:22px 16px 40px; }.topbar { align-items:flex-start; }.topbar-actions { align-items:flex-end; flex-direction:column; }.summary-grid { grid-template-columns:1fr; }.section-header { align-items:flex-start; flex-direction:column; }.form-grid { grid-template-columns:1fr; }.detail-list { grid-template-columns:105px 1fr; }.dialog { width:calc(100vw - 24px); }.dialog article,.dialog form { padding:17px; }.lot-actions { grid-template-columns:1fr; } }