@font-face{font-family:'SUIT';src:url('fonts/SUIT-Variable.woff2') format('woff2');font-weight:100 900;font-display:swap}

:root{
  /* 팔레트 B: 석고보드 벽과 청사진 (2026-10-16 바탕을 리넨 #E5E0D6에서 석고보드로 바꿈) */
  --bg:#EFEFEB;--surface:#FCFBF8;--ink:#2E2B28;--ink-2:#5D574F;--rule:#D3D0C8;--rule-strong:#85807A;
  --primary:#22508A;--primary-hover:#183C69;--on-primary:#FFFFFF;--primary-wash:#DCE5F0;
  --ready:#6E4724;--ready-hover:#55361B;--on-ready:#FFFFFF;--ready-wash:#ECE3D6;
  --risk-fg:#2E2B28;--risk-bg:#F2BE1A;--cond:#605A52;--chip:#DEDBD4;--focus:#22508A;
  /* 모서리: 물건(질문 상자) > 기록 칸·버튼 > 입력칸 > 표시 */
  --r-object:12px;--r-control:8px;--r-field:6px;--r-mark:4px;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0 auto;max-width:420px;min-height:100vh;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.55;word-break:keep-all}
button,input,textarea{font-family:inherit;font-size:16px;color:inherit}
a{color:var(--primary)}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 상단 */
.top{min-height:56px;padding:6px 12px 0 20px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.top.back{padding-left:6px;justify-content:flex-start}
.brand{margin:0;font-size:17px;font-weight:800}
.back-link{min-height:44px;padding:0 10px;display:flex;align-items:center;gap:4px;color:var(--ink);font-weight:700;text-decoration:none}
.text-btn{min-height:44px;padding:0 8px;border:0;background:transparent;color:var(--primary);font-weight:700;text-decoration:underline;text-underline-offset:4px;display:inline-flex;align-items:center;cursor:pointer}
/* 세 단계: 한 줄 */
.route{margin:0;padding:0 20px;list-style:none;display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px;row-gap:2px;color:var(--ink-2)}
.route li+li::before{content:'→';margin-right:6px;color:var(--ink-2);font-family:system-ui,sans-serif;display:inline-block}
.route .now{color:var(--ink);font-weight:800;text-decoration:underline;text-decoration-color:var(--primary);text-decoration-thickness:3px;text-underline-offset:6px}
.route .past{color:var(--ink)}
.h1{margin:14px 0 0;padding:0 20px;font-size:23px;line-height:1.42;font-weight:800;letter-spacing:-.02em}
.lead{margin:6px 0 0;padding:0 20px;color:var(--ink-2)}

/* 묶음: 면 대신 선. 위는 굵은 선, 항목 사이는 가는 선 */
.block{margin:14px 20px 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--rule-strong)}
.block>*+*{border-top:1px solid var(--rule)}
.note{margin:14px 20px 0;padding:14px 0 16px;border-top:2px solid var(--ink);border-bottom:1px solid var(--rule-strong)}
.sec{padding:36px 0 0}
.sec-h{margin:0;padding:0 20px;font-size:20px;font-weight:800}
.choice{width:100%;min-height:48px;padding:0;border:0;background:transparent;font-size:17px;font-weight:600;text-align:left;cursor:pointer;display:flex;align-items:center}
.choice[aria-pressed=true]{font-weight:800;text-decoration:underline;text-decoration-color:var(--primary);text-decoration-thickness:3px;text-underline-offset:6px}

/* 시작 화면: 세 단계 한 덩어리, 예시는 누를 수 없는 견본 */
.steps{margin:22px 20px 0;padding:0;list-style:none;border-top:2px solid var(--ink)}
.steps li{padding:12px 0;border-bottom:1px solid var(--rule)}
.steps b{display:block;font-size:17px}
.eg{display:block;margin-top:2px;color:var(--ink-2)}
.eg q{quotes:'“' '”';text-decoration:underline;text-decoration-style:dotted;text-decoration-color:var(--rule-strong);text-underline-offset:5px}
.stage-q h2{margin:24px 0 0;padding:0 20px;font-size:17px;font-weight:700}

/* 하단: 왼쪽 요약 + 오른쪽 동사 버튼 */
.dock{position:sticky;bottom:0;margin-top:24px;padding:12px 16px 18px;background:var(--bg);border-top:1px solid var(--rule-strong);display:flex;align-items:center;gap:12px;z-index:4}
.dock .sum{flex:1;min-width:0;color:var(--ink-2);line-height:1.4}
.dock .sum b{color:var(--ink)}
.btn{min-height:52px;padding:0 22px;border:0;border-radius:var(--r-control);background:var(--primary);color:var(--on-primary);font-size:17px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer}
.btn.line{background:transparent;color:var(--primary);box-shadow:inset 0 0 0 1.5px var(--primary)}
.btn.wide{width:100%}
.btn.ready{background:var(--ready);color:var(--on-ready)}
/* 공정 고르기 */
.tiles{margin:16px 20px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.tile{min-height:52px;padding:0 12px;border-radius:var(--r-field);border:1.5px solid var(--rule-strong);display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:17px;font-weight:600;cursor:pointer}
.tile:has(input:checked){border:2px solid var(--primary);background:var(--surface);font-weight:800}
.tile input,.mine input{width:22px;height:22px;margin:0;flex:none}
.tile input{accent-color:var(--primary)}
/* 입력 */
.field{display:flex;flex-direction:column;gap:6px;color:var(--ink-2)}
.field input,.field textarea,.dline input{min-height:48px;padding:0 10px;border:1px solid var(--rule-strong);border-radius:var(--r-field);background:var(--paper);color:var(--ink)}
.field textarea{padding:12px;line-height:1.5;resize:vertical}
input[aria-invalid=true]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);background:var(--ready-wash)}
.err{margin:6px 0 0;font-weight:700;color:var(--ink)}
/* 날짜 정하기: 공정마다 한 줄 */
.dtools{margin:16px 20px 0;display:flex;justify-content:flex-end}
/* 휴대폰: 이름·업체 한 줄 + 시작일·종료일 한 줄 (360px에서 세 칸이면 날짜가 잘려요) */
.dhead,.dline{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:8px;align-items:center}
.dhead{margin:0 20px;padding:0 0 6px;font-size:14px;font-weight:700;color:var(--ink-2)}
.dhead span:first-child{display:none}
.drow{padding:6px 0 12px}
.dname{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:8px}
.dname b{font-size:17px;line-height:1.3}
.dname .text-btn{padding:0;font-weight:600}
.dline input{width:100%;padding:0 8px}
.eline{display:flex;align-items:center;gap:6px}
.eline b{flex:1;min-width:0;font-size:17px}
.mv{width:44px;height:44px;border:1px solid var(--rule-strong);border-radius:var(--r-control);background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer}
.mv:disabled{opacity:.4;cursor:not-allowed;background:var(--track);color:var(--ink-2)}
.del{min-height:44px;padding:0;border:0;background:transparent;color:var(--ink-2);font-weight:700;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
/* 보기 전환 */
.views{display:flex;gap:4px;padding:0 20px;margin-top:14px}
.views button{min-height:44px;padding:0 14px;border:0;border-radius:var(--r-control);background:transparent;color:var(--ink-2);font-weight:700;cursor:pointer;box-shadow:inset 0 0 0 1px var(--rule-strong)}
.views button[aria-pressed=true]{color:var(--ink);box-shadow:inset 0 0 0 2px var(--primary)}
/* 날짜순 목록: 한 줄 전체를 누를 수 있게 */
.day{display:grid;grid-template-columns:52px minmax(0,1fr);gap:8px;padding:10px 0}
.day .dt{line-height:1.25;padding-top:6px}
.day .dt b{display:block;font-size:19px}
.day .dt span{color:var(--ink-2)}
.ev{position:relative;display:flex;align-items:center;gap:10px;margin:0 -8px;padding:6px 8px;border-radius:var(--r-mark)}
.ev+.ev{margin-top:4px}
.ev .t{flex:1;min-width:0;line-height:1.4}
.ev .n{font-size:17px;font-weight:700;color:var(--ink);text-decoration:none}
.ev .n::after{content:'';position:absolute;inset:0}
.ev .s{color:var(--ink-2)}
.ev.ready .n{font-weight:800}
.ev.off .n{color:var(--ink-2)}
.ev .btn,.ev .need,.ev .in-link{position:relative;z-index:1}
.ev .btn.ready{margin-top:10px}
.in-link{display:inline-flex;align-items:center;min-height:44px;font-weight:700}
/* [필요해요] */
.need{flex:none;min-height:44px;padding:0 14px;border:2px solid var(--primary);border-radius:var(--r-control);background:transparent;color:var(--primary);font-weight:800;cursor:pointer}
.need[aria-pressed=true]{background:var(--primary-wash)}
.need.quiet{border:1px solid var(--rule-strong);color:var(--ink-2);font-weight:600}
.need.quiet[aria-pressed=true]{border-color:var(--ink-2);background:transparent;color:var(--ink);font-weight:800}
/* 달력 보기 */
.cal{margin:14px 20px 0;padding:8px 0 4px;border-top:2px solid var(--ink)}
.cal-title{padding:2px 0 8px;font-size:17px;font-weight:800}
.cal-wd,.cal-wk{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));column-gap:2px}
.cal-wd{font-size:14px;color:var(--ink-2);text-align:center;padding-bottom:4px}
.cal-wk{padding:4px 0 8px;border-top:1px solid var(--rule);min-height:44px;align-content:start}
.d{text-align:center;font-weight:600;line-height:28px;grid-row:1}
.d.out{color:var(--ink-2);font-weight:400}
.bar{height:22px;margin-top:3px;padding:0 6px;border-radius:var(--r-mark);font-size:14px;font-weight:700;line-height:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:var(--chip);color:var(--ink)}
.bar.ready{background:var(--ready);color:var(--on-ready)}
.bar.open{background:transparent;border:1.5px dashed var(--ink-2);line-height:19px}
.cal-item{padding:10px 0}
/* 알림 */
.alert{padding:16px 0}
.alert-top{display:flex;align-items:flex-start;gap:12px}
.alert-top p{flex:1;margin:0;font-size:17px;font-weight:700;line-height:1.5}
.alert-date{margin:10px 0 0;display:flex;flex-wrap:wrap;align-items:baseline;column-gap:10px;row-gap:2px}
.alert-date span{color:var(--ink-2)}
.alert-date b{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}
.alert-date.off b,.alert-date.missing b{font-size:17px}
.alert .when{margin:4px 0 0;color:var(--ink-2)}
.cond{margin:10px 0 0;padding:0;list-style:none}
.cond li{position:relative;padding-left:14px}
.cond li+li{margin-top:6px}
.cond li::before{content:'';position:absolute;left:2px;top:.7em;width:6px;height:6px;border-radius:1px;background:var(--cond)}
.switch{flex:none;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:52px;font-size:14px;font-weight:700;color:var(--ink-2);cursor:pointer}
.switch input{appearance:none;-webkit-appearance:none;width:48px;height:28px;margin:0;border-radius:14px;background:var(--rule-strong);position:relative;cursor:pointer;transition:background .15s}
.switch input::after{content:'';position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--paper);transition:transform .15s}
.switch input:checked{background:var(--primary)}
.switch input:checked::after{transform:translateX(20px)}
.alert.muted .alert-top p,.alert.muted .cond li{color:var(--ink-2)}
/* 경고 */
.warn{margin:12px 20px 0;padding:14px 16px;border-radius:var(--r-mark);background:var(--ink);color:var(--surface);font-weight:700;display:flex;gap:10px}
/* 체크리스트 */
.ck-bar{margin-top:16px;padding:6px 20px 6px;background:var(--bg);border-top:2px solid var(--ink);border-bottom:1px solid var(--rule-strong);display:flex;flex-wrap:wrap;align-items:center;column-gap:12px}
.ck-count{margin:0;flex:1 1 100%;font-size:17px;font-weight:800;padding-top:4px}
.ck-bar nav{display:flex;gap:2px;margin-left:-10px}
.ck-bar nav button{min-height:44px;padding:0 10px;border:0;background:transparent;color:var(--primary);font-weight:700;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.stage{margin:32px 0 0;padding:0 20px;font-size:20px;font-weight:800;scroll-margin-top:112px}
.ck{padding:20px 0}
.ck .meta{margin:0;color:var(--ink-2)}
.ck .risk{display:inline-flex;align-items:center;gap:4px;padding:1px 8px;border-radius:var(--r-mark);background:var(--risk-bg);color:var(--risk-fg);font-weight:800}
.ck h3{margin:0;font-size:18px;line-height:1.45;font-weight:800}
.ck-body ul{margin:8px 0 0;padding-left:18px}
.q-label{margin:16px 0 6px;font-weight:800}
.qbox{border-radius:var(--r-object);background:var(--surface);border:1px solid var(--rule-strong);overflow:hidden}
.qbox p{margin:0;padding:14px 16px;white-space:pre-wrap}
.copy{width:100%;min-height:52px;border:0;border-top:1px solid var(--rule);background:var(--primary-wash);color:var(--primary);font-weight:800;display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer}
.mine{margin-top:14px;min-height:52px;padding:0 14px;border-radius:var(--r-control);border:1.5px solid var(--ink);display:flex;align-items:center;gap:12px;font-size:17px;font-weight:600;cursor:pointer}
.mine input{accent-color:var(--ink)}
details{margin-top:8px}
summary{min-height:44px;display:flex;align-items:center;font-weight:700;color:var(--primary);cursor:pointer}
.record{margin-top:12px;padding:14px;border-radius:var(--r-control);background:var(--surface);border:1px solid var(--rule-strong)}
.record h4{margin:0 0 10px;font-size:16px;font-weight:800}
.basis{margin:14px 0 0;padding-top:10px;border-top:1px dashed var(--rule);color:var(--ink-2)}
.basis p{margin:0}
.ph{margin:0;padding:16px 0;color:var(--ink-2)}
.todo{display:flex;align-items:center;gap:10px;min-height:56px}
.todo label{flex:1;min-width:0;display:flex;align-items:center;gap:12px;font-size:17px;cursor:pointer}
.todo input{width:22px;height:22px;margin:0;accent-color:var(--ink)}
footer{margin:40px 20px 0;padding:20px 0 48px;border-top:2px solid var(--ink);color:var(--ink-2)}
footer p{margin:0}footer p+p{margin-top:10px}
footer a{display:inline-flex;align-items:center;min-height:44px}
.tile:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:2px}

