/* ── extra page styles ── */
.banner{height:180px;border-radius:var(--radius);overflow:hidden;margin-bottom:22px;background:color-mix(in srgb,var(--accent) 8%,var(--panel));position:relative;border:1px solid var(--line);cursor:pointer;}
.banner img{width:100%;height:100%;object-fit:cover;}
.side{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:14px;}
.side-portrait{width:100%;aspect-ratio:1/1;border-radius:var(--radius);overflow:hidden;background:color-mix(in srgb,var(--accent) 7%,var(--panel));border:1px solid var(--line);position:relative;display:flex;align-items:center;justify-content:center;color:var(--dim);font-size:.82rem;}
.side-portrait img{width:100%;height:100%;object-fit:cover;}
.upload-chip{width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;border:2px solid var(--panel);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;}
.side-portrait .upload-chip{position:absolute;bottom:8px;right:8px;}
.side-title,.side-tagline{border:none;background:transparent;color:var(--text);width:100%;text-align:center;}
.side-title{font-family:var(--font-display);font-weight:700;font-size:1.15rem;}
.side-tagline{font-size:.86rem;color:var(--dim);}
.side-divider{height:1px;background:var(--line);}
.layout{display:grid;grid-template-columns:220px 1fr;gap:22px;align-items:start;}
.content{min-width:0;}
.couple-headline{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:20px;flex-wrap:wrap;}
.char-name-inline{font-family:var(--font-display);font-weight:700;font-size:1.5rem;border:none;background:transparent;color:var(--ink);max-width:180px;}
.connector{font-family:var(--font-display);font-weight:300;font-size:1.5rem;color:var(--dim);border:none;background:transparent;width:36px;text-align:center;}
.profiles{display:grid;grid-template-columns:1fr 1fr;gap:28px;}
.pavatar-row{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.avatar-wrap{position:relative;}
.avatar{width:78px;height:78px;border-radius:50%;border:1px solid var(--line);background:color-mix(in srgb,var(--accent) 6%,var(--panel));display:flex;align-items:center;justify-content:center;color:var(--dim);font-size:.72rem;overflow:hidden;}
.avatar img{width:100%;height:100%;object-fit:cover;}
.avatar-wrap .upload-chip{position:absolute;bottom:-2px;right:-2px;width:26px;height:26px;font-size:.85rem;}
.ptitle{font-family:var(--font-display);font-weight:600;font-size:1.1rem;border:none;background:transparent;color:var(--ink);}
.info-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--line);}
.info-row .k{width:72px;color:var(--dim);font-size:.88rem;border:none;background:transparent;}
.info-row .v{flex:1;font-size:.88rem;border:none;background:transparent;color:var(--ink);}
.info-row .del{color:var(--dim);font-size:.8rem;flex:none;}
/* gallery */
.gal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;}
.gal-item{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--panel);position:relative;cursor:pointer;}
.gal-item img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;}
.gal-item .cap{width:100%;border:none;background:transparent;padding:8px;font-size:.84rem;color:var(--dim);}
.gal-item .del{position:absolute;top:6px;right:6px;background:rgba(0,0,0,.5);color:#fff;border-radius:50%;width:22px;height:22px;font-size:.75rem;display:none;align-items:center;justify-content:center;}
.gal-item:hover .del{display:flex;}
.gal-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:140px;color:var(--dim);border:1px dashed var(--line);border-radius:var(--radius);}
/* quotes */
.quote-block{border-left:2px solid var(--accent);padding:4px 0 4px 18px;margin-bottom:20px;position:relative;}
.qtext{width:100%;border:none;background:transparent;color:var(--ink);resize:none;overflow:hidden;font-family:var(--font-display);font-weight:500;font-size:1.1rem;line-height:1.55;}
.qmeta{display:flex;gap:8px;margin-top:6px;}
.qwho{border:none;background:transparent;color:var(--dim);font-size:.86rem;width:120px;}
.qctx{border:none;background:transparent;color:var(--dim);font-size:.86rem;flex:1;font-style:italic;}
.quote-block .del{position:absolute;top:0;right:0;border:none;background:none;color:var(--dim);cursor:pointer;font-size:.82rem;}
/* rp */
.rp-composer{border:1px solid var(--line);border-radius:var(--radius);padding:14px;margin-bottom:22px;background:var(--panel);}
.rp-c-head{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.rp-c-ava{width:38px;height:38px;border-radius:50%;background:color-mix(in srgb,var(--accent) 8%,var(--panel));border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--dim);font-size:.72rem;overflow:hidden;flex:none;}
.rp-c-ava img{width:100%;height:100%;object-fit:cover;}
.who-sel{padding:7px 10px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink);font-family:var(--font-display);font-weight:600;}
.rp-composer textarea{width:100%;border:none;background:transparent;color:var(--ink);resize:none;overflow:hidden;font-size:.98rem;line-height:1.65;min-height:44px;}
.rp-c-foot{display:flex;justify-content:flex-end;border-top:1px solid var(--line);padding-top:10px;margin-top:4px;}
.rp-feed{display:flex;flex-direction:column;}
.rp-post{display:flex;gap:12px;padding:16px 2px;border-bottom:1px solid var(--line);}
.rp-ava{width:40px;height:40px;border-radius:50%;flex:none;border:1px solid var(--line);background:color-mix(in srgb,var(--accent) 8%,var(--panel));display:flex;align-items:center;justify-content:center;color:var(--dim);font-size:.72rem;overflow:hidden;}
.rp-ava img{width:100%;height:100%;object-fit:cover;}
.rp-body{flex:1;min-width:0;}
.rp-meta{display:flex;align-items:baseline;gap:7px;margin-bottom:3px;}
.rp-name{font-family:var(--font-display);font-weight:600;font-size:.96rem;}
.rp-time{font-size:.8rem;color:var(--dim);}
.rp-del{margin-left:auto;border:none;background:none;color:var(--dim);cursor:pointer;font-size:.8rem;opacity:0;transition:opacity .15s;}
.rp-post:hover .rp-del{opacity:1;}
.rp-text{width:100%;border:none;background:transparent;color:var(--ink);resize:none;overflow:hidden;font-size:.96rem;line-height:1.7;}
/* trpg */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:10px;margin-bottom:14px;}
.stat{border:1px solid var(--line);border-radius:10px;padding:12px 10px;text-align:center;position:relative;background:var(--panel);}
.stat .sv{width:100%;border:none;background:transparent;color:var(--ink);font-size:1.4rem;font-weight:700;text-align:center;display:block;}
.stat .sn{width:100%;border:none;background:transparent;color:var(--dim);font-size:.76rem;text-align:center;display:block;margin-top:2px;}
.stat .del{position:absolute;top:-7px;right:-7px;width:18px;height:18px;border-radius:50%;background:#b4524a;color:#fff;font-size:.65rem;display:none;align-items:center;justify-content:center;}
body.editing .stat:hover .del{display:flex;}
.log{border:1px solid var(--line);border-radius:var(--radius);padding:14px;margin-bottom:10px;position:relative;background:var(--panel);}
.ldate{font-size:.82rem;color:var(--dim);border:none;background:transparent;margin-bottom:4px;}
.ltitle{font-family:var(--font-display);font-weight:600;font-size:1rem;border:none;background:transparent;color:var(--ink);display:block;width:100%;}
.log textarea{width:100%;border:none;background:transparent;color:var(--ink);resize:none;overflow:hidden;margin-top:6px;font-size:.9rem;line-height:1.6;}
.log .del{position:absolute;top:8px;right:10px;border:none;background:none;color:var(--dim);cursor:pointer;font-size:.82rem;}
.log-import{margin:6px 0 16px;padding:14px;border:1px dashed var(--line);border-radius:var(--radius);background:color-mix(in srgb,var(--accent) 3%,transparent);}
.log-import-desc{font-size:.85rem;color:var(--dim);line-height:1.6;margin-bottom:10px;}
.logbook-item{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius);margin-bottom:10px;background:var(--panel);cursor:pointer;transition:background .15s;}
.logbook-item:hover{background:color-mix(in srgb,var(--accent) 5%,var(--panel));}
.lb-icon{font-size:1.25rem;flex:none;}
.lb-body{flex:1;min-width:0;}
.lb-name{border:none;background:transparent;color:var(--ink);font-weight:600;font-size:.94rem;width:100%;}
.lb-meta{font-size:.78rem;color:var(--dim);margin-top:2px;}
.lb-del{flex:none;border:none;background:none;color:var(--dim);cursor:pointer;font-size:.84rem;padding:4px 8px;}
/* book viewer */
.book-overlay{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.4);backdrop-filter:blur(3px);padding:20px;}
.book-overlay.show{display:flex;}
.book{width:min(700px,96vw);height:min(82vh,840px);background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.25);overflow:hidden;}
.book-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line);}
.book-title{font-family:var(--font-display);font-weight:700;font-size:1rem;flex:1;}
.book-page{flex:1;overflow-y:auto;padding:22px 24px;line-height:1.85;}
.book-line{margin-bottom:12px;}
.book-line .who{font-family:var(--font-display);font-weight:600;margin-right:6px;}
.book-line.system{color:var(--dim);font-size:.86rem;font-style:italic;}
.book-nav{display:flex;align-items:center;gap:14px;justify-content:center;padding:12px 18px;border-top:1px solid var(--line);}
.book-count{font-size:.84rem;color:var(--dim);min-width:70px;text-align:center;}
/* timeline */
.tl-item{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);position:relative;}
.tl-item input[type=date]{border:none;background:transparent;color:var(--dim);font-size:.84rem;}
.tl-item .ev{flex:1;border:none;background:transparent;color:var(--ink);font-size:.94rem;}
.tl-item .del{border:none;background:none;color:var(--dim);cursor:pointer;font-size:.8rem;}
/* lightbox */
.lightbox{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.75);backdrop-filter:blur(4px);}
.lightbox.show{display:flex;}
.lightbox img{max-width:90vw;max-height:90vh;border-radius:8px;object-fit:contain;}
@media(max-width:860px){.layout{grid-template-columns:1fr;}.profiles{grid-template-columns:1fr;}}
@media(max-width:640px){.rp-del{opacity:1;}}

/* hs popup */
.hs-popup.show{display:flex!important;}