/* 종이(노트)에 직접 써 넣는 느낌: 박스 칸 대신 밑줄, 결과는 포스트잇, 서명은 서명 줄 */
:root { --ink: #23201B; --pencil: #6B655A; --rule: #CFC8B6; --sheet: #FFFEF8; --marker: #FFE68A; --note: #FFF2A6; --margin: #EBA6A1; }
body { color: var(--ink); }
h1, .wd-pg-head h3, .wd-letter h5, .s-more h2, .g-main h2 { font-family: "Gowun Batang", "Nanum Myeongjo", serif; letter-spacing: -0.5px; }
h1 { font-size: 29px; }
.g-main h2 { font-size: 22px; }

/* 요약 상자 → 첫 문단처럼 */
.g-sum { padding: 0 0 0 14px; border: 0; border-left: 3px solid var(--primary); border-radius: 0; background: none; }
.g-sum-k { display: none; }
.g-sum p:last-child { color: var(--pencil); font-size: 16px; }
.s-badges { gap: 0; margin: 4px 0 22px; }
.s-badges li { padding: 0; background: none; box-shadow: none; color: var(--pencil); font-weight: 600; }
.s-badges li + li::before { content: "·"; margin: 0 8px; color: var(--rule); }

/* ---------- 종이 한 장 ---------- */
#withdraw.wd-app { position: relative; margin: 6px 0 26px; padding: 26px 22px 18px 52px; background: var(--sheet); border-radius: 3px;
  box-shadow: 0 1px 1px rgba(60, 50, 20, .08), 0 18px 34px -22px rgba(60, 50, 20, .45); }
#withdraw.wd-app::before { content: ""; position: absolute; left: 36px; top: 0; bottom: 0; width: 1.5px; background: var(--margin); }   /* 노트 왼쪽 빨간 여백선 */
#withdraw.wd-app::after { content: ""; position: absolute; left: 12px; top: 26px; bottom: 26px; width: 12px;                         /* 바인더 구멍 */
  background: radial-gradient(circle at 6px 6px, #E9E5D8 5px, transparent 5.5px) 0 0 / 12px 64px repeat-y; }

/* 단계: 노트 위 글자 탭 */
#withdraw .wd-steps { gap: 4px; border-bottom: 1.5px solid var(--rule); padding-bottom: 0; }
#withdraw .wd-steps button { padding: 6px 2px 9px; border-radius: 0; background: none; color: var(--pencil); font-size: 13px; box-shadow: none; position: relative; }
#withdraw .wd-steps button::before { width: auto; height: auto; margin: 0 0 1px; background: none; box-shadow: none; color: var(--pencil); font-family: "Gowun Batang", serif; font-size: 15px; line-height: 1.2; }
#withdraw .wd-steps li.done button, #withdraw .wd-steps li.done button::before { background: none; color: var(--primary); }
#withdraw .wd-steps li.done button::before { content: "✓"; box-shadow: none; }
#withdraw .wd-steps li.on button { background: none; color: var(--ink); }
#withdraw .wd-steps li.on button::after { content: ""; position: absolute; left: 12%; right: 12%; bottom: -1.5px; height: 3px; border-radius: 2px; background: var(--primary); }
#withdraw .wd-steps li.on button::before { background: none; color: var(--ink); }

/* 쪽 제목: 형광펜 */
#withdraw .wd-pg-head { margin: 18px 0 10px; }
#withdraw .wd-pg-head > span { width: auto; height: auto; background: none; color: var(--margin); font-family: "Gowun Batang", serif; font-size: 22px; line-height: 1.1; }
#withdraw .wd-pg-head h3 { display: inline; font-size: 20px; background: linear-gradient(transparent 58%, var(--marker) 58%, var(--marker) 92%, transparent 92%); }
#withdraw .wd-pg-head p { margin-top: 6px; color: var(--pencil); }

/* 입력: 박스 대신 밑줄 */
#withdraw .wd-card { padding: 0; background: none; box-shadow: none; border-radius: 0; }
#withdraw .rd-row { padding: 12px 0 8px; border-bottom: 0; border-radius: 0; }
#withdraw .rd-row label { font-size: 13.5px; font-weight: 700; color: var(--pencil); }
#withdraw .rd-req { background: none; padding: 0; color: #C2410C; }
#withdraw .rd-in input, #withdraw .rd-in select { height: 40px; padding: 0 2px; border: 0; border-bottom: 1.5px solid var(--rule); border-radius: 0; background: transparent;
  font-size: 17px; font-weight: 600; color: var(--ink); text-align: left; box-shadow: none; }
