:root{color-scheme:light;--ink:#63313b;--wine:#a52f50;--muted:#884958;--paper:#fff9f7;--line:#e18b9f;--pink:#e85b83}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;padding:34px 22px;color:var(--ink);background:#ffd0df url("images/hearts%203.gif") repeat;font:13px/1.65 Verdana,sans-serif}button,a{-webkit-tap-highlight-color:#ffb1c7}button{font:inherit;color:inherit}a{color:var(--wine);text-underline-offset:3px}:focus-visible{outline:3px solid #b82d51;outline-offset:4px}img{max-width:100%;height:auto}.skip-link{position:absolute;top:-100px;left:20px;padding:12px;background:#fff;z-index:10}.skip-link:focus{top:5px}
.registry-header{max-width:1100px;margin:auto;background:#fff7f8 url("images/hearts%203.gif") repeat}.browser-bar{height:24px;background:var(--pink)}.registry-header header{padding:30px 18px 24px;text-align:center;border-bottom:1px solid var(--line)}.eyebrow{margin:0 0 8px;font:10px/1.7 "Courier New",monospace;letter-spacing:1.7px;text-transform:uppercase}.registry-header h1{margin:0;color:var(--wine);font:italic 28px/1 Georgia,"Times New Roman",serif;text-shadow:2px 2px #fff}.registry-header h1 span{display:block;margin-top:5px;font:64px/.95 Georgia,"Times New Roman",serif;font-style:normal;letter-spacing:-3px}.registry-header header>p:last-of-type{margin:17px 0 7px;color:var(--muted);font:italic 16px/1.5 Georgia,serif}.header-ornament{color:#bb4667;font-size:14px;letter-spacing:3px}.registry-header nav{display:flex;background:#ffd0dd;border-top:1px solid #fff;border-bottom:3px double var(--line)}.registry-header nav a{flex:1;min-height:44px;padding:11px;text-align:center;text-decoration:none;border-inline:1px solid #fff6fa;font:bold 11px/22px Verdana,sans-serif}.registry-header nav a:hover,.registry-header nav a[aria-current]{background:#fff6f9}
/* The legacy intro remains, but becomes a compact registry banner. */
.page{max-width:1100px;margin:auto;padding:20px 24px 6px;text-align:center;background:rgba(255,249,247,.72)}.page>img:first-child{display:block;width:min(100%,540px);height:auto;margin:auto}.page>p{margin:10px 0;color:var(--muted);font:italic 14px/1.5 Georgia,serif}
.kin-registry{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1100px;margin:auto;padding:22px 24px;background:rgba(255,249,247,.72)}
.kin{position:relative;display:flex;min-width:0;padding:16px 14px 13px;flex-direction:column;align-items:center;text-align:center;border:3px double var(--line);background:linear-gradient(145deg,#fff9f7,#ffe2eb);box-shadow:4px 4px 0 #efb4c6}.kin::before{content:attr(data-fandom);align-self:stretch;margin:-5px 0 10px;color:var(--muted);font:9px/1.6 "Courier New",monospace;letter-spacing:1px;text-transform:uppercase}.kin::after{content:"SWEETHEARTS SOCIETY MEMBERSHIP CARD";align-self:stretch;margin-top:auto;padding-top:10px;border-top:1px dashed var(--line);color:var(--wine);font:bold 8px/1.6 "Courier New",monospace;letter-spacing:.8px}.kin>.image-button{display:block;width:150px;height:150px;margin:0 auto 10px;padding:5px;overflow:hidden;border:1px solid var(--line);border-radius:0;background:#ffd8e5;box-shadow:2px 2px 0 #e9a3ba;cursor:pointer}.kin>.image-button:hover{transform:translateY(-2px);box-shadow:3px 4px 0 #e9a3ba}.kin>.image-button img{display:block;width:100%;height:100%;object-fit:cover}.kin>p{min-height:45px;margin:0 0 11px;color:var(--wine);font:bold 12px/1.45 Verdana,sans-serif}.kin:has(.kin-card:not(.hidden)){grid-column:1/-1}.hidden{display:none!important}
.kin-card{width:100%;margin:6px 0 12px;padding:18px;border:1px solid var(--line);background:#fffaf7;text-align:left;box-shadow:inset 0 0 0 4px #ffe8ef}.now-playing{text-align:center;font:10px/1.65 "Courier New",monospace;color:var(--muted)}.now-playing>span{color:var(--wine);font-weight:bold}.controls{margin-top:10px;text-align:center}.controls>button{min-width:42px;min-height:38px;margin:3px;padding:5px 9px;border:1px solid var(--line);border-radius:0;background:#ffe0ea;cursor:pointer}.controls>button:hover,.controls>button.loop-active{background:#ffb8cd}.photo-row{display:grid;grid-template-columns:minmax(140px,32%) 1fr;gap:20px;align-items:start;margin:15px 0}.offset-left{display:block;width:100%;max-height:360px;object-fit:contain;border:3px double var(--line);background:#f8dbe5}.photo-text{padding:8px 12px;border-left:3px double var(--line);text-align:left;font:12px/1.5 Verdana,sans-serif}.photo-text p{margin:0 0 7px}.kin-card>p{text-align:center}.april-inline{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:5px;margin:18px 0 8px;padding:9px;border:1px dashed var(--line);background:#ffe9f0}.april-text{font:bold 24px/1 Georgia,serif;color:var(--wine)}.small-num{font:13px/1 "Courier New",monospace;color:#790000}.april-button{padding:0;border:0;background:transparent;cursor:pointer}.april-gif{display:block;width:24px}.DISCLAIMER{display:block;margin:12px 0;padding:10px;border:2px solid #b72747;background:#ffe2e7;color:#8e1532;font:bold 16px/1.4 Verdana,sans-serif;text-align:center;text-decoration:underline}.kin audio{display:none}
body>img[src*="heart-line"]{display:block;width:min(1050px,calc(100% - 30px));height:auto;margin:0 auto}.registry-footer{max-width:1100px;margin:auto;padding:20px 15px;text-align:center;background:transparent;font:10px/1.8 "Courier New",monospace}.registry-footer p{margin:0 0 3px;font:italic 19px/1.5 Georgia,serif}.registry-footer a{display:block;width:max-content;margin:5px auto 0;padding:8px}
@media(max-width:850px){.kin-registry{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){body{padding:13px 10px}.registry-header header{padding:24px 12px 18px}.registry-header h1 span{font-size:clamp(42px,12vw,58px)}.registry-header header>p:last-of-type{font-size:14px}.page{padding:14px 12px 4px}.kin-registry{grid-template-columns:1fr;padding:14px 12px;gap:14px}.kin:has(.kin-card:not(.hidden)){grid-column:auto}.kin>.image-button{width:140px;height:140px}.kin-card{padding:12px}.photo-row{grid-template-columns:1fr}.offset-left{max-height:330px}.photo-text{border-left:0;border-top:3px double var(--line);padding:10px 3px}.controls>button{min-width:40px}.registry-header nav{flex-wrap:wrap}.registry-header nav a{padding:9px 7px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}body,.registry-header{background-image:none}.kin>.image-button:hover{transform:none}}
