/* Swappable screen skin. Official PDF templates and printed records are independent. */
@media screen {
  .theme-picker { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; color: var(--ink, #253d3b); font-size: 12px; font-weight: 700; }
  .theme-picker select { min-height: 44px; max-width: 130px; padding: 7px 28px 7px 12px; border: 1px solid var(--line-strong, #b8cac0); border-radius: 24px; background: #fff; color: var(--ink, #253d3b); font-size: 14px; }
  .theme-picker-dots { display: flex; gap: 3px; }
  .theme-picker-dots i { width: 8px; height: 8px; border-radius: 50%; background: #e7adca; }
  .theme-picker-dots i:nth-child(2) { background: #e4cc41; }
  .theme-picker-dots i:nth-child(3) { background: #32b991; }
  .login-card .theme-picker { display: inline-flex; margin-top: 0; }
  .login-theme-picker { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--line); text-align: center; }

  :root[data-ui-theme="pop"] {
    --paper: #ffffff;
    --paper-bright: #fff;
    --paper-deep: #ffffff;
    --ink: #26332f;
    --ink-soft: #424d46;
    --forest: #276454;
    --forest-deep: #194e40;
    --forest-pale: #7cddb8;
    --line: #dae4de;
    --line-strong: #91a79c;
    --terra: #a34c72;
    --vermillion: #9d3c32;
    --error: #a02e32;
    --sage: #74a892;
    --shadow: 0 4px 0 #e2efe7;
    --pop-friends: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20180%20108%22%3E%3Cg%20stroke%3D%22%23293b31%22%20stroke-width%3D%223.2%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cg%20stroke%3D%22%23ffbb16%22%20stroke-width%3D%225%22%3E%3Cpath%20d%3D%22M46%207v8M46%2081v8M5%2048h9M78%2048h9M17%2018l6%206M70%2072l6%206M17%2078l6-6M70%2024l6-6%22%2F%3E%3C%2Fg%3E%3Ccircle%20cx%3D%2246%22%20cy%3D%2248%22%20r%3D%2227%22%20fill%3D%22%23ffcf24%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M35%2045v3m21-3v3M38%2057q8%209%2016%200%22%20fill%3D%22none%22%2F%3E%3Cellipse%20cx%3D%2229%22%20cy%3D%2254%22%20rx%3D%225%22%20ry%3D%223%22%20fill%3D%22%23f883a6%22%20stroke%3D%22none%22%2F%3E%3Cellipse%20cx%3D%2263%22%20cy%3D%2254%22%20rx%3D%225%22%20ry%3D%223%22%20fill%3D%22%23f883a6%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M82%2085c-19%200-20-26-3-29%200-27%2039-34%2048-9%2023-8%2039%2023%2017%2034-9%205-49%205-62%204Z%22%20fill%3D%22%2379dcbc%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M97%2064v3m17-3v3m-15%208q6%206%2012%200%22%20fill%3D%22none%22%2F%3E%3Cpath%20d%3D%22M157%2075v25m0-11q-15%201-14-10%2012-2%2014%2010%22%20fill%3D%22%2341b890%22%20stroke%3D%22%23258765%22%2F%3E%3Cpath%20d%3D%22M147%2040c-16-17%2010-30%2015-11%2016-14%2029%209%2010%2017%2016%2016-8%2032-16%2013-18%2015-32-10-9-19Z%22%20fill%3D%22%23fa7da6%22%20stroke%3D%22none%22%2F%3E%3Ccircle%20cx%3D%22158%22%20cy%3D%2246%22%20r%3D%2211%22%20fill%3D%22%23ffe04b%22%20stroke%3D%22none%22%2F%3E%3Cpath%20d%3D%22M154%2044h0m8%200h0m-9%206q5%204%2010%200%22%20fill%3D%22none%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");
    --pop-yellow: #ffcf24;
    --pop-pink: #ff91b6;
    --pop-mint: #71d9b0;
    --pop-round: 'Hiragino Maru Gothic ProN', 'ヒラギノ丸ゴ ProN', 'BIZ UDPGothic', 'Yu Gothic', sans-serif;
  }
  html[data-ui-theme="pop"] body { background: var(--paper); }
  html[data-ui-theme="pop"] .sidebar {
    color: var(--ink); background: #ffffff;
    border-right: 1px solid #e0e9e2;
    box-shadow: inset 6px 0 #f46ca0;
  }
  html[data-ui-theme="pop"] .brand { position: relative; padding-bottom: 20px; }
  html[data-ui-theme="pop"] .brand::after {
    content: ''; position: absolute; inset: auto 10px 0; height: 5px;
    background: repeating-linear-gradient(90deg, #ed6595 0 6px, transparent 6px 11px, #ffc929 11px 17px, transparent 17px 22px, #32b991 22px 28px, transparent 28px 33px);
    border-radius: 10px; pointer-events: none;
  }
  html[data-ui-theme="pop"] .brand strong { color: #26332f; font-family: var(--pop-round); letter-spacing: .04em; }
  html[data-ui-theme="pop"] .brand span:last-child { color: #35483d; }
  html[data-ui-theme="pop"] .brand-mark { border: 0; border-radius: 15px 15px 20px 20px; background: var(--pop-yellow); transform: rotate(-5deg); }
  html[data-ui-theme="pop"] .brand-mark i { background: #477457; }
  html[data-ui-theme="pop"] .facility-identity { border-left: 3px solid #9bbcab; color: var(--ink); }
  html[data-ui-theme="pop"] .facility-identity span { color: #35483d; }
  html[data-ui-theme="pop"] .facility-identity strong { color: #26332f; }
  html[data-ui-theme="pop"] .current-child { background: #fff; border: 2px solid #f177a4; border-radius: 20px; color: var(--ink); box-shadow: 0 4px 0 #ffc6d9; }
  html[data-ui-theme="pop"] .current-child .eyebrow { color: #984364; }
  html[data-ui-theme="pop"] .current-child strong { color: #26332f; font-family: var(--pop-round); }
  html[data-ui-theme="pop"] .current-child > span:last-child { color: #35483d; }
  html[data-ui-theme="pop"] .current-child:hover { background: #fff7fa; border-color: #c27897; }
  html[data-ui-theme="pop"] .primary-nav button { color: #293d32; border-radius: 14px; font-weight: 700; }
  html[data-ui-theme="pop"] .primary-nav button > span { background: #ffffff; color: #35483d; border-radius: 8px; }
  html[data-ui-theme="pop"] .primary-nav button:hover:not(:disabled) { background: #ffeb84; color: #303f34; }
  html[data-ui-theme="pop"] .primary-nav button[aria-current="page"] { background: var(--pop-yellow); color: #29352c; box-shadow: inset 4px 0 #e99d10; }
  html[data-ui-theme="pop"] .primary-nav button[aria-current="page"] > span { color: #29352c; background: #ffffff; }
  html[data-ui-theme="pop"] .primary-nav .record-nav-shortcut { background: #ffb1ce; color: #4f2437; border-color: #f177a4; }
  html[data-ui-theme="pop"] .primary-nav .record-nav-shortcut small { color: #4f2437; }
  html[data-ui-theme="pop"] .primary-nav button:disabled { color: #7c8174; opacity: .8; }
  html[data-ui-theme="pop"] .topbar { background: #ffffff; border-bottom: 1px solid #e0e9e2; }
  html[data-ui-theme="pop"] .sidebar-account { border-color: #91a79c; background: #ffffff; }
  html[data-ui-theme="pop"] .sidebar-account .staff-context { color: #26332f; }
  html[data-ui-theme="pop"] .sidebar-account .staff-context strong { color: #26332f; }
  html[data-ui-theme="pop"] .sidebar-account .staff-context span { color: #536e69; }
  html[data-ui-theme="pop"] .sidebar-help-link { border-color: #d9e5de; color: #35483d; }
  html[data-ui-theme="pop"] .sidebar-help-link:hover { background: #f4f8f5; color: #26332f; }
  html[data-ui-theme="pop"] .logout-button { color: #35483d; border-color: #91a79c; border-radius: 24px; background: #fff; }
  html[data-ui-theme="pop"] .page-heading { border-bottom: 3px dashed #ffc929; padding-bottom: 20px; }
  html[data-ui-theme="pop"] .page-heading h1 { font-family: var(--pop-round); color: #26332f; letter-spacing: .02em; }
  html[data-ui-theme="pop"] .page-heading > div:first-child { position: relative; padding-right: 126px; min-height: 82px; }
  html[data-ui-theme="pop"] .page-heading > div:first-child::after {
    content: ''; width: 112px; height: 82px; position: absolute; right: 0; top: 0;
    background: var(--pop-friends) center / contain no-repeat; pointer-events: none;
  }
  html[data-ui-theme="pop"] .page-view h2, html[data-ui-theme="pop"] .page-view h3,
  html[data-ui-theme="pop"] .dialog-heading h2 { font-family: var(--pop-round); }
  html[data-ui-theme="pop"] .support-record-actions { margin: 0 0 18px; }
  html[data-ui-theme="pop"] .button { border-radius: 20px; }
  html[data-ui-theme="pop"] .button-primary { background: var(--pop-yellow); color: #29352c; border: 1px solid #c49008; box-shadow: 0 3px 0 #e6ae18; }
  html[data-ui-theme="pop"] .button-primary:hover:not(:disabled) { background: #ffdd52; color: #29352c; box-shadow: 0 3px 0 #dba20d; }
  html[data-ui-theme="pop"] .button-primary:disabled { box-shadow: none; }
  html[data-ui-theme="pop"] .button-secondary { color: #375f4c; border-color: #9cb49e; background: #fff; }
  html[data-ui-theme="pop"] #reorder-child-profile-button { color: #375f4c; border-color: #9cb49e; background: #fff; }
  html[data-ui-theme="pop"] #reorder-child-profile-button[aria-pressed="true"] { color: #fff; border-color: #356d5d; background: #356d5d; }
  html[data-ui-theme="pop"] .button-quiet { color: #3e6554; }
  html[data-ui-theme="pop"] .eyebrow { color: #994b70; }
  html[data-ui-theme="pop"] .section-tabs { background: #ffffff; border-color: #c9dacf; border-radius: 16px; }
  html[data-ui-theme="pop"] .section-tabs button[aria-selected="true"] { color: #442436; background: #ff9ac0; border-radius: 12px; }
  html[data-ui-theme="pop"] .detail-sheet, html[data-ui-theme="pop"] .subsection-card,
  html[data-ui-theme="pop"] .document-lane, html[data-ui-theme="pop"] .record-card,
  html[data-ui-theme="pop"] .record-item, html[data-ui-theme="pop"] .document-reference-shared {
    background: #fff; border-color: #bfd5c7; border-radius: 28px; box-shadow: 0 4px 0 #e1eee5;
  }
  html[data-ui-theme="pop"] .document-lane-heading { background: #f2f7f4; border-top: 4px solid #74a892; border-radius: 17px 17px 0 0; }
  html[data-ui-theme="pop"] .document-lane:nth-child(2n) .document-lane-heading,
  html[data-ui-theme="pop"] .document-lane:nth-child(3n) .document-lane-heading { background: #f2f7f4; }
  html[data-ui-theme="pop"] .document-jump-nav a { background: #fff; border-radius: 28px; }
  html[data-ui-theme="pop"] .document-jump-nav a:nth-child(2n) { background: #fff; border-color: #bfd5c7; }
  html[data-ui-theme="pop"] .support-record-kind-button { background: #fff; border-radius: 14px; }
  html[data-ui-theme="pop"] .support-record-kind-button:nth-child(2n) { background: #fff; }
  html[data-ui-theme="pop"] .app-dialog { border: 2px solid #76b89a; border-radius: 26px; box-shadow: 0 16px 60px rgb(44 61 39 / 17%); }
  html[data-ui-theme="pop"] .app-dialog::backdrop { background: rgb(42 61 47 / 47%); backdrop-filter: blur(3px); }
  html[data-ui-theme="pop"] .dialog-heading { border-top: 7px solid transparent; border-image: repeating-linear-gradient(120deg, #f46ca0 0 6px, #ffffff 6px 12px) 7; padding-top: 16px; }
  html[data-ui-theme="pop"] .field input, html[data-ui-theme="pop"] .field select,
  html[data-ui-theme="pop"] .field textarea { background-color: #fff; border-color: #91a79c; border-radius: 12px; color: var(--ink); }
  html[data-ui-theme="pop"] input[type="checkbox"], html[data-ui-theme="pop"] input[type="radio"] { accent-color: #3d7358; }
  html[data-ui-theme="pop"] :is(button, a, input, textarea, select, summary):focus-visible { outline: 3px solid #9b416b; outline-offset: 3px; }
  html[data-ui-theme="pop"] .editor-group { border-radius: 16px; border-color: #bfd5c7; }
  html[data-ui-theme="pop"] .journal-photos, html[data-ui-theme="pop"] .journal-writing-tools { background: #ffffff; }
  html[data-ui-theme="pop"] .attendance-scope button[aria-pressed="true"] { background: #ffcf24; color: #29352c; border-color: #c49008; }
  html[data-ui-theme="pop"] .attendance-toolbar { background: #fff; border-color: #bfd5c7; border-radius: 28px; }
  html[data-ui-theme="pop"] #view-today .attendance-list { border-color: #bfd5c7; border-radius: 20px; box-shadow: 0 4px 0 #e1eee5; }
  html[data-ui-theme="pop"] #view-today .attendance-list-heading { background: #7cddb8; color: #26332f; }
  html[data-ui-theme="pop"] #view-today .attendance-row:nth-child(2n) { background: #ffffff; }
  html[data-ui-theme="pop"] .attendance-open-child { color: #375c49; }
  html[data-ui-theme="pop"] .picker-avatar { background: #ffcf24; color: #26332f; }
  html[data-ui-theme="pop"] .picker-option.is-current { background: #ffe04b; border-color: #c49008; }
  html[data-ui-theme="pop"] .login-page {
    background: repeating-linear-gradient(135deg, #f46ca0 0 9px, #ffffff 9px 18px) left / 14px 100% no-repeat,
      repeating-linear-gradient(135deg, #ffcf24 0 9px, #ffffff 9px 18px) right / 14px 100% no-repeat, #ffffff;
  }
  html[data-ui-theme="pop"] .login-header::after {
    content: ''; display: block; height: 86px; margin: 12px auto 0;
    background: var(--pop-friends) center / 150px 90px no-repeat; pointer-events: none;
  }
  html[data-ui-theme="pop"] #view-documents .document-lane { border-radius: 18px; box-shadow: 0 3px 0 #e1eee5; }
  html[data-ui-theme="pop"] #view-documents .document-lane h2 { font-family: var(--pop-round); }
  html[data-ui-theme="pop"] .document-lane.monitoring .document-lane-heading { background: #f2f7f4; }
  html[data-ui-theme="pop"] .support-record-kind-button { color: #26332f; border: 1px solid #bfd5c7; box-shadow: inset 4px 0 #74a892; }
  html[data-ui-theme="pop"] .support-record-kind-button:nth-child(2n) { border-color: #bfd5c7; }
  html[data-ui-theme="pop"] .support-record-kind-button:nth-child(3n) { background: #fff; border-color: #bfd5c7; }
  html[data-ui-theme="pop"] .support-record-kind-button:hover:not(:disabled) { border-color: #74a892; background: #f4f8f5; }
  html[data-ui-theme="pop"] .support-record-kind-button :is(strong, span, small, p) { color: #26332f; }
  html[data-ui-theme="pop"] .document-lane-heading :is(h2, p) { color: #26332f; }
  html[data-ui-theme="pop"] .login-card { border: 1px solid #91a79c; border-top: 9px solid #f46ca0; border-bottom: 9px solid #ffcf24; border-radius: 28px; box-shadow: 7px 8px 0 #ffdfeb; }
  html[data-ui-theme="pop"] .login-card h1, html[data-ui-theme="pop"] .login-brand strong { font-family: var(--pop-round); color: #26332f; }
  html[data-ui-theme="pop"] .gate-mark { background: #2f7060; color: #fffdf8; border-radius: 14px; }
  html[data-ui-theme="pop"] .login-card button[type="submit"] { background: #ffcf24; color: #29352c; border: 1px solid #c49008; border-radius: 14px; box-shadow: 0 3px 0 #e6ae18; }
  html[data-ui-theme="pop"] .login-card input { border-color: #91a79c; border-radius: 12px; }
  @media (max-width: 640px) {
    .theme-picker { gap: 6px; }
    .theme-picker-dots { display: none; }
    .theme-picker select { max-width: 116px; padding-inline: 9px; font-size: 13px; }
    html[data-ui-theme="pop"] .sidebar { box-shadow: inset 0 5px #f46ca0; }
    html[data-ui-theme="pop"] .page-heading > div:first-child { padding-right: 78px; min-height: 62px; }
    html[data-ui-theme="pop"] .page-heading > div:first-child::after { right: 0; width: 70px; height: 58px; }
  }
}
@media print {
  [data-theme-picker] { display: none !important; }
}