.pic-wrap{
  max-width:860px;
  margin:24px auto;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Hiragino Sans","Yu Gothic",sans-serif;
  color:#1f2937;
}
.pic-card{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:24px;
  padding:24px;
  box-shadow:0 10px 30px rgba(15,23,42,.06);
}
.pic-badge{
  display:inline-block;
  background:#eef2ff;
  color:#3730a3;
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  font-weight:700;
  margin-bottom:12px;
}
.pic-lead{line-height:1.8;color:#475569;margin:0 0 16px}
.pic-note{
  background:#f8fafc;
  border:1px solid #e2e8f0;
  border-radius:16px;
  padding:16px;
  line-height:1.8;
  margin:18px 0 20px;
}
.pic-topline{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
  flex-wrap:wrap;
}
.pic-step,.pic-category,.pic-role-tag{
  display:inline-block;
  background:#f8fafc;
  border:1px solid #e5e7eb;
  border-radius:999px;
  padding:6px 12px;
  font-size:13px;
  font-weight:700;
}
.pic-role-tag{background:#f5f3ff;color:#5b21b6;border-color:#ddd6fe}
.pic-progress{
  width:100%;
  height:10px;
  background:#e5e7eb;
  border-radius:999px;
  overflow:hidden;
  margin-bottom:20px;
}
.pic-progress span,
.pic-meter span{
  display:block;
  height:100%;
  background:linear-gradient(90deg,#60a5fa,#818cf8);
  border-radius:999px;
}
.pic-question{
  font-size:28px;
  line-height:1.5;
  margin:0 0 18px;
}
.pic-choices{
  display:grid;
  gap:12px;
}
.pic-role-choices{grid-template-columns:repeat(2,minmax(0,1fr))}
.pic-choice{
  appearance:none;
  border:1px solid #cbd5e1;
  background:#fff;
  color:#0f172a;
  padding:16px 18px;
  border-radius:18px;
  text-align:left;
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  transition:.18s ease;
}
.pic-choice:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(2,6,23,.06)}
.pic-choice-active{
  border-color:#4f46e5;
  background:#eef2ff;
  color:#312e81;
}
.pic-nav{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-top:22px;
  flex-wrap:wrap;
}
.pic-nav-center{justify-content:center}
.pic-btn{
  appearance:none;
  border:none;
  border-radius:16px;
  padding:14px 18px;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  min-width:132px;
}
.pic-btn-primary{background:#111827;color:#fff}
.pic-btn-secondary{background:#e5e7eb;color:#111827}
.pic-btn[disabled]{opacity:.45;cursor:not-allowed}
.pic-error{color:#b91c1c;font-weight:700;min-height:24px;margin-top:10px}
.pic-grid-3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin:18px 0 24px;
}
.pic-mini-box{
  background:#f8fafc;
  border:1px solid #e2e8f0;
  border-radius:18px;
  padding:16px;
}
.pic-mini-label{font-size:13px;color:#64748b;margin-bottom:8px}
.pic-mini-value{font-size:28px;font-weight:800;color:#0f172a}
.pic-mini-text{font-size:18px;line-height:1.4}
.pic-section-title{margin:8px 0 14px;font-size:22px}
.pic-summary-list{display:grid;gap:14px}
.pic-summary-card{
  border:1px solid #e5e7eb;
  border-radius:18px;
  padding:16px;
}
.pic-summary-head{display:flex;justify-content:space-between;gap:10px;font-size:15px;margin-bottom:10px}
.pic-meter{height:10px;background:#e5e7eb;border-radius:999px;overflow:hidden;margin-bottom:12px}
.pic-summary-title{font-size:18px;font-weight:800;margin-bottom:8px}
.pic-status-high{background:#fff7ed;border-color:#fdba74}
.pic-status-medium{background:#fffbeb;border-color:#fcd34d}
.pic-status-low{background:#f0fdf4;border-color:#86efac}
.pic-result-hero{
  border:1px solid #e5e7eb;
  border-radius:18px;
  padding:18px;
  margin-bottom:14px;
}
.pic-overall-urgent{background:#fff1f2;border-color:#fda4af}
.pic-overall-same-day{background:#fff7ed;border-color:#fdba74}
.pic-overall-planned{background:#eff6ff;border-color:#93c5fd}
.pic-overall-observe{background:#f0fdf4;border-color:#86efac}
.pic-action-box{
  margin:0 0 22px;
  background:#f8fafc;
  border-radius:18px;
  border:1px solid #e2e8f0;
  padding:18px;
}
.pic-action-box ul{margin:10px 0 0 18px}
.pic-action-box li{margin:8px 0;line-height:1.7}
.pic-disclaimer{
  margin-top:18px;
  color:#475569;
  line-height:1.8;
  font-size:14px;
}
@media (max-width: 640px){
  .pic-wrap{margin:16px auto}
  .pic-card{padding:18px}
  .pic-question{font-size:22px}
  .pic-choice{font-size:15px;padding:14px}
  .pic-grid-3{grid-template-columns:1fr}
  .pic-role-choices{grid-template-columns:1fr}
  .pic-nav{flex-direction:column}
  .pic-btn{width:100%}
}


.pic-tools{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 18px;
}
.pic-copy-status{
  min-height:24px;
  font-weight:700;
  color:#065f46;
  margin:4px 0 16px;
}
.pic-note-grid,
.pic-template-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin:0 0 18px;
}
.pic-note-panel,
.pic-template-box{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:18px;
  padding:16px;
}
.pic-label{
  display:block;
  font-size:14px;
  font-weight:800;
  margin-bottom:10px;
}
.pic-textarea{
  width:100%;
  min-height:140px;
  border:1px solid #cbd5e1;
  border-radius:14px;
  padding:12px 14px;
  font:inherit;
  line-height:1.6;
  resize:vertical;
  box-sizing:border-box;
}
.pic-template-text{
  line-height:1.8;
  color:#334155;
  white-space:normal;
}
.no-print{display:flex}
@media (max-width: 640px){
  .pic-tools{flex-direction:column}
  .pic-note-grid,.pic-template-grid{grid-template-columns:1fr}
}
@media print{
  body *{visibility:hidden !important}
  #pic-app, #pic-app *{visibility:visible !important}
  #pic-app{position:absolute;left:0;top:0;width:100%}
  .no-print{display:none !important}
  .pic-wrap{max-width:none;margin:0}
  .pic-card{box-shadow:none;border:none;padding:0}
  .pic-choice,.pic-btn,.pic-progress,.pic-copy-status{display:none !important}
  .pic-textarea{border:1px solid #999;min-height:100px}
  .pic-result-hero,.pic-summary-card,.pic-action-box,.pic-note-panel,.pic-template-box{break-inside:avoid;page-break-inside:avoid}
}


.pic-summary-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 10px;
}
.pic-rank-chip,
.pic-priority-chip,
.pic-percent-chip,
.pic-priority-rank,
.pic-priority-tag{
  display:inline-block;
  border-radius:999px;
  padding:6px 10px;
  font-size:12px;
  font-weight:800;
}
.pic-rank-chip{background:#e0f2fe;color:#0c4a6e}
.pic-percent-chip{background:#f1f5f9;color:#334155}
.pic-priority-high{background:#fee2e2;color:#991b1b}
.pic-priority-medium{background:#fef3c7;color:#92400e}
.pic-priority-low{background:#dcfce7;color:#166534}
.pic-priority-section{margin:0 0 22px}
.pic-priority-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.pic-priority-card{
  border:1px solid #e5e7eb;
  border-left-width:6px;
  border-radius:18px;
  padding:16px;
  background:#fff;
}
.pic-priority-card.pic-priority-high{border-left-color:#ef4444;background:#fff7f7}
.pic-priority-card.pic-priority-medium{border-left-color:#f59e0b;background:#fffbeb}
.pic-priority-card.pic-priority-low{border-left-color:#22c55e;background:#f0fdf4}
.pic-priority-label{font-size:18px;font-weight:800;margin:10px 0 6px}
.pic-priority-title{line-height:1.7;color:#334155}
.pic-overall-urgent h2,.pic-overall-urgent .pic-lead{color:#881337}
.pic-overall-same-day h2,.pic-overall-same-day .pic-lead{color:#9a3412}
.pic-overall-planned h2,.pic-overall-planned .pic-lead{color:#1d4ed8}
.pic-overall-observe h2,.pic-overall-observe .pic-lead{color:#166534}
@media (max-width: 640px){
  .pic-priority-grid{grid-template-columns:1fr}
}


.pic-result-insight{display:grid;grid-template-columns:1.05fr .95fr;gap:14px;margin:0 0 22px}
.pic-insight-card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;padding:18px}
.pic-summary-lead{margin:0;color:#334155}
.pic-radar-wrap{width:100%;min-height:360px}
.pic-radar-canvas{width:100%;height:360px;display:block}
@media (max-width: 640px){.pic-result-insight{grid-template-columns:1fr}.pic-radar-wrap,.pic-radar-canvas{height:320px;min-height:320px}}


.pic-save-indicator{
  margin:0 0 16px;
  padding:12px 14px;
  border-radius:14px;
  font-size:14px;
  font-weight:700;
  border:1px solid #e2e8f0;
  background:#f8fafc;
  color:#334155;
}
.pic-save-saving{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8;}
.pic-save-saved{background:#ecfdf5;border-color:#86efac;color:#166534;}
.pic-save-idle{background:#f8fafc;border-color:#e2e8f0;color:#334155;}
