/* Affairs Office console on the shared St. Maria theme (theme.css). Class names are driven by affairs.js. */
main { max-width: 1180px; margin: 0 auto; padding: 0 18px 30px; }

.card { position: relative; background: var(--paper); color: var(--ink); padding: 26px 28px; margin-bottom: 26px; border-top: 6px solid var(--red);
  box-shadow: 3px 4px 0 rgba(0,0,0,.2), 0 18px 28px -14px rgba(0,0,0,.6); }
.card::before { content: ""; position: absolute; top: -14px; left: 50%; width: 18px; height: 18px; margin-left: -9px; border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #E8888F, var(--red) 60%, var(--red-deep)); box-shadow: 1px 3px 3px rgba(0,0,0,.35); }
.narrow { max-width: 460px; margin: 40px auto; transform: rotate(-.6deg);
  background-image: repeating-linear-gradient(0deg, transparent 0 27px, rgba(36,48,75,.07) 27px 28px); }
#entry-message { color: var(--muted); }
#login-form button { margin-top: 22px; width: 100%; height: 44px; }
#reload-entry { margin-top: 12px; }

/* who is signed in: a name tag */
.identity-bar { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 18px; margin: 0 0 26px;
  background: var(--gold-soft); color: var(--brown); box-shadow: 2px 3px 0 rgba(0,0,0,.25); transform: rotate(-.3deg); max-width: 640px; }
.identity-bar p { margin: 0; min-width: 0; }
.identity-bar strong { margin-right: 12px; font-family: var(--zh); font-size: 16px; color: var(--red-deep); }
.identity-bar #account-email { color: var(--brown); opacity: .75; overflow-wrap: anywhere; font-size: 13px; }

/* office mailbox: a stamped envelope strip */
.mailbox-card { display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap; border-top-color: var(--green);
  background: var(--paper-2) repeating-linear-gradient(-45deg, transparent 0 12px, rgba(156,36,52,.06) 12px 18px, transparent 18px 24px, rgba(36,48,75,.06) 24px 30px); }
.mailbox-card::before { display: none; }
.mailbox-card h2 { font-size: 17px; margin-bottom: 2px; }
.mailbox-card p { margin: 0 0 2px; overflow-wrap: anywhere; }
.mailbox-card #mailbox-address { font-family: var(--type); font-variation-settings: "wdth" 75; color: var(--red); }
.mailbox-card button { flex-shrink: 0; margin-left: 6px; }

/* compose + preview */
.workspace-grid { display: grid; grid-template-columns: minmax(300px, .9fr) minmax(0, 1.1fr); gap: 26px; align-items: start; }
.workspace-grid > .card { min-width: 0; }
.workspace-grid > .card:first-child { transform: rotate(-.4deg); background-image: repeating-linear-gradient(0deg, transparent 0 27px, rgba(36,48,75,.06) 27px 28px); }
.section-heading { margin-bottom: 8px; }
.lead { margin: 0 0 20px; font-size: 13px; }
.offer-preview-card { border-top-color: var(--gold); }
.offer-preview-card h3 { font-size: 16px; line-height: 1.6; overflow-wrap: anywhere; margin: 14px 0 0; color: var(--red-deep); }
#preview-frame { display: block; width: 100%; height: 620px; border: 0; background: var(--cream); margin-top: 16px; box-shadow: inset 0 0 0 1px var(--line); }
.preview-text { margin-top: 14px; font-size: 12.5px; color: var(--muted); }
.preview-text #preview-body { padding-top: 12px; color: var(--ink); font-size: 13px; white-space: pre-wrap; line-height: 1.9; overflow-wrap: anywhere; }
#preview-status { color: var(--red); }
#offer-template, #template-editor-select { max-width: none; }
select { max-width: 180px; }
.advanced-settings { margin-top: 20px; border-top: 1px dashed var(--line); padding-top: 14px; }
.advanced-settings summary, summary { cursor: pointer; }
.advanced-settings summary { font-size: 13px; color: var(--brown); }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }

/* issued offer: the ticket stub */
.result-card { border-top-color: var(--green); background: var(--paper-2); }
.result-card h2 { color: var(--red-deep); }
.result-card > .copy-field { max-width: 720px; }
.copy-field { display: flex; align-items: stretch; gap: 8px; }
.copy-field input { font-family: var(--type); font-variation-settings: "wdth" 75; letter-spacing: .04em; }
.copy-field button { flex-shrink: 0; }
#result-code { font-size: 17px; color: var(--red-deep); }
.result-card .delivery-note { font-size: 13px; padding: 12px 14px; background: var(--gold-soft); white-space: pre-wrap; margin: 22px 0 12px; overflow-wrap: anywhere; }
.result-card .delivery-note:empty { display: none; }

