/* 紙とインクのテーマ（確認画面・職長サイン画面）
   方針: 操作の枠（ナビ・ボタン）は現代的なまま、帳票そのものを「紙とインク」で見せる。
   AI部分（.ai-tag / .btn-ai）は青紫のまま残し、「書類をAIが書いている」対比を作る。
   参考: 申請のダンドリ（~/property-application-system）の昭和レトロテーマから、紙・墨・深緑・朱肉・明朝・手書きのみ継承 */
:root{
  --paper:#FAFAF7; --paper-cream:#F3F2EE; --paper-edge:#DCDAD3;
  --ink:#1F1B16; --ink-sub:#5F5A52; --rule:#CFCBC2;
  --green-ink:#2D5A4A; --shu:#B3261E; --shu-fill:#F7E6E1; /* 深緑は完了・OKの印だけに使う */
  --mincho:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",YuMincho,serif;
  --hand:"Klee One","YuKyokasho","Hiragino Maru Gothic ProN",sans-serif;
}

/* 用紙（水彩紙・画用紙の目。assets/paper-grain.webp は assets/_paper-texture-generator.py で生成した自作テクスチャ。
   700pxタイルを350pxで敷く＝Retinaで等倍になり、紙の目がにじまない） */
.paper-sheet{position:relative;background:var(--paper) url('../assets/paper-grain.webp') center/350px auto repeat;border:1px solid var(--paper-edge);border-radius:2px;padding:26px 22px 20px;margin-top:22px;color:var(--ink);
  box-shadow:0 1px 1px rgba(0,0,0,.06),0 8px 22px rgba(40,36,30,.13);}
