/* ICE Notice Board: physical notice-board material with a fast document system. */

body.page-notices{
  --notice-red:#8e1630;
  --notice-red-deep:#650c20;
  --notice-red-dark:#430714;
  --notice-paper:#fffdf5;
  --notice-paper-edge:#e6ddc9;
  --notice-ink:#1b2030;
  --notice-muted:#616570;
  /* Matte fabric (felt/baize) notice surface */
  --notice-felt:#8a1a2f;
  --notice-felt-deep:#5c0f1d;
  /* Carved Nepali (Newari) hardwood frame */
  --notice-wood:#5a3620;
  --notice-wood-light:#8a5730;
  --notice-wood-mid:#6b3f24;
  --notice-wood-dark:#3a2013;
  --notice-wood-deep:#28150b;
  --notice-control-radius:6px;
  background:var(--bg);
  color:var(--ink);
}

body.page-notices header.site{
  position:relative;
  background:var(--navy-deep);
}

.notice-page{
  overflow-x:clip;
  padding-bottom:var(--ice-space-fluid-48-96);
}

/* Compact classroom-style page head (replaces the oversized hero banner). */
.notice-head{
  width:min(100% - 32px,var(--ice-container-wide));
  margin:clamp(16px,2.4vw,26px) auto 0;
}

.notice-head__inner{
  display:grid;
  gap:10px;
}

.notice-breadcrumb{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--slate);
  font:700 .72rem/1.2 var(--sans);
  letter-spacing:.07em;
  text-transform:uppercase;
}

.notice-breadcrumb a{
  color:inherit;
  text-decoration:none;
}

.notice-breadcrumb a:hover{color:var(--crimson)}

.notice-head__title{
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:4px 16px;
}

.notice-head__nepali{
  margin:0;
  color:var(--ice-color-text-accent);
  font:700 clamp(1rem,1.6vw,1.28rem)/1.2 var(--sans);
  letter-spacing:.02em;
}

.notice-head h1{
  margin:0;
  color:var(--ink);
  font:500 clamp(2rem,4.6vw,3.35rem)/1 var(--display);
  letter-spacing:-.032em;
  text-wrap:balance;
}

.notice-head__intro{
  max-width:66ch;
  margin:0;
  color:var(--slate);
  font:400 clamp(.95rem,1.3vw,1.08rem)/1.55 var(--sans);
}

.notice-workspace{
  width:min(100% - 32px,var(--ice-container-wide));
  /* Reclaim the global section{padding:var(--sec) 0} rule: this is a productivity
     surface, so the controls sit right under the title, not a viewport below it. */
  margin:clamp(10px,1.6vw,16px) auto 0;
  padding:clamp(4px,1vw,10px) 0 clamp(28px,4vw,52px);
}

.notice-controls{
  border-bottom:1px solid var(--hairline);
  padding-bottom:12px;
}

.notice-controls__top{
  display:grid;
  gap:8px;
  margin-bottom:14px;
}

.notice-controls__label{
  margin:0 0 6px;
  color:var(--ice-color-text-accent);
  font:800 .74rem/1.2 var(--sans);
  letter-spacing:.1em;
  text-transform:uppercase;
}

.notice-controls h2{
  max-width:34ch;
  margin:0;
  color:var(--ink);
  font:600 clamp(1.3rem,2.1vw,1.8rem)/1.12 var(--display);
  letter-spacing:-.02em;
  text-wrap:balance;
}

.notice-controls__hint{
  max-width:50ch;
  margin:0;
  color:var(--slate);
  font:400 .94rem/1.55 var(--sans);
}

.notice-toolbar{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  margin-bottom:12px;
}

.notice-search,.notice-audience{
  display:grid;
  gap:6px;
}

.notice-search label,.notice-audience label,.notice-view>span{
  color:var(--slate);
  font:750 .72rem/1.2 var(--sans);
  letter-spacing:.06em;
  text-transform:uppercase;
}

.notice-search input,.notice-audience select{
  width:100%;
  min-height:48px;
  border:1px solid var(--hairline);
  border-radius:var(--notice-control-radius);
  background:var(--card);
  color:var(--ink);
  padding:0 14px;
  font:500 .94rem/1 var(--sans);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}