#withdraw .rd-in input::placeholder { color: #BDB6A4; font-weight: 500; }
#withdraw .rd-in input:focus, #withdraw .rd-in select:focus { border-bottom: 2px solid var(--primary); background: linear-gradient(transparent 70%, rgba(15, 118, 110, .06) 70%); }
#withdraw .rd-in select { appearance: none; -webkit-appearance: none; padding-right: 22px;
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236B655A' stroke-width='1.6'/%3E%3C/svg%3E") right 4px center / 11px no-repeat; }
#withdraw .rd-in i { color: var(--pencil); }
#withdraw .rd-help { color: #9A9384; }
#withdraw .wd-card-t { margin: 22px 0 0; font-family: "Gowun Batang", serif; font-size: 16px; color: var(--ink); }
#withdraw .wd-card-t small { font-family: "Pretendard", sans-serif; color: #9A9384; }
#withdraw .wd-acct, #withdraw .wd-att { margin-top: 6px; padding-top: 4px; border-top: 1.5px dashed var(--rule); }
#withdraw .wd-att .rd-check { font-weight: 600; color: var(--ink); }
#withdraw .rd-check input { accent-color: var(--primary); }
#withdraw .wd-safe { padding: 0; background: none; color: var(--pencil); font-size: 13.5px; }

/* 결과: 포스트잇 */
#withdraw .rd-hero.wd-hero { position: relative; margin: 16px 4px 6px; padding: 20px 18px 16px; border-radius: 2px; background: var(--note); box-shadow: 0 10px 18px -12px rgba(80, 60, 0, .5); transform: rotate(-0.8deg); }
#withdraw .rd-hero.wd-hero::before { content: ""; position: absolute; left: 50%; top: -9px; width: 86px; height: 20px; margin-left: -43px; background: rgba(255, 255, 255, .55); box-shadow: 0 1px 2px rgba(0,0,0,.08); transform: rotate(2deg); }   /* 테이프 */
#withdraw .rd-hero.wd-hero > p { color: var(--pencil); }
#withdraw .rd-hero.wd-hero > b { font-family: "Gowun Batang", serif; font-size: 34px; }
#withdraw .rd-hero.wd-hero > b.down { color: #0F5F57; } #withdraw .rd-hero.wd-hero > b.up { color: #B4320A; }
#withdraw .rd-tag { background: rgba(255,255,255,.6); }
#withdraw .wd-bar { background: rgba(0, 0, 0, .08); }
#withdraw .wd-cal { border: 0; border-bottom: 1.5px solid var(--primary); border-radius: 0; background: none; padding: 0 2px; height: 34px; }

/* 만들 문서: 종이 위 체크 */
#withdraw .wd-kinds-t { font-family: "Gowun Batang", serif; font-size: 16px; }
#withdraw .wd-kind span { padding: 10px 4px 10px 38px; border-radius: 0; background: none; box-shadow: none; border-bottom: 1px dashed var(--rule); }
#withdraw .wd-kind span::before { left: 6px; top: 13px; width: 20px; height: 20px; border-radius: 3px; box-shadow: inset 0 0 0 2px var(--pencil); background: transparent; }
#withdraw .wd-kind input:checked + span { background: none; box-shadow: none; }
#withdraw .wd-kind input:checked + span::before { box-shadow: inset 0 0 0 2px var(--primary); background: transparent; }
#withdraw .wd-kind input:checked + span::after { content: "✓"; position: absolute; left: 8px; top: 3px; color: var(--primary); font-size: 24px; font-weight: 900; line-height: 1; transform: rotate(-6deg); }
#withdraw .wd-kind input:checked + span b { background: linear-gradient(transparent 60%, var(--marker) 60%); }

/* 접는 칸(예치기관 참조): 글자 링크처럼 */
#withdraw .wd-more { background: none; border-radius: 0; }
#withdraw .wd-more summary { padding: 12px 0 6px; color: var(--primary); }
#withdraw .wd-more summary small { color: #9A9384; }
#withdraw .wd-more .rd-row { margin: 0; }

