.commerce-page main { padding-top: 50px; }
.commerce-page nav { display: flex; gap: 18px; }
.commerce-page h1 { font-size: clamp(30px,5vw,52px); }
.commerce-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,300px),1fr)); gap: 22px; }
.commerce-card { border: 1px solid var(--line); border-radius: 24px; padding: 26px; background: var(--surface); overflow-wrap: anywhere; }
.commerce-card h3 { margin-top: 0; }
.commerce-card label { display: flex; flex-direction: column; gap: 8px; margin: 16px 0; font-weight: 700; }
.commerce-card input, .commerce-card textarea, .commerce-card select { font: inherit; width: 100%; min-height: 46px; border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; background: var(--night); color: var(--paper); }
.commerce-card input[type=checkbox] { width: 20px; min-height: 20px; }
.commerce-card .check-field { flex-direction: row; align-items: center; font-weight: 400; }
.commerce-card textarea { min-height: 110px; resize: vertical; }
.commerce-card .button { margin: 8px 8px 8px 0; }
.commerce-card p { font-size: 14px; }
.commerce-notice { border-left: 4px solid var(--peach); padding: 16px 20px; background: var(--surface); border-radius: 0 14px 14px 0; }
.commerce-error { border-color: #b34539; }
.commerce-card dl { display: grid; grid-template-columns: 85px 1fr; gap: 10px; font-size: 14px; }
.commerce-card dd { margin: 0; }
.request-history { padding-left: 22px; }
.request-history li { padding: 14px 0; border-top: 1px solid var(--line); }
.request-history p { white-space: pre-wrap; }
.commerce-page [hidden] { display: none !important; }
@media(max-width:640px) { .commerce-page .header-inner { flex-wrap: wrap; gap: 10px; } .commerce-page nav { display: flex; flex-wrap: wrap; gap: 12px; } .commerce-card { padding: 20px; } }