.notice-search input:hover,.notice-audience select:hover{border-color:color-mix(in srgb,var(--slate) 58%,var(--hairline))}
.notice-search input:focus-visible,.notice-audience select:focus-visible{
  outline:3px solid color-mix(in srgb,var(--crimson) 35%,transparent);
  outline-offset:2px;
  border-color:var(--crimson);
}

.notice-view{
  min-height:48px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0;
  align-self:end;
  border:1px solid var(--hairline);
  border-radius:var(--notice-control-radius);
  overflow:hidden;
  background:var(--card);
}

.notice-view>span{
  grid-column:1/-1;
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
}

.notice-view button,.notice-reset,.notice-tabs button,.notice-empty button{
  border:0;
  font-family:var(--sans);
  cursor:pointer;
  touch-action:manipulation;
}

.notice-view button{
  min-height:46px;
  background:transparent;
  color:var(--slate);
  font-size:.86rem;
  font-weight:750;
}

.notice-view button+button{border-left:1px solid var(--hairline)}
.notice-view button:hover{background:var(--field);color:var(--ink)}
.notice-view button.is-active{background:var(--navy-deep);color:#fff}

.notice-reset{
  min-height:48px;
  align-self:end;
  border:1px solid var(--hairline);
  border-radius:var(--notice-control-radius);
  background:transparent;
  color:var(--ink);
  padding:0 16px;
  font-size:.84rem;
  font-weight:750;
}
.notice-reset:hover{border-color:var(--crimson);color:var(--crimson)}
.notice-reset:active{transform:translateY(1px)}

.notice-tabs{
  display:flex;
  gap:8px;
  overflow-x:auto;
  scrollbar-width:thin;
  padding:2px 2px 4px;
}

.notice-tabs button{
  flex:0 0 auto;
  min-height:44px;
  display:flex;
  align-items:center;
  gap:9px;
  border:1px solid var(--hairline);
  border-radius:var(--notice-control-radius);
  background:var(--card);
  color:var(--slate);
  padding:0 12px;
  font-size:.82rem;
  font-weight:720;
  transition:border-color 160ms ease,color 160ms ease,background-color 160ms ease;
}

.notice-tabs button:hover{border-color:var(--slate);color:var(--ink)}
.notice-tabs button.is-active{border-color:var(--crimson);background:var(--crimson);color:#fff}
.notice-tabs button b{
  min-width:21px;
  height:21px;
  display:grid;
  place-items:center;
  border-radius:4px;
  background:var(--field);
  color:var(--ink);
  font-size:.68rem;
  font-variant-numeric:tabular-nums;
}
.notice-tabs button.is-active b{background:rgba(255,255,255,.18);color:#fff}
.notice-tab__full{display:none}

.notice-toolbar button:focus-visible,.notice-tabs button:focus-visible,.notice-card button:focus-visible,.notice-card a:focus-visible,.notice-empty button:focus-visible,.notice-dialog button:focus-visible,.notice-dialog a:focus-visible,.notice-source-note a:focus-visible{
  outline:3px solid color-mix(in srgb,var(--crimson) 40%,transparent);
  outline-offset:3px;
}

.notice-result-line{
  min-height:0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:6px 24px;
  padding:8px 2px;
  color:var(--slate);
  font:.78rem/1.4 var(--sans);
}
.notice-result-line p{margin:0}
#notice-result-status{color:var(--ink);font-weight:750}
.notice-drag-help{display:none}

.notice-board-frame{
  position:relative;
  isolation:isolate;
  padding:20px;
  border-radius:10px;
  background:
    repeating-linear-gradient(94deg,rgba(0,0,0,.10) 0 1px,transparent 1px 3px,rgba(255,255,255,.045) 3px 4px,transparent 4px 7px),
    repeating-linear-gradient(90deg,rgba(0,0,0,.05) 0 6px,rgba(255,255,255,.028) 6px 7px,transparent 7px 15px),
    linear-gradient(96deg,var(--notice-wood-mid) 0,var(--notice-wood-light) 16%,var(--notice-wood) 34%,var(--notice-wood-dark) 60%,var(--notice-wood-mid) 82%,var(--notice-wood-dark) 100%),
    var(--notice-wood);
  background-size:9px 100%,17px 100%,auto,auto;
  box-shadow:
    0 32px 66px rgba(26,14,6,.34),
    0 7px 16px rgba(26,14,6,.28),
    inset 0 2px 0 rgba(255,255,255,.16),
    inset 0 -3px 7px rgba(0,0,0,.4),
    inset 0 0 0 1px rgba(20,10,4,.5);
}

/* Routed/carved groove where the wood meets the felt */
.notice-board-frame::before{
  content:"";
  position:absolute;
  inset:11px;
  z-index:2;
  border-radius:6px;
  pointer-events:none;
  box-shadow:
    0 0 0 2px rgba(24,12,5,.62),
    0 1px 0 2px rgba(255,255,255,.12),
    inset 0 0 0 1px rgba(20,10,4,.55),
    inset 0 3px 8px rgba(0,0,0,.55),
    inset 0 -1px 2px rgba(255,255,255,.08);
}

.notice-board-corner{display:none}

.notice-canvas{
  position:relative;
  z-index:1;
  min-height:720px;
  display:grid;
  grid-template-columns:1fr;
  align-content:start;
  gap:16px;
  overflow:hidden;
  padding:34px 18px;
  border-radius:4px;
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.028) 0 1px,transparent 1px 2px,rgba(0,0,0,.05) 2px 3px,transparent 3px 4px),
    repeating-linear-gradient(0deg,rgba(255,255,255,.022) 0 1px,transparent 1px 2px,rgba(0,0,0,.045) 2px 3px,transparent 3px 4px),
    radial-gradient(circle at 21% 29%,rgba(0,0,0,.10) 0 1px,transparent 1.6px),
    radial-gradient(circle at 73% 63%,rgba(255,255,255,.04) 0 1px,transparent 1.5px),
    var(--notice-felt);
  background-size:4px 4px,4px 4px,23px 27px,29px 33px,auto;
  box-shadow:inset 0 0 60px rgba(40,6,16,.55),inset 0 2px 5px rgba(0,0,0,.28);
}

/* Matte edge vignette (no gloss) that seats the fabric inside the wood */
.notice-canvas::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:radial-gradient(125% 115% at 50% 42%,transparent 58%,rgba(24,3,10,.32) 100%);
}