/* records ledger */
.records { border-top-color: var(--navy); }
.section-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; margin-bottom: 10px; }
.section-row h2 { margin-bottom: 0; }
.section-row button { flex-shrink: 0; }
.record-list { margin-top: 12px; }
.record { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 18px; padding: 16px 4px; border-top: 1px dashed var(--line); }
.record:nth-child(odd) { background: rgba(243,231,210,.45); }
.record-title { font-size: 15px; font-weight: 700; overflow-wrap: anywhere; margin: 0 0 6px; color: var(--ink); }
.record-meta { font-size: 12.5px; color: var(--muted); overflow-wrap: anywhere; margin: 0 0 4px; }
.record-tags { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.record-actions { display: flex; align-items: center; gap: 8px; }
.record-actions button { font-size: 12.5px; padding: 6px 12px; }
.pagination { display: flex; align-items: center; justify-content: flex-end; gap: 14px; margin-top: 16px; font-size: 12.5px; color: var(--muted); }
.pagination button { font-size: 12.5px; padding: 6px 12px; }

/* admin drawers */
.management-panel { border-top-color: var(--brown); }
.management-panel::before { display: none; }
.management-panel > summary { font-family: var(--zh); font-weight: 900; font-size: 19px; color: var(--green-deep); list-style: none; display: flex; align-items: center; gap: 8px; }
.management-panel > summary::-webkit-details-marker { display: none; }
.management-panel > summary::before { content: "▸"; color: var(--red); font-size: 14px; transition: transform .15s; }
.management-panel[open] > summary::before { transform: rotate(90deg); }
.management-panel[open] > summary { margin-bottom: 16px; }
.management-panel .section-row h2 { display: none; }
.management-panel code { font-family: var(--type); font-variation-settings: "wdth" 75; font-size: 12px; background: var(--gold-soft); padding: 1px 5px; }
.management-panel #template-fields { max-width: 780px; }
textarea { resize: vertical; line-height: 1.8; background-image: repeating-linear-gradient(0deg, transparent 0 25px, rgba(36,48,75,.07) 25px 26px); background-attachment: local; }
.reviewer-form { max-width: 560px; }
#template-status[data-kind="error"] { color: var(--red); }

@media (max-width: 900px) {
  .workspace-grid { grid-template-columns: 1fr; gap: 0; }
  .workspace-grid > .card:first-child { transform: none; }
}
@media (max-width: 640px) {
  main { padding: 0 12px 24px; }
  .card { padding: 22px 18px; }
  .identity-bar { flex-wrap: wrap; }
  .identity-bar #account-email { display: block; margin-top: 2px; }
  .section-row { flex-wrap: wrap; }
  .record { grid-template-columns: minmax(0, 1fr); }
  .record-actions { justify-content: flex-end; flex-wrap: wrap; }
  .actions > button { flex: 1 1 100%; }
  .pagination { justify-content: space-between; gap: 8px; }
  #preview-frame { height: 520px; }
}

/* member management (admin) */
.members-search { display: flex; gap: 8px; margin: 14px 0 6px; flex-wrap: wrap; }
.members-search input { flex: 1 1 240px; }
.member-list { margin-top: 10px; }
.member { border-top: 1px dashed var(--line); padding: 14px 4px; }
.member:nth-child(odd) { background: rgba(243,231,210,.45); }
.member-head { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(0, 1.4fr) auto; gap: 8px 18px; align-items: start; }
.member-who strong { display: block; font-size: 15px; color: var(--ink); overflow-wrap: anywhere; }
.member-email { display: block; font-size: 12.5px; color: var(--red); overflow-wrap: anywhere; }
.member-meta { display: grid; gap: 2px; font-size: 12.5px; color: var(--muted); overflow-wrap: anywhere; }
.member-head > button { font-size: 12.5px; padding: 6px 12px; }
.member-detail { margin: 12px 0 2px; padding: 14px 16px; background: var(--paper-2); border-left: 4px solid var(--green); }
.member-detail h3 { font-size: 15px; margin: 0 0 8px; }
.send-row { display: grid; grid-template-columns: 150px minmax(0, 1fr) minmax(0, 1.2fr); gap: 4px 14px; font-size: 13px; padding: 6px 0; border-top: 1px dotted var(--line); }
.send-time { color: var(--muted); } .send-subject { font-weight: 700; overflow-wrap: anywhere; } .send-to { color: var(--brown); overflow-wrap: anywhere; }
.member-detail .actions { margin-top: 14px; }
.member-detail .delivery-note { white-space: pre-wrap; font-size: 13px; margin: 12px 0 0; padding: 0; background: none; }
.member-detail .delivery-note:not(:empty) { padding: 12px 14px; background: var(--gold-soft); }
@media (max-width: 760px) {
  .member-head { grid-template-columns: 1fr; }
  .member-head > button { justify-self: start; }
  .send-row { grid-template-columns: 1fr; }
}

/* module tabs: index-card tabs on the tartan */
.module-tabs { display: flex; gap: 10px; margin: 0 0 26px; padding-left: 4px; border-bottom: 3px solid var(--gold); }
.module-tabs a { display: grid; gap: 1px; padding: 10px 22px 9px; background: rgba(251,244,230,.82); color: var(--green-deep); text-decoration: none;
  font-family: var(--zh); font-weight: 900; font-size: 17px; line-height: 1.2; border-radius: 4px 4px 0 0; transform: translateY(3px);
  box-shadow: 0 -2px 0 rgba(0,0,0,.12) inset; transition: background .15s; }
.module-tabs a .tab-en { font-family: var(--label); font-weight: 400; font-size: 9.5px; letter-spacing: .2em; color: var(--red); }
.module-tabs a:hover { background: var(--paper); }
.module-tabs a.on { background: var(--paper); border-top: 4px solid var(--red); box-shadow: none; padding-top: 7px; }
.members-panel { border-top-color: var(--green); }
.members-panel::before { display: block; }
@media (max-width: 640px) {
  .module-tabs { gap: 6px; }
  .module-tabs a { flex: 1; text-align: center; padding: 9px 10px 8px; font-size: 16px; }
}

/* ===== the desk: one stationery widget per module ===== */
.desk-back { display: inline-block; margin: 0 0 18px; padding: 7px 14px; background: var(--gold-soft); color: var(--brown); text-decoration: none; font-weight: 700; font-size: 13.5px; box-shadow: 2px 3px 0 rgba(0,0,0,.25); transform: rotate(-1deg); }
.desk-back:hover { background: var(--gold); }
.desk { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px 30px; align-items: start; padding: 8px 4px 20px; }
.w { position: relative; display: grid; gap: 4px; align-content: start; min-height: 190px; padding: 22px 22px 20px; color: var(--ink); text-decoration: none;
  box-shadow: 3px 4px 0 rgba(0,0,0,.22), 0 18px 26px -14px rgba(0,0,0,.6); transition: transform .2s; }
a.w:hover, a.w:focus-visible { transform: rotate(0deg) translateY(-6px) !important; }
.w-kicker { font-family: var(--label); font-size: 10px; letter-spacing: .2em; color: var(--red); }
.w-title { font-family: var(--zh); font-weight: 900; font-size: 22px; color: var(--green-deep); line-height: 1.3; }
.w-line { font-size: 13px; color: var(--brown); line-height: 1.6; }
.w-line:empty { display: none; }
.w-cta { margin-top: 10px; font-weight: 700; font-size: 13.5px; color: var(--red); }
.w-big b { font-family: var(--display); font-weight: 900; font-variation-settings: "opsz" 72, "wdth" 60; font-size: 54px; line-height: 1; color: var(--red-deep); }
.w-big small { margin-left: 6px; color: var(--muted); font-size: 13px; }

/* postcard: Offer issuing (spans two columns) */
.w-postcard { grid-column: span 2; min-height: 230px; padding-right: 190px; background: var(--paper);
  background-image: linear-gradient(90deg, transparent calc(100% - 172px), var(--line) calc(100% - 172px), var(--line) calc(100% - 171px), transparent calc(100% - 171px)),
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(36,48,75,.10) 31px 32px);
  border: 1px solid rgba(74,48,42,.15); transform: rotate(-1.2deg); }