/* 서명: 서명 줄 */
#withdraw .wd-sign-pad { margin-top: 4px; background: none; box-shadow: none; border-radius: 0; }
#withdraw .wd-sign-pad canvas { height: 140px; }
#withdraw .wd-sign-pad::after { left: 0; right: 0; bottom: 30px; border-bottom: 1.5px solid var(--pencil); }
#withdraw .wd-sign-pad::before { content: "서명"; position: absolute; left: 0; bottom: 8px; font-size: 12.5px; color: #9A9384; }
#withdraw .wd-sign-hint { top: 58px; color: #CFC8B6; font-family: "Gowun Batang", serif; }
#withdraw .wd-sign-pad button { border-color: var(--rule); background: var(--sheet); }

/* 문서 미리보기·확인 */
#withdraw .wd-paper { background: none; box-shadow: none; }
#withdraw .wd-paper-head { padding: 12px 0; }
#withdraw .wd-sheet { padding: 0 0 8px; }
#withdraw .wd-btns button { border-radius: 8px; }
#withdraw .wd-todo { padding: 4px 0; background: none; }
#withdraw .rd-wait { background: none; padding: 10px 0; color: var(--pencil); }

/* 아래 고정 바: 종이와 어울리는 짙은 색 */
.wd-mbar { background: #23302C; }
.wd-mnext { background: var(--primary); }

@media (max-width: 720px) {
  #withdraw.wd-app { margin: 4px -8px 22px; padding: 18px 14px 14px 34px; }
  #withdraw.wd-app::before { left: 24px; }
  #withdraw.wd-app::after { left: 6px; width: 10px; background-size: 10px 56px; background-image: radial-gradient(circle at 5px 5px, #E9E5D8 4px, transparent 4.5px); }
  #withdraw.wd-app .wd-steps { margin: -18px -14px 10px -34px; padding: 8px 14px 0 34px; background: rgba(255, 254, 248, .97); }
  #withdraw .rd-row { grid-template-columns: minmax(0, 1fr); row-gap: 2px; }
  #withdraw .rd-hero.wd-hero > b { font-size: 30px; }
}

/* ===== 잘 보이게: 글자 진하게·크게, 중요한 것은 형광펜과 큰 글씨 ===== */
:root { --pencil: #3F3A31; }
body { font-size: 16.5px; }
p, li, td { color: #2F2B25; }
.g-main p { color: #2F2B25; }
/* 요약: 흰 카드 + 굵은 왼쪽 줄, 굵은 글자는 형광펜 */
.g-sum { padding: 16px 18px 16px 18px; border-left: 5px solid var(--primary); border-radius: 4px; background: #fff; box-shadow: 0 1px 0 var(--rule); }
.g-sum p:last-child { color: var(--ink); font-size: 17px; line-height: 1.75; }
.g-sum b, .g-main p b, .g-main li b { color: #111; background: linear-gradient(transparent 62%, var(--marker) 62%, var(--marker) 94%, transparent 94%); }
.g-tip { font-size: 16px; }
/* 표 */
.g-tbl th { font-size: 14px; color: #2F2B25; }
.g-tbl td { font-size: 15.5px; color: #1F1C17; }
.g-tbl td:first-child { font-weight: 700; }
/* 도구 안 글자 */
#withdraw .wd-pg-head p { color: #3F3A31; font-size: 15px; }
#withdraw .rd-row label { font-size: 15px; color: #1F1C17; }
#withdraw .rd-help { font-size: 13.5px; color: #5E574B; }
#withdraw .rd-in input, #withdraw .rd-in select { font-size: 18px; border-bottom-color: #B9B19C; }
#withdraw .rd-in input::placeholder { color: #A39C8A; }
#withdraw .wd-safe { color: #2F5D50; font-size: 14px; }
#withdraw .wd-kind small { font-size: 14px; color: #3F3A31; }
#withdraw .wd-kind b { font-size: 17px; }
#withdraw .wd-more summary small, #withdraw .wd-card-t small, .wd-cover small { color: #5E574B; font-size: 13.5px; }
#withdraw .wd-steps button { font-size: 13.5px; color: #4A4438; }
#withdraw .wd-steps li.on button { font-weight: 800; }
/* 결과 포스트잇: 마감일을 크게 */
#withdraw .rd-hero.wd-hero > p:first-child { font-size: 15px; color: #3F3A31; }
.wd-due { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin: 6px 0 4px !important; font-size: 21px; font-weight: 800; color: #111 !important; }
.wd-due span { padding: 1px 8px; border-radius: 4px; background: #B4320A; color: #fff; font-size: 13px; font-weight: 800; }
#withdraw .rd-hero.wd-hero small { font-size: 14px; color: #3F3A31; line-height: 1.6; }
#withdraw .wd-ends { font-size: 13px; color: #3F3A31; }
/* 아래 고정 바 글자 */
.wd-mbar small { color: #C9D3CF; font-size: 12.5px; }
/* 바닥글 */
.s-foot p { color: #5E574B; }
@media (max-width: 720px) {
  .g-sum p:last-child { font-size: 16.5px; }
  .wd-due { font-size: 19px; }
}
@media (max-width: 720px) {
  .g-tbl td { font-size: 14.5px; }
  .s-dates td:not(:first-child) { white-space: nowrap; }   /* 날짜 표만 한 줄로 (글 표는 줄바꿈) */
}

/* ===== 폰: 앱처럼 (노트 장식은 빼고 화면 가득, 큰 터치 영역) ===== */
@media (max-width: 720px) {
  .s-home h1 { margin-top: 10px; font-size: 25px; }
  .s-home .g-sum { padding: 12px 14px; }
  .s-home .g-sum p:last-child { font-size: 15.5px; }
  .s-badges { margin-bottom: 12px; font-size: 12.5px; }
  #withdraw.wd-app { margin: 0 -16px 22px; padding: 0 16px 16px; border-radius: 0; box-shadow: none; background: var(--sheet); border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
  #withdraw.wd-app::before, #withdraw.wd-app::after { display: none; }
  #withdraw.wd-app .wd-steps { margin: 0 -16px 6px; padding: 8px 10px 0; top: 56px; background: rgba(255, 254, 248, .98); box-shadow: 0 6px 12px -10px rgba(0,0,0,.25); }
  #withdraw .wd-steps button { padding: 4px 0 9px; font-size: 12.5px; }
  #withdraw .wd-pg-head { margin-top: 14px; }
  #withdraw .wd-pg-head h3 { font-size: 21px; }
  #withdraw .rd-in input, #withdraw .rd-in select { height: 48px; font-size: 18px; }
  #withdraw .rd-row { padding: 14px 0 6px; }
  #withdraw .wd-kind span { padding: 14px 6px 14px 40px; }
  #withdraw .rd-hero.wd-hero { margin: 16px 0 8px; transform: none; }
  #withdraw .wd-sheet { margin: 0 -8px; }
  .wd-letter { font-size: 14px; }
  .wd-ft { font-size: 13.5px; } .wd-ft th { width: 74px; } .wd-ft td.sub { width: 68px; }
}
/* 문서(서식) 안은 형광펜·회색 칸 없이 */
.wd-letter b { background: none !important; }
.wd-letter .wd-recv th { background: none; border: 0; color: #111; }
/* 진한 바탕(아래 버튼 상자)에서는 형광펜·진한 글씨를 쓰지 않는다 */
.g-main .s-cta p { color: #DDF2EE; }
.g-main .s-cta p b { background: none; color: #fff; }

/* 순서 목록의 소제목은 형광펜 대신 진한 글씨 (줄 전체에 칠해지지 않게) */
.g-main .g-steps li b { background: none; color: var(--primary-dark); }
@media (max-width: 360px) { .s-badges { flex-wrap: nowrap; } .s-badges li { font-size: 12.5px; white-space: nowrap; } .s-badges li + li::before { margin: 0 5px; } }
@media (max-width: 340px) { .wd-due { font-size: 16.5px; gap: 6px; } }
@media (max-width: 340px) { .g-tbl:not(.g-stack) th, .g-tbl:not(.g-stack) td { padding: 9px 7px; } }
@media (max-width: 380px) { .s-dates td, .s-dates td:not(:first-child) { white-space: normal; } }