.notice-card{
  position:relative;
  z-index:calc(2 + var(--notice-order));
  min-width:0;
  color:var(--notice-ink);
}

.notice-card[hidden]{display:none!important}

.notice-paper{
  position:relative;
  min-height:252px;
  display:flex;
  flex-direction:column;
  border:1px solid var(--notice-paper-edge);
  border-radius:5px 5px 3px 3px;
  background:
    linear-gradient(90deg,rgba(126,102,62,.026) 1px,transparent 1px),
    linear-gradient(rgba(126,102,62,.022) 1px,transparent 1px),
    var(--notice-paper);
  background-size:22px 22px;
  box-shadow:0 17px 26px rgba(52,4,17,.22),0 3px 6px rgba(52,4,17,.20),inset 0 1px 0 #fff;
  transform:rotate(var(--paper-tilt));
  transform-origin:50% 8%;
  transition:transform 180ms cubic-bezier(.2,.7,.2,1),box-shadow 180ms ease;
}

.notice-card::before{
  content:"";
  position:absolute;
  top:-10px;
  left:18px;
  z-index:0;
  width:44%;
  height:22px;
  border:1px solid var(--notice-paper-edge);
  border-bottom:0;
  border-radius:6px 6px 0 0;
  background:var(--notice-paper);
  transform:rotate(var(--paper-tilt));
  transform-origin:left bottom;
}

.notice-card:hover .notice-paper{
  transform:rotate(calc(var(--paper-tilt) * .45)) translateY(-3px);
  box-shadow:0 22px 34px rgba(52,4,17,.28),0 5px 8px rgba(52,4,17,.18),inset 0 1px 0 #fff;
}

.notice-card.is-dragging{
  user-select:none;
  -webkit-user-select:none;
}
.notice-card.is-dragging .notice-paper{
  transform:rotate(0deg) scale(1.018);
  box-shadow:0 28px 44px rgba(52,4,17,.34),0 8px 14px rgba(52,4,17,.24);
}

