[hidden] { display: none !important; }
.app-page { padding: env(safe-area-inset-top, 0px) 0 env(safe-area-inset-bottom, 0px); }
.app-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; max-width: 1060px; margin: auto; padding: 16px 20px; }
.app-brand { display: flex; align-items: center; gap: 10px; font-size: 21px; font-weight: 900; line-height: 1.3; }
.app-brand img { border-radius: 8px; }
.app-brand small { display: block; font-size: 13px; color: var(--muted-strong); margin-top: 4px; }
.app-install { min-height: 44px; padding: 6px 12px; color: #ffffff; background: #a8122a; border: 1px solid #e8213d; border-radius: 6px; font-weight: 800; white-space: nowrap; cursor: pointer; }
.app-main { max-width: 1060px; margin: auto; }
.app-store { padding: 32px 24px; background: #101014; border-top: 2px solid #e8213d; }
.app-store h1 { font-size: 38px; line-height: 1.3; letter-spacing: 0; margin: 10px 0 14px; }
.app-store p:not(.eyebrow) { color: var(--silver); font-size: 15px; }
.app-store .button { margin-top: 20px; width: auto; }
.app-shortcuts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-block: 1px solid var(--line); }
.app-shortcuts a { display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 64px; padding: 16px; border-right: 1px solid var(--line); font-weight: 800; }
.app-shortcuts span { color: #ff526a; }
.app-shortcuts a:hover { background: #181015; }
.app-section { padding: 32px 24px; border-bottom: 1px solid var(--line); }
.app-section h2 { font-size: 26px; line-height: 1.4; letter-spacing: 0; margin: 8px 0; }
.app-muted { font-size: 14px; color: var(--muted-strong); margin-top: 12px; }
.app-price-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.app-price-row strong { flex-shrink: 0; }
.app-price-row small { display: block; color: var(--muted); font-size: 13px; }
.app-page input[type=checkbox], .seoulmouse-section input[type=checkbox] { width: 20px; height: 20px; vertical-align: middle; accent-color: #e8213d; margin: 0 8px 0 0; flex-shrink: 0; }
.app-total { display: flex; justify-content: space-between; align-items: center; min-height: 78px; gap: 16px; }
.app-total output { font-size: 28px; color: #ff526a; font-weight: 900; }
.app-timing { margin-top: 24px; font-weight: 800; }
.app-timing small { font-size: 14px; color: var(--muted-strong); font-weight: 400; }
.app-contact { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 20px; }
.app-contact .button { width: auto; cursor: pointer; font: inherit; font-weight: 800; }
.app-kakao { color: #171301; background: #fee500; border: 1px solid #fee500; }
.app-checklist label { display: flex; align-items: center; min-height: 56px; border-bottom: 1px solid var(--line); padding: 12px 0; }
.app-page address, .seoulmouse-section address { font-style: normal; margin-top: 24px; }
.app-main.repair-main { display: block; }
.repair-main .repair-copy > p, .repair-main .repair-flow { display: none; }
.repair-tools { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 32px; border-top: 1px solid var(--line); }
.repair-tools > .app-section { min-width: 0; padding: 24px 0; }
.repair-tools > .app-section + .app-section { padding-left: 24px; border-left: 1px solid var(--line); }
.repair-tools > .app-section:first-child { padding-right: 24px; }
.repair-main .seoulmouse-section { padding: 32px 24px; }
.repair-main .seoulmouse-section .section-heading h2 { font-size: 32px; }
.repair-main .repair-hero { grid-template-columns: minmax(0,1fr); }
.repair-main .repair-info-grid { grid-template-columns: minmax(0,1fr); }
@media(max-width:640px) {
  .repair-tools { grid-template-columns: minmax(0,1fr); }
  .repair-tools > .app-section:first-child, .repair-tools > .app-section + .app-section { padding: 24px 0; border-left: 0; }
  .repair-main .seoulmouse-section { padding: 28px 16px; }
  .repair-main .seoulmouse-section .section-heading h2 { font-size: 28px; }
}
.app-footer { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px 24px; padding: 24px 20px; color: var(--muted); font-size: 13px; }
.app-page button:focus-visible, .app-page a:focus-visible { outline: 2px solid #ff526a; outline-offset: 3px; }
@media (min-width: 850px) {
  .app-main { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .app-store, .app-shortcuts { grid-column: 1 / -1; }
  .app-section + .app-section { border-left: 1px solid var(--line); }
}
@media (max-width: 640px) {
  .app-header { padding: 12px 16px; flex-wrap: wrap; }
  .app-brand { font-size: 19px; }
  .app-store { padding: 28px 16px; }
  .app-store h1 { font-size: 30px; }
  .app-shortcuts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .app-shortcuts a { min-height: 56px; border-bottom: 1px solid var(--line); font-size: 15px; }
  .app-section { padding: 28px 16px; }
  .app-section h2 { font-size: 24px; }
  .app-contact { flex-direction: column; }
  .app-contact .button { width: 100%; }
}
