/* The purpose directory: aged parchment, navy enamel and engraved brass. */
:is(.right,.center) .purpose-panel{
  position:relative;isolation:isolate;container-type:inline-size;
  padding:6px;margin:0;border:1px solid #5b3918;border-radius:7px;
  clip-path:none;overflow:visible;
  background:linear-gradient(90deg,#89612d,#f0cc76 2%,#7e521c 4%,#f2d490 50%,#7e521c 96%,#edc46c 98%,#89612d);
  box-shadow:inset 0 0 0 1px #ebcf8b,0 3px 6px #39220d66;
}
:is(.right,.center) .purpose-panel::before{
  content:"";position:absolute;inset:3px;z-index:4;border:1px solid #69431d;border-radius:4px;
  box-shadow:0 0 0 1px #f3d996,inset 0 0 0 1px #dfb85f;pointer-events:none;background:none;
}
:is(.right,.center) .purpose-panel::after{content:none}
.purpose-corner{position:absolute;z-index:5;width:28px;height:28px;background:url("../images/feature-corner-v2.png") center/contain no-repeat;pointer-events:none}
.purpose-corner--tl{left:-2px;top:-2px}.purpose-corner--tr{right:-2px;top:-2px;transform:scaleX(-1)}
.purpose-corner--bl{left:-2px;bottom:-2px;transform:scaleY(-1)}.purpose-corner--br{right:-2px;bottom:-2px;transform:scale(-1)}
:is(.right,.center) .purpose-panel .panel-title{
  display:flex;align-items:center;gap:10px;min-height:51px;margin:0;padding:4px 12px 4px 8px;
  border:0;border-bottom:2px solid #b88c39;border-radius:2px 2px 0 0;
  color:#fff2cf;font:700 clamp(18px,7.5cqw,23px)/1.3 var(--reading-font);
  background:linear-gradient(100deg,#06334ff2,#062e50eb),url("../images/feature-heading-wood-v1.png") center/cover;
  box-shadow:inset 0 1px #f0d184,inset 0 0 0 1px #b58c3b;
  text-shadow:0 2px 2px #001321;
}
:is(.right,.center) .purpose-panel .panel-title::before,:is(.right,.center) .purpose-panel .panel-title::after{content:none}
.purpose-panel .panel-title img{display:block;width:37px;height:40px;object-fit:contain;filter:drop-shadow(0 2px 1px #00101c80)}
:is(.right,.center) .purpose-panel .side-section{
  display:grid;gap:5px;padding:7px 7px 10px;
  background:linear-gradient(90deg,#fff9e336,#fff9e28c 45%,#fff7df30),url("../images/quest-parchment-v2.png") center/100% 100%;
}
:is(.right,.center) .purpose-panel .side-link{
  position:relative;display:grid;grid-template-columns:25px minmax(0,1fr) 10px;
  align-items:center;gap:8px;min-height:50px;margin:0;padding:8px 8px;
  border:1px solid #b7995e;border-radius:7px;
  background:linear-gradient(110deg,#fffdf35c,#fff8de36 60%,#dabc7c1a);
  box-shadow:inset 0 0 0 1px #fff9e6b3,0 1px 1px #76552826;
  color:#533b21;font:700 clamp(13px,5.3cqw,16px)/1.5 var(--reading-font);
  text-shadow:0 1px #fffae6;
  translate:0 0;
  transition:translate .45s var(--interaction-ease),background-color .45s ease,box-shadow .45s ease,color .45s ease;
}
:is(.right,.center) .purpose-panel .side-link::before{content:none}
:is(.right,.center) .purpose-panel .side-link::after{content:"›";font:700 25px/1 Georgia,serif;color:#69461e;justify-self:center}
.purpose-icon{width:25px;height:29px;fill:none;stroke:#6c4b24;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px #fffae1)}
@media(hover:hover) and (pointer:fine){
  :is(.right,.center) .purpose-panel .side-link:hover{translate:3px 0;color:#3f2b16;background-color:#f6d99450;box-shadow:inset 0 0 0 1px #fff9e5,0 0 7px #b9934330}
}
:is(.right,.center) .purpose-panel .side-link:focus-visible{outline:2px solid #185579;outline-offset:1px}
@media(prefers-reduced-motion:reduce){:is(.right,.center) .purpose-panel .side-link,:is(.right,.center) .purpose-panel .side-link:hover{translate:none;transition:none}}
/* Compact news ledger and the navy return medallion. */
.news-and-top{margin-top:16px;min-width:0}
.news-board{
  position:relative;padding:18px 28px 24px;color:#4d3822;
  background:url("../images/quest-parchment-cutout-v3.png") center/100% 100% no-repeat;
  filter:drop-shadow(0 3px 2px #49301455);
}
.news-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 0 7px}
.news-heading h2{display:flex;align-items:center;gap:6px;margin:0;font:700 20px/1.4 var(--reading-font);color:#463017;text-shadow:0 1px #fff6d6}
.news-heading h2 img{width:29px;height:34px;object-fit:contain;filter:drop-shadow(0 1px 1px #49301440)}
.news-heading>a{color:#634923;font:700 12px/1.4 var(--reading-font);white-space:nowrap;text-decoration:none;text-shadow:0 1px #fff7df;transition:color .4s ease}
.news-heading>a span{display:inline-block;transition:translate .4s ease}
.news-heading>a:hover{color:#153f60}.news-heading>a:hover span{translate:2px 0}
.news-list{
  list-style:none;margin:0;padding:0;
  border:0;border-radius:0;background:none;box-shadow:none;
}
.news-list li{padding:0;color:#4e4435;font:500 13px/1.55 var(--reading-font)}
.news-list li+li{border-top:1px dashed #b29b6b80}
.news-list time{display:block;color:#735f40;font-size:12px;font-variant-numeric:tabular-nums;line-height:1.5}
.news-list span{display:block}
.back-to-top{
  position:fixed;z-index:50;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));width:62px;height:62px;
  display:grid;place-items:center;padding:16px;border:0;background:url("../images/back-to-top-medallion.svg") center/contain no-repeat;
  cursor:pointer;filter:drop-shadow(0 3px 2px #2d1b0c80);
  transition:filter .45s ease;
}
.back-to-top svg{width:29px;height:29px;fill:none;stroke:#fff6d8;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 1px 2px #00152a);transition:translate .45s ease}
@media(hover:hover) and (pointer:fine){
  .back-to-top:hover{filter:brightness(1.2) drop-shadow(0 0 5px #6bb9db66)}
  .back-to-top:hover svg{translate:0 -2px}
}
.back-to-top:focus-visible,.news-heading>a:focus-visible{outline:2px solid #17608c;outline-offset:3px}
@media(max-width:1000px) and (min-width:681px){.news-and-top{margin-top:0}}
@media(prefers-reduced-motion:reduce){.back-to-top,.back-to-top svg,.news-heading>a,.news-heading>a span{transition:none}.back-to-top:hover svg,.news-heading>a:hover span{translate:none}}
/* News is printed directly on the paper, with room for its torn edges. */
.news-link{display:grid;grid-template-columns:minmax(0,1fr) 12px;align-items:center;gap:9px;padding:9px 2px;color:#4e4435;text-decoration:none;background:none}
.news-link__copy{min-width:0;overflow-wrap:break-word}
.news-link b{font:700 25px/1 Georgia,serif;color:#69461e;justify-self:center;transition:translate .45s ease}
.news-link__copy>span{text-decoration:underline solid transparent;text-decoration-thickness:1px;text-underline-offset:3px;transition:color .45s ease,text-decoration-color .45s ease}
@media(hover:hover) and (pointer:fine){.news-link:hover .news-link__copy>span{color:#174b70;text-decoration-color:#98703b}.news-link:hover b{translate:2px 0}}
.news-link:focus-visible{outline:2px solid #17608c;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.news-link b,.news-link__copy>span{transition:none}.news-link:hover b{translate:none}}

@media(max-width:600px){.back-to-top{right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));width:56px;height:56px;padding:14px}}
/* Four individually weathered boards on one heavy post; lettering stays live HTML. */
.news-board--standing{
  position:relative;isolation:isolate;width:100%;max-width:380px;aspect-ratio:7/11;min-height:440px;
  margin:0 auto;padding:0;border:0;border-radius:0;box-shadow:none;
  background:url("../images/news-plank-sign-grass-v4.png") center/100% 100% no-repeat;
  filter:drop-shadow(0 4px 3px #41270e3b);
}
.news-board--standing::before,.news-board--standing::after{content:none}
.news-board--standing .news-heading{
  position:absolute;left:13%;right:11%;top:13%;height:9.5%;min-height:0;
  padding:0;gap:7px;
}
.news-board--standing .news-heading h2{color:#fff0cf;font-size:20px;letter-spacing:.04em;text-shadow:0 2px 1px #241208}
.news-board--standing .news-heading>a{color:#f4dfb8;font-size:12px;text-shadow:0 1px 2px #241208}
.news-board--standing .news-heading>a:hover{color:#fff9e8}
.news-board--standing .news-list{display:contents;background:none;border:0;box-shadow:none;filter:none;padding:0;margin:0}
.news-board--standing .news-list::before,.news-board--standing .news-list::after{content:none}
.news-board--standing .news-list li{
  position:absolute;left:11%;right:10%;height:18%;padding:0;border:0;
}
.news-board--standing .news-list li:nth-child(1){top:25%}
.news-board--standing .news-list li:nth-child(2){top:45.5%}
.news-board--standing .news-list li:nth-child(3){top:66%}
.news-board--standing .news-link{height:100%;padding:0;gap:7px;color:#fff0cf;text-shadow:0 1px 2px #1e1008,0 0 3px #2c180d}
.news-board--standing .news-list time{color:#e8c68d;font-size:12px;line-height:1.5;margin-bottom:2px}
.news-board--standing .news-link__copy>span{font-size:13px;line-height:1.6;font-weight:500}
.news-board--standing .news-link b{color:#f5d390;text-shadow:0 2px 1px #241208}
@media(hover:hover) and (pointer:fine){
  .news-board--standing .news-link:hover .news-link__copy>span{color:#fff9ea;text-decoration-color:#e8c483}
}
.news-board--standing .news-link:focus-visible,.news-board--standing .news-heading>a:focus-visible{outline-color:#ffe1a1}

/* In the two-column layout, news follows the quest and the directory fills the main column. */
@media(max-width:1240px){
  .quest-sidebar .news-and-top{margin:20px auto 0;width:100%}
  .center>.purpose-panel{width:100%;margin:18px 0 0}
  .portal-grid>.right:empty{display:none}
}
/* A personal guide welcomes visitors above the purpose directory. */
.manager-card{
  position:relative;isolation:isolate;min-width:0;margin:0 0 16px;padding:8px 9px 10px;
  border:2px solid #704719;border-radius:6px;
  background:linear-gradient(155deg,#0d4c75,#06294a 58%,#031a32);
  box-shadow:inset 0 0 0 2px #d5a84f,inset 0 0 0 4px #5d3e1b,0 3px 5px #3d250e66;
}
.manager-card__corner{position:absolute;z-index:4;width:28px;height:28px;background:url("../images/feature-corner-v2.png") center/contain no-repeat;pointer-events:none}
.manager-card__corner--tl{left:-4px;top:-4px}.manager-card__corner--tr{right:-4px;top:-4px;transform:scaleX(-1)}
.manager-card__corner--bl{left:-4px;bottom:-4px;transform:scaleY(-1)}.manager-card__corner--br{right:-4px;bottom:-4px;transform:scale(-1)}
.manager-card__intro{position:relative;display:grid;grid-template-columns:44% minmax(0,1fr);align-items:center;min-height:185px}
.manager-card__character{position:absolute;z-index:3;bottom:-4px;left:-25px;width:55%;height:225px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 2px 2px #00132199);pointer-events:none}
.manager-card__speech{grid-column:2;position:relative;z-index:2;padding:14px 9px;border:1px solid #d8bd7c;border-radius:5px;background:linear-gradient(145deg,#061c35,#021329);box-shadow:inset 0 0 0 2px #071d31,0 1px 2px #00121d;text-shadow:0 1px 1px #00101c}
.manager-card__speech h2{margin:0 0 8px;color:#fff3d5;font:700 clamp(15px,1.15vw,18px)/1.55 var(--reading-font)}
.manager-card__speech p{margin:0;color:#f2e5c6;font:500 13px/1.65 var(--reading-font)}
.manager-card__button{position:relative;z-index:4;display:flex;align-items:center;justify-content:center;gap:14px;min-height:53px;padding:8px 14px;border:2px solid #d5a64a;border-radius:6px;color:#fff6e1;text-decoration:none;background:linear-gradient(180deg,#e06b58 0%,#b12a25 20%,#8e171a 80%,#6b1016);box-shadow:inset 0 0 0 2px #742119,inset 0 1px #ffb68c,0 2px 2px #00142280;font:700 16px/1.4 var(--reading-font);text-shadow:0 2px #5b1010;transition:filter .45s ease,box-shadow .45s ease}
.manager-card__button b{font:700 25px/1 Georgia,serif;transition:translate .45s ease}
@media(hover:hover) and (pointer:fine){.manager-card__button:hover{filter:brightness(1.18);box-shadow:inset 0 0 0 2px #a43827,inset 0 1px #ffd0a8,0 0 9px #e6aa5c66}.manager-card__button:hover b{translate:3px 0}}
.manager-card__button:focus-visible{outline:2px solid #fff0a1;outline-offset:3px}
@media(max-width:1240px){.center>.manager-card{margin:20px 0 16px}.center>.purpose-panel{margin-top:0}}
@media(prefers-reduced-motion:reduce){.manager-card__button,.manager-card__button b{transition:none}.manager-card__button:hover b{translate:none}}
/* Crop the existing guide to a face-forward portrait while keeping the staff. */
.manager-card__portrait{position:absolute;z-index:3;left:-25px;bottom:-3px;width:58%;height:225px;overflow:hidden;pointer-events:none}
.manager-card__character{position:absolute;left:-19%;top:-18px;bottom:auto;width:155%;height:auto;max-width:none;object-fit:initial;filter:drop-shadow(0 2px 2px #00132199)}
/* The portrait stays within the card edge; the staff rises above its frame. */
.manager-card{z-index:2}
.manager-card__intro{z-index:2}
.manager-card__portrait{left:0;bottom:-4px;width:min(54%,155px);height:225px;overflow:visible;z-index:1}
.manager-card__character{left:0;top:auto;bottom:0;width:100%;height:auto}
.manager-card__speech{z-index:2}
/* The main column becomes two columns only when both panels have room. */
.secondary-pair{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;margin:20px 0 0}
.secondary-pair>.manager-card,.secondary-pair>.purpose-panel{width:100%;margin:0}
@container main-column (min-width:640px){
  .secondary-pair{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:16px}
}
