/* Quiet velvet folds; no extra bitmap downloads or continuous texture animation. */
body{
 background-color:#0e0b0f;
 background-image:
  repeating-linear-gradient(98deg,#f6cfdf03 0px,#f6cfdf03 1px,transparent 1px,transparent 4px),
  radial-gradient(ellipse at 48% 30%,#09090d90 0%,transparent 58%),
  linear-gradient(108deg,#100c1100 4%,#4b192422 15%,#09090c55 26%,#33131e25 42%,#0c0b1080 56%,#3d14232b 76%,#08090b55 91%);
 background-size:4px 6px,100% 100%,100% 1100px;
}
footer{
 background-color:#100b11;
 background-image:repeating-linear-gradient(98deg,#f6cfdf03 0px,#f6cfdf03 1px,transparent 1px,transparent 4px),radial-gradient(ellipse at 50% 5%,#4b13252b,transparent 65%),linear-gradient(108deg,#0a090d55,#2c101c25 38%,#09090d55 75%);
 background-size:4px 6px,100% 100%,100% 100%;
}
/* Keep the word itself centered and the existing emblem offset to its left. */
.topbar>.brand>img,footer .footer-top>.brand>img{filter:drop-shadow(0 0 7px #ba173753) drop-shadow(0 0 18px #7b0d293b)}
.brand .brand-wordmark{display:inline-block;font-size:inherit;letter-spacing:inherit;font-weight:500;font-style:normal;color:#f1edef;text-shadow:0 1px 1px #050509,0 0 15px #d7ced320}
@supports(background-clip:text){
 .brand .brand-wordmark{background:linear-gradient(180deg,#fffdfc 9%,#e4dce2 40%,#bcb2bc 52%,#f5edef 65%,#d5c6d1 100%);background-clip:text;-webkit-background-clip:text;color:transparent;text-shadow:none}
}
/* Red light remains on the rim instead of changing skin tones. */
.portrait-open{transition:border-color .3s,box-shadow .35s,transform .18s}
.portrait-open:before{content:'';position:absolute;inset:0;z-index:2;border-radius:inherit;padding:3px;background:radial-gradient(ellipse at 50% 0%,#ffe0e6 0%,#ec5473 16%,#d3244955 36%,transparent 68%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;opacity:0;pointer-events:none;transition:opacity .35s}
.portrait-open.is-spotlit,.portrait-open:focus-visible{border-color:#dd6b80;box-shadow:0 -6px 24px #c6254b40,0 0 0 3px #180b13,0 0 0 4px #a24057}
.portrait-open.is-spotlit:before,.portrait-open:focus-visible:before{opacity:1}
@media(hover:hover){.portrait-open:hover{border-color:#dd6b80;box-shadow:0 -6px 24px #c6254b40,0 0 0 3px #180b13,0 0 0 4px #a24057}.portrait-open:hover:before{opacity:1}}
.portrait-dialog[open] .profile-grid>img{border-color:#cb6178;box-shadow:0 -7px 26px #c6254b2b;animation:portrait-welcome .7s ease-out}
@keyframes portrait-welcome{from{box-shadow:0 -8px 34px #e3396966}to{box-shadow:0 -7px 26px #c6254b2b}}
/* A final line below the social links, with a restrained thorn flourish. */
.story-epilogue{position:relative;text-align:center;margin:0 auto 48px;padding:28px 15px 36px;max-width:640px}
.story-epilogue p{font-size:clamp(14px,1.5vw,19px);font-weight:500;letter-spacing:.16em;line-height:2.2;color:#e7cbd4;text-shadow:0 2px 0 #491226;margin:0;text-wrap:balance}
.story-epilogue:after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:min(210px,65%);height:24px;background:url('../img/thorn-title.svg') center/100% 100% no-repeat;opacity:.7}
@media(max-width:700px){.story-epilogue{padding:22px 0 33px;margin-bottom:36px}.story-epilogue p{font-size:14px;letter-spacing:.1em}.topbar>.brand>img,footer .footer-top>.brand>img{filter:drop-shadow(0 0 6px #ba173753) drop-shadow(0 0 13px #7b0d293b)}}
@media(prefers-reduced-motion:reduce){.portrait-dialog[open] .profile-grid>img{animation:none}.portrait-open,.portrait-open:before{transition:none}}
@media(forced-colors:active){.brand .brand-wordmark{background:none;color:CanvasText}}
.js .reveal{transition-duration:1.2s}
/* The close control owns its own row, including its keyboard-focus outline. */
.portrait-dialog{padding:18px 25px 25px;overflow-y:auto}
.portrait-dialog .portrait-close{position:static;display:block;width:fit-content;max-width:100%;min-height:44px;margin:0 0 22px auto;padding:10px 18px;line-height:1.4;box-shadow:none}
.portrait-dialog .portrait-close:focus-visible,#photo-dialog #close-photo:focus-visible{outline:2px solid #ed8b9e;outline-offset:3px}
#photo-dialog{padding:18px 18px 16px}
#photo-dialog #close-photo{position:static;display:block;width:fit-content;max-width:100%;min-height:44px;margin:0 0 20px auto;padding:10px 18px;line-height:1.4;box-shadow:none}
@media(max-width:700px){.portrait-dialog{padding:16px 18px 22px}.portrait-dialog .portrait-close{margin-bottom:20px}#photo-dialog{padding:16px 16px 18px}}
@media(prefers-reduced-motion:reduce){.js .reveal{transition:none}}
