/* Phase 7: sharing and reliability — local-only, device-conscious */
.s7-hero{border-radius:24px;background:linear-gradient(115deg,#183d34,#416550);color:#fffdf3;padding:clamp(22px,3.4vw,40px);margin-bottom:20px;position:relative;overflow:hidden}
.s7-hero:after{content:'✧';font:normal 220px Georgia,serif;position:absolute;right:35px;top:-75px;color:#ffffff12;pointer-events:none}
.s7-hero .eyebrow{color:#f2d9ac}.s7-hero h3{font:normal clamp(27px,3.5vw,43px) Georgia,serif;margin:10px 0}.s7-hero p{font-size:14px;line-height:1.6;max-width:650px;color:#f3eee2;margin:0}
.s7-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.85fr);gap:16px;align-items:start}
.s7-panel{border:1px solid var(--line);border-radius:18px;background:#fffdf9;padding:clamp(16px,2.2vw,25px);min-width:0;box-shadow:var(--shadow);margin-bottom:16px}
.s7-panel h3{font:normal 26px Georgia,serif;color:var(--pine);margin:0 0 8px}.s7-panel p{font-size:13px;color:#657467;line-height:1.6}
.s7-safety{border-radius:13px;background:#eef3e9;padding:15px 18px;border-left:4px solid #6e9674;color:#334f3c;font-size:13px;line-height:1.65;margin:12px 0}
.s7-warning{border-radius:13px;background:#fff2e9;border:1px solid #f0d8c5;padding:14px 16px;color:#79583b;font-size:13px;line-height:1.65;margin:10px 0}
.s7-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:15px 0}.s7-stat{padding:12px;background:#f5f4ef;border-radius:11px}.s7-stat strong{font-size:18px;display:block;color:var(--pine)}.s7-stat span{font-size:11px;color:#758478}
.s7-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:15px}
.s7-checks{display:grid;gap:9px;margin:16px 0}.s7-check{display:flex;gap:10px;align-items:start;color:#485d4d;font-size:13px;line-height:1.55}.s7-check span{color:#3c7a54;font-size:19px}
.s7-shareoptions{display:grid;gap:12px;margin:15px 0}.s7-shareoptions label{display:flex;align-items:start;gap:10px;padding:12px;border-radius:10px;border:1px solid #e9e8e0;font-size:13px;line-height:1.5;cursor:pointer}.s7-shareoptions input{width:18px;height:18px;min-height:18px;flex-shrink:0;margin-top:2px;accent-color:var(--pine)}
.s7-preview{background:linear-gradient(135deg,#f8f0e6,#f5f6ed);border:1px solid #e6e3d8;border-radius:17px;padding:22px;text-align:center;margin:17px 0}.s7-preview .smallcaps{letter-spacing:2px;font-size:10px;color:#927e69;font-weight:800}.s7-preview h4{font:normal 29px Georgia,serif;color:var(--pine);margin:11px 0}.s7-swatches{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:16px 0}.s7-swatches span{display:block;width:29px;height:29px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #0002}
.s7-readonly{border-radius:11px;background:#f6f6f1;padding:12px;overflow-wrap:anywhere;font-size:12px;color:#58685b}
.s7-modal-backdrop{position:fixed;inset:0;background:#0e2019c9;z-index:1000;display:flex;justify-content:center;align-items:center;padding:20px;overflow:auto}
.s7-modal{width:min(620px,100%);max-height:90dvh;overflow:auto;border-radius:24px;background:white;padding:clamp(20px,4vw,32px);box-shadow:0 30px 90px #0005;outline:none}.s7-modal h3{font:normal 32px Georgia,serif;color:var(--pine);margin:0 0 9px}.s7-modal p{line-height:1.55;color:#5c6c60;font-size:14px}.s7-modal .s7-actions{justify-content:flex-end}
#s7RestoreFile{max-width:100%}.s7-alert{font-size:12px;font-weight:700;color:#975741}
.s7-settingslink{border:1px solid #dce5dc;background:#f0f5ed;padding:16px 18px;border-radius:16px;margin:18px 0;display:flex;gap:13px;align-items:center;flex-wrap:wrap}
.s7-settingslink p{font-size:12px;margin:4px 0 0;color:#6e7c70;flex:1}
:focus-visible{outline:3px solid #b07535!important;outline-offset:3px}
@media(max-width:850px){.s7-layout{grid-template-columns:minmax(0,1fr)}}
@media(max-width:420px){.s7-stats{grid-template-columns:1fr 1fr}.s7-stat strong{font-size:16px}.s7-panel{padding:15px}.s7-actions button{width:100%}}
@media(prefers-reduced-motion:reduce){.s7-hero *, .s7-panel *{animation:none!important;transition:none!important}}

/* Ensure selected navigation retains readable contrast across custom themes. */
#navigation .navbtn.active{background:#f8f1e3!important;color:#183d34!important}
/* Keep active navigation legible for every bride's selected theme color. */
.sidebar .navbtn.active{background:#f8f1e3!important;color:#183d34!important}
.sidebar .navbtn.active .navico{color:#183d34!important}