.w-postcard .w-title { font-size: 28px; }
.w-stamp { position: absolute; top: 18px; right: 22px; width: 108px; height: 128px; display: grid; place-items: center; align-content: center; padding: 10px;
  color: var(--cream); text-align: center; transform: rotate(3deg);
  background: radial-gradient(circle, transparent 4px, var(--red) 4.6px) -6px -6px / 12px 12px; filter: drop-shadow(1px 2px 0 rgba(0,0,0,.2)); }
.w-stamp::before { content: ""; position: absolute; inset: 6px; background: var(--red); box-shadow: inset 0 0 0 5px var(--red), inset 0 0 0 6.5px var(--gold-soft); }
.w-stamp > * { position: relative; }
.w-stamp span { font-family: var(--label); font-size: 8.5px; letter-spacing: .12em; color: var(--gold-soft); }
.w-stamp b { font-family: var(--display); font-weight: 900; font-variation-settings: "opsz" 72, "wdth" 60; font-size: 42px; line-height: 1.05; }
.w-stamp small { font-size: 11px; }
.w-postmark { position: absolute; top: 118px; right: 108px; width: 84px; height: 84px; border: 2px solid rgba(36,48,75,.5); border-radius: 50%;
  display: grid; place-items: center; align-content: center; font-family: var(--label); font-size: 8.5px; letter-spacing: .14em; color: rgba(36,48,75,.6); transform: rotate(-14deg); pointer-events: none; }
.w-postmark::after { content: ""; position: absolute; left: 76px; top: 30px; width: 70px; height: 24px; background: repeating-linear-gradient(0deg, transparent 0 4px, rgba(36,48,75,.4) 4px 6px); }

/* stamp sheet: roster */
.w-stampsheet { background: var(--cream); border: 6px solid var(--paper-2); outline: 1.5px dashed rgba(156,36,52,.45); outline-offset: -14px; transform: rotate(1.4deg); padding: 26px 26px 24px; }
.w-stampsheet .w-perf { position: absolute; right: -9px; top: 0; bottom: 0; width: 18px;
  background: radial-gradient(circle 5px, var(--green-deep) 98%, transparent) 0 0 / 18px 16px; }

