/* Consent-first messages, drawn as a small manga correspondence corner. */
.proactive-page { max-width: 1120px; }
.proactive-page *, .proactive-page *::before, .proactive-page *::after { min-width: 0; }
.proactive-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:4px 0 18px; border-bottom:3px solid var(--comic-ink); }
.proactive-header nav { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px 18px; font-size:11px; font-weight:750; }
.proactive-header .comic-brand-sub { font-size:8px; letter-spacing:1px; }
.proactive-cover { display:flex; justify-content:space-between; gap:20px; margin:25px 0 30px; border:3px solid var(--comic-ink); background:#fffefa; box-shadow:6px 6px 0 var(--comic-ink); overflow:hidden; }
.proactive-cover > div { padding:27px 29px; }
.proactive-cover h1 { margin:15px 0 10px; color:var(--comic-ink); font-size:34px; font-weight:900; line-height:1.35; letter-spacing:-1px; }
.proactive-cover h1 em { color:var(--comic-blue); font-style:normal; }
.proactive-cover p { margin:0; color:var(--muted); font-size:12px; line-height:1.8; }
.proactive-cover > img { width:260px; max-height:255px; height:auto; flex-shrink:0; object-fit:cover; border-left:3px solid var(--comic-ink); }
.proactive-layout { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); align-items:start; gap:24px; }
.proactive-page .card { padding:24px; margin-bottom:24px; }
.proactive-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; }
.proactive-section-heading > div { display:flex; align-items:center; gap:12px; }
.proactive-section-heading h2 { margin:0; font-size:19px; font-weight:850; }
.proactive-section-heading .panel-number { font-size:29px; }
.proactive-note { color:var(--muted); font-size:11px; line-height:1.9; margin:10px 0 16px; overflow-wrap:anywhere; }
.proactive-page fieldset { margin:0; padding:0; border:0; }
.proactive-page input[type=checkbox] { width:18px; height:18px; flex:0 0 18px; accent-color:var(--comic-blue); cursor:pointer; }
.proactive-master-label { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px; margin:18px 0; border:2px solid var(--comic-blue); background:var(--comic-pale); cursor:pointer; }
.proactive-master-label strong,.proactive-master-label small { display:block; }
.proactive-master-label strong { font-size:14px; }
.proactive-master-label small { margin-top:5px; font-size:10px; color:var(--muted); line-height:1.8; }
.proactive-master-label input { width:21px!important; height:21px!important; flex-basis:21px!important; }
.proactive-channel-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.proactive-channel-card { display:flex; align-items:start; gap:9px; padding:15px 12px; background:#fffefa; border:1px solid #bbc7dd; cursor:pointer; }
.proactive-channel-card:has(input:checked) { border-color:var(--comic-blue); background:#eef3ff; }
.proactive-channel-card input { margin-top:1px; }
.proactive-channel-card strong,.proactive-channel-card small { display:block; }
.proactive-channel-card strong { font-size:12px; }
.proactive-channel-card small { margin-top:6px; font-size:10px; color:var(--muted); line-height:1.8; }
.proactive-time-grid { display:grid; grid-template-columns:1fr 1fr; gap:15px; margin:22px 0 12px; }
.proactive-time-grid .field { margin:0; }
.proactive-time-grid label { display:block; margin-bottom:7px; font-size:11px; font-weight:750; }
.proactive-time-grid .input { min-height:43px; padding:10px; font-size:13px; border:1px solid #a9b8d0; border-radius:4px; box-shadow:none; background:white; }
.proactive-consents { margin:20px 0; padding-top:4px; border-top:1px dashed #b6c2d5; }
.proactive-consents .checkbox { display:flex; align-items:start; gap:10px; margin:15px 0 0; font-size:11px; line-height:1.9; cursor:pointer; }
.proactive-consents input { margin-top:3px; }
.proactive-send-consent { padding:12px; background:#fff8df; border:1px solid #ddca8e; }
.proactive-save-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.proactive-save-actions .btn { font-size:12px; }
.proactive-save-actions > span { color:var(--muted); font-size:10px; }
.proactive-pause-panel { padding:22px; background:var(--comic-yellow); border:2px solid var(--comic-ink); box-shadow:4px 4px 0 #dbcd9f; margin-bottom:24px; }
.proactive-pause-panel .chapter-label { font-size:9px; }
.proactive-pause-panel h2 { font-size:21px; margin:16px 0 9px; font-weight:900; }
.proactive-pause-panel p { font-size:11px; line-height:1.9; color:#5d543d; margin:10px 0 16px; }
.proactive-pause-panel .btn { background:white; font-size:12px; }
.proactive-pause-panel .proactive-note { margin-bottom:0; font-size:10px; }
.proactive-window-card > h2 { font-size:18px; margin:0 0 16px; }
.proactive-window-card > p:not(.proactive-note) { color:var(--muted); font-size:12px; line-height:1.9; }
.proactive-window-card > .btn { font-size:12px; }
.proactive-schedule-facts { border-top:1px dashed #bdc8dc; border-bottom:1px dashed #bdc8dc; padding:10px 0; }
.proactive-schedule-facts > div { display:flex; flex-wrap:wrap; justify-content:space-between; gap:5px 10px; font-size:10px; margin:8px 0; }
.proactive-schedule-facts span { color:var(--muted); }
.proactive-schedule-facts strong { font-weight:750; }
.proactive-window-card .text-button { display:inline-block; font-size:11px; margin-bottom:15px; }
.proactive-processing { display:flex; align-items:start; gap:12px; padding:13px; margin:15px 0; border:1px solid #bacbef; background:var(--comic-pale); }
.proactive-processing > span { margin-top:5px; width:10px; height:10px; flex:0 0 10px; border-radius:50%; background:var(--comic-blue); animation:proactivePulse 1s ease-in-out infinite; }
.proactive-processing strong { font-size:12px; }
.proactive-processing p { color:var(--muted); font-size:10px; margin:5px 0 0; line-height:1.8; }
@keyframes proactivePulse { 50% { opacity:.3; } }
.proactive-message { padding:12px 14px; margin-top:15px; background:#eef8f2; border:1px solid #a6c7b5; border-radius:4px; color:#2c624a; font-size:12px; line-height:1.8; overflow-wrap:anywhere; }
.proactive-message.error { background:#fff1ee; border-color:#d8b2a9; color:#8c4236; }
.proactive-list-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:10px 0 16px; }
.proactive-list-heading h2 { margin:12px 0 0; font-size:25px; font-weight:900; }
.proactive-list-heading h2 .chip { vertical-align:middle; margin-left:8px; font-size:10px; font-weight:650; }
.proactive-list-heading > .btn { font-size:12px; flex-shrink:0; }
.proactive-message-list { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-bottom:28px; }
.proactive-letter { border:2px solid var(--comic-ink); background:#fffefa; padding:21px; box-shadow:4px 4px 0 #d2dcef; }
.proactive-letter.unread { border-color:var(--comic-blue); box-shadow:4px 4px 0 #c1cdf8; }
.proactive-letter-meta { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; font-size:10px; color:var(--muted); margin-bottom:15px; }
.proactive-letter-body { white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; line-height:2; color:var(--comic-ink); }
.proactive-letter > .proactive-note { font-size:10px; border-top:1px dashed #bdc8dc; padding-top:11px; margin-top:17px; }
.proactive-letter .btn-row { margin-top:12px; gap:8px; }
.proactive-letter .btn { font-size:10px; }
.proactive-empty { grid-column:1/-1; display:flex; align-items:center; justify-content:center; gap:24px; padding:25px; min-height:190px; border:2px dashed #aebcd5; background:#f2f5fc; }
.proactive-empty > img { width:100px; height:120px; object-fit:cover; border:2px solid var(--comic-ink); border-radius:50%; }
.proactive-empty h3 { margin:0 0 9px; font-size:21px; font-weight:850; }
.proactive-empty p { color:var(--muted); font-size:12px; line-height:1.9; margin:0; }
.proactive-job { border-top:1px solid #dce3f0; padding:17px 0; }
.proactive-job:last-child { padding-bottom:0; }
.proactive-job-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:11px; margin-bottom:13px; }
.proactive-job-channels { display:flex; flex-wrap:wrap; gap:10px; }
.proactive-job-channels > span { padding:7px 10px; border:1px solid #ccd5e5; background:#f4f6fb; font-size:11px; line-height:1.5; }
.proactive-job > p { color:var(--muted); font-size:11px; line-height:1.9; overflow-wrap:anywhere; margin:10px 0 0; }
.proactive-job-id { color:var(--muted); font-size:9px!important; font-family:monospace; }
.proactive-colophon { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; border-top:2px solid var(--comic-ink); padding-top:15px; margin-top:35px; color:var(--muted); font-size:9px; letter-spacing:.5px; }
@media(max-width:850px) { .proactive-layout { grid-template-columns:1fr; gap:0; } .proactive-sidebar { display:grid; grid-template-columns:1fr 1fr; gap:20px; align-items:start; } }
@media(max-width:640px) {
 .proactive-header { align-items:start; gap:12px; }
 .proactive-header .comic-brand { font-size:19px; }
 .proactive-header .comic-brand > img { width:36px; height:36px; }
 .proactive-header .comic-brand-sub { font-size:7px; letter-spacing:0; }
 .proactive-header nav { max-width:100px; gap:5px 9px; font-size:9px; }
 .proactive-cover { gap:0; margin:21px 0 25px; }
 .proactive-cover > div { padding:20px 16px; }
 .proactive-cover .chapter-label { font-size:8px; padding:3px 5px; }
 .proactive-cover h1 { font-size:25px; margin:13px 0 9px; }
 .proactive-cover p { font-size:10px; }
 .proactive-cover > img { width:110px; max-height:none; object-position:45% center; }
 .proactive-page .card { padding:19px; margin-bottom:22px; }
 .proactive-section-heading { gap:10px; }
 .proactive-section-heading > div { gap:9px; }
 .proactive-section-heading h2 { font-size:17px; }
 .proactive-section-heading .panel-number { font-size:26px; }
 .proactive-section-heading .chip { font-size:9px; }
 .proactive-note { font-size:10px; }
 .proactive-channel-card { padding:13px 10px; gap:8px; }
 .proactive-channel-card strong { font-size:11px; }
 .proactive-channel-card small { font-size:9px; }
 .proactive-time-grid { gap:13px; }
 .proactive-time-grid label { font-size:10px; }
 .proactive-time-grid .input { padding:9px; font-size:12px; }
 .proactive-consents .checkbox { font-size:10px; }
 .proactive-save-actions .btn { font-size:11px; }
 .proactive-sidebar { display:block; }
 .proactive-pause-panel { padding:19px; }
 .proactive-pause-panel h2 { font-size:20px; }
 .proactive-list-heading { gap:12px; }
 .proactive-list-heading h2 { font-size:22px; }
 .proactive-list-heading h2 .chip { display:table; margin:9px 0 0; font-size:9px; }
 .proactive-list-heading > .btn { font-size:10px; padding:9px 11px; }
 .proactive-message-list { grid-template-columns:1fr; gap:17px; }
 .proactive-letter { padding:18px; }
 .proactive-letter-body { font-size:12px; }
 .proactive-empty { padding:20px 15px; gap:15px; min-height:170px; }
 .proactive-empty > img { width:74px; height:95px; }
 .proactive-empty h3 { font-size:17px; }
 .proactive-empty p { font-size:10px; }
 .proactive-job-channels > span { font-size:10px; }
 .proactive-colophon { font-size:8px; }
 .proactive-colophon > span:nth-child(2) { display:none; }
}
@media(max-width:359px) {
 .proactive-header .comic-brand > img { display:none; }
 .proactive-header .comic-brand { font-size:18px; }
 .proactive-cover > div { padding:16px 12px; }
 .proactive-cover .chapter-label { font-size:7px; }
 .proactive-cover h1 { font-size:22px; }
 .proactive-cover > img { width:79px; }
 .proactive-page .card { padding:16px; }
 .proactive-section-heading h2 { font-size:15px; }
 .proactive-section-heading .panel-number { font-size:24px; }
 .proactive-channel-grid { grid-template-columns:1fr; gap:10px; }
 .proactive-channel-card small { margin-top:3px; }
 .proactive-time-grid { gap:12px; }
}
@media(prefers-reduced-motion:reduce) { .proactive-page *, .proactive-page *::before, .proactive-page *::after { transition:none!important; animation:none!important; scroll-behavior:auto!important; } }