/* 시작 화면 휴대폰 순서: 재방문 질문 → 소개 → 단계 질문 → 세 단계 */
#s-start:not([hidden]){display:flex;flex-direction:column}
.start-l,.start-r{display:contents}
#s-start>.top{order:-2}
#revisit{order:-1}
.start-l .h1{order:0}
.stage-q{order:1}
.steps{order:2}
#s-start .dock{order:3}

/* 체크리스트 진행 수와 단계 이동: 휴대폰에서 스크롤 중에도 보이게 */
@media (max-width:899px){
  .ck-bar{position:sticky;top:0;z-index:5}
  .h1{font-size:21px}
}

/* 마우스 */
@media (hover:hover){
  a:hover{color:var(--primary-hover)}
  .btn:hover{background:var(--primary-hover);color:var(--on-primary)}
  .btn.ready:hover{background:var(--ready-hover);color:var(--on-ready)}
  .btn.line:hover,.need:hover{background:var(--primary-wash);color:var(--primary-hover)}
  .need.quiet:hover{background:var(--surface);border-color:var(--ink-2);color:var(--ink)}
  .ev:hover{background:var(--hover)}
  .text-btn:hover,.back-link:hover,summary:hover,.choice:hover,.ck-bar nav button:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
  .tile:hover{border-color:var(--ink-2)}
  .tile:has(input:checked):hover{border-color:var(--primary-hover)}
  .mv:not(:disabled):hover{border-color:var(--ink-2);background:var(--surface)}
  .views button:hover{color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink-2)}
  .copy:hover{background:var(--primary-press)}
  .del:hover{color:var(--ink)}
  .switch:hover input{box-shadow:0 0 0 3px var(--rule)}
}

/* PC: 900px 이상 */
@media (min-width:900px){
  body{max-width:none}
  .app{max-width:1240px;margin:0 auto;padding:0 32px 24px}
  .only-narrow{display:none!important}
  .h1{font-size:28px}
  #s-start:not([hidden]){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px;align-items:start;padding-top:16px}
  #s-start>.top{grid-column:1/-1}
  .start-l,.start-r{display:block}
  .start-l{padding-top:20px}
  .start-l .h1{font-size:34px;line-height:1.35}
  .steps{margin-top:32px}
  .steps li{padding:18px 0}
  .steps b{font-size:19px}
  .start-r .stage-q h2{margin-top:20px}
  .pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:32px;align-items:start}
  .pair.work{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}
  #s-dates{padding-top:93px}
  .tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dhead,.dline{grid-template-columns:minmax(0,1fr) 150px 150px}
  .dhead span:first-child{display:inline}
  .dname{grid-column:auto;flex-direction:column;align-items:flex-start;gap:0}
  .dname b{padding-top:4px}
  /* 오른쪽 패널: 면 대신 세로 선, 스크롤을 따라오지 않는 일반 흐름 */
  .pair.work>#s-checklist,.pair.work>#s-pending{margin-top:20px;padding-left:12px;border-left:1px solid var(--rule-strong)}
}
/* 여러 화면 구현: 시안의 동작용 inline style을 클래스 배치로 옮겨요. */
button, input, select, textarea { font-family:inherit; font-size:16px; max-width:100%; }
button, a, label { -webkit-tap-highlight-color:transparent; }
input, textarea, select { min-width:0; }
select { min-height:48px; padding:8px; border:1px solid var(--rule-strong); border-radius:var(--r-field); background:var(--surface); }
p { overflow-wrap:anywhere; }
.screen { min-width:0; }
.status-message:empty { display:none; }
.status-message { margin:12px 16px; padding:12px; border-radius:12px; background:var(--primary-wash); }
@media(min-width:900px) { .status-message { margin:0 0 16px; } }
.warn { margin-bottom:12px; }
.h1:focus, .schedule-title:focus { outline-offset:2px; }
.start-screen:not([hidden]) { display:flex; flex-direction:column; }
.start-screen > .top { order:-3; }
.start-screen .followup-section { order:-2; }
.start-screen .h1 { order:0; font-size:21px; margin-top:8px; }
.start-screen .steps { order:1; margin-top:12px; }
.start-screen .stage-q { order:2; }
.start-screen .dock { order:3; margin-top:12px; }
.start-screen .steps li { padding:4px 0; }
.start-screen .steps b, .start-screen .steps .eg { display:inline; font-size:16px; }
.start-screen .steps b { margin-right:8px; }
.start-screen .stage-q h2 { margin-top:14px; font-size:17px; }
.start-screen .stage-q .block { margin-top:8px; }
.start-screen .choice { min-height:44px; font-size:16px; }
.optional { font-weight:500; color:var(--ink-2); }
.followup-section h2 { font-size:17px; }
.followup-form { display:grid; gap:10px; }
.followup-form label { display:grid; gap:6px; }
.custom-builder { margin:8px 20px 0; }
.custom-builder > button { padding-left:0; }
.custom-form { display:grid; gap:8px; }
.date-rows { margin-top:0; }
.drow { overflow-wrap:anywhere; }
.dname b { overflow-wrap:anywhere; }
.dhead { font-size:16px; }
.drow .field { margin-top:8px; }
.field textarea { width:100%; min-height:100px; }
.err { grid-column:1/-1; margin:8px 0; }
.empty-message { margin:0; padding:14px 0; }
.schedule-title { margin:0; font-size:21px; font-weight:800; }
.schedule-help { margin:8px 0 0; padding:0 20px; color:var(--ink-2); }
.ev { min-height:52px; flex-wrap:wrap; }
.ev .t { flex-basis:160px; }
.ev .inline-status { flex-basis:100%; position:relative; z-index:1; }
.ev .s { overflow-wrap:anywhere; }
.undated { font-size:16px!important; }
.calendar-week { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:3px 2px; padding:6px 0; border-top:1px solid var(--rule); }
.calendar-week > .d { grid-row:1; }
.calendar-bar { display:block; min-height:44px; border-radius:var(--r-mark); padding:8px 5px; background:var(--chip); color:var(--ink); font-size:16px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-decoration:none; }
.calendar-bar.ready { background:var(--ready); color:var(--on-primary); }
.calendar-bar.open { background:transparent; border:1px dashed var(--ink-2); }
.calendar-bar.notice-date { background:var(--primary-wash); color:var(--primary); }
.month-field { margin-bottom:10px; }
.notice-section > .alert + .alert { border-top:1px solid var(--rule); }
.notice-title { margin:0; }
.notice-condition { padding-left:14px; position:relative; }
.notice-condition::before { content:''; position:absolute; width:6px; height:6px; left:2px; top:.7em; background:var(--cond); }
.alert .field { margin-top:12px; }
.alert-top .notice-title { min-width:0; }
.switch { font-size:16px; }
.switch b { font-weight:700; }
.export-actions { display:flex; flex-direction:column; gap:8px; margin:14px 20px 0; }
.export-actions p { margin:0; }
.export-actions input[type=file] { width:100%; }
footer .footer-title { font-size:18px; margin:0 0 10px; }
footer .text-btn { padding-left:0; }
.ck-bar { border-bottom:1px solid var(--rule-strong); box-shadow:0 2px 0 var(--bg); }
.check-body { margin:10px 0 0; }
.check-title { overflow-wrap:anywhere; }
.qbox { margin-bottom:14px; }
.js-question { white-space:pre-wrap; }
.ck .meta { margin-top:4px; }
.record .field + .field { margin-top:10px; }
.basis { font-size:16px; }
.evidence-source + .evidence-source { margin-top:12px; }
.evidence-lines { margin:0; }
.checklist-screen footer { margin-top:30px; }
.todo-form { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:8px; margin:12px 20px; }
.todo-form .btn { padding:0 14px; min-height:48px; }
.todo-form .field { min-width:0; }
.todo { flex-wrap:wrap; padding:8px 0; }
.todo > label { flex:1 1 150px; }
.todo .del { flex-shrink:0; }
.inline-status { margin:6px 0; color:var(--primary); }
.copy-fallback { padding:12px; }
.copy-fallback textarea { width:100%; min-height:140px; }
@media(max-width:899px) {
  .ck-bar { position:sticky; top:0; z-index:5; }
  .checklist-screen .stage { scroll-margin-top:110px; }
}
@media(min-width:900px) {
  .start-screen:not([hidden]) { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 64px; align-items:start; padding-top:16px; }
  .start-screen > .top { grid-column:1/-1; }
  .start-screen .start-l, .start-screen .start-r { display:block; padding-top:20px; }
  .start-screen .h1 { font-size:34px; margin-top:0; }
  .start-screen .stage-q h2 { margin-top:0; }
  .start-screen .steps { margin-top:24px; }
  .start-screen .steps li { padding:12px 0; }
  .start-screen .steps b, .start-screen .steps .eg { display:block; }
  .start-screen .choice { min-height:48px; }
  .dates-screen { padding-top:93px; }
  .work > .checklist-screen, .work > .pending-screen { margin-top:20px; padding-left:12px; border-left:1px solid var(--rule-strong); }
  .ck-bar { position:static; }
}
.calendar-start-1 { grid-column-start:1; }
.calendar-span-1 { grid-column-end:span 1; }
.calendar-start-2 { grid-column-start:2; }
.calendar-span-2 { grid-column-end:span 2; }
.calendar-start-3 { grid-column-start:3; }
.calendar-span-3 { grid-column-end:span 3; }
.calendar-start-4 { grid-column-start:4; }
.calendar-span-4 { grid-column-end:span 4; }
.calendar-start-5 { grid-column-start:5; }
.calendar-span-5 { grid-column-end:span 5; }
.calendar-start-6 { grid-column-start:6; }
.calendar-span-6 { grid-column-end:span 6; }
.calendar-start-7 { grid-column-start:7; }
.calendar-span-7 { grid-column-end:span 7; }
/* 직접 추가한 긴 이름도 화면 폭 안에서 읽을 수 있어요. */
.h1, .tile span, .ev .n, .dname .text-btn { overflow-wrap:anywhere; }
.tile span { min-width:0; }
.dname .text-btn { max-width:100%; text-align:left; }
/* v3: 전환 제목은 얇은 표시만 두고 조작 요소의 초점은 유지해요. */
.screen :is(h1,h2)[tabindex="-1"]:focus { outline:none; }
.use-date-field { display:flex; flex-direction:column; align-items:flex-start; gap:6px; width:100%; }
.use-date-field input { width:calc((100% - 8px) / 2); }
@media(min-width:900px) { .use-date-field input { width:150px; } }
/* v4: 공통 입력칸과 단계별 체크리스트 */
.field-label { display:flex; flex-direction:column; gap:6px; min-width:0; }
.field-input { width:100%; min-height:48px; padding:0 10px; border:1px solid var(--rule-strong); border-radius:var(--r-field); background:var(--paper); color:var(--ink); font:inherit; }
.field textarea.field-input { min-height:0; padding:12px 10px; line-height:1.5; resize:none; overflow-y:hidden; }
.record .field-label + .field-label { margin-top:10px; }
.ck-bar nav.checklist-tabs { flex-basis:100%; margin-left:0; gap:4px; }
.ck-bar nav.checklist-tabs button { flex:1; min-width:0; padding:8px 3px; font-size:16px; white-space:nowrap; text-decoration:none; border-bottom:3px solid transparent; }
.ck-bar nav.checklist-tabs button[aria-selected=true] { border-bottom-color:var(--primary); background:var(--primary-wash); }
.evidence summary { cursor:pointer; }
.evidence-lines { margin-top:8px; overflow-wrap:anywhere; }