/* luggage tag: groups */
.w-tag { background: #E7D2A6; border-radius: 6px 26px 26px 6px; clip-path: polygon(0 0, calc(100% - 34px) 0, 100% 34px, 100% calc(100% - 34px), calc(100% - 34px) 100%, 0 100%); transform: rotate(-2deg); padding-right: 54px; }
.w-hole { position: absolute; right: 22px; top: 50%; width: 16px; height: 16px; margin-top: -8px; border-radius: 50%; background: var(--green-deep); box-shadow: 0 0 0 4px #F3E7D2; }

/* airmail envelope: broadcasts */
.w-airmail { background: var(--paper-2); border: 10px solid transparent; border-image: repeating-linear-gradient(-45deg, var(--red) 0 12px, var(--paper-2) 12px 20px, var(--navy) 20px 32px, var(--paper-2) 32px 40px) 10; transform: rotate(1deg); }

/* ticket stub: events */
.w-ticket { background: var(--gold-soft); transform: rotate(-.8deg);
  -webkit-mask: radial-gradient(circle 12px at 0 50%, transparent 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle 12px at 100% 50%, transparent 98%, #000) right / 51% 100% no-repeat;
          mask: radial-gradient(circle 12px at 0 50%, transparent 98%, #000) left / 51% 100% no-repeat, radial-gradient(circle 12px at 100% 50%, transparent 98%, #000) right / 51% 100% no-repeat;
  border-left: 2px dashed rgba(74,48,42,.3); }

/* newspaper clipping: news */
.w-clipping { background: #F1ECDF; transform: rotate(1.6deg); filter: drop-shadow(3px 4px 0 rgba(0,0,0,.22)); box-shadow: none;
  clip-path: polygon(0 3%, 6% 0, 14% 2%, 22% 0, 31% 3%, 40% 0, 49% 2%, 58% 0, 67% 3%, 76% 0, 85% 2%, 93% 0, 100% 3%, 98% 50%, 100% 97%, 92% 100%, 83% 98%, 74% 100%, 65% 97%, 56% 100%, 47% 98%, 38% 100%, 29% 97%, 20% 100%, 11% 98%, 2% 100%, 0 96%, 2% 50%);
  background-image: repeating-linear-gradient(90deg, transparent 0 calc(50% - 1px), rgba(43,36,32,.12) calc(50% - 1px) 50%, transparent 50% 100%); }
.w-clipping .w-kicker { font-family: var(--display); font-weight: 900; letter-spacing: .12em; color: var(--ink); border-bottom: 2px solid var(--ink); padding-bottom: 4px; }

/* not built yet */
.w-soon { cursor: default; }
.w-soon > :not(.w-soon-mark):not(.w-hole) { opacity: .62; }
.w-soon-mark { position: absolute; right: 18px; bottom: 16px; transform: rotate(-10deg); border: 2px solid var(--red); color: var(--red); padding: 2px 10px; font-weight: 700; font-size: 13px; letter-spacing: .2em; opacity: .75; }
.w-tag .w-soon-mark { right: 56px; }

@media (max-width: 1000px) {
  .desk { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .desk { grid-template-columns: 1fr; gap: 26px; }
  .w-postcard { grid-column: auto; padding-right: 22px; padding-top: 150px; background-image: repeating-linear-gradient(0deg, transparent 0 31px, rgba(36,48,75,.10) 31px 32px); }
  .w-postmark { top: 40px; right: 140px; }
  .w-postmark::after { display: none; }
  .w { min-height: 0; }
}

/* ===== desk hierarchy: frequent widgets are bigger, important ones darker ===== */
.desk { grid-template-columns: repeat(2, minmax(0, 1.25fr)) repeat(2, minmax(0, 1fr));
  grid-template-areas: "issue issue roster roster" "issue issue broadcast events" "issue issue groups news"; gap: 30px 26px; }
.desk [data-widget="issue"] { grid-area: issue; } .desk [data-widget="roster"] { grid-area: roster; }
.desk [data-widget="broadcast"] { grid-area: broadcast; } .desk [data-widget="events"] { grid-area: events; }
.desk [data-widget="groups"] { grid-area: groups; } .desk [data-widget="news"] { grid-area: news; }
.desk:not(:has([data-widget="roster"]:not([hidden]))) { grid-template-columns: 1fr; grid-template-areas: "issue"; max-width: 640px; }

/* most used + most important: a deep red postcard */
.w-postcard { grid-column: auto; min-height: 100%; padding: 30px 30px 28px; padding-right: 30px; color: var(--cream);
  background: var(--red-deep) repeating-linear-gradient(0deg, transparent 0 35px, rgba(243,231,210,.08) 35px 36px); border: 0; transform: rotate(-1deg);
  box-shadow: inset 0 0 0 8px var(--red-deep), inset 0 0 0 9.5px rgba(211,163,59,.55), 3px 4px 0 rgba(0,0,0,.25), 0 22px 30px -14px rgba(0,0,0,.7); }
.w-postcard .w-kicker { color: var(--gold); }
.w-postcard .w-title { color: var(--paper); font-size: 34px; margin-top: 4px; }
.w-postcard .w-line { color: var(--gold-soft); font-size: 14px; }
.w-postcard .w-cta { display: inline-block; justify-self: start; margin-top: 18px; padding: 10px 18px; background: var(--gold); color: var(--red-deep); font-size: 15px; box-shadow: 2px 3px 0 rgba(0,0,0,.3); }
.w-postcard .w-stamp { position: relative; top: auto; right: auto; justify-self: end; margin: -6px -4px 6px 0; width: 120px; height: 142px; color: var(--red-deep);
  background: radial-gradient(circle, transparent 4px, var(--paper) 4.6px) -6px -6px / 12px 12px; }
.w-postcard .w-stamp::before { background: var(--paper); box-shadow: inset 0 0 0 5px var(--paper), inset 0 0 0 6.5px var(--red); }
.w-postcard .w-stamp span { color: var(--red); }
.w-postcard .w-stamp b { font-size: 50px; }
.w-postcard .w-postmark { top: 110px; right: auto; left: auto; right: 118px; border-color: rgba(246,227,166,.55); color: rgba(246,227,166,.75); }
.w-postcard .w-postmark::after { background: repeating-linear-gradient(0deg, transparent 0 4px, rgba(246,227,166,.45) 4px 6px); }
.w-recent { list-style: none; margin: 14px 0 0; padding: 12px 0 0; border-top: 1px dashed rgba(246,227,166,.4); display: grid; gap: 6px; }
.w-recent:empty { display: none; }
.w-recent li { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; color: var(--cream); }
.w-recent b { font-weight: 700; font-size: 12px; padding: 0 8px; border-radius: 2px; background: rgba(243,231,210,.15); color: var(--gold-soft); }
.w-recent b[data-status="used"] { background: var(--gold); color: var(--red-deep); }

/* important, second: a deep green stamp sheet */
.w-stampsheet { background: var(--green); color: var(--cream); border-color: var(--green-deep); outline-color: rgba(246,227,166,.5); }
.w-stampsheet .w-kicker { color: var(--gold); }
.w-stampsheet .w-title { color: var(--paper); font-size: 26px; }
.w-stampsheet .w-big b { color: var(--gold-soft); font-size: 64px; }
.w-stampsheet .w-big small, .w-stampsheet .w-line { color: var(--cream); }
.w-stampsheet .w-perf { background: radial-gradient(circle 5px, var(--green-deep) 98%, transparent) 0 0 / 18px 16px; }

/* less frequent: smaller and quieter */
[data-widget="groups"], [data-widget="news"] { min-height: 140px; padding: 16px 18px; }
[data-widget="groups"] .w-title, [data-widget="news"] .w-title { font-size: 18px; }
[data-widget="groups"] .w-line, [data-widget="news"] .w-line { font-size: 12px; }
[data-widget="groups"] .w-soon-mark, [data-widget="news"] .w-soon-mark { font-size: 11px; padding: 1px 7px; bottom: 12px; }
[data-widget="broadcast"], [data-widget="events"] { min-height: 170px; }

@media (max-width: 1000px) {
  .desk { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "issue issue" "roster roster" "broadcast events" "groups news"; }
}
@media (max-width: 640px) {
  .desk { grid-template-columns: 1fr 1fr; gap: 22px 16px; grid-template-areas: "issue issue" "roster roster" "broadcast broadcast" "events events" "groups news"; }
  .w-postcard { padding-top: 26px; }
  .w-postcard .w-postmark { display: none; }
  [data-widget="groups"], [data-widget="news"] { min-height: 120px; padding-bottom: 42px; }
  [data-widget="groups"] .w-line, [data-widget="news"] .w-line { display: none; }
  [data-widget="groups"] { padding-right: 46px; }
  [data-widget="groups"] .w-soon-mark { right: 40px; }
}

/* ===== tone-down: issue is the lead card but on cream paper, same height as roster ===== */
.desk { grid-template-areas: "issue issue roster roster" "broadcast events groups news"; }
.w-postcard { min-height: 0; color: var(--ink); padding: 26px 168px 24px 30px; transform: rotate(-.8deg);
  background: var(--paper) repeating-linear-gradient(0deg, transparent 0 31px, rgba(36,48,75,.08) 31px 32px);
  border-top: 8px solid var(--red);
  box-shadow: inset 0 0 0 1px rgba(74,48,42,.12), 3px 4px 0 rgba(0,0,0,.22), 0 18px 26px -14px rgba(0,0,0,.6); }
.w-postcard .w-kicker { color: var(--red); }
.w-postcard .w-title { color: var(--red-deep); font-size: 30px; }
.w-postcard .w-line { color: var(--brown); font-size: 13.5px; }
.w-postcard .w-cta { background: var(--red); color: var(--cream); margin-top: 14px; }
.w-postcard .w-stamp { position: absolute; top: 20px; right: 22px; margin: 0; width: 112px; height: 132px; color: var(--cream);
  background: radial-gradient(circle, transparent 4px, var(--red) 4.6px) -6px -6px / 12px 12px; }
.w-postcard .w-stamp::before { background: var(--red); box-shadow: inset 0 0 0 5px var(--red), inset 0 0 0 6.5px var(--gold-soft); }
.w-postcard .w-stamp span { color: var(--gold-soft); }
.w-postcard .w-stamp b { font-size: 46px; }
.w-postcard .w-postmark { top: 26px; right: 122px; border-color: rgba(36,48,75,.4); color: rgba(36,48,75,.55); }
.w-postcard .w-postmark::after { display: none; }
.w-postcard .w-postmark::after { background: repeating-linear-gradient(0deg, transparent 0 4px, rgba(36,48,75,.4) 4px 6px); }
.w-recent { border-top-color: var(--line); }
.w-recent li { color: var(--ink); }
.w-recent b { background: var(--cream); color: var(--brown); }
.w-recent b[data-status="used"] { background: var(--green); color: var(--cream); }
@media (max-width: 1000px) {
  .desk { grid-template-areas: "issue issue" "roster roster" "broadcast events" "groups news"; }
}
@media (max-width: 640px) {
  .desk { grid-template-areas: "issue issue" "roster roster" "broadcast broadcast" "events events" "groups news"; }
  .w-postcard { padding: 22px 20px 22px; padding-top: 22px; }
  .w-postcard .w-stamp { width: 86px; height: 102px; top: 16px; right: 16px; }
  .w-postcard .w-stamp b { font-size: 34px; }
  .w-postcard .w-title { font-size: 26px; padding-right: 96px; }
  .w-postcard .w-kicker { padding-right: 96px; }
  .w-postcard #w-issue-line, .w-postcard #w-issue-line2 { padding-right: 92px; }
}

/* ===== deep colours that stand out on the green tartan: navy roster, burgundy groups ===== */
.desk { grid-template-areas: "issue issue roster roster" "groups broadcast events news"; }
.w-stampsheet { background: var(--navy); border-color: #1A2238; outline-color: rgba(246,227,166,.5); }
.w-stampsheet .w-perf { background: radial-gradient(circle 5px, var(--green-deep) 98%, transparent) 0 0 / 18px 16px; }
[data-widget="groups"] { min-height: 170px; padding: 22px 54px 20px 22px; background: var(--red-deep); color: var(--cream); }
[data-widget="groups"] .w-kicker { color: var(--gold); }
[data-widget="groups"] .w-title { color: var(--paper); font-size: 22px; }
[data-widget="groups"] .w-line { color: var(--gold-soft); font-size: 13px; }
[data-widget="groups"] .w-hole { box-shadow: 0 0 0 4px var(--gold); }
[data-widget="groups"].w-soon > :not(.w-soon-mark):not(.w-hole) { opacity: .9; }
[data-widget="groups"] .w-soon-mark { border-color: var(--gold-soft); color: var(--gold-soft); font-size: 13px; padding: 2px 10px; bottom: 16px; right: 56px; }
@media (max-width: 1000px) {
  .desk { grid-template-areas: "issue issue" "roster roster" "groups broadcast" "events news"; }
}
@media (max-width: 640px) {
  .desk { grid-template-areas: "issue issue" "roster roster" "groups groups" "broadcast broadcast" "events events" "news news"; }
  [data-widget="groups"] .w-line { display: block; }
  [data-widget="groups"] { padding-right: 54px; }
  [data-widget="groups"] .w-soon-mark { right: 56px; }
}

/* ===== no gaps: every card in a row fills the row height ===== */
.desk { align-items: stretch; }
.desk > .w { height: 100%; }
.w-stampsheet { display: flex; flex-direction: column; gap: 4px; }
.w-roster-recent { border-top-color: rgba(246,227,166,.3); }
.w-roster-recent li { color: var(--cream); }
.w-roster-recent b { background: rgba(243,231,210,.12); color: var(--gold-soft); font-weight: 400; }

/* ===== events dropped; publish (news) is important; a blank reserved stamp ===== */
.desk { grid-template-areas: "issue issue roster roster" "groups broadcast publish tbd"; }
.desk [data-widget="news"] { grid-area: publish; }
.desk [data-widget="tbd"] { grid-area: tbd; }
[data-widget="news"] { min-height: 170px; padding: 22px; }
[data-widget="news"] .w-title { font-size: 22px; }
[data-widget="news"] .w-line { font-size: 13px; }
.w-blank { background: transparent; border: 2px dashed rgba(246,227,166,.5); box-shadow: none; color: var(--cream); transform: rotate(.6deg); }
.w-blank .w-kicker { color: var(--gold); }
.w-blank .w-title { color: var(--cream); }
.w-blank .w-line { color: var(--gold-soft); }
.w-blank .w-soon-mark { border-color: var(--gold-soft); color: var(--gold-soft); }
@media (max-width: 1000px) {
  .desk { grid-template-areas: "issue issue" "roster roster" "groups broadcast" "publish tbd"; }
}
@media (max-width: 640px) {
  .desk { grid-template-areas: "issue issue" "roster roster" "groups groups" "broadcast broadcast" "publish publish" "tbd tbd"; }
  [data-widget="news"] .w-line { display: block; }
}

/* ===== notice board: a cork board with pinned slips (news, notice, post, homework) ===== */
.w-cork { background: #B98A5A; color: var(--paper);
  background-image: radial-gradient(rgba(74,48,42,.35) 1px, transparent 1.4px), radial-gradient(rgba(255,240,210,.25) 1px, transparent 1.4px);
  background-size: 7px 7px, 11px 11px; background-position: 0 0, 3px 4px;
  border: 9px solid #6E4A2E; box-shadow: inset 0 0 0 2px rgba(0,0,0,.15), 3px 4px 0 rgba(0,0,0,.25), 0 18px 26px -14px rgba(0,0,0,.6); transform: rotate(-.6deg); }
.w-cork .w-kicker { color: var(--gold-soft); text-shadow: 0 1px 0 rgba(0,0,0,.3); }
.w-cork .w-title { color: var(--paper); text-shadow: 0 2px 0 rgba(0,0,0,.25); }
.w-cork.w-soon > :not(.w-soon-mark) { opacity: 1; }
.w-slips { display: flex; flex-wrap: wrap; gap: 8px 10px; margin-top: 10px; }
.w-slips i { position: relative; font-style: normal; font-size: 12px; font-weight: 700; padding: 6px 10px 5px; color: var(--ink); box-shadow: 1px 2px 0 rgba(0,0,0,.25); }
.w-slips i::before { content: ""; position: absolute; top: -5px; left: 50%; width: 9px; height: 9px; margin-left: -4px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #E8888F, var(--red) 60%, var(--red-deep)); }
.w-slips .s-clip { background: #F1ECDF; transform: rotate(-4deg); }
.w-slips .s-letter { background: var(--paper); border-top: 3px solid var(--red); transform: rotate(3deg); }
.w-slips .s-note { background: #F6E3A6; transform: rotate(-2deg); }
.w-slips .s-sheet { background: #FFFCF6 repeating-linear-gradient(0deg, transparent 0 7px, rgba(36,48,75,.18) 7px 8px); transform: rotate(4deg); }
.w-cork .w-soon-mark { background: var(--paper); }

/* ===== transcript takes the lead slot; issue moves to the second row ===== */
.desk { grid-template-areas: "transcript transcript roster roster" "groups broadcast publish issue"; }
.desk [data-widget="transcript"] { grid-area: transcript; }
.w-report { background: var(--paper-2); color: var(--ink); padding: 22px 26px 22px; border: 1px solid rgba(74,48,42,.18); transform: rotate(-.6deg);
  box-shadow: inset 0 0 0 6px var(--paper-2), inset 0 0 0 7.5px rgba(156,36,52,.55), 3px 4px 0 rgba(0,0,0,.22), 0 18px 26px -14px rgba(0,0,0,.6); }
.w-report.w-soon > :not(.w-soon-mark) { opacity: 1; }
.w-report-head { display: flex; justify-content: space-between; gap: 10px; border-bottom: 2px solid var(--red); padding-bottom: 6px; }
.w-report-school { font-family: var(--label); font-size: 9.5px; letter-spacing: .16em; color: var(--muted); }
.w-report .w-title { font-size: 28px; color: var(--red-deep); margin-top: 6px; }
.w-report .w-line { color: var(--brown); }
.w-report-table { display: grid; margin-top: 12px; border: 1.5px solid var(--brown); font-size: 12.5px; }
.r-row { display: grid; grid-template-columns: 1.1fr repeat(4, 1fr) .9fr; border-top: 1px solid rgba(74,48,42,.3); }
.r-row:first-child { border-top: 0; }
.r-row i { font-style: normal; padding: 4px 8px; border-left: 1px solid rgba(74,48,42,.2); text-align: center; font-family: var(--display); font-weight: 700; }
.r-row i:first-child { border-left: 0; text-align: left; font-family: var(--label); font-weight: 400; letter-spacing: .1em; }
.r-th { background: var(--cream); }
.r-th i { font-family: var(--label); font-weight: 400; font-size: 9.5px; letter-spacing: .14em; color: var(--muted); }
.r-wide { grid-column: span 4; text-align: left !important; font-family: var(--ui) !important; font-weight: 400 !important; color: var(--brown); }
.r-grade { color: var(--red); font-size: 15px; position: relative; }
.r-grade::after { content: ""; position: absolute; inset: 1px 18%; border: 1.5px solid var(--red); border-radius: 50%; transform: rotate(-8deg); opacity: .8; }
.r-ok { color: var(--green); } .r-ok::after { border-color: var(--green); }
.w-report .w-soon-mark { background: var(--paper-2); }

/* issue as a regular-size postcard in the second row */
.desk .w-postcard { padding: 20px 18px 18px; transform: rotate(1deg); }
.desk .w-postcard .w-title { font-size: 22px; padding-right: 74px; }
.desk .w-postcard .w-kicker { padding-right: 74px; }
.desk .w-postcard .w-stamp { width: 70px; height: 84px; top: 14px; right: 14px; }
.desk .w-postcard .w-stamp b { font-size: 28px; }
.desk .w-postcard .w-stamp span { font-size: 7px; }
.desk .w-postcard .w-postmark, .desk .w-postcard .w-recent, .desk .w-postcard #w-issue-line2 { display: none; }
.desk .w-postcard .w-line { font-size: 12.5px; padding-right: 0; }
.desk .w-postcard .w-cta { margin-top: 10px; padding: 7px 12px; font-size: 13px; }

@media (max-width: 1000px) {
  .desk { grid-template-areas: "transcript transcript" "roster roster" "groups broadcast" "publish issue"; }
}
@media (max-width: 640px) {
  .desk { grid-template-areas: "transcript transcript" "roster roster" "issue issue" "groups groups" "broadcast broadcast" "publish publish"; }
  .r-row { grid-template-columns: 1fr repeat(4, .8fr) .8fr; font-size: 11.5px; }
  .r-row i { padding: 3px 4px; }
}
.desk .w-postcard #w-issue-line { padding-right: 74px; }
.desk .w-postcard .w-stamp span { display: none; }
.w-report { padding-bottom: 50px; }
.w-report .w-soon-mark { bottom: 12px; }

/* ===== live desk: third row for notes, events and admissions ===== */
.desk { grid-template-areas: "transcript transcript roster roster" "groups broadcast publish issue" "community community activities admissions"; }
.desk [data-widget="community"] { grid-area: community; } .desk [data-widget="activities"] { grid-area: activities; } .desk [data-widget="admissions"] { grid-area: admissions; }
.desk a.w:hover, .desk a.w:focus-visible { filter: brightness(1.04); }
.w-admissions { background: #DCE1EE; transform: rotate(1.4deg); }
.w-report-live:empty { display: none; }
@media (max-width: 1000px) {
  .desk { grid-template-areas: "transcript transcript" "roster roster" "groups broadcast" "publish issue" "community community" "activities admissions"; }
}
@media (max-width: 640px) {
  .desk { grid-template-areas: "transcript transcript" "roster roster" "issue issue" "groups groups" "broadcast broadcast" "publish publish" "community community" "activities activities" "admissions admissions"; }
}

/* ===== administrative modules (office.js) ===== */
.office-card h2:focus { outline: none; }
.office-form label.check, .audience label.check { display: flex; align-items: center; gap: 8px; margin: 8px 0 0; font-weight: 400; color: var(--ink); }
.office-form label.check input, .audience label.check input { width: auto; }
.office-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 0 16px; }
.office-row select { max-width: none; }
.audience { border: 1px dashed var(--line); padding: 4px 14px 12px; margin: 18px 0 0; }
.audience legend { font-size: 13px; font-weight: 700; color: var(--brown); padding: 0 6px; }
.audience-groups { display: flex; flex-wrap: wrap; gap: 0 18px; padding-left: 22px; }
.swatch { display: inline-block; width: 13px; height: 13px; border-radius: 50%; margin-right: 6px; vertical-align: -1px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.2); }
.color-input { width: 64px !important; height: 38px; padding: 2px !important; }
.office-empty { padding: 14px 0; }
.office-preview { margin-top: 18px; padding-top: 14px; border-top: 1px dashed var(--line); }
.office-frame { width: 100%; height: 360px; border: 1px solid var(--line); background: #fff; }
.office-pre { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: 14px; margin: 6px 0; }
.office-rich { margin: 14px 0; line-height: 1.85; overflow-wrap: anywhere; }
.plain-list { list-style: none; margin: 8px 0 0; padding: 0; }
.plain-list li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 8px 0; border-top: 1px dashed var(--line); font-size: 14px; }
.plain-list li:first-child { border-top: 0; }
.plain-list button { font-size: 12.5px; padding: 4px 10px; }
.submission { padding: 12px 0; border-top: 1px dashed var(--line); }
.submission:first-child { border-top: 0; }
.submission .record-title { margin: 0 0 4px; }
.actions.inline { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 6px; }
.actions.inline select { width: auto; }
.chips { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.chip { padding: 5px 12px; font-size: 13px; background: var(--cream); color: var(--green-deep); box-shadow: none; border-radius: 14px; }
.chip.on { background: var(--red); color: var(--cream); }
.table-scroll { overflow-x: auto; margin-top: 12px; }
.office-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.office-table th, .office-table td { border: 1px solid rgba(74,48,42,.22); padding: 7px 10px; text-align: left; vertical-align: top; }
.office-table thead th { background: var(--cream); font-size: 12px; color: var(--muted); }
.office-table small { color: var(--muted); }
.grade-cells { display: flex; flex-wrap: wrap; gap: 10px 16px; }
.grade-cell { display: grid; gap: 2px; margin: 0; font-size: 12px; font-weight: 400; color: var(--muted); }
.grade-cell select { width: 70px; }
.grade-total { font-family: var(--display); font-weight: 700; color: var(--red); text-align: center !important; width: 56px; }
.link-button { background: none; border: 0; box-shadow: none; padding: 0; color: var(--red); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.link-button:hover:not(:disabled) { background: none; color: var(--red-deep); }
.back-button { margin-bottom: 16px; background: var(--paper); }
.member-detail:not([hidden]) { margin: 0 4px 12px; padding: 12px 16px; background: var(--paper-2); border-left: 4px solid var(--green); }
.college-toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) rotate(-1deg); z-index: 60; max-width: calc(100% - 32px);
  background: var(--gold-soft); color: var(--brown); padding: 10px 18px; box-shadow: 2px 4px 0 rgba(0,0,0,.25); font-weight: 700; }
.college-toast[data-kind="error"] { background: var(--red); color: var(--cream); }
@media (max-width: 640px) {
  .office-frame { height: 300px; }
  .record { grid-template-columns: 1fr; }
  .record-actions { flex-wrap: wrap; }
}
.w-specimen { position: relative; opacity: .8; }
.w-specimen-mark { position: absolute; right: 10px; bottom: -11px; z-index: 1; padding: 0 8px; background: var(--paper-2); border: 1.5px solid var(--muted); color: var(--muted);
  font-family: var(--label); font-size: 9.5px; letter-spacing: .14em; transform: rotate(-3deg); }
.desk [data-widget="groups"] .w-big b { color: var(--gold-soft); }
.desk [data-widget="groups"] .w-big small { color: var(--cream); opacity: .85; }
.conflict-bar { margin: 0 0 14px; padding: 12px 16px; background: var(--red-soft); border-left: 4px solid var(--red); color: var(--red-deep); }
.conflict-bar p { margin: 0 0 8px; font-weight: 700; }