.notice-card__drag{
  position:relative;
  min-height:46px;
  display:grid;
  grid-template-columns:28px 1fr auto;
  align-items:center;
  gap:8px;
  border:0;
  border-bottom:1px dashed #d4cab6;
  background:transparent;
  color:#6a2636;
  padding:8px 12px 7px;
  font:800 .68rem/1.2 var(--sans);
  letter-spacing:.075em;
  text-align:left;
  text-transform:uppercase;
  cursor:default;
}

.notice-drag-enabled .notice-card__drag{cursor:grab;touch-action:none}
.notice-card.is-dragging .notice-card__drag{cursor:grabbing}
.notice-card__drag small{
  color:#8c8a84;
  font-size:.6rem;
  font-weight:700;
  opacity:0;
  transition:opacity 140ms ease;
}
.notice-drag-enabled .notice-card:hover .notice-card__drag small,.notice-card__drag:focus-visible small{opacity:1}

/* 3D pushpin: a glossy plastic head with a steel needle driven into the board. */
.notice-pin{
  position:relative;
  width:23px;
  height:27px;
  display:block;
  align-self:start;
  margin-top:-4px;
  transform:rotate(-6deg);
  /* soft contact shadow where the steel pierces the sheet */
  background:radial-gradient(ellipse 9px 3px at 50% 94%,rgba(30,3,12,.5),transparent 72%);
  filter:drop-shadow(0 3px 2.5px rgba(35,4,14,.42));
}
.notice-pin::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  z-index:1;
  width:22px;
  height:22px;
  border-radius:50%;
  background:radial-gradient(circle at 33% 26%,#ffd7de 0 5%,#ff8598 16%,#e62c4d 39%,#a8142f 67%,#5c0a1a 100%);
  box-shadow:
    inset -2.5px -2.5px 5px rgba(72,4,21,.72),
    inset 2px 2px 3px rgba(255,255,255,.42),
    0 1px 1px rgba(0,0,0,.28);
}
.notice-pin::after{
  content:"";
  position:absolute;
  left:9px;
  top:14px;
  z-index:0;
  width:4px;
  height:13px;
  background:linear-gradient(90deg,#6f777d,#f3f6f7 42%,#c4ccd1 58%,#5c646a);
  clip-path:polygon(0 0,100% 0,58% 100%,42% 100%);
  box-shadow:0 1px 1.5px rgba(0,0,0,.32);
}
.notice-pin i{
  position:absolute;
  left:4px;
  top:3px;
  z-index:2;
  width:6px;
  height:4px;
  border-radius:50%;
  background:rgba(255,255,255,.9);
  transform:rotate(-22deg);
}

.notice-card--reference .notice-pin::before,.notice-card--archive .notice-pin::before{
  background:radial-gradient(circle at 33% 26%,#ffffff 0 5%,#eef2f4 16%,#c3ccd2 41%,#8b959c 69%,#4a525a 100%);
  box-shadow:
    inset -2.5px -2.5px 5px rgba(45,52,58,.6),
    inset 2px 2px 3px rgba(255,255,255,.7),
    0 1px 1px rgba(0,0,0,.26);
}

.notice-card__body{
  flex:1 1 auto;
  min-width:0;
  padding:14px 15px 10px;
}

.notice-card__meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:6px 10px;
  margin-bottom:10px;
  color:var(--notice-muted);
  font:700 .64rem/1.25 var(--sans);
  letter-spacing:.035em;
}
.notice-card__meta time{font-variant-numeric:tabular-nums}

.notice-state{
  border-radius:3px;
  background:#eee9dc;
  color:#56554f;
  padding:4px 6px;
}
.notice-state[data-timing="urgent"]{background:#a81830;color:#fff}
.notice-state[data-timing="soon"]{background:#f1ddc9;color:#73230e}
.notice-state[data-timing="active"]{background:#e7e1d6;color:#5b381f}
.notice-state[data-timing="archived"]{background:#e3e5e7;color:#51565a}

.notice-card h3{
  margin:0 0 8px;
  color:var(--notice-ink);
  font:750 clamp(1.05rem,1.6vw,1.22rem)/1.14 var(--sans);
  letter-spacing:-.025em;
  text-wrap:pretty;
}

.notice-card__body>p{
  display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  margin:0;
  color:var(--notice-muted);
  font:450 .79rem/1.46 var(--sans);
}

.notice-card__actions{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:8px;
  min-height:46px;
  border-top:1px solid #e8e1d3;
  padding:7px 11px;
}

.notice-card__actions a,.notice-open{
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:4px;
  text-decoration:none;
  font:750 .67rem/1.2 var(--sans);
}

.notice-open{
  display:none;
  border:1px solid #cbbfac;
  background:transparent;
  color:#5f2734;
  padding:0 9px;
  cursor:pointer;
}
.notice-js .notice-open{display:inline-flex}
.notice-open:hover{border-color:#74233a;background:#fbf3ef}
.notice-card__actions a{
  justify-self:end;
  color:#701b31;
  padding:0 4px;
  text-align:right;
}
.notice-card__actions a:hover{text-decoration:underline;text-underline-offset:3px}

.notice-empty{
  position:relative;
  z-index:4;
  align-self:center;
  justify-self:center;
  width:min(100%,390px);
  margin:auto;
  border:1px solid rgba(255,255,255,.5);
  border-radius:6px;
  background:rgba(67,7,20,.72);
  color:#fff;
  padding:28px;
  text-align:center;
  box-shadow:0 16px 34px rgba(40,2,11,.28);
}
.notice-empty[hidden]{display:none}
.notice-empty h3{margin:0 0 8px;color:#fff;font:600 1.5rem/1.2 var(--display)}
.notice-empty p{margin:0 0 18px;color:rgba(255,255,255,.75);font:.9rem/1.5 var(--sans)}
.notice-empty button{min-height:44px;border-radius:4px;background:#fff;color:#651027;padding:0 16px;font-weight:800}

.notice-board-frame[data-view="list"] .notice-canvas{
  min-height:0;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));
}
.notice-board-frame[data-view="list"] .notice-card{
  position:relative!important;
  inset:auto!important;
  transform:none!important;
}
.notice-board-frame[data-view="list"] .notice-paper,.notice-board-frame[data-view="list"] .notice-card::before{transform:none}
.notice-board-frame[data-view="list"] .notice-card__drag{cursor:default;touch-action:manipulation}

.notice-source-note{
  display:grid;
  gap:14px;
  margin-top:20px;
  border-left:4px solid var(--crimson);
  background:var(--field);
  padding:18px 20px;
}
.notice-source-note p{max-width:78ch;margin:0;color:var(--slate);font:.9rem/1.55 var(--sans)}
.notice-source-note strong{color:var(--ink)}
.notice-source-note a{align-self:center;color:var(--crimson);font:750 .84rem/1.3 var(--sans);text-underline-offset:3px}

.notice-dialog{
  width:min(680px,calc(100% - 28px));
  max-height:min(82dvh,760px);
  overflow:auto;
  overscroll-behavior:contain;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--notice-ink);
  padding:0;
  box-shadow:0 30px 90px rgba(4,9,36,.42);
}
.notice-dialog::backdrop{background:rgba(4,9,36,.68);backdrop-filter:blur(5px)}
.notice-dialog__paper{
  border:1px solid var(--notice-paper-edge);
  background:
    linear-gradient(90deg,rgba(126,102,62,.026) 1px,transparent 1px),
    linear-gradient(rgba(126,102,62,.022) 1px,transparent 1px),
    var(--notice-paper);
  background-size:24px 24px;
}
.notice-dialog__top{
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border-bottom:1px dashed #d1c5b2;
  padding:8px 14px 8px 20px;
  color:#6a2636;
  font:800 .7rem/1.2 var(--sans);
  letter-spacing:.075em;
  text-transform:uppercase;
}
.notice-dialog__top button{
  min-width:64px;
  min-height:38px;
  border:1px solid #c7b9a4;
  border-radius:4px;
  background:transparent;
  color:#5d2734;
  font:750 .75rem/1 var(--sans);
  cursor:pointer;
}
.notice-dialog__top button:hover{background:#f4ece1;border-color:#713147}
.notice-dialog__content{padding:clamp(24px,6vw,52px)}
.notice-dialog__date{margin:0 0 8px;color:#8a6c52;font:750 .76rem/1.3 var(--sans);letter-spacing:.05em}
.notice-dialog h2{max-width:18ch;margin:0 0 16px;color:var(--notice-ink);font:600 clamp(1.8rem,5vw,3rem)/1.04 var(--display);letter-spacing:-.035em;text-wrap:balance}
.notice-dialog__summary{max-width:56ch;margin:0 0 24px;color:#464a54;font:550 1rem/1.56 var(--sans)}
.notice-dialog ul{display:grid;gap:10px;margin:0 0 28px;padding:0;list-style:none}
.notice-dialog li{position:relative;padding-left:20px;color:#52555d;font:.92rem/1.58 var(--sans)}
.notice-dialog li::before{content:"";position:absolute;left:0;top:.68em;width:7px;height:7px;border-radius:50%;background:var(--notice-red)}
.notice-dialog__source{min-height:46px;display:inline-flex;align-items:center;border-radius:4px;background:var(--notice-red);color:#fff;padding:0 18px;text-decoration:none;font:800 .8rem/1.2 var(--sans)}
.notice-dialog__source:hover{background:var(--notice-red-deep)}

@media(min-width:620px){
  .notice-toolbar{grid-template-columns:minmax(230px,1fr) minmax(180px,.7fr)}
  .notice-view,.notice-reset{grid-row:2}
  .notice-view{grid-column:1}
  .notice-reset{grid-column:2}
  .notice-source-note{grid-template-columns:1fr auto;align-items:center}
  .notice-tab__full{display:inline}
  .notice-tab__short{display:none}
}

@media(min-width:760px){
  .notice-controls__top{grid-template-columns:minmax(0,1fr) minmax(260px,420px);align-items:end}
  .notice-controls__hint{justify-self:end}
  .notice-toolbar{grid-template-columns:minmax(250px,1.2fr) minmax(190px,.8fr) 190px 150px}
  .notice-view,.notice-reset{grid-row:auto;grid-column:auto}
  .notice-drag-help{display:block}
}

@media(min-width:900px){
  .notice-board-frame{padding:24px;border-radius:12px}
  .notice-canvas{min-height:960px;display:block;padding:0}
  .notice-card{
    position:absolute;
    left:var(--board-x);
    top:var(--board-y);
    width:clamp(238px,24%,292px);
    will-change:auto;
  }
  .notice-card.is-dragging{will-change:transform}
  .notice-card__drag{cursor:grab}
  .notice-card__drag[aria-disabled="true"]{cursor:default}
  /* Carved wooden pegs that fix the felt into the frame corners. */
  .notice-board-corner{
    position:absolute;
    z-index:4;
    display:block;
    width:15px;
    height:15px;
    border-radius:50%;
    background:radial-gradient(circle at 37% 31%,#a6703f 0 12%,#7c4c2b 42%,#4a2c19 78%,#2a160c 100%);
    box-shadow:
      inset -1px -1px 2px rgba(20,10,4,.7),
      inset 1px 1px 1.5px rgba(255,240,220,.35),
      0 1px 2px rgba(0,0,0,.35);
    pointer-events:none;
  }
  .notice-board-corner--tl{left:5px;top:5px}
  .notice-board-corner--tr{right:5px;top:5px}
  .notice-board-corner--br{right:5px;bottom:5px}
  .notice-board-corner--bl{left:5px;bottom:5px}
  .notice-board-frame[data-view="list"] .notice-canvas{min-height:0;display:grid}
}

@media(min-width:1180px){
  .notice-canvas{min-height:920px}
  /* Cards scale with the now full-width board so the corkboard reads filled,
     not a scatter of small cards; capped so content never stretches. */
  .notice-card{width:clamp(276px,19%,340px)}
}

@media(max-width:899px){
  .notice-card,.notice-card[style]{transform:none!important}
  .notice-card::before{transform:none}
  .notice-paper{transform:none}
  .notice-card:hover .notice-paper{transform:translateY(-2px)}
  .notice-card__drag small{display:none}
  .notice-reset{display:none}
}

@media(prefers-reduced-motion:reduce){
  .notice-paper,.notice-tabs button,.notice-card__drag small{transition:none!important}
  .notice-card:hover .notice-paper,.notice-card.is-dragging .notice-paper{transform:rotate(var(--paper-tilt))}
  .notice-dialog::backdrop{backdrop-filter:none}
}

@media(prefers-contrast:more){
  .notice-paper{border-width:2px}
  .notice-card__body>p{color:#343740}
  .notice-search input,.notice-audience select,.notice-tabs button,.notice-reset{border-width:2px}
}