/* v5: 승인 시안의 글자 크기·간격, PC의 독립 화면 구조 */
body { line-height:1.5; }
.appbar, .process-sidebar, .vendor-cell, .company-heading { display:none; }
.top { min-height:52px; padding:4px 12px 0 16px; }
.top.back { padding-left:4px; }
.brand { font-size:16px; text-decoration:none; color:var(--ink); }
.route, .h1, .lead, .sec-h, .stage, .stage-q h2, .schedule-help { padding-left:16px; padding-right:16px; }
.h1, .start-screen .h1, .schedule-title { font-size:20px; line-height:1.4; }
.h1 { margin-top:10px; }
.lead { margin-top:4px; }
.block, .note, .steps, .tiles, .cal, .warn, .dtools, .dhead, .custom-builder, .export-actions, .todo-form, .status-message { margin-left:16px; margin-right:16px; }
.block { margin-top:10px; }
.note { margin-top:12px; padding:12px 0 14px; }
.sec { padding-top:28px; }
.sec-h, .stage { font-size:18px; }
.choice, .start-screen .choice { min-height:44px; font-size:16px; font-weight:600; }
.start-screen .stage-q h2 { font-size:16px; }
.start-screen .steps { margin-top:16px; }
.start-screen .steps li { padding:8px 0; }
.start-screen .steps b, .start-screen .steps .eg { display:block; }
.start-screen .stage-q { order:1; }
.start-screen .steps { order:2; }
.dock { margin-top:20px; padding:10px 16px 14px; }
.btn { min-height:48px; padding:0 20px; font-size:16px; font-weight:800; }
.tiles { margin-top:12px; gap:6px; }
.tile { min-height:44px; padding:0 10px; font-size:16px; font-weight:600; }
.tile:has(input:checked) { font-weight:700; }
.field input, .dline input, .field-input, select { min-height:44px; }
.field textarea.field-input { min-height:0; padding:10px; }
.dtools { margin-top:10px; }
.dhead { font-size:14px; }
.drow { padding:4px 0 10px; }
.dname b, .eline b { font-size:16px; font-weight:700; }
.vendor-cell { grid-column:1/-1; }
.vendor-cell.vendor-open { display:flex; }
.views { margin-top:10px; padding:0 16px; }
.views button { min-height:44px; padding:0 12px; }
.schedule-help { margin-top:6px; }
.day { grid-template-columns:44px minmax(0,1fr); padding:8px 0; }
.day .dt b { font-size:17px; }
.ev { gap:8px; margin:0 -6px; padding:4px 6px; }
.ev .n { font-size:16px; font-weight:700; }
.ev.ready .n { font-weight:700; }
.alert { padding:12px 0; }
.alert-top { gap:10px; }
.alert-top p { font-size:16px; }
.alert-date { margin-top:6px; column-gap:8px; }
.alert-date b { font-size:19px; }
.alert-date.off b, .alert-date.missing b { font-size:16px; }
.alert .when { margin-top:2px; }
.ck-bar { margin-top:12px; padding:4px 16px; }
.ck-count { font-size:16px; }
.ck { padding:16px 0; }
.ck h3 { font-size:17px; }
.ck .meta { margin-top:2px; }
.ck-body p { margin-top:8px; }
.ck-body ul { margin-top:6px; }
.q-label { margin:14px 0 6px!important; }
.question-details { margin:0; }
.question-details summary { padding:0 12px; }
.question-details p.js-question { margin:0; padding:12px 14px; }
.record { margin-top:10px; padding:0 12px 12px; }
.record:not([open]) { padding-bottom:0; }
.record > summary { color:var(--ink); font-size:16px; font-weight:700; }
.record .field:first-of-type { margin-top:6px; }
.todo > label { min-height:44px; }
footer { margin:32px 16px 0; padding:16px 0 40px; }
footer .footer-title { font-size:18px; }
@media(min-width:900px) {
  .app { max-width:1200px; padding:0 32px 24px; }
  .appbar { display:block; border-bottom:1px solid var(--rule-strong); background:var(--surface); }
  .appbar-in { max-width:1200px; min-height:60px; margin:0 auto; padding:0 32px; display:flex; align-items:stretch; gap:40px; }
  .appbar .brand { display:flex; align-items:center; font-size:17px; }
  .main-tabs { flex:1; display:flex; gap:28px; }
  .main-tabs a { display:flex; align-items:center; gap:6px; min-height:44px; padding:0 2px; border-bottom:3px solid transparent; color:var(--ink-2); font-weight:700; text-decoration:none; }
  .main-tabs a[aria-current=page] { color:var(--ink); border-bottom-color:var(--primary); }
  .tab-count { font-size:14px; font-weight:600; color:var(--ink-2); }
  .appbar .text-btn { align-self:center; }
  .top.back, .route, .start-screen > .top, .only-narrow { display:none!important; }
  .h1, .start-screen .h1 { font-size:24px; padding:0; }
  .lead, .schedule-help, .sec-h, .stage, .stage-q h2 { padding-left:0; padding-right:0; }
  .block, .note, .steps, .tiles, .cal, .warn, .views, .dtools, .dhead, .ck-bar, footer, .custom-builder, .export-actions, .todo-form { margin-left:0; margin-right:0; }
  .top, .views, .ck-bar { padding-left:0; padding-right:0; }
  .dock { position:static; margin-top:20px; padding:0; border:0; background:none; justify-content:flex-end; }
  .dock .sum { flex:0 1 auto; }
  .start-screen:not([hidden]) { padding-top:40px; column-gap:72px; }
  .start-screen .start-l, .start-screen .start-r { padding-top:0; }
  .start-screen .h1 { margin:0; font-size:32px; line-height:1.35; }
  .start-screen .stage-q h2 { margin-top:0; }
  .start-screen .steps { margin-top:28px; }
  .start-screen .steps li { padding:14px 0; }
  .start-screen .steps b { font-size:18px; }
  .pair { display:block; }
  .pair.make:has(> section:not([hidden])) { display:grid; grid-template-columns:320px minmax(0,1fr); gap:0; align-items:start; padding-top:28px; }
  #js-screen-build { padding-right:32px; }
  .dates-screen { padding:0 0 0 40px; border-left:1px solid var(--rule); }
  .make .h1 { font-size:20px; margin-top:0; }
  .tiles { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dhead, .dline { grid-template-columns:minmax(76px,1fr) minmax(0,1.1fr) minmax(0,1.1fr) minmax(72px,1fr); column-gap:12px; }
  .dhead { padding-top:14px; }
  .dhead span:first-child, .company-heading { display:inline; }
  .dname { grid-column:auto; flex-direction:row; }
  .dname .js-company-toggle { display:none; }
  .vendor-cell, .vendor-cell.vendor-open { display:flex; grid-column:auto; font-size:0; margin-top:0; gap:0; }
  .vendor-cell input { font-size:16px; }
  .drow { padding:8px 0; }
  .drow .vendor-cell { margin-top:0; }
  .work[data-mode=schedule] #js-screen-schedule:not([hidden]) { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:0 56px; align-items:start; padding-top:28px; }
  #js-screen-schedule > .top { grid-column:1/-1; margin-bottom:6px; }
  #js-screen-schedule > footer { grid-column:1/-1; }
  .schedule-main, .schedule-rail { min-width:0; }
  .schedule-rail .sec:first-child { padding-top:0; }
  .day { grid-template-columns:72px minmax(0,1fr); padding:10px 0; }
  .work[data-mode=check] { display:grid; grid-template-columns:240px minmax(0,1fr); gap:56px; padding-top:28px; align-items:start; }
  .work[data-mode=check] .process-sidebar { display:block; }
  .process-sidebar { min-width:0; }
  .process-sidebar h2 { margin:0 0 8px; font-size:16px; color:var(--ink-2); }
  .process-sidebar ul { margin:0; padding:0; list-style:none; border-top:2px solid var(--ink); }
  .process-sidebar li { border-bottom:1px solid var(--rule); }
  .process-sidebar li a { display:block; min-height:44px; padding:10px 8px; color:var(--ink); text-decoration:none; overflow-wrap:anywhere; }
  .process-sidebar li a span { display:block; color:var(--ink-2); font-weight:400; }
  .process-sidebar a[aria-current=true] { background:var(--ready-wash); font-weight:700; }
  .work > .checklist-screen, .work > .pending-screen { max-width:720px; margin:0; padding:0; border:0; }
  .checklist-screen .h1, .pending-screen .h1 { margin-top:0; }
}
@media(min-width:900px) and (max-width:1099px) {
  .app, .appbar-in { padding-left:24px; padding-right:24px; }
  .appbar-in { gap:24px; }
  .main-tabs { gap:20px; }
  .pair.make:has(> section:not([hidden])) { grid-template-columns:280px minmax(0,1fr); }
  #js-screen-build { padding-right:24px; }
  .dates-screen { padding-left:24px; }
  .dhead, .dline { column-gap:6px; grid-template-columns:minmax(64px,.8fr) minmax(0,1fr) minmax(0,1fr) minmax(56px,.8fr); }
  .work[data-mode=schedule] #js-screen-schedule:not([hidden]) { gap:32px; }
  .work[data-mode=check] { grid-template-columns:200px minmax(0,1fr); gap:32px; }
}
@media(hover:hover) {
  .main-tabs a:hover { color:var(--ink); border-bottom-color:var(--rule-strong); }
  .process-sidebar li a:hover { background:var(--ready-wash); }
}
@media(prefers-reduced-motion:reduce) { .switch input, .switch input::after { transition:none; } }

/* v6: 접힌 항목 목록과 알림 사용 순서 */
.tile-name { min-width:0; }
.tile-hint { display:block; color:var(--ink-2); font-size:12px; font-weight:500; line-height:1.4; }
.notice-guide { margin:12px 16px 0; }
.notice-guide p { margin:0; }
.notice-guide ol { margin:10px 0 12px; padding-left:24px; }
.notice-guide li + li { margin-top:6px; }
.ck.check-item { padding:0; }
.item-toggle { display:grid; grid-template-columns:22px minmax(0,1fr) auto 10px; align-items:start; gap:8px; width:100%; min-height:52px; padding:14px 0; border:0; background:transparent; text-align:left; font:inherit; color:var(--ink); cursor:pointer; }
.item-title { overflow-wrap:anywhere; }
.question-tag { color:var(--ink-2); font-size:12px; line-height:1.5; font-weight:500; white-space:nowrap; padding-top:3px; }
.item-toggle::after { content:''; grid-column:4; align-self:start; width:7px; height:7px; margin-top:7px; border-right:2px solid var(--ink-2); border-bottom:2px solid var(--ink-2); transform:rotate(45deg); }
.item-toggle[aria-expanded=true]::after { transform:rotate(225deg); margin-top:10px; }
.item-check-state { display:block; position:relative; width:22px; height:22px; margin-top:2px; border:1px solid var(--ink); border-radius:2px; }
.item-check-state.is-checked { background:var(--ink); }
.item-check-state.is-checked::after { content:''; position:absolute; width:5px; height:10px; top:3px; left:7px; border:solid var(--surface); border-width:0 2px 2px 0; transform:rotate(45deg); }
.check-item > .ck-body { padding-bottom:16px; }
@media(hover:hover) { .item-toggle:hover .item-title { color:var(--primary); text-decoration:underline; text-underline-offset:4px; } }
@media(min-width:900px) { .notice-guide { margin-left:0; margin-right:0; } }
@media(max-width:899px) {
  .appbar { display:block; position:static; border-bottom:1px solid var(--rule-strong); background:var(--surface); }
  .appbar.start-menu { display:none; }
  .appbar-in { display:flex; flex-wrap:nowrap; align-items:stretch; gap:8px; padding:0 8px; min-height:48px; }
  .appbar .brand { display:flex; align-items:center; flex-shrink:0; min-height:44px; font-size:13px; white-space:nowrap; }
  .main-tabs { flex:1; min-width:0; display:flex; justify-content:space-between; gap:4px; }
  .main-tabs a { display:flex; align-items:center; min-height:44px; padding:0 2px; border-bottom:3px solid transparent; color:var(--ink-2); font-size:14px; font-weight:700; text-decoration:none; white-space:nowrap; }
  .main-tabs a[aria-current=page] { color:var(--ink); border-bottom-color:var(--primary); }
  .main-tabs .tab-count, .appbar .text-btn { display:none; }
  #js-screen-schedule > .top.back, #js-screen-schedule > .route, #js-screen-checklist > .top.back, #js-screen-pending > .top.back { display:none; }
  .check-item { scroll-margin-top:110px; }
}

/* 재이용: 지급·질문 상태·선택형 기여 */
.browser-tip p, #js-empty-return p { margin:0; }
.browser-tip .field { margin-top:8px; }
.quick-backup { padding:0 16px; }
.payments, .paid-export { margin:12px 16px 0; }
.payment-card { margin-top:12px; padding:0 12px 12px; border-top:1px solid var(--rule-strong); }
.payment-card:not([open]) { padding-bottom:0; }
.payment-card summary { color:var(--ink); overflow-wrap:anywhere; }
.payment-card .field + .field { margin-top:10px; }
.payment-card h3 { margin:16px 0 4px; font-size:17px; }
.payment-links, .waiting-links { display:flex; flex-direction:column; }
.item-jump { width:100%; justify-content:flex-start; text-align:left; white-space:normal; overflow-wrap:anywhere; padding:8px 0; line-height:1.5; }
.payment-event { padding:0; }
.payment-mark { font-size:12px; color:var(--primary); font-weight:700; }
.payment-date { width:100%; text-align:left; border:0; background:var(--primary-wash); }
.waiting-section { margin:16px 16px 0; padding:12px 0; border-top:2px solid var(--ink); border-bottom:1px solid var(--rule-strong); }
.waiting-section .sec-h { padding:0; }
.question-state { margin:12px 0; display:grid; gap:10px; }
.question-state select { width:100%; }
.consent-prompt { margin:12px 0 0; padding:12px; }
.consent-prompt p { margin-top:0; }
.consent-prompt ul { padding-left:20px; }
.reminder-option { min-height:44px; display:flex; align-items:center; gap:8px; cursor:pointer; padding:8px 0; }
.reminder-option .switch input { width:48px; height:28px; }
.reminder-option > span:first-of-type { flex:1; }
.paid-offer { padding:14px 0; }
.paid-offer .btn { padding:12px 16px; font-weight:700; height:auto; white-space:normal; line-height:1.5; text-align:left; }
.paid-offer p { margin:8px 0 0; }
.js-mark-waiting { padding:10px 12px; font-weight:700; white-space:normal; text-align:left; line-height:1.5; }
button:disabled { opacity:.5; cursor:not-allowed; }
@media(min-width:900px) {
  .payments, .paid-export, .waiting-section { margin-left:0; margin-right:0; }
  #js-screen-schedule > .quick-backup { grid-column:1/-1; padding:0; margin-bottom:12px; }
}

/* 수정 v7: 알림은 제목과 상태로 접고, 날짜와 조건은 함께 펼쳐요. */
.notice-item { padding:0; }
.notice-summary { grid-template-columns:minmax(0,1fr) auto 10px; gap:8px; align-items:start; }
.notice-summary::after { grid-column:3; }
.notice-summary .notice-title { font-size:16px; font-weight:700; overflow-wrap:anywhere; }
.notice-state { color:var(--ink-2); font-size:14px; font-weight:500; white-space:nowrap; padding-top:2px; }
.notice-body { padding-bottom:16px; }
.payment-reminder-date { display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 8px; margin:0; width:100%; }
.payment-draft { margin-top:12px; padding:12px; border:1px solid var(--rule-strong); border-radius:var(--r-control); background:var(--surface); }
.payment-draft h3 { margin:0 0 12px; font-size:17px; }
.payment-draft .field + .field { margin-top:10px; }
.payment-draft-actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.contribute-options { border:0; padding:0; margin:12px 0; min-width:0; }
.contribute-options legend { font-weight:700; padding:0; }
.contribute-choice { min-height:44px; display:flex; align-items:center; gap:8px; cursor:pointer; }
.contribute-choice input { width:20px; height:20px; margin:0; flex:none; accent-color:var(--primary); }
.js-paid-info .text-btn { margin-right:8px; }
@media(hover:hover) { .contribute-choice:hover { color:var(--primary); } }

/* 수정 v8: 다가오는 것과 세 탭, 접어 둔 내보내기 */
.upcoming { padding-top:12px; }
.upcoming .sec-h { margin-bottom:4px; }
.upcoming .block { margin-top:0; }
.upcoming-item { display:flex; width:100%; justify-content:flex-start; text-align:left; white-space:normal; overflow-wrap:anywhere; border-bottom:1px solid var(--rule); padding:8px 0; line-height:1.5; }
.schedule-tabs { gap:8px; margin-top:20px; }
.schedule-tabs button { flex:1; }
.schedule-tabs button[aria-selected=true] { color:var(--ink); box-shadow:inset 0 0 0 2px var(--primary); }
.schedule-panel { padding-top:16px; }
.payment-group > h3 { margin:20px 0 4px; font-size:16px; overflow-wrap:anywhere; }
.payment-card { margin-top:0; }
.payment-event .text-btn { padding-left:0; text-align:left; white-space:normal; overflow-wrap:anywhere; }
.payment-draft .field + .field { margin-top:10px; }
.notice-summary::after { grid-row:1; }
.notice-summary-date { grid-column:1/-1; grid-row:2; font-size:15px; font-weight:500; color:var(--ink-2); }
.notice-export { margin:12px 16px 0; }
.export-panel { padding-top:20px; }
.export-panel > summary { margin:0; padding-top:12px; padding-bottom:12px; border-top:1px solid var(--rule-strong); }
.export-panel .export-actions { margin-top:8px; }
@media(min-width:900px) {
  .upcoming { padding-top:0; }
  .notice-export { margin-left:0; margin-right:0; }
  .schedule-rail { padding-top:0; }
}

/* 수정 v9: 금액은 기기에만 저장, 알림은 공정별로 펼쳐요. */
.project-info { margin:16px; padding:12px 0; border-top:1px solid var(--rule-strong); border-bottom:1px solid var(--rule); }
.project-info summary, .notice-group > summary { cursor:pointer; font-weight:700; min-height:44px; padding:10px 0; overflow-wrap:anywhere; }
.project-options { margin:12px 0; padding:0; border:0; min-width:0; }
.project-options legend { font-weight:700; }
.project-options .contribute-choice { display:inline-flex; margin-right:16px; }
.budget-summary { display:grid; gap:4px; padding:12px 0; border-top:2px solid var(--ink); border-bottom:1px solid var(--rule); font-variant-numeric:tabular-nums; }
.budget-group-totals { display:flex; flex-wrap:wrap; column-gap:14px; row-gap:4px; padding:10px 0; font-variant-numeric:tabular-nums; }
.budget-total { overflow-wrap:anywhere; }
.budget-over { flex-basis:100%; margin:4px 0 0; font-weight:700; }
.budget-group-body > .field { max-width:320px; }
.amount-display { min-height:24px; font-variant-numeric:tabular-nums; color:var(--ink); }
.amount-privacy { color:var(--ink-2); }
.payment-order-warning { font-weight:700; }
.notice-group { padding:0 0 4px; }
.notice-group > .notice-item { margin:0; }
.notice-description { margin:0 0 12px; }
.view-switch { gap:12px; }
.view-switch button { padding:0 4px; box-shadow:none; border:0; border-radius:0; font-size:14px; font-weight:500; text-decoration:none; }
.view-switch button[aria-pressed=true] { box-shadow:none; font-weight:800; text-decoration:underline; text-underline-offset:5px; }
.today-divider { margin:12px 0 0; padding:8px 0; border-top:2px solid var(--primary); font-weight:700; }
.calendar-week .d.today { outline:2px solid var(--primary); outline-offset:-2px; font-weight:800; }
.calendar-week .d.today small { display:block; font-size:12px; }
@media(min-width:900px) { .project-info { margin-left:0; margin-right:0; } }

.js-amount[aria-invalid=true] { border-style:dashed; border-width:2px; }

@media(hover:hover) { .view-switch button:hover { box-shadow:none; } }

/* 수정 v10: 예산은 별도 화면, 지급에는 실제 지급 목록만 표시해요. */
.budget-group { margin:0; padding:0; border-top:0; border-bottom:1px solid var(--rule); }
.budget-group > summary { min-height:44px; padding:12px 0; font-weight:700; cursor:pointer; overflow-wrap:anywhere; }
.budget-group-body { padding:4px 0 16px; }
.budget-payment { display:flex; width:100%; padding:8px 0; line-height:1.5; white-space:normal; overflow-wrap:anywhere; }
.budget-screen .amount-privacy { margin-top:20px; }
.budget-link { padding-left:0; margin-right:12px; }
.budget-empty { margin:16px 0; }
@media(min-width:900px) { .budget-screen { max-width:720px; margin:0 auto; padding-top:28px; } }

/* 구현 v4·v5: 홈과 작업 화면에 공통으로 쓰는 앱 표면 */
:root {
  --group-ring:#E1DCD2;--group-rule:#E6E1D8;--hover:#F4F1EA;--track:#E3DED4;--line-soft:#C9C3B8;
  /* 2026-10-27 Hallmark 점검: 직접 쓰던 색을 토큰으로 옮김(값은 그대로, 순백만 아주 옅게) */
  --paper:#FFFEFB;--paper-edge:#DDD7CC;--line-mid:#9C9488;--rule-soft:#D3CEC4;--bar-off:#DAD5CB;--primary-press:#C9D7E8;
  --scrim:rgba(46,43,40,.45);--shadow-card:rgba(46,43,40,.08);--shadow-slip:rgba(46,43,40,.10);--shadow-press:rgba(46,43,40,.18);--shadow-sheet:rgba(46,43,40,.28);
  --font:'SUIT',sans-serif;
  --r-group:14px;--r-sheet:20px;--r-pill:999px;--r-control:12px;
  --scroll-thumb:#85807A;--scroll-track:#EFEFEB;
}
* { -webkit-tap-highlight-color:transparent;scrollbar-width:thin;scrollbar-color:var(--scroll-thumb) var(--scroll-track); }
*::-webkit-scrollbar { width:10px;height:10px; }
*::-webkit-scrollbar-track { background:var(--scroll-track); }
*::-webkit-scrollbar-thumb { background:var(--scroll-thumb);border:2px solid var(--scroll-track);border-radius:8px; }
*::-webkit-scrollbar-thumb:hover { background:var(--ink-2); }
*::-webkit-scrollbar-thumb:active { background:var(--ink); }
::selection { background:var(--primary-wash);color:var(--ink); }
input,textarea { caret-color:var(--primary); }
body { max-width:none;margin:0; }
.app { width:100%;max-width:none;margin:0 auto;padding:0 0 calc(68px + env(safe-area-inset-bottom)); }
body.initial-flow .app { padding-bottom:16px; }
a,button { touch-action:manipulation; }
button,a,summary,label:has(input) { cursor:pointer; }
.text-btn,.del { text-decoration:none;border-radius:8px; }
a.in-link,.check-body a,.common-notice-line a { text-decoration:underline; }
.text-btn:not(.item-jump)::after { content:'›';content:'›' / '';margin-left:6px;font-size:18px; }
.btn { min-height:48px;border-radius:12px; }
.btn.line { background:var(--surface); }
.appbar { display:block;position:fixed;inset:auto 0 0;z-index:10;border:0;border-top:1px solid var(--line-soft);background:var(--surface);padding-bottom:env(safe-area-inset-bottom); }
.appbar-in { max-width:440px;min-height:52px;margin:auto;display:block;padding:0; }
.appbar .brand,.appbar .nav-settings,.main-tabs .tab-count { display:none; }
.main-tabs { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0; }
.main-tabs a { display:flex;flex-direction:column;justify-content:center;gap:0;min-width:0;min-height:52px;padding:2px 0;border:0;text-decoration:none;color:var(--ink-2);font-size:16px;font-weight:700;white-space:nowrap; }
.main-tabs a[aria-current=page] { color:var(--primary);font-weight:800;border:0; }
body.initial-flow .appbar,body.keyboard-open .appbar { display:none; }
.page-heading { margin:22px 20px 16px;display:flex;align-items:flex-start;justify-content:space-between;gap:8px;flex-wrap:wrap; }
.page-heading > div:first-child { flex:1;min-width:0; }
.page-heading h1,.settings-screen > .h1,.pending-screen > .h1 { margin:0;padding:0;font-size:28px;font-weight:800;line-height:1.35;letter-spacing:-.02em; }
.page-heading p { margin:4px 0 0;color:var(--ink-2); }
.page-heading > .text-btn { order:3;flex-basis:100%;padding-left:0; }
.settings-gear { display:flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;border-radius:12px; }
.settings-gear svg { fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round;stroke-linecap:round; }
.checklist-heading h1 { font-size:24px; }
.page-heading .process-name { margin:0 0 6px;color:var(--ready);font-weight:800; }
.page-back { margin:12px 12px 4px; }
.settings-screen > .h1,.pending-screen > .h1 { margin:0 20px 16px; }
.home-columns { display:flex;flex-direction:column;gap:0; }
.home-main,.home-side { min-width:0; }
.app-group { margin:8px 16px 20px; }
.group-heading { min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding-left:20px; }
.group-heading h2,.group-title { margin:0;font-size:17px;font-weight:800; }
.group-heading h2 { flex:1;min-width:0; }
.group-heading .text-btn { padding:0 4px;white-space:nowrap; }
.group-box { background:var(--surface);border:0;border-radius:var(--r-group);box-shadow:0 0 0 1px var(--group-ring);overflow:hidden; }
.group-empty { margin:0;padding:16px;color:var(--ink-2); }
.app-row { position:relative;display:flex;align-items:center;gap:10px;min-height:60px;width:100%;padding:10px 12px 10px 16px;text-decoration:none;text-align:left;color:var(--ink);font:inherit;border:0;background:transparent; }
.app-row + .app-row::before { content:'';position:absolute;top:0;left:16px;right:0;border-top:1px solid var(--group-rule); }
.row-text { display:flex;flex-direction:column;flex:1;min-width:0;overflow-wrap:anywhere; }
.row-title { font-weight:700; }
.row-secondary { display:block;color:var(--ink-2); }
.ready-text { color:var(--ready);font-weight:700; }
.chevron { flex:none;font-size:18px;color:var(--ink-2); }
.home-remaining .row-title { color:var(--ink-2);font-weight:500; }
.home-remaining .row-secondary { font-size:30px;line-height:1.35;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums; }
.date-box { width:48px;min-height:48px;flex:none;background:var(--bg);border-radius:10px;display:flex;align-items:center;justify-content:center;flex-direction:column;line-height:1.25; }
.date-box b { font-size:16px;font-weight:800; }
.date-box > span { font-size:14px;color:var(--ink-2); }
.date-box.past { background:transparent;border:1px solid var(--rule-soft); }
.question-tag,.over-pill { display:inline-flex;align-items:center;justify-content:center;padding:3px 8px;border:1px solid var(--line-soft);border-radius:var(--r-pill);font-size:12px;line-height:1.4;color:var(--ink-2);font-weight:700;white-space:nowrap; }
.state-waiting { color:var(--primary);background:var(--primary-wash);border-color:transparent; }
.state-more { color:var(--on-primary);background:var(--ink);border-color:var(--ink); }
.over-pill { background:var(--risk-bg);color:var(--ink);border:0; }
/* 세그먼트와 펼친 항목 */
.ck-bar { border:0;padding:10px 16px;margin:16px 0 8px;gap:8px; }
.ck-count { padding:0; }
.ck-bar nav.checklist-tabs,.schedule-tabs { display:flex;background:var(--track);padding:4px;border-radius:12px;gap:2px; }
.ck-bar nav.checklist-tabs button,.schedule-tabs button { flex:1;min-height:44px;border:0;border-radius:9px;box-shadow:none;text-decoration:none;padding:8px 2px;color:var(--ink-2);background:transparent;font-weight:700; }
.ck-bar nav.checklist-tabs button[aria-selected=true],.schedule-tabs button[aria-selected=true] { background:var(--surface);color:var(--ink);font-weight:800;border:0;box-shadow:0 1px 2px var(--shadow-press); }
.checklist-screen .block[role=tabpanel] { border:0;margin:0 16px;padding:0; }
.check-item + .check-item { border-top:1px solid var(--group-rule); }
.item-toggle { min-height:60px;padding:14px 12px 14px 16px;grid-template-columns:22px minmax(0,1fr) auto 10px;align-items:center; }
.item-toggle .item-title { font-weight:700; }
.item-toggle:hover .item-title { text-decoration:none; }
.item-check-state { border-radius:6px;margin:0; }
.check-item > .ck-body { padding:0 16px 18px; }
.task-box { border-radius:12px;background:var(--bg);padding:14px;margin-bottom:16px; }
.question-choices { border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px;min-width:0; }
.question-choices legend { font-weight:700;margin-bottom:6px; }
.question-choices button { min-height:44px;border-radius:var(--r-pill);border:1px solid var(--line-soft);background:var(--paper);padding:8px 12px;font-size:16px; }
.question-choices button[aria-pressed=true] { box-shadow:inset 0 0 0 1px var(--primary);border-color:var(--primary);background:var(--primary-wash);font-weight:800;color:var(--primary); }
.mine { background:var(--paper);border-radius:12px;min-height:52px; }
.task-box .question-state { margin-top:12px; }
.task-box .q-label { font-size:16px; }
.waiting-section { margin:16px 16px 0;border:0;padding:0; }
.waiting-section .sec-h { min-height:44px;display:flex;align-items:center;padding:0 20px;font-size:17px; }
.waiting-links { background:var(--surface);box-shadow:0 0 0 1px var(--group-ring);border-radius:14px;overflow:hidden; }
.waiting-links .item-jump { min-height:56px;padding:12px 16px; }
.waiting-links .item-jump + .item-jump { border-top:1px solid var(--group-rule); }
.check-item { scroll-margin-top:118px; }
.paid-offer { padding:12px;border-radius:12px;box-shadow:inset 0 0 0 1.5px var(--line-soft);margin-top:12px; }
.paid-offer .btn.line { background:transparent;box-shadow:none;padding:0; }
.process-sidebar { display:none; }
/* 일정·지급·알림 */
#js-screen-schedule:not([hidden]),.work[data-mode=schedule] #js-screen-schedule:not([hidden]) { display:block;padding:0; }
#js-screen-schedule > .top.back,#js-screen-schedule > .route { display:none; }
.schedule-tabs { margin:12px 16px 0; }
.schedule-tabs button { padding:8px 10px; }
.schedule-panel { padding-top:16px; }
.view-switch { display:inline-flex;border-radius:var(--r-pill);background:var(--track);padding:4px;margin:16px 16px 0; }
.view-switch button { border-radius:var(--r-pill);box-shadow:none;background:transparent;min-height:36px; }
.view-switch button[aria-pressed=true] { background:var(--ink);color:var(--on-primary);box-shadow:none; }
#js-schedule-list { padding:0;margin-top:12px; }
.day { display:flex;gap:12px;padding:14px 12px 14px 16px;border-bottom:1px solid var(--group-rule);align-items:flex-start; }
.ev { margin:0;padding:0;flex:1;min-width:0;align-items:flex-start; }
.ev .t { min-width:0; }
.ev .n::after { display:none; }
.ev .n { display:block;min-height:32px; }
.ev .n::before { content:'';position:absolute;inset:0; }
.ev .s { overflow-wrap:anywhere; }
.ev.ready .s:last-of-type { color:var(--ready);font-weight:700; }
.ev .btn.ready { margin-top:8px;min-height:44px; }
.day .payment-event { flex:1;min-width:0; }
.payment-event .app-row { padding:0; }
.today-divider { margin:0;padding:10px 16px;background:var(--primary-wash);color:var(--primary);font-weight:800;border:0; }
.cal { border:0;margin:12px 16px 0;padding:8px;box-shadow:0 0 0 1px var(--group-ring);border-radius:14px;background:var(--surface);overflow:hidden;min-width:0; }
.calendar-controls { display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:18px;font-weight:800; }
.calendar-controls button { width:44px;height:44px;border:0;border-radius:12px;background:transparent;color:var(--primary);font-size:28px; }
.calendar-week { min-height:76px; }
.calendar-week .d { min-height:30px; }
.calendar-week .d.today { width:30px;height:30px;min-height:30px;justify-self:center;background:var(--primary);color:var(--on-primary);border-radius:50%;border:0;outline:0; }
.calendar-week .d.today small { display:none; }
.calendar-bar { background:var(--bar-off);border-radius:6px;color:var(--ink); }
.calendar-bar.ready { background:var(--ready);color:var(--on-primary); }
.calendar-bar.payment-date { background:var(--paper);color:var(--primary);box-shadow:inset 0 0 0 1.5px var(--primary); }
.month-list { min-width:0;margin:16px; }
.month-list .group-title { min-height:44px;display:flex;align-items:center;padding-left:20px; }
.month-list .day { flex-wrap:wrap; }
.payment-group > h3 { min-height:44px;display:flex;align-items:center;font-size:17px;font-weight:800;padding-left:20px;margin:12px 0 0; }
.payment-group { background:transparent; }
.payment-card { background:var(--surface);border:0;border-top:1px solid var(--group-rule);padding:0 16px 16px;margin:0; }
.payment-card:not([open]) { padding-bottom:0; }
.payment-card:first-of-type { border-radius:14px 14px 0 0;box-shadow:0 -1px 0 0 var(--group-ring); }
.payment-card:last-of-type { border-radius:0 0 14px 14px;box-shadow:0 1px 0 0 var(--group-ring); }
.payment-card:only-of-type { border-radius:14px; }
.payment-card > summary { min-height:72px;gap:12px;margin:0 -16px;padding:10px 12px 10px 16px;font-weight:700; }
.payments { min-width:0; }
.payment-draft { border:0;border-radius:14px;box-shadow:0 0 0 1px var(--group-ring);padding:16px; }
.notice-group { border:0;margin:0;padding:0; }
.notice-group + .notice-group { border-top:1px solid var(--group-rule); }
.notice-group > summary { min-height:60px;padding:12px 16px;color:var(--ink); }
.notice-group > summary::after { content:'⌄';margin-left:auto;padding-left:8px; }
.notice-group[open] > summary::after { content:'⌃'; }
.notice-group > .notice-items { padding-left:28px; }
.notice-group .notice-item { margin-left:28px;margin-right:16px;border-top:1px solid var(--group-rule); }
.notice-summary { padding-left:0; }
.notice-body { padding-right:0; }
/* 예산: 수치는 의미별로 한 곳에서 읽어요. */
.budget-screen { width:100%;max-width:none; }
.budget-screen > .block { padding:0;border:0; }
.budget-summary { display:flex;flex-direction:column;padding:0;gap:0;border-radius:14px;overflow:hidden;background:var(--surface);box-shadow:0 0 0 1px var(--group-ring); }
.budget-total { display:flex;align-items:center;justify-content:space-between;padding:12px 16px;gap:12px; }
.budget-total + .budget-total { border-top:1px solid var(--group-rule); }
.total-value { font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;overflow-wrap:anywhere; }
.remaining-total { display:block;background:var(--primary-wash); }
.remaining-total .total-label { color:var(--primary);font-weight:700; }
.remaining-total .total-value { display:block;font-size:34px;line-height:1.4; }
.budget-over { padding:0 16px 12px; }
.budget-unbudgeted { margin-top:12px;color:var(--ink-2); }
.budget-legend { display:flex;flex-wrap:wrap;gap:12px;margin:14px 0 16px;font-size:14px;color:var(--ink-2); }
.budget-legend span { display:flex;align-items:center;gap:5px; }
.budget-legend span::before { content:'';display:inline-block;width:12px;height:10px;border-radius:2px;background:var(--primary); }
.budget-legend .legend-planned::before { background:var(--primary-wash);border:1px solid var(--primary); }
.budget-legend .legend-over::before { background:var(--risk-bg);border:1px solid var(--ink); }
.budget-group { border:0;margin:0;padding:0; }
.budget-group + .budget-group { border-top:1px solid var(--group-rule); }
.budget-group > summary { min-height:78px;padding:14px 16px;display:flex;flex-wrap:wrap;align-items:center;gap:8px;color:var(--ink); }
.budget-group > summary .row-text { flex-basis:55%; }
.budget-bar { flex-basis:100%;width:100%;height:10px;border-radius:5px;background:var(--track);overflow:hidden;display:block; }
.bar-paid { fill:var(--primary); }
.bar-planned { fill:var(--primary-wash);stroke:var(--primary);stroke-width:1; }
.bar-over { fill:var(--risk-bg);stroke:var(--ink);stroke-width:1; }
.budget-group-body { padding:0 16px 16px; }
.budget-group-totals .budget-total { padding:10px 0; }
.budget-group-totals .remaining-total { background:none; }
.budget-group-totals .total-value { font-size:18px; }
.budget-payment { display:flex;padding:8px 0;white-space:normal;overflow-wrap:anywhere; }
/* 설정 */
.settings-box > p { padding:14px 16px;margin:0;color:var(--ink-2); }
.settings-box > .contribute-options,.settings-box > .paid-offer { margin:12px 16px; }
.settings-box > ul { margin:12px 16px;padding-left:20px; }
.settings-box > .text-btn { margin:0 8px 8px; }
/* 공정 편집 시트는 기존 입력 화면 한 벌을 재사용해요. */
body.sheet-open { overflow:hidden; }
.edit-sheet { position:fixed;inset:56px 0 0;margin:0;width:100%;max-width:none;max-height:calc(100dvh - 56px);height:calc(100dvh - 56px);padding:0;border:0;border-radius:20px 20px 0 0;background:var(--surface);color:var(--ink);overflow:hidden; }
.edit-sheet[open] { display:flex;flex-direction:column; }
.edit-sheet::backdrop { background:var(--scrim); }
.sheet-handle { width:40px;height:5px;flex:none;background:var(--line-soft);border-radius:999px;margin:10px auto 4px; }
.edit-sheet > h1 { flex:none;font-size:20px;font-weight:800;margin:12px 20px; }
.edit-scroll { flex:1;min-height:0;overflow:auto;padding-bottom:20px; }
.edit-sheet .make { display:block; }
.edit-sheet .make .top,.edit-sheet .make .route,.edit-sheet .make .dock { display:none!important; }
.edit-sheet #js-screen-build { padding:0; }
.edit-sheet .make .h1 { font-size:18px;margin-top:12px; }
.edit-sheet .dates-screen { margin-top:24px;padding:0;border:0; }
.sheet-footer { flex:none;padding:10px 16px calc(12px + env(safe-area-inset-bottom));box-shadow:0 -1px 0 0 var(--group-rule);background:var(--surface); }
.sheet-footer p { min-height:24px;margin:0 0 6px;text-align:center;color:var(--primary); }
.sheet-footer .btn { width:100%; }
.tile { min-height:48px;border:1.5px solid var(--line-soft);background:var(--paper);border-radius:12px; }
.tile:has(input:checked) { border:2px solid var(--primary);background:var(--primary-wash);font-weight:800; }
.initial-flow .pair.make,.initial-flow .start-screen { max-width:1160px;margin:auto; }
@media(min-width:900px) {
  body { display:flex;align-items:flex-start; }
  .appbar { position:sticky;inset:auto;top:0;width:224px;min-width:224px;height:100dvh;overflow-y:auto;display:block;border:0;border-right:1px solid var(--group-ring);padding:20px 12px; }
  .appbar-in { display:flex;flex-direction:column;gap:20px;min-height:100%;max-width:none;padding:0;margin:0; }
  .appbar .brand { display:flex;min-height:44px;font-size:17px;padding:0 12px; }
  .main-tabs { display:flex;flex-direction:column;gap:4px;flex:none; }
  .main-tabs a { flex-direction:row;justify-content:flex-start;gap:8px;min-height:46px;padding:6px 16px;border-radius:12px;font-size:16px; }
  .main-tabs a[aria-current=page] { background:var(--primary-wash); }
  .main-tabs .tab-count { display:inline;margin-left:auto;font-size:14px; }
  .appbar .nav-settings { display:flex;align-items:center;gap:10px;min-height:46px;margin-top:auto;padding:6px 16px;text-decoration:none;border-radius:12px;color:var(--ink-2);font-weight:700; }
  .nav-settings[aria-current=page] { background:var(--primary-wash);color:var(--primary); }
  body.keyboard-open .appbar { display:block; }
  body.initial-flow .appbar { display:none; }
  .app { flex:1;min-width:0;max-width:1160px;padding:36px 40px 48px; }
  body.initial-flow .app { max-width:1280px; }
  .page-heading { margin:0 0 24px;align-items:center; }
  .page-heading h1,.settings-screen > .h1,.pending-screen > .h1 { font-size:32px; }
  .checklist-heading h1 { font-size:30px; }
  .page-heading > .text-btn { order:0;flex-basis:auto;margin-left:auto; }
  .settings-gear { display:none; }
  .page-back { display:flex!important;margin:0 0 12px;padding:0; }
  .settings-screen > .h1,.pending-screen > .h1 { margin:0 0 24px; }
  .home-columns { flex-direction:row;flex-wrap:wrap;gap:32px; }
  .home-main { flex:1.4 1 420px; }
  .home-side { flex:1 1 300px; }
  .app-group { margin:0 0 24px; }
  .group-heading h2,.group-title { font-size:18px; }
  .work[data-mode=check] { display:block;padding:0; }
  .work[data-mode=check] .process-sidebar { display:block; }
  .work > .checklist-screen,.work > .pending-screen { max-width:none;padding:0;margin:0;border:0; }
  .process-sidebar { margin:0 0 20px; }
  .process-sidebar h2 { margin:0 0 8px;font-size:18px;color:var(--ink); }
  .process-sidebar ul { display:flex;flex-wrap:wrap;gap:6px;border:0; }
  .process-sidebar li { border:0;max-width:100%; }
  .process-sidebar li a { border-radius:999px;background:var(--surface);padding:10px 14px;box-shadow:0 0 0 1px var(--group-ring); }
  .process-sidebar li a span { display:none; }
  .process-sidebar > .text-btn { margin-top:8px; }
  .ck-bar { position:static;padding:10px 0; }
  .checklist-screen .block[role=tabpanel] { margin:0; }
  .check-item > .ck-body { padding:0 16px 18px 52px; }
  .task-box { padding:16px; }
  .waiting-section { margin:16px 0 0; }
  .schedule-tabs { width:368px;margin:0; }
  .schedule-tabs button { flex:1 0 116px; }
  .view-switch { margin:16px 0 0; }
  #js-schedule-list { margin:12px 0 0; }
  .calendar-week { min-height:104px; }
  .cal { margin:12px 0 0; }
  .month-list { margin:16px 0 0; }
  .month-list .ev .need { padding:0 8px; }
  .budget-screen,.settings-screen { max-width:960px;margin:0 auto; }
  .budget-summary { flex-direction:row;flex-wrap:wrap;gap:12px;padding:0;overflow:visible;background:none;box-shadow:none; }
  .budget-summary .budget-total { flex:1 1 140px;display:block;border:0;border-radius:14px;background:var(--surface);box-shadow:0 0 0 1px var(--group-ring);padding:18px; }
  .budget-summary .remaining-total { flex:1.4 1 180px;background:var(--primary-wash); }
  .budget-summary .total-value { display:block;font-size:24px; }
  .budget-summary .remaining-total .total-value { font-size:32px; }
  .budget-summary .budget-over { flex-basis:100%;margin:0;padding:0; }
  .budget-bar { height:12px; }
  .edit-sheet { inset:0;margin:auto;width:min(920px,calc(100% - 48px));height:auto;max-height:calc(100dvh - 96px);border-radius:20px;box-shadow:0 12px 48px var(--shadow-sheet); }
  .edit-sheet > h1 { font-size:24px;margin:24px 24px 16px; }
  .sheet-handle { display:none; }
  .edit-scroll { padding:0 24px 24px; }
  .edit-sheet .make:has(>section:not([hidden])) { display:grid;grid-template-columns:300px minmax(0,1fr);gap:24px;padding:0; }
  .edit-sheet #js-screen-build { padding:0; }
  .edit-sheet .dates-screen { padding:0;border:0;margin:0; }
  .edit-sheet .make .h1 { margin:0; }
  .edit-sheet .tiles { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tile-name { white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
  .edit-sheet .tile { gap:4px;padding:0 8px; }
  .edit-sheet .dhead,.edit-sheet .dline { grid-template-columns:minmax(44px,.6fr) minmax(132px,1.3fr) minmax(132px,1.3fr) minmax(44px,.6fr);gap:6px; }
  .edit-sheet input[type=date] { padding:0 4px;font-size:16px;min-width:0; }
  .edit-sheet .dname b { overflow-wrap:anywhere; }
  .sheet-footer { display:flex;align-items:center;gap:20px;padding:12px 24px; }
  .sheet-footer p { flex:1;margin:0; }
  .sheet-footer .btn { width:auto;min-width:120px; }
}
@media(min-width:1100px) {
  .edit-sheet .make:has(>section:not([hidden])) { grid-template-columns:440px minmax(0,1fr); }
  .edit-sheet .tiles { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .initial-flow .pair.make:has(>section:not([hidden])) { grid-template-columns:440px minmax(0,1fr);gap:32px; }
  .initial-flow .tiles { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .initial-flow #js-screen-build { padding-right:0; }
}
@media(min-width:1200px) {
  .work[data-mode=check] { display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px;align-items:start; }
  .process-sidebar ul { display:flex;flex-direction:column;gap:8px; }
  .process-sidebar li a { border-radius:12px; }
  .process-sidebar li a span { display:block;font-size:14px; }
  .process-sidebar li a[aria-current=true] { background:var(--ready-wash);font-weight:800; }
  #js-calendar-panel:not([hidden]) { display:flex;flex-wrap:wrap;align-items:flex-start;gap:24px; }
  #js-calendar-panel .cal { flex:2 1 560px; }
  #js-calendar-panel .month-list { flex:1 1 300px; }
}
@media(max-width:359px) {
  .group-heading { padding-left:12px;gap:4px;flex-wrap:wrap; }
  .group-heading .text-btn { font-size:14px; }
  .item-toggle { grid-template-columns:22px minmax(0,1fr) 10px;gap:6px;padding-left:12px; }
  .item-toggle .question-tag { grid-column:2;justify-self:start; }
  .item-toggle::after { grid-column:3;grid-row:1; }
  .app-row .question-tag { white-space:normal;max-width:72px;flex:none; }
  .remaining-total .total-value { font-size:30px; }
}
@media(hover:hover) {
  .app-row:hover,.item-toggle:hover,summary:hover { background:var(--hover); }
  .main-tabs a:hover,.nav-settings:hover { background:var(--ready-wash); }
  .btn:hover { background:var(--primary-hover);color:var(--on-primary); }
  .btn.ready:hover { background:var(--ready-hover); }
  .btn.line:hover { background:var(--primary-wash);color:var(--primary); }
  .text-btn:hover,.settings-gear:hover { background:var(--hover); }
  .tile:hover { border-color:var(--ink-2); }
}
.app-row:active,.item-toggle:active,.main-tabs a:active,.checklist-tabs button:active,.schedule-tabs button:active,summary:active { background:var(--ready-wash); }
.text-btn:active,.settings-gear:active { background:var(--primary-wash); }
.btn:active { background:var(--primary-hover);transform:scale(.98); }
.btn.ready:active { background:var(--ready-hover); }
.btn.line:active { background:var(--primary-wash);color:var(--primary); }
.question-choices button:active,.tile:active { transform:scale(.98); }
@media(prefers-reduced-motion:reduce) { .btn:active,.question-choices button:active,.tile:active { transform:none; } }
@media(forced-colors:active) { * { scrollbar-color:auto; } .group-box { border:1px solid CanvasText; } }
/* 이전 선 중심 화면의 경계선을 새 표면 규칙으로 교체해요. */
.budget-summary,.budget-unbudgeted { border:0; }
.budget-screen { padding-top:0; }
#js-edit-title:focus { outline:none; }
.edit-sheet .dates-screen .dock { display:block!important;margin:12px 0 0;padding:0;background:none;border:0; }
.edit-sheet .dates-screen .dock .btn { display:none; }
.edit-sheet .dates-screen .dock .sum { display:block; }

.ready-process .chevron { color:var(--ready); }
.day { position:relative; }
.day .ev { position:static; }

.view-switch { gap:2px; }
.view-switch button,.view-switch button[aria-pressed=true] { text-decoration:none; }
.view-switch .text-btn::after { content:none; }
.payment-group-box .payment-card { border-radius:0;box-shadow:none;background:transparent; }
.payment-group-box .payment-card:first-child { border-top:0; }

.view-switch button { min-height:44px;padding:0 14px;font-size:16px; }
.edit-sheet .dates-screen .dock { position:static;margin-left:16px;margin-right:16px; }
@media(min-width:900px) { .edit-sheet .dates-screen .dock { margin-left:0;margin-right:0; } }

/* 구현 v6: 글자 메뉴와 공정별 견적 기록 */
.main-tabs a { position:relative; }
.main-tabs a[aria-current=page]::before { content:'';position:absolute;left:0;right:0;top:-1px;height:3px;background:var(--primary); }
.quote-title { margin:20px 0 8px;font-size:18px;font-weight:800; }
.quote-list { border:1px solid var(--group-rule);border-radius:12px;overflow:hidden; }
.quote-list:empty { display:none; }
.quote-card { margin:0;border:0; }
.quote-card + .quote-budget-prompt + .quote-card { border-top:1px solid var(--group-rule); }
.quote-card > summary { display:flex;align-items:center;gap:8px;min-height:68px;padding:12px;color:var(--ink); }
.quote-card summary strong { overflow-wrap:anywhere; }
.quote-card.quote-drop > summary,.quote-card.quote-drop > summary strong { color:var(--ink-2); }
.quote-pill { flex:none;display:inline-flex;align-items:center;justify-content:center;max-width:112px;padding:4px 8px;border:1px solid var(--line-soft);border-radius:var(--r-pill);font-size:14px;font-weight:700;line-height:1.4;color:var(--ink-2); }
.quote-go { background:var(--primary-wash);color:var(--primary);border-color:transparent; }
.quote-body,.quote-draft { padding:14px 12px; }
.quote-body { border-top:1px solid var(--group-rule); }
.quote-body > .field,.quote-draft > .field { margin-top:14px; }
.quote-body > .field:first-child,.quote-draft > .field:first-child { margin-top:0; }
.quote-body input,.quote-draft input,.quote-body textarea,.quote-draft textarea { min-width:0; }
.quote-scope h4 { margin:20px 0 8px;font-size:17px; }
.quote-segment { border:0;padding:0;margin:14px 0;min-width:0; }
.quote-segment legend { margin-bottom:6px;padding:0;font-weight:600; }
.quote-segment-controls { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;border-radius:12px;background:var(--track);padding:4px; }
.quote-segment-controls button { min-height:44px;min-width:0;padding:8px 4px;border:0;border-radius:8px;background:transparent;color:var(--ink-2);font:inherit;overflow-wrap:anywhere; }
.quote-segment-controls button[aria-pressed=true] { color:var(--ink);background:var(--surface);font-weight:800;box-shadow:0 1px 2px var(--shadow-press); }
.quote-delete { margin-top:24px;padding-top:12px;border-top:1px solid var(--group-rule); }
.quote-budget-prompt { padding:12px;background:var(--bg); }
.quote-budget-prompt > p { margin:0 0 10px; }
.quote-prompt-actions,.quote-draft-actions { display:flex;flex-wrap:wrap;gap:8px; }
.quote-prompt-actions .btn { padding:8px 12px; }
.quote-draft { margin-top:8px;border:1px solid var(--group-ring);border-radius:12px;background:var(--surface); }
.quote-draft-actions { margin-top:18px; }
.quote-section > .js-quote-add { border-radius:8px;margin-top:6px; }
.quote-segment-controls button:active { background:var(--ready-wash);transform:scale(.98); }
@media(hover:hover) { .quote-segment-controls button:hover { background:var(--hover); } }
@media(prefers-reduced-motion:reduce) { .quote-segment-controls button:active { transform:none; } }
@media(max-width:899px) {
  .app { padding-bottom:calc(69px + env(safe-area-inset-bottom)); }
  .main-tabs a { flex-direction:row;border-radius:0; }
  .item-toggle:not(.notice-summary) { grid-template-columns:22px minmax(0,1fr) 10px;align-items:start; }
  .item-toggle:not(.notice-summary) .question-tag { grid-column:2;justify-self:start; }
  .item-toggle:not(.notice-summary)::after { grid-column:3;grid-row:1; }
}
@media(min-width:900px) {
  .main-tabs a[aria-current=page]::before { display:none; }
  .quote-body,.quote-draft { padding:16px; }
}

/* 2026-10-19 사용자 검수: 제목 정렬, 예산 선 정리, 메뉴 아이콘 되돌림 */
@media(max-width:899px) { .page-heading { margin-left:16px;margin-right:16px; } }
.settings-screen > .h1,.pending-screen > .h1 { margin-left:0;margin-right:0;padding:0 16px; }
@media(min-width:900px) { .settings-screen > .h1,.pending-screen > .h1 { padding:0; } }
.group-heading,.month-list .group-title { padding-left:0; }
.budget-screen .block > * + * { border-top:0; }
.budget-group-totals { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:12px 0 4px;padding:0;border-radius:12px;background:var(--bg); }
.budget-group-totals .budget-total { display:block;padding:10px 12px;border:0; }
.budget-group-totals .remaining-total { grid-column:1/-1;padding-bottom:4px; }
.budget-group-totals .budget-total:not(.remaining-total) + .budget-total { border-left:1px solid var(--line-soft); }
.budget-group-totals .total-label { display:block;font-size:15px;color:var(--ink-2); }
.budget-group-totals .remaining-total .total-label { color:var(--primary); }
.budget-group-totals .budget-over { grid-column:1/-1;margin:0;padding:0 12px 10px; }
.appbar-in { min-height:62px; }
.main-tabs a { min-height:62px;font-size:14px; }
.main-tabs a[aria-current=page]::before { display:none; }
.nav-icon { display:flex;align-items:center;justify-content:center;min-width:52px;height:30px;border-radius:var(--r-pill); }
.main-tabs svg { stroke-width:1.9; }
.main-tabs a[aria-current=page] svg { stroke-width:2.3; }
.main-tabs a[aria-current=page] .nav-icon { background:var(--primary-wash); }
.nav-settings svg { fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round;stroke-linecap:round; }
@media(max-width:899px) {
  .app { padding-bottom:calc(78px + env(safe-area-inset-bottom)); }
  .main-tabs a { flex-direction:column; }
}
@media(min-width:900px) {
  .appbar-in { min-height:100%; }
  .main-tabs a { min-height:46px;padding:6px 10px;font-size:16px; }
  .appbar .nav-settings { padding:6px 12px; }
  .nav-icon { min-width:24px;width:24px; }
  .main-tabs a[aria-current=page] .nav-icon { background:none; }
  .nav-settings svg { width:22px; }
}
/* 알림 접힌 줄: 체크리스트 줄의 22px 체크 칸 규칙(.item-toggle)이 덮어써 제목이 세로로 꺾이던 문제 */
.item-toggle.notice-summary { grid-template-columns:minmax(0,1fr) auto 10px; }

/* v8: question slip; decor uses the expanded item's surface. */
.ck-body.has-slip { background:var(--surface); }
.has-slip .task-box { background:none;padding:0;margin:0; }
.slip { position:relative;min-width:0;margin-top:10px;background:var(--paper);border-radius:8px;box-shadow:0 0 0 1px var(--paper-edge),0 6px 18px var(--shadow-slip); }
.slip-main { padding:14px 16px 16px; }
.slip .q-label { display:flex;align-items:center;gap:6px;font-size:14px;font-weight:800;color:var(--ink-2);margin:0; }
.q-lead { font-size:18px;font-weight:800;line-height:1.5;margin:8px 0 0; }
.slip .qbox { margin:0;padding:0;border:0;background:none; }
.slip .copy { width:100%;min-height:50px;border-radius:12px;background:var(--primary);color:var(--on-primary); }
.slip-perf { position:relative;margin:0 14px;border-top:2px dashed var(--line-soft); }
.slip-perf::before,.slip-perf::after { content:'';position:absolute;top:-9px;width:16px;height:16px;border-radius:50%;background:var(--surface);box-shadow:inset 0 0 0 1px var(--paper-edge); }
.slip-perf::before { left:-22px; }.slip-perf::after { right:-22px; }
.slip-stub { padding:12px 16px 16px; }.slip-stub .question-state { margin:0; }
.check-remainder { min-width:0; }.check-remainder .mine { margin-top:16px; }
@media(min-width:1200px) {
 .has-slip .slip-layout { display:flex;flex-wrap:wrap;gap:0 24px;align-items:flex-start; }
 .slip-layout>.action-type { flex:0 0 100%; }.slip-layout>.slip { flex:1 1 340px; }.slip-layout>.check-remainder { flex:1 1 280px; }
 .slip-main { padding:16px 18px; }.slip .copy { width:auto;min-height:48px; }
}

/* v9: quote paper cards and a shared modal sheet. */
.quote-list { display:grid;grid-template-columns:minmax(0,1fr);gap:10px;border:0;border-radius:0;overflow:visible; }
button.quote-card { display:block;width:100%;min-width:0;text-align:left;padding:12px 14px;border:0;border-radius:8px;background:var(--paper);box-shadow:0 0 0 1px var(--paper-edge),0 4px 12px var(--shadow-card);color:var(--ink);cursor:pointer; }
.quote-card-head { display:flex;align-items:flex-start;gap:10px;justify-content:space-between; }.quote-card-head strong { min-width:0;overflow-wrap:anywhere;font-weight:700; }
.quote-card .quote-pill { flex:none;font-size:14px;border:1px solid var(--line-soft);color:var(--ink-2); }.quote-card .quote-go { background:var(--primary-wash);border-color:transparent;color:var(--primary); }
.quote-card-value { display:block;margin-top:6px;font-size:15px;color:var(--ink-2);overflow-wrap:anywhere; }.quote-card-value b { font-size:20px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums; }
.quote-card.quote-drop,.quote-drop .quote-card-value b { color:var(--ink-2); }
.quote-tags { display:flex;flex-wrap:wrap;gap:6px;margin-top:10px; }.quote-tag { display:inline-flex;align-items:center;gap:5px;min-height:26px;padding:0 7px;border-radius:6px;background:var(--bg);font-size:14px;font-weight:700; }
.quote-tag-in::before,.quote-tag-out::before { content:'';width:9px;height:9px;box-sizing:border-box;background:var(--ink); }.quote-tag-out::before { border:1.5px solid var(--ink);background:none; }.quote-tag-unknown { background:none;box-shadow:inset 0 0 0 1.5px var(--line-mid);color:var(--ink-2); }
.quote-add { width:100%;min-height:48px;padding:12px;border:0;border-radius:10px;background:none;box-shadow:inset 0 0 0 1.5px var(--line-soft);color:var(--primary);font-weight:700;cursor:pointer; }
.data-sheet { position:fixed;inset:56px 0 0;margin:0;width:100%;max-width:none;height:calc(100dvh - 56px);max-height:calc(100dvh - 56px);padding:0;border:0;border-radius:20px 20px 0 0;background:var(--surface);color:var(--ink);overflow:hidden; }
.data-sheet[open] { display:flex;flex-direction:column; }.data-sheet::backdrop { background:var(--scrim); }
.data-sheet-heading { padding:10px 20px 0;flex:none; }.data-sheet-heading p { margin:0;color:var(--ready);font-size:16px;font-weight:800; }.data-sheet-heading h1 { margin:2px 0 0;font-size:22px;font-weight:800;overflow-wrap:anywhere; }
.data-sheet-scroll { min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;padding:0 20px 16px; }.data-sheet .quote-body { padding:0; }.data-sheet .field { min-width:0; }.data-sheet input { min-width:0;max-width:100%; }
.quote-field-pair { display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:10px; }.quote-field-pair output { overflow-wrap:anywhere; }
.data-sheet .quote-segment-controls { padding:3px;gap:3px;background:var(--track);border-radius:10px; }.data-sheet .quote-segment-controls button { border:0;min-height:44px;background:none;border-radius:8px;color:var(--ink-2); }.data-sheet .quote-segment-controls button[aria-pressed=true] { background:var(--surface);color:var(--ink);font-weight:800;box-shadow:0 1px 2px var(--shadow-press); }
.data-sheet .quote-scope fieldset { margin:0;padding:10px 0;border-top:1px solid var(--group-rule); }
.paper-link { display:flex;align-items:center;gap:10px;width:100%;min-width:0;padding:12px 12px 12px 14px;margin-top:10px;border:0;border-radius:8px;background:var(--paper);box-shadow:0 0 0 1px var(--paper-edge),0 4px 12px var(--shadow-card);color:var(--ink);text-align:left;cursor:pointer; }.paper-link>span:first-child { flex:1;min-width:0; }.paper-label { display:block;font-size:14px;font-weight:800;color:var(--ink-2);margin-bottom:4px; }.paper-link strong { font-weight:800; }
.data-sheet-actions { display:flex;gap:10px;width:100%; }.data-sheet-actions .btn { flex:1; }.data-sheet .sheet-footer { flex:none;display:block;margin:0;border:0;padding:10px 20px max(16px,env(safe-area-inset-bottom)); }.data-sheet .sheet-footer p { text-align:center;min-height:24px;margin:0 0 6px; }.data-sheet .del { text-decoration:underline;text-underline-offset:4px;color:var(--ink-2); }
@media(min-width:900px) { .quote-list { grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr));gap:12px; }button.quote-card { padding:14px 16px; }.quote-card-value b { font-size:22px; }.quote-add { height:100%; }.quote-card:hover { box-shadow:0 0 0 1px var(--line-mid),0 4px 12px var(--shadow-card); }.data-sheet { inset:0;margin:auto;width:min(640px,calc(100% - 48px));height:auto;max-height:calc(100dvh - 96px);border-radius:20px; }.data-sheet-actions { justify-content:flex-end; }.data-sheet-actions .btn { flex:0 1 auto;min-width:120px; } }
@media(prefers-reduced-motion:no-preference) { button.quote-card:active { transform:scale(.99); } }

/* v10: payment steps and chronological notification months. */
#js-schedule-panel-payments>.sec-h { display:flex;align-items:center;justify-content:space-between;gap:10px; }.payment-group { margin:0 0 16px;overflow:hidden; }.payment-group-head { padding:14px 16px 10px;border-bottom:1px solid var(--group-rule); }.payment-group-head h3 { margin:0;font-size:17px;font-weight:800; }.payment-group-head p { margin:0;color:var(--ink-2);font-variant-numeric:tabular-nums; }
.payment-steps { position:relative;padding:6px 0; }.payment-steps::before { content:'';position:absolute;left:27px;top:30px;bottom:30px;width:2px;background:var(--rule-soft); }
.payment-step { position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;width:100%;min-width:0;padding:12px 14px 12px 44px;text-align:left;border:0;background:none;color:var(--ink);cursor:pointer; }.payment-dot { position:absolute;left:20px;top:17px;width:16px;height:16px;border-radius:50%;background:var(--paper);border:2.5px solid var(--primary); }.payment-past .payment-dot { background:var(--ink);border:0; }.payment-undated .payment-dot { border:1.5px dashed var(--line-mid); }.payment-step-text strong,.payment-step-text>span,.payment-step-amount b,.payment-step-amount>span { display:block; }.payment-step-text strong { font-size:17px;font-weight:800; }.payment-step-text>span { color:var(--ink-2);font-variant-numeric:tabular-nums; }.payment-step-amount { text-align:right; }.payment-step-amount b { font-size:18px;font-weight:800;font-variant-numeric:tabular-nums; }.payment-step-amount>span { font-size:14px;font-weight:700;color:var(--ink-2); }.payment-past strong,.payment-past .payment-step-amount b { color:var(--ink-2); }
.payment-today { position:relative;margin:2px 14px;padding:6px 10px;border-radius:999px;background:var(--primary-wash);color:var(--primary);font-weight:800;font-size:14px; }.payment-check-slip { margin:0 14px 10px 44px;width:calc(100% - 58px);flex-wrap:wrap;font-weight:700; }.payment-check-slip strong { font-size:14px;color:var(--primary); }.payment-add { min-height:48px;width:100%;border:0;border-radius:12px;background:none;box-shadow:inset 0 0 0 1.5px var(--line-soft);color:var(--primary);font-weight:700;cursor:pointer; }
.notice-overview { margin:0 16px;padding:14px 16px; }.notice-overview .sec-h { padding:0;margin:0 0 6px; }.notice-overview>p { margin:0; }.notice-overview .notice-export { margin:12px 0; }.notice-overview .notice-guide { margin:0; }.notice-preferences { margin-bottom:14px; }.notice-preferences .group-box { margin:0 16px; }.notice-kind-count { display:block;color:var(--ink-2);font-size:14px;font-weight:400; }.notice-preferences .reminder-option { padding:8px 16px;min-height:64px; }.notice-preferences .reminder-option>span:first-child { flex:1;font-weight:700; }.notice-preferences .group-box>*+* { border-top:1px solid var(--group-rule); }
.notice-month-title,.notice-month-toggle { font-size:15px;font-weight:800;color:var(--ink-2);margin:14px 0 8px;padding:0 20px; }.notice-month-toggle { width:100%;min-height:48px;text-align:left;border:0;background:none;cursor:pointer;margin-bottom:0; }.notice-month-box { margin:0 16px; }.notice-day { display:flex;align-items:flex-start;gap:12px;padding:10px 12px; }.notice-day+.notice-day { border-top:1px solid var(--group-rule); }.notice-day>.date-box { width:48px;height:48px;flex:none; }.notice-past>.date-box { background:none;box-shadow:inset 0 0 0 1px var(--rule-soft);color:var(--ink-2); }.notice-undated>.date-box { background:none;border:1px dashed var(--line-mid); }.notice-undated>.date-box>* { display:none; }.notice-day-items { min-width:0;flex:1; }.notice-day .notice-item { margin:0;padding:0;border:0;background:none; }.notice-day .notice-item+.notice-item { border-top:1px solid var(--group-rule); }.notice-day .notice-summary { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px;padding:4px 0;min-height:48px; }.notice-day .notice-title { min-width:0;grid-column:1;font-size:16px;font-weight:700; }.notice-day .notice-process { grid-column:1;font-size:14px;color:var(--ink-2); }.notice-day .notice-state { grid-column:2;grid-row:1;align-self:start;font-size:14px; }.notice-day .muted .notice-title { color:var(--ink-2); }.notice-day .notice-body { padding:8px 0 12px; }.notice-day .notice-dates { padding:10px; }.notice-day .notice-condition { margin-left:0;margin-right:0; }
@media(min-width:900px) { .notice-overview,.notice-preferences .group-box,.notice-month-box { margin-left:0;margin-right:0; }.notice-month-title,.notice-month-toggle { padding-left:0;padding-right:0; } }

.payment-group.group-box { background:var(--surface); }
.notice-months>section { border-top:0; }
.notice-day .use-date-field input { width:150px;max-width:100%;min-width:132px;font-size:16px;padding-left:6px;padding-right:4px; }

/* 2026-10-20 사용자 검수(v8~v10): 알림·지급·예산 줄 정리. JS는 건드리지 않음 */
/* 알림 목록 바깥의 옛 .block 선·여백이 남아 2px 먹선과 이중 들여쓰기가 생기던 것 */
#js-notices.notice-months { margin:0; border:0; }
#js-notices.notice-months>*+* { border-top:0; }
/* 종류 스위치: '켜짐/꺼짐' 글자를 스위치 왼쪽 한 줄로 */
.notice-preferences .switch { flex-direction:row; align-items:center; gap:8px; }
/* '저장했어요' 자리: 종류 이름 아래 개수 줄을 잠시 바꿔 보여 줌(앵커를 개수 줄로 옮기는 JS 수정과 짝) */
.notice-kind-count:has(+ .inline-status) { display:none; }
.reminder-option .inline-status { margin:0; font-size:14px; font-weight:700; color:var(--primary); line-height:1.5; }
/* 알림 줄: h3 기본 여백 때문에 제목이 날짜 상자보다 아래로 밀리던 것 */
.notice-day .item-heading { margin:0; }
.notice-day .notice-summary { align-items:center; }
.notice-day .notice-state { align-self:center; }
/* 접힌 달: 눌러 펼칠 수 있게 보이도록 오른쪽 펼침 표시 */
.notice-month-toggle { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.notice-month-toggle::after { content:''; flex:none; width:8px; height:8px; margin-right:6px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg) translateY(-2px); }
.notice-month-toggle[aria-expanded="true"]::after { transform:rotate(-135deg) translateY(-2px); }
/* 지급 '확인할 것' 쪽지 줄: 문장이 두 줄로 꺾이지 않게 개수를 아래 줄로 */
.payment-check-slip { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:8px; row-gap:2px; }
.payment-check-slip>span:first-child { grid-column:1; }
.payment-check-slip>strong { grid-column:1; grid-row:2; }
.payment-check-slip>.chevron { grid-column:2; grid-row:1 / span 2; align-self:center; }
/* 지급 머리 '예산 보기 › ›' 겹침 */
.text-btn.budget-link::after { content:none; }
/* 예산 묶음 줄: 초과 알약이 오른쪽 칸을 차지해 글자가 3~4줄로 꺾이던 것 → 알약을 글자 아래로 */
.js-budget-group-summary { display:grid !important; grid-template-columns:minmax(0,1fr) auto; column-gap:8px; align-items:center; }
.js-budget-group-summary>.row-text { grid-column:1; grid-row:1; }
.js-budget-group-summary>.over-pill { grid-column:1; grid-row:2; justify-self:start; margin-top:6px; }
.js-budget-group-summary>.chevron { grid-column:2; grid-row:1 / span 2; }
.js-budget-group-summary>.budget-bar { grid-column:1 / -1; }
/* PC 넓은 화면: 지급 묶음 두 열 */
@media(min-width:1200px) {
  #js-payments { display:grid; grid-template-columns:repeat(auto-fill,minmax(400px,1fr)); gap:16px; align-items:start; }
  #js-payments>.payment-group { margin:0; }
  #js-payments>:not(.payment-group) { grid-column:1 / -1; }
}
/* 알림 탭 제목들의 왼쪽을 다른 묶음 제목과 같은 16px로 */
.notice-preferences .group-title { margin:20px 0 0; padding:0 16px; font-size:17px; font-weight:800; }
.notice-preferences>.schedule-help { margin:2px 0 8px; }
.notice-month-title,.notice-month-toggle { padding-left:16px; padding-right:16px; }
@media(min-width:900px) {
  .notice-preferences .group-title,.notice-preferences>.schedule-help,.notice-month-title,.notice-month-toggle { padding-left:0; padding-right:0; }
}

/* 2026-10-20 Claude Code 디자인 수정: 목록 체크 표시를 입력칸과 다르게, 작은 표시 글자 14px, 브라우저 안내 닫기 */
.item-check-state { width:16px; height:16px; margin:4px 3px 0; border:1.5px solid var(--rule-strong); border-radius:4px; background:transparent; }
.item-check-state.is-checked { border-color:var(--ink); background:var(--ink); }
.item-check-state.is-checked::after { width:4px; height:8px; top:1px; left:4.5px; }
.tile-hint, .question-tag, .over-pill { font-size:14px; }
.app-row .question-tag { max-width:88px; }
.browser-tip-close { margin-left:4px; }
.browser-tip:has(.js-browser-tip-close:checked) { display:none; }
.browser-tip .text-btn.browser-tip-close::after { content:none; }

/* 2026-10-21 실험 가칭 챙키: 시작 화면 부제 */
.brand-sub { order:-1; margin:8px 0 0; padding:0 16px; color:var(--ink-2); font-size:16px; font-weight:700; }
@media(min-width:900px) { .brand-sub { padding:0; margin:0 0 10px; } }
@media(min-width:900px) { .start-screen > .top { display:flex!important; grid-column:1/-1; padding:0; min-height:44px; } .start-screen > .top .brand { font-size:20px; } }
/* 2026-10-21 v11 뒤: 행동 표시와 추가금 위험 표시 사이 간격(가운뎃점을 뺀 자리) */
.action-type .risk-label { margin-left:8px; }
/* 2026-10-22 v15: 사전 신청 → 제목·설명 글 + '관심 있어요' 버튼(누르기 전에 미출시·결제 없음 안내가 보이게) */
.paid-offer .paid-title { margin:0; font-size:16px; font-weight:700; line-height:1.5; }
.paid-offer .paid-desc { margin:4px 0 0; color:var(--ink-2); font-size:16px; line-height:1.5; }
.paid-offer .btn.line.js-paid-interest { margin-top:12px; min-height:48px; padding:0 16px; text-align:center; background:var(--surface); box-shadow:inset 0 0 0 1.5px var(--primary); }
/* 2026-10-27 v17: 질문 바로 보기(#questions). 입력 없는 읽기 화면이라 체크리스트보다 단순하게, 휴대폰 16px 여백 */
.questions-screen { padding-bottom:32px; }
.questions-screen .page-back { margin:12px 16px 0; }
.questions-screen > .h1 { margin:8px 16px 0; font-size:24px; line-height:1.4; }
#js-questions-body > .lead { margin:8px 16px 0; color:var(--ink-2); }
#js-questions-body > .btn { display:flex; width:calc(100% - 32px); margin:20px 16px; }
.questions-screen .check-items { margin:0 16px; }
.questions-screen .check-item { padding:20px 16px; }
.questions-screen .item-heading { margin:0 0 8px; font-size:18px; line-height:1.45; }
.questions-screen .ck-body { margin:0; padding:0; }
.questions-screen .qbox { margin-left:0; margin-right:0; }
#js-questions-body > footer { margin:8px 16px 0; }
/* 2026-10-27 검수: 일반 .h1·.lead의 좌우 16px 안쪽 여백이 겹쳐 글자가 32px에서 시작하던 것 → 상자와 같은 16px */
.questions-screen > .h1,#js-questions-body > .lead { padding-left:0; padding-right:0; }
/* 2026-10-27 검수: 질문 상자를 체크리스트의 v8 쪽지와 같은 모양으로(절취선은 JS 요소라 없음) */
.questions-screen .qbox { border:0; border-radius:8px; background:var(--paper); box-shadow:0 0 0 1px var(--paper-edge),0 6px 18px var(--shadow-slip); }
.questions-screen .qbox .copy { width:calc(100% - 32px); min-height:50px; margin:0 16px 16px; border:0; border-radius:12px; background:var(--primary); color:var(--on-primary); }
@media(hover:hover) { .questions-screen .qbox .copy:hover { background:var(--primary-hover); } }
@media(min-width:900px) { .questions-screen .qbox .copy { display:inline-flex; width:auto; min-height:48px; padding:0 24px; } }
@media(min-width:900px) {
  .questions-screen { width:100%; max-width:760px; margin:0 auto; }
  .questions-screen > .h1 { font-size:32px; }
  #js-questions-body > .btn { width:auto; display:inline-flex; }
}
/* 2026-10-27 v17-1: 바로 가기 묶음과 첫 항목 상자가 붙어 한 덩어리로 보이던 것 */
.questions-screen .check-items + .check-items { margin-top:16px; }
/* 2026-10-28 v17-1 검수: 체크리스트용 118px 스크롤 여백(고정 막대 몫) 때문에 바로 가기 뒤 앞 항목 끝이 위에 남던 것. 이 화면엔 고정 막대가 없음 */
.questions-screen .check-item { scroll-margin-top:16px; }
/* 2026-11-01 v18: 설문 묻는 칸. 글 여백은 설정 화면 상자와 같게, 질문 화면에서는 항목 상자와 같은 폭 */
.survey-prompt .group-box > p { padding:14px 16px 4px;margin:0;color:var(--ink-2); }
.survey-prompt .group-box > .text-btn { margin:0 8px 8px; }
.questions-screen .survey-prompt { margin:24px 16px; }
@media(min-width:900px) { .questions-screen .survey-prompt { margin-top:0; } }