/* MAKEと同じ配色を使い、比較用の画面だけを独立させる。 */
.wakaru-brand { gap: 9px; white-space: nowrap; }
.wakaru-brand strong { color: #52663b; font-size: 29px; letter-spacing: -.04em; }
.wakaru-brand span { font-size: 18px; }
.wakaru-home-note { margin: -12px 16px 26px; line-height: 1.8; }
.wakaru-sample-tag { display: inline-block; margin-left: 12px; padding: 2px 12px; background: #fff; border-radius: 20px; font-size: 12px; }
.wakaru-app .calendar-search { width: min(360px, 45vw); }
.wakaru-mini-board { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; width: 100%; }
.wakaru-illustration { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; width: 100%; min-width: 0; height: 100%; padding: 8px; background: var(--variant-color); border-radius: 10px; }
.wakaru-illustration img { display: block; width: 100%; height: auto; aspect-ratio: 1; min-height: 0; object-fit: contain; mix-blend-mode: multiply; }
.wakaru-illustration span { flex-shrink: 0; background: rgba(255,255,255,.85); padding: 3px 10px; border-radius: 15px; color: #000; font-size: 14px; }
.wakaru-app .card-preview .wakaru-illustration img { width: 100%; height: auto; }
.wakaru-app .card-preview { padding: 14px; }
#wakaruEditor { height: calc(100dvh - 52px); display: grid; grid-template-columns: clamp(230px, 28vw, 400px) minmax(0, 1fr); overflow: hidden; }
.wakaru-palette { min-height: 0; display: flex; flex-direction: column; background: white; border-right: 4px solid var(--line); }
.wakaru-palette-heading { padding: 20px 20px 10px; border-bottom: 2px solid var(--line); }
.wakaru-palette-heading h2 { font-size: 20px; margin: 0; }
.wakaru-palette-heading p { margin: 8px 0; }
.wakaru-demo-note { font-size: 13px; line-height: 1.6; }
.wakaru-candidates { overflow-y: auto; overscroll-behavior: contain; min-height: 0; display: grid; align-content: start; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 18px; }
.wakaru-candidate, .wakaru-slot { min-width: 0; border: 3px solid transparent; border-radius: 13px; background: white; padding: 3px; cursor: pointer; }
.wakaru-candidate[aria-pressed="true"] { border-color: #4c6b30; outline: 2px solid #4c6b30; outline-offset: 2px; box-shadow: 0 5px 14px #52663b33; }
.wakaru-candidate:hover, .wakaru-slot:hover { border-color: var(--sage); }
.wakaru-workspace { min-width: 0; min-height: 0; display: flex; flex-direction: column; padding: 20px 28px; }
.wakaru-editor-toolbar { display: flex; align-items: center; gap: 20px; }
.wakaru-editor-toolbar .file-button { flex-shrink: 0; }
.wakaru-title-label { display: flex; align-items: center; gap: 14px; flex: 1; font-size: 14px; }
.wakaru-title-label input { min-width: 0; max-width: 440px; width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; background: white; font-size: 20px; }
.wakaru-instruction { margin: 16px 0; min-height: 24px; }
.wakaru-board { display: grid; flex: 1; min-height: 0; width: min(100%, 1000px); margin: 0 auto; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 18px; padding: 18px; background: var(--sage-stage); border-radius: 18px; }
.wakaru-slot { overflow: hidden; min-height: 0; }
.wakaru-slot .wakaru-illustration img { flex: 1; height: 0; width: 100%; aspect-ratio: auto; }
.wakaru-editor-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 18px; }
.wakaru-editor-footer span { font-size: 13px; }
.wakaru-dialog { position: fixed; width: min(660px, calc(100vw - 32px)); padding: 36px; border: 0; border-radius: 22px; background: var(--cream); }
.wakaru-dialog h2 { margin: 0 40px 22px 0; }
.wakaru-dialog::backdrop { background: #232b2380; }
.wakaru-action-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.wakaru-action-option { padding: 12px; border: 2px solid var(--sage-pale); border-radius: 14px; background: white; cursor: pointer; }
.wakaru-action-option img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; margin-bottom: 12px; }
.wakaru-check { display: flex; gap: 12px; margin: 26px 0; align-items: center; }
.wakaru-check input { width: 22px; height: 22px; }
.wakaru-print { display: none; }
.wakaru-app.large-text .wakaru-instruction, .wakaru-app.large-text .wakaru-demo-note { font-size: 19px; }
@media (max-width: 640px) {
  .wakaru-brand { flex-direction: column; justify-content: center; gap: 0; align-items: flex-start !important; }
  .wakaru-brand strong { font-size: 23px; line-height: 1; }
  .wakaru-brand span { font-size: 11px; }
  .wakaru-home-note { margin-inline: 0; font-size: 14px; }
  #wakaruEditor { grid-template-columns: 110px minmax(0, 1fr); }
  .wakaru-palette-heading { padding: 10px 8px; }
  .wakaru-palette-heading h2 { font-size: 14px; }
  .wakaru-palette-heading p { font-size: 11px; }
  .wakaru-candidates { grid-template-columns: 1fr; padding: 10px 7px; gap: 10px; }
  .wakaru-workspace { padding: 12px 8px; }
  .wakaru-title-label { display: block; }
  .wakaru-title-label input { font-size: 16px; padding: 7px; }
  .wakaru-editor-toolbar { gap: 8px; }
  .wakaru-editor-toolbar .file-button { width: 34px; height: 34px; }
  .wakaru-instruction { font-size: 12px; line-height: 1.5; margin: 12px 0; }
  .wakaru-board { flex: none; height: min(50dvh, 360px); padding: 6px; gap: 5px; border-radius: 10px; }
  .wakaru-illustration { padding: 3px; gap: 4px; }
  .wakaru-illustration span { font-size: 10px; padding: 3px 4px; }
  .wakaru-slot { padding: 1px; border-width: 2px; border-radius: 8px; }
  .wakaru-editor-footer { margin-top: auto; flex-wrap: wrap; justify-content: flex-end; padding-top: 10px; }
  .wakaru-editor-footer span { font-size: 11px; }
  .wakaru-editor-footer .primary-button { min-height: 42px; }
  .wakaru-dialog { padding: 28px 16px; }
  .wakaru-action-options { gap: 8px; }
  .wakaru-action-option { padding: 7px; font-size: 13px; }
}
@media screen and (max-height: 540px) { #wakaruEditor { height: auto; min-height: calc(100dvh - 52px); } .wakaru-board { flex: none; height: 340px; } .wakaru-palette { max-height: 540px; } }
@media print {
  @page { size: A4 landscape; margin: 12mm; }
  .wakaru-app > :not(.wakaru-print) { display: none !important; }
  .wakaru-app .wakaru-print { display: block; height: 180mm; }
  .wakaru-print h1 { text-align: center; margin: 0 0 6mm; font-size: 22pt; }
  .wakaru-print .wakaru-mini-board { height: 160mm; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 5mm; }
  .wakaru-print .wakaru-illustration { min-height: 0; break-inside: avoid; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .wakaru-print .wakaru-illustration img { flex: 1; height: 0; aspect-ratio: auto; }
}

/* 中間幅でもタイトルと候補番号を途中で折り返さない。 */
.wakaru-title-label { white-space: nowrap; min-width: 0; }
.wakaru-illustration span { white-space: nowrap; }