.paper-sheet .filing-tab{position:absolute;top:-22px;left:18px;background:var(--pri-dark);color:#fff;font-family:var(--mincho);font-size:12px;letter-spacing:.12em;padding:4px 14px 3px;border-radius:6px 6px 0 0;}
.paper-sheet .sheet-head{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;border-bottom:2px solid var(--ink);padding-bottom:8px;margin-bottom:14px;font-family:var(--mincho);}
.paper-sheet .sheet-head h3{font-size:17px;font-weight:700;letter-spacing:.14em;margin:0;}
.paper-sheet .sheet-head .meta{font-size:12px;color:var(--ink-sub);}
.paper-sheet .sheet-head .meta b{font-family:var(--hand);font-weight:600;color:var(--ink);font-size:14px;margin-left:4px;}
.paper-sheet .sheet-head .ai-tag{margin-left:auto;}
.paper-sheet .muted{color:var(--ink-sub);}

/* 朝礼メモ（罫線） */
.memo-lined{font-family:var(--hand);font-size:16px;line-height:32px;color:var(--ink);padding:0 4px;
  background-image:linear-gradient(transparent 31px,var(--rule) 31px);background-size:100% 32px;}

/* 聞き取り票（記入欄） */
.form-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:0 22px;}
.paper-sheet .fcard{background:transparent;border:none;border-bottom:1px solid var(--rule);border-radius:0;padding:10px 2px 8px;}
.paper-sheet .fcard .k{font-family:var(--mincho);font-size:12px;color:var(--ink-sub);font-weight:600;letter-spacing:.06em;}
.paper-sheet .fcard .v input,.paper-sheet .fcard .v textarea{font-family:var(--hand);font-size:17px;font-weight:600;color:#1B2A4A;background:transparent;border:1px dashed transparent;border-radius:2px;padding:2px 4px;}
.paper-sheet .fcard .v input:focus,.paper-sheet .fcard .v textarea:focus{border-color:var(--green-ink);background:rgba(255,255,255,.85);}
.paper-sheet .fcard.missing{background:transparent;border-bottom:2px solid var(--shu);}
.paper-sheet .fcard.missing .v input,.paper-sheet .fcard.missing .v textarea{border:1px dashed var(--shu);background:var(--shu-fill);}
.paper-sheet .fcard.missing .v input::placeholder,.paper-sheet .fcard.missing .v textarea::placeholder{color:var(--shu);font-family:var(--mincho);font-size:13px;font-weight:600;}
.paper-sheet .src{font-family:var(--mincho);font-weight:600;font-size:10.5px;border-radius:2px;border:1px solid currentColor;background:transparent;padding:1px 6px;}
.paper-sheet .src.speech{color:#3348A8;}
.paper-sheet .src.diary{color:#8A6420;}
.paper-sheet .src.manual{color:var(--green-ink);}
.paper-sheet .src.missing{color:var(--shu);}
.paper-sheet .src.optional{color:var(--ink-sub);}
.paper-sheet .missing-banner,.paper-sheet .ok-banner{border-radius:2px;font-family:var(--mincho);font-size:13px;}
.paper-sheet .missing-banner{background:var(--shu-fill);border:1px solid #D9A79E;color:var(--shu);}
.paper-sheet .ok-banner{background:#E6EFEA;border:1px solid #B7CFC2;color:var(--green-ink);}

/* 作業前確認・署名 */
.paper-sheet .checklist label{font-family:var(--mincho);font-size:13.5px;color:var(--ink);border-bottom:1px dotted var(--rule);padding:8px 2px;display:flex;gap:10px;align-items:flex-start;}
.paper-sheet .checklist input{accent-color:var(--green-ink);width:18px;height:18px;margin-top:2px;flex:none;}
.sign-field{position:relative;border:1px solid var(--ink);background:rgba(255,255,255,.72);margin-top:6px;}
.sign-field .sign-label{position:absolute;top:0;left:0;font-family:var(--mincho);font-size:12px;letter-spacing:.3em;background:var(--ink);color:var(--paper);padding:3px 10px 3px 12px;}
.sign-field::after{content:"";position:absolute;left:16px;right:16px;bottom:34px;border-bottom:1px solid var(--rule);pointer-events:none;}
.sign-field canvas{display:block;width:100%;background:transparent;border:none;touch-action:none;}

/* 確定後: 受領欄＋朱肉の印 */
.paper-sheet .sign-done{background:transparent;border:none;border-top:2px solid var(--ink);border-radius:0;padding:16px 2px 4px;font-family:var(--mincho);}
.paper-sheet .sign-done > b{color:var(--green-ink);}
.sign-done .seal-row{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin:10px 0 4px;}
.paper-sheet .sign-done .kv{flex:1;min-width:240px;}
.paper-sheet .sign-done .kv b{color:var(--ink-sub);font-weight:600;}
.paper-sheet .sig-img{border:none;border-bottom:1px solid var(--rule);border-radius:0;background:transparent;}
.hanko{width:84px;height:84px;flex:none;border:3px solid var(--shu);border-radius:50%;color:var(--shu);display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--mincho);font-weight:700;transform:rotate(-8deg);opacity:.9;
  box-shadow:inset 0 0 0 2px transparent;animation:hanko-in .28s ease-out both;mix-blend-mode:multiply;}
.hanko .hanko-top{font-size:10px;letter-spacing:.1em;border-bottom:1.5px solid var(--shu);padding:0 6px 1px;}
.hanko .hanko-name{font-size:20px;line-height:1.1;margin:2px 0;}
.hanko .hanko-date{font-size:9.5px;border-top:1.5px solid var(--shu);padding:1px 4px 0;}
@keyframes hanko-in{0%{transform:scale(1.6) rotate(-16deg);opacity:0}60%{transform:scale(.92) rotate(-7deg);opacity:1}100%{transform:scale(1) rotate(-8deg);opacity:.9}}
@media(prefers-reduced-motion:reduce){.hanko{animation:none;}}
@media(max-width:560px){.paper-sheet{padding:24px 14px 16px;}.paper-sheet .sheet-head .ai-tag{margin-left:0;}}
.sign-field #pad{border:none;border-radius:0;background:transparent;}
.paper-sheet .checklist label{background:transparent;border:none;border-bottom:1px dotted var(--rule);border-radius:0;box-shadow:none;margin:0;}
.paper-sheet .sign-done .kv{grid-template-columns:132px 1fr;}

/* 帳票プレビュー（画面4）＝印刷した書類の見た目 */
.form-card.paper-sheet{padding:26px 18px 14px;margin-bottom:26px;overflow:visible;border-radius:2px;}
.form-card.paper-sheet .form-head{background:transparent;border:none;border-bottom:2px solid var(--ink);padding:0 4px 8px;font-family:var(--mincho);}
.form-card.paper-sheet .fname{font-family:var(--mincho);font-size:16px;letter-spacing:.1em;color:var(--ink);}
.form-card.paper-sheet .fsub{color:var(--ink-sub);}
.form-card.paper-sheet .form-body{padding:14px 4px 4px;background:transparent;}
.form-card.paper-sheet .formtable th{background:rgba(236,232,222,.72);color:#4A443A;font-family:var(--mincho);}
.form-card.paper-sheet .formtable th,.form-card.paper-sheet .formtable td{border-color:#B9B3A6;}
.form-card.paper-sheet .formtable td{background:transparent;}
.form-card.paper-sheet .fv{font-family:var(--hand);font-size:14.5px;font-weight:600;color:#1B2A4A;}
.form-card.paper-sheet .muted{color:var(--ink-sub);}
.form-card.paper-sheet .sig-mini{font-family:var(--mincho);color:var(--shu);font-size:17px;}
.form-card.paper-sheet .gen-badge{border-radius:2px;}
.form-card.paper-sheet .btn-ai.btn-sm{background:var(--pri);border-radius:3px;}
