/* 아옴 서비스 화면 시안: 고객, 업체, 작업자, 관리자.
   토큰과 버튼, 푸터는 style.css를 쓴다. 폰이 기본이고 900px부터 PC 배치로 바꾼다.
   관리자 템플릿의 세 가지(왼쪽 메뉴, 수치 카드, 표)를 쓰지 않는다. 숫자와 문장을 제목처럼 찍는다. */

body.sc { --dock-h: 0px; --fill: calc(100vw - var(--gutter) * 2); }
.pane { overflow-x: clip; scroll-margin-top: 240px; }
.pane[hidden] { display: none; }
.sc h1, .sc h2 { font-weight: 900; }

/* ---------- 머리와 탭 ---------- */
.sc-id { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 4px var(--gutter); }
.sc-note { color: var(--ink-2); text-align: right; line-height: 1.35; }
.sc-tabs { position: sticky; top: 0; z-index: 20; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: var(--paper); border-top: var(--line) solid var(--ink); border-bottom: var(--line) solid var(--ink); }
.sc-tabs button { min-height: 56px; padding: 6px 2px; border: 0; border-left: var(--line) solid var(--ink); background: none; cursor: pointer; font-size: 20px; font-weight: 900; letter-spacing: -.05em; line-height: 1; transition: background-color .12s; }
.sc-tabs button:first-child { border-left: 0; }
.sc-tabs button:hover { background: var(--paper-2); }
.sc-tabs button[aria-selected="true"] { background: var(--cobalt); color: var(--paper); }
.sc-tabs button:focus-visible { outline-offset: -6px; outline-color: currentColor; }

/* 공통: 사업자 확인 표시, 도장 */
.tag { display: inline-block; padding: 1px 8px; border: 2px solid var(--ink); font-size: var(--t-note); font-weight: 800; line-height: 1.45; white-space: nowrap; }
.tag-on-dark { border-color: var(--paper); }
.seal {
  flex: none; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%;
  border: 4px solid var(--cobalt); outline: 2px solid var(--cobalt); outline-offset: -10px;
  color: var(--cobalt); font-size: 28px; font-weight: 900; letter-spacing: -.04em; line-height: 1;
  transform: rotate(var(--tilt, -8deg)); filter: url(#ink);
  animation: stamp .36s var(--d, .1s) var(--ease-out) both;
}
.seal-sm { width: 48px; height: 48px; font-size: 14px; border-width: 3px; outline: 0; }
.seal-empty { flex: none; display: block; width: 48px; height: 48px; border-radius: 50%; border: 2px dashed var(--ink); }
.chip { min-height: 44px; padding: 0 14px; border: var(--line) solid var(--paper); background: transparent; color: var(--paper); font-size: var(--t-ui); font-weight: 800; line-height: 1.2; cursor: pointer; white-space: nowrap; }
.chip[aria-pressed="true"] { background: var(--paper); color: var(--cobalt); }
.chip-ink { border-color: var(--ink); color: var(--ink); }
.chip-ink[aria-pressed="true"] { background: var(--ink); color: var(--paper); }

/* ---------- 고객 ---------- */
.c-head { position: relative; padding: 14px var(--gutter) 16px; }
.c-kicker { padding-right: 96px; font-size: var(--t-ui); font-weight: 800; line-height: 1.4; }
.c-title { margin: 10px 0 0 -.03em; font-size: calc(var(--fill) / 4.06); line-height: .98; letter-spacing: -.06em; }
.c-title span { display: block; white-space: nowrap; }
.c-stamp {
  --tilt: -14deg;
  position: absolute; right: var(--gutter); top: 70px; display: grid; place-items: center; width: 104px; height: 104px; border-radius: 50%;
  border: 6px solid var(--cobalt); outline: 3px solid var(--cobalt); outline-offset: -14px;
  color: var(--cobalt); font-size: 34px; font-weight: 900; letter-spacing: -.04em; line-height: 1;
  transform: rotate(var(--tilt)); filter: url(#ink); mix-blend-mode: multiply;
  animation: stamp .4s .45s var(--ease-out) both;
}
.c-stamp[hidden] { display: none; }
.c-lead { margin-top: 12px; font-size: var(--t-body); font-weight: 800; line-height: 1.4; letter-spacing: -.03em; }

/* 폰: 금액 세 개를 먼저 한 줄에 */
.c-strip { display: grid; grid-template-columns: 1fr 1fr 1.32fr; border-top: 4px solid var(--ink); }
.c-strip li + li { border-left: var(--line) solid var(--ink); }
.c-strip a { display: flex; flex-direction: column; min-height: 96px; padding: 8px 10px; text-decoration: none; }
.c-strip span { font-size: var(--t-note); font-weight: 800; line-height: 1.3; }
.c-strip b { font-size: 44px; font-weight: 900; letter-spacing: -.07em; line-height: 1; }
.c-strip li:last-child b { font-size: 36px; line-height: 1.22; }
.c-strip small { font-size: var(--t-note); font-weight: 800; line-height: 1.3; }
.c-strip .is-out a { background: var(--paper-2); }
.c-strip .is-out b { text-decoration: line-through; text-decoration-thickness: 4px; }

.c-board { border-top: 4px solid var(--ink); }
.c-offer { display: block; padding: 16px var(--gutter) 20px; scroll-margin-top: 64px; }
.c-offer + .c-offer { border-top: 4px solid var(--ink); }
.o-head { display: flex; align-items: center; gap: 12px; }
.o-head h2 { font-size: 28px; line-height: 1.1; letter-spacing: -.05em; }
.o-head .tag { margin-top: 4px; }
.o-price { container-type: inline-size; padding: 10px 0 8px; }
.price { display: flex; align-items: baseline; gap: .04em; font-weight: 900; letter-spacing: -.07em; line-height: .92; white-space: nowrap; }
.price b { font-size: 44cqw; font-weight: 900; }
.price span { font-size: 12cqw; letter-spacing: -.05em; }
.price.is-range b { font-size: 23cqw; }
.price-note { margin-top: 2px; font-size: var(--t-ui); font-weight: 800; line-height: 1.4; }
.o-rows { display: block; }
.o-row { display: grid; grid-template-columns: 68px minmax(0, 1fr); gap: 8px; padding: 9px 0; border-top: 2px solid var(--ink); }
.o-row dt { font-size: var(--t-note); font-weight: 800; line-height: 1.6; color: var(--ink-2); }
.o-row dd { font-size: var(--t-ui); font-weight: 700; line-height: 1.45; }
.o-fee dd { font-size: var(--t-body); font-weight: 800; letter-spacing: -.03em; }
.o-fee b { font-weight: 900; color: var(--cobalt); }
.o-num dd .ico { width: 18px; height: 18px; margin-right: 4px; vertical-align: -3px; }
.o-act { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; padding-top: 10px; }
.o-act .btn { padding: 0 12px; }
.o-act .btn-line { min-height: 56px; }
.o-empty { display: none; }
.c-offer.is-out > :not(.o-empty) { display: none; }
.c-offer.is-out .o-empty { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 16px; border: 2px dashed var(--ink); }
.o-empty p { display: grid; gap: 2px; font-size: var(--t-ui); font-weight: 600; line-height: 1.45; }
.o-empty b { font-size: var(--t-lead); font-weight: 900; letter-spacing: -.04em; }

.c-fourth { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding: 18px var(--gutter); background: var(--ink); }
.c-fourth-t { font-size: 40px; font-weight: 900; letter-spacing: -.06em; line-height: 1.02; }
.c-fourth-s { display: flex; align-items: center; gap: 6px; font-size: var(--t-ui); font-weight: 800; line-height: 1.4; }
.c-fourth-s .ico { width: 20px; height: 20px; }

/* ---------- 업체 ---------- */
.b-dark { background: var(--ink); }
.b-top { padding: 12px var(--gutter) 0; }
.b-who { display: flex; align-items: center; gap: 10px; font-size: var(--t-lead); line-height: 1.3; letter-spacing: -.03em; }
.b-who > b { font-weight: 900; }
.b-nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; margin-top: 10px; border-top: 2px solid var(--paper); border-left: 2px solid var(--paper); }
.b-nav button { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; width: 100%; min-height: 52px; padding: 6px 12px; border: 0; border-right: 2px solid var(--paper); border-bottom: 2px solid var(--paper); background: none; color: var(--paper); font-size: var(--t-ui); font-weight: 800; line-height: 1.2; cursor: pointer; text-align: left; }
.b-nav b { font-size: 28px; font-weight: 900; letter-spacing: -.04em; line-height: 1.1; }
.b-nav button:hover { background: #2B2822; }
.b-nav button.is-on { background: var(--paper); color: var(--ink); }
.b-hero { padding: 18px var(--gutter) 24px; display: grid; gap: 20px; }
.b-title { font-size: calc(var(--fill) / 6.08); line-height: 1; letter-spacing: -.06em; margin-left: -.03em; white-space: nowrap; }
.b-week-t { margin: 18px 0 8px; font-size: var(--t-lead); letter-spacing: -.04em; line-height: 1.2; }
.b-week { display: grid; border-top: 2px solid var(--paper); }
.d { display: grid; grid-template-columns: 26px 54px minmax(0, 1fr); align-items: center; gap: 4px; min-height: 52px; padding: 4px 10px; border-bottom: 2px solid var(--paper); }
.d-w { font-size: var(--t-ui); font-weight: 800; line-height: 1.2; }
.d-n { font-size: 36px; font-weight: 900; letter-spacing: -.06em; line-height: 1; }
.d-t { font-size: var(--t-ui); font-weight: 700; line-height: 1.3; }
.d.is-free .d-t { color: #C9C2B3; }
.d.is-hit { min-height: 84px; background: var(--cobalt); border-bottom-color: var(--cobalt); }
.d.is-hit .d-n { font-size: 60px; }
.d.is-hit { grid-template-columns: 26px 84px minmax(0, 1fr); }
.d.is-hit .d-t { font-size: var(--t-body); font-weight: 900; letter-spacing: -.03em; color: var(--paper); }

/* 제안 표: 표 구멍이 뚫린 종이 */
.ticket {
  position: relative; display: grid; gap: 12px; padding: 18px 16px 16px; background: var(--paper); color: var(--ink);
  -webkit-mask: radial-gradient(circle 9px at 50% 0, transparent 8.5px, #000 9px) top / 34px 100% repeat-x;
  mask: radial-gradient(circle 9px at 50% 0, transparent 8.5px, #000 9px) top / 34px 100% repeat-x;
}
.ticket :focus-visible { outline-color: var(--cobalt); }
.ticket-kicker { font-size: var(--t-note); font-weight: 800; line-height: 1.4; }
.ticket h2 { margin-top: 4px; font-size: 48px; line-height: 1; letter-spacing: -.06em; }
.ticket-seats { display: flex; align-items: center; gap: 6px; margin-top: 10px; }
.ticket-seats b { margin-left: 6px; font-size: var(--t-body); font-weight: 900; letter-spacing: -.03em; }
.t-price { display: block; border-top: 4px solid var(--ink); padding-top: 8px; }
.t-price > span:first-child, .t-field > span, .t-field legend { display: block; padding: 0; margin-bottom: 6px; font-size: var(--t-ui); font-weight: 800; line-height: 1.4; }
.t-price-in { display: flex; align-items: baseline; gap: 6px; }
.t-price-in input { width: 2.1ch; min-height: 44px; padding: 0; border: 0; border-bottom: 5px solid var(--cobalt); border-radius: 0; background: transparent; color: var(--ink); font: inherit; font-size: 104px; font-weight: 900; letter-spacing: -.07em; line-height: 1; }
.t-price-in b { font-size: 34px; font-weight: 900; letter-spacing: -.05em; }
.t-field { margin: 0; padding: 0; border: 0; display: block; }
.t-field input, .t-field select { width: 100%; min-height: 48px; padding: 0 12px; border: 2px solid var(--ink); border-radius: 0; background: #FBF8F2; color: var(--ink); font: inherit; font-size: var(--t-ui); font-weight: 700; }
.togs { display: flex; flex-wrap: wrap; gap: 6px; }
.tog { min-height: 44px; padding: 0 12px; border: 2px solid var(--ink); background: transparent; color: var(--ink); font-size: var(--t-ui); font-weight: 800; cursor: pointer; }
.tog[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.ticket-note { font-size: var(--t-note); font-weight: 700; color: var(--ink-2); line-height: 1.45; }

.b-more { display: grid; }
.b-list { padding: 24px var(--gutter) 28px; }
.b-list h2, .b-hire h2 { font-size: 36px; line-height: 1.04; letter-spacing: -.06em; }
.b-list ul { margin-top: 14px; border-top: 4px solid var(--ink); }
.q-row { display: grid; grid-template-columns: 88px minmax(0, 1fr); grid-template-areas: "size main" "seat seat" "cal go"; align-items: center; gap: 4px 10px; padding: 12px 0; border-bottom: 2px solid var(--ink); }
.q-size { grid-area: size; font-size: 56px; font-weight: 900; letter-spacing: -.07em; line-height: 1; }
.q-size small { font-size: 20px; letter-spacing: -.03em; }
.q-main { grid-area: main; }
.q-main h3 { font-size: var(--t-lead); font-weight: 900; }
.q-main p { font-size: var(--t-ui); font-weight: 600; color: var(--ink-2); line-height: 1.35; }
.q-seat { grid-area: seat; display: inline-flex; align-items: center; gap: 8px; font-size: var(--t-ui); font-weight: 800; line-height: 1.4; }
.q-seat .dots { color: var(--cobalt); }
.q-cal { grid-area: cal; font-size: var(--t-ui); font-weight: 800; line-height: 1.4; color: var(--ink-2); }
.q-cal.is-free { color: var(--cobalt); }
.q-row .btn-line { grid-area: go; justify-self: end; }
.q-row.is-on .q-size { color: var(--cobalt); }
.b-hire { padding: 24px var(--gutter) 28px; background: var(--cobalt); }
.b-hire-job { margin-top: 12px; font-size: var(--t-body); font-weight: 800; line-height: 1.4; letter-spacing: -.03em; }
.b-hire-pay { margin-top: 6px; font-size: var(--t-lead); font-weight: 800; line-height: 1; letter-spacing: -.03em; }
.b-hire-pay b { font-size: 96px; font-weight: 900; letter-spacing: -.07em; line-height: 1; }
.b-hire-new { margin: 8px 0 14px; font-size: var(--t-body); font-weight: 900; }
.b-hire .btn { width: 100%; }

/* ---------- 작업자: 코발트 벽 ---------- */
.w { background: var(--cobalt); overflow: clip; padding-bottom: 32px; }
.w-head { padding: 16px var(--gutter) 14px; }
.w-title { font-size: calc(var(--fill) / 6.5); line-height: 1; letter-spacing: -.06em; margin-left: -.03em; }
.w-title span { display: block; white-space: nowrap; }
.w-filters { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.w-grid { display: grid; gap: 20px; padding: 0 var(--gutter); }
.w-list { display: grid; gap: 6px; align-content: start; }
.w-list li[hidden] { display: none; }
.job { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: center; gap: 8px; width: 100%; min-height: 88px; padding: 10px 12px; border: 0; background: var(--paper); color: var(--ink); text-align: left; cursor: pointer; transition: background-color .12s, color .12s; }
.job:focus-visible { outline-color: var(--paper); }
.job:hover { background: var(--paper-2); }
.job[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.job-d { display: grid; justify-items: start; font-size: var(--t-ui); font-weight: 800; line-height: 1.1; }
.job-d b { font-size: 36px; font-weight: 900; letter-spacing: -.06em; line-height: 1; }
.job-m { display: grid; min-width: 0; font-size: var(--t-note); font-weight: 600; line-height: 1.35; }
.job-m strong { font-size: var(--t-body); font-weight: 900; letter-spacing: -.03em; line-height: 1.25; }
.job-p { display: flex; flex-direction: column; align-items: flex-end; font-size: var(--t-note); font-weight: 800; line-height: 1.1; white-space: nowrap; }
.job-p b { font-size: 44px; font-weight: 900; letter-spacing: -.07em; line-height: .96; }

/* 전단지: 아래쪽 띠를 뜯어 간다 */
.flyer { position: relative; padding: 24px 16px 0; background: var(--paper); color: var(--ink); scroll-margin-top: 72px; transform: rotate(-.6deg); }
.flyer :focus-visible { outline-color: var(--cobalt); }
.flyer:focus { outline: 0; }
.flyer-tape { position: absolute; left: 50%; top: -14px; width: 112px; height: 30px; margin-left: -56px; background: var(--paper-2); transform: rotate(-2deg); box-shadow: inset 0 0 0 1px rgba(21, 19, 15, .14); }
.flyer-tag { display: inline-block; padding: 2px 10px; background: var(--ink); color: var(--paper); font-size: var(--t-body); font-weight: 900; letter-spacing: -.03em; line-height: 1.4; }
.flyer-pay { display: flex; align-items: baseline; gap: 6px; margin-top: 4px; font-size: 26px; font-weight: 900; letter-spacing: -.05em; line-height: 1; white-space: nowrap; }
.flyer-pay b { font-size: calc((100vw - var(--gutter) * 2) * .5); font-weight: 900; letter-spacing: -.08em; line-height: .94; color: var(--cobalt); }
.flyer h2 { margin-top: 2px; font-size: 40px; line-height: 1.06; letter-spacing: -.06em; }
.flyer-rows { margin: 12px 0; border-top: 4px solid var(--ink); }
.flyer-rows > div { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 8px; padding: 8px 0; border-bottom: 2px solid var(--ink); }
.flyer-rows dt { font-size: var(--t-ui); font-weight: 900; line-height: 1.45; }
.flyer-rows dd { font-size: var(--t-ui); font-weight: 700; line-height: 1.45; }
.flyer .btn-lg:disabled { background: var(--ink); cursor: default; }
.flyer-after { margin-top: 8px; font-size: var(--t-ui); font-weight: 800; line-height: 1.4; }
.flyer-after[hidden] { display: none; }
.tear { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 16px -16px 0; border-top: 2px dashed var(--ink); }
.tear li { display: flex; justify-content: center; min-height: 136px; padding: 8px 0; writing-mode: vertical-rl; border-left: 2px dashed var(--ink); font-size: var(--t-note); font-weight: 800; letter-spacing: -.02em; line-height: 1.2; white-space: nowrap; cursor: pointer; transform-origin: 50% 0; transition: background-color .12s; }
.tear li:first-child { border-left: 0; }
.tear li:hover { background: var(--paper-2); }
.tear li.is-torn { animation: tear .5s var(--ease-move) both; pointer-events: none; }
@keyframes tear {
  30% { transform: rotate(4deg); }
  100% { transform: translate3d(14px, 90px, 0) rotate(16deg); opacity: 0; }
}

/* ---------- 관리자 ---------- */
.a-head { padding: 14px var(--gutter) 16px; }
.a-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.a-warn { font-size: var(--t-ui); font-weight: 900; letter-spacing: -.02em; line-height: 1.4; }
.a-range { display: flex; gap: 4px; }
.a-title { margin: 12px 0 0 -.03em; font-size: calc(var(--fill) / 6.08); line-height: 1; letter-spacing: -.06em; }
.a-title span { display: block; white-space: nowrap; }
.a-rate { padding: 16px var(--gutter) 20px; background: var(--cobalt); }
.a-rate-k { font-size: var(--t-body); font-weight: 900; letter-spacing: -.03em; line-height: 1.3; }
.a-big { display: flex; align-items: baseline; font-size: 56vw; font-weight: 900; letter-spacing: -.08em; line-height: .86; margin: 6px 0 12px -.03em; }
.a-big small { font-size: .42em; letter-spacing: -.04em; margin-left: .06em; }
.waffle { display: grid; grid-template-columns: repeat(14, minmax(0, 1fr)); gap: 3px; }
.waffle i { display: block; aspect-ratio: 1; border: 2px solid var(--paper); }
.waffle i.on { background: var(--paper); }
.a-rate-s { margin-top: 10px; font-size: var(--t-ui); font-weight: 700; line-height: 1.45; }
.a-funnel { padding: 22px var(--gutter) 24px; }
.a-funnel h2, .a-src h2, .a-todo h2 { font-size: 36px; line-height: 1.04; letter-spacing: -.06em; }
.a-funnel ol { margin-top: 12px; border-top: 4px solid var(--ink); }
.a-funnel li { padding: 8px 0; border-bottom: 2px solid var(--ink); }
.f-l { display: block; font-size: var(--t-ui); font-weight: 800; line-height: 1.4; }
.f-b { display: flex; align-items: center; gap: 8px; }
.f-b i { position: relative; flex: none; height: 26px; width: calc(var(--v) / 42 * (100% - 110px)); background: var(--cobalt); }
.f-b b { font-size: var(--t-lead); font-weight: 900; letter-spacing: -.04em; line-height: 1; white-space: nowrap; }
.f-b small { font-size: var(--t-note); font-weight: 800; color: var(--ink-2); }
.a-note { margin-top: 8px; font-size: var(--t-note); font-weight: 600; color: var(--ink-2); line-height: 1.45; }
.a-src-head { padding: 0 var(--gutter); display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px; }
.a-legend { display: flex; gap: 14px; font-size: var(--t-ui); font-weight: 800; line-height: 1.4; }
.a-legend span { display: inline-flex; align-items: center; gap: 6px; }
.sw { display: block; width: 18px; height: 18px; border: 2px solid var(--ink); }
.sw-s { background: var(--cobalt); border-color: var(--cobalt); }
.a-rows { margin-top: 12px; border-top: 4px solid var(--ink); }
.a-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name pct" "bars bars"; align-items: baseline; gap: 4px 12px; padding: 12px var(--gutter); border-bottom: 2px solid var(--ink); }
.a-row h3 { grid-area: name; font-size: 32px; font-weight: 900; letter-spacing: -.06em; line-height: 1.05; }
.a-pct { grid-area: pct; font-size: 64px; font-weight: 900; letter-spacing: -.07em; line-height: .92; }
.a-pct small { font-size: .42em; }
.a-bars { grid-area: bars; display: grid; gap: 2px; }
.a-bars p { display: flex; align-items: center; gap: 8px; font-size: var(--t-ui); font-weight: 900; line-height: 1.2; }
.a-bars i { position: relative; flex: none; height: 18px; width: calc(var(--v) / 18 * (100% - 44px)); }
.a-bars i.t { border: 2px solid currentColor; }
.a-bars i.s { background: var(--cobalt); }
.a-row.is-hi { background: var(--cobalt); border-bottom-color: var(--cobalt); }
.a-row.is-hi .a-bars i.s { background: var(--paper); }
[data-tip]:hover::after {
  content: attr(data-tip); position: absolute; left: 0; bottom: calc(100% + 6px); z-index: 5;
  padding: 6px 10px; background: var(--ink); color: var(--paper);
  font-size: var(--t-note); font-weight: 700; line-height: 1.3; white-space: nowrap; pointer-events: none;
}
.a-src { padding-top: 8px; }
.a-todo { padding: 24px var(--gutter) 32px; }
.a-todo ul { margin-top: 12px; border-top: 4px solid var(--ink); }
.a-todo li { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 10px 0; border-bottom: 2px solid var(--ink); }
.a-dday { font-size: 32px; font-weight: 900; letter-spacing: -.06em; line-height: 1; }
.a-who { display: grid; font-size: var(--t-note); font-weight: 600; line-height: 1.35; }
.a-who strong { font-size: var(--t-ui); font-weight: 900; letter-spacing: -.02em; }
.a-todo .btn-line { padding: 0 10px; min-width: 0; }

/* ---------- PC 배치 ---------- */
@media (min-width: 900px) {
  .sc-id { padding: 4px var(--gutter); }
  .sc-tabs button { min-height: 76px; font-size: clamp(28px, 3.4vw, 52px); }

  /* 고객: 금액 세 칸과 세로 띠가 한 포스터가 된다 */
  .c-head { padding-top: 12px; padding-bottom: 14px; }
  .c-kicker { padding-right: 240px; font-size: var(--t-body); }
  .c-title { margin-top: 4px; font-size: calc((var(--fill) - 11vw) / 6.62); }
  .c-title span { display: inline; }
  .c-stamp { top: 22px; width: min(12.5vw, 180px); height: min(12.5vw, 180px); font-size: min(4.2vw, 60px); border-width: 9px; outline-width: 4px; outline-offset: -22px; }
  .c-lead { margin-top: 8px; font-size: var(--t-lead); }
  .c-strip { display: none; }
  .c-board { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(136px, 12vw); grid-template-rows: repeat(4, auto); }
  .c-offer { display: grid; grid-row: span 4; grid-template-rows: subgrid; padding: 16px 20px 20px; }
  .c-offer:first-child { padding-left: var(--gutter); }
  .c-offer + .c-offer { border-top: 0; border-left: 4px solid var(--ink); }
  .c-offer.is-out { display: block; }
  .o-head h2 { font-size: min(2.6vw, 38px); }
  .seal { width: 76px; height: 76px; font-size: 32px; }
  .o-rows { min-height: 216px; }
  .o-row dd { font-size: var(--t-body); font-weight: 700; }
  .o-fee dd { font-size: var(--t-lead); }
  .o-row { grid-template-columns: 76px minmax(0, 1fr); }
  .c-offer.is-out .o-empty { height: 100%; align-content: center; }
  .c-fourth { grid-row: 1 / span 4; grid-column: 4; flex-direction: column; flex-wrap: nowrap; justify-content: space-between; align-items: center; padding: 20px 8px; }
  .c-fourth-t { writing-mode: vertical-rl; font-size: min(5vw, 72px); line-height: 1.02; white-space: nowrap; }
  .o-act { align-self: end; }
  .c-fourth-s { flex-direction: column; text-align: center; font-size: var(--t-ui); }

  /* 업체 */
  .b-top { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 10px; }
  .b-nav { display: flex; margin: 0; border: 0; gap: 2px; }
  .b-nav button { min-height: 52px; padding: 4px 16px; border: 2px solid var(--paper); gap: 10px; align-items: center; white-space: nowrap; }
  .b-hero { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: 32px; align-items: start; padding: 16px var(--gutter) 32px; }
  .b-title { font-size: min(calc((var(--fill) - 32px) * .636 / 6.08), calc(var(--vh, 1vh) * 20)); }
  .b-week-t { margin-top: 28px; }
  .b-week { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0; border: 2px solid var(--paper); border-right: 0; }
  .d, .d.is-hit { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 0; min-height: min(36vh, 330px); padding: 10px; border-bottom: 0; border-right: 2px solid var(--paper); }
  .d-n { font-size: min(5.2vw, 76px); margin: 2px 0 8px; }
  .d-w { font-size: var(--t-body); }
  .d-t { margin-top: auto; }
  .d.is-hit .d-n { font-size: min(5.2vw, 76px); }
  .d.is-hit { position: relative; border-right-color: var(--cobalt); }
  .ticket { padding: 22px 22px 18px; }
  .ticket h2 { font-size: min(4vw, 60px); }
  .b-more { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); }
  .b-list { padding: 32px var(--gutter) 40px; }
  .b-list h2, .b-hire h2 { font-size: 48px; }
  .q-row { grid-template-columns: 112px minmax(0, 1fr) auto 112px auto; grid-template-areas: "size main seat cal go"; gap: 16px; padding: 12px 0; }
  .q-size { font-size: 64px; }
  .q-main h3 { font-size: var(--t-h3); }
  .b-hire { padding: 32px 32px 40px; }
  .b-hire-pay b { font-size: min(10vw, 148px); }
  .b-hire .btn { width: auto; }

  /* 작업자 */
  .w { padding-bottom: 56px; }
  .w-head { display: block; padding-top: 16px; padding-bottom: 18px; }
  .w-title { font-size: calc(var(--fill) / 9.95); }
  .w-title span { display: inline; }
  .w-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px; align-items: start; }
  .job { grid-template-columns: 104px minmax(0, 1fr) auto; min-height: 176px; padding: 16px 24px; gap: 12px; }
  .job-d { font-size: var(--t-body); }
  .job-d b { font-size: 84px; }
  .job-m { font-size: var(--t-ui); }
  .job-m strong { font-size: 36px; letter-spacing: -.05em; }
  .job-p { flex-direction: row; align-items: baseline; gap: 4px; font-size: var(--t-lead); font-weight: 900; }
  .job-p b { font-size: 112px; }
  .flyer { padding: 26px 26px 0; transform: rotate(-1.2deg); margin-top: 8px; }
  .flyer-pay b { font-size: min(14vw, 200px); }
  .flyer-pay { font-size: 36px; }
  .flyer h2 { font-size: 48px; }
  .tear { margin: 18px -26px 0; }
  .tear li { min-height: 132px; font-size: var(--t-ui); }

  /* 관리자 */
  .a-head { padding-top: 12px; }
  .a-title { font-size: calc(var(--fill) / 12.05); margin-top: 8px; }
  .a-title span { display: inline; }
  .a-hero { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }
  .a-rate { padding: 24px var(--gutter) 28px; }
  .a-big { font-size: min(25vw, 360px); margin-bottom: 18px; }
  .a-rate-k { font-size: var(--t-lead); }
  .a-rate-s { font-size: var(--t-body); }
  .a-funnel { padding: 24px var(--gutter) 28px 40px; }
  .a-funnel h2, .a-src h2, .a-todo h2 { font-size: 56px; }
  .a-funnel li { display: grid; grid-template-columns: 170px minmax(0, 1fr); align-items: center; gap: 12px; padding: 14px 0; }
  .f-l { font-size: var(--t-body); }
  .f-b i { height: 48px; }
  .f-b b { font-size: 36px; }
  .f-b small { font-size: var(--t-body); }
  .a-src { padding-top: 24px; }
  .a-row { grid-template-columns: minmax(0, 3fr) minmax(0, 6fr) 180px; grid-template-areas: "name bars pct"; align-items: center; gap: 24px; padding: 14px var(--gutter); }
  .a-row h3 { font-size: 52px; }
  .a-pct { font-size: 104px; text-align: right; }
  .a-bars p { font-size: var(--t-lead); }
  .a-bars i { height: 28px; }
  .a-todo ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-bottom: 2px solid var(--ink); }
  .a-todo li { padding: 16px 20px; border-bottom: 0; border-left: 2px solid var(--ink); }
  .a-todo li:first-child { border-left: 0; padding-left: 0; }
  .a-dday { font-size: 44px; }
  .a-who { font-size: var(--t-ui); }
  .a-who strong { font-size: var(--t-lead); }
}
