.connection-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:28px}.connection-card{background:#fffaf5;color:#302b3e;border:1px solid #d7cec8;border-radius:20px;overflow:hidden;text-align:left;padding:0;cursor:pointer}.connection-card>img{width:100%;height:240px;object-fit:contain;background:#ebe5df}.connection-card>span{display:grid;gap:10px;padding:20px}.connection-card b{font-size:25px}.connection-card small,.connection-dates small{display:block;color:#615969}.connection-form{max-width:780px;margin-top:24px}.connection-pictures{border:0;padding:0;margin:20px 0}.connection-pictures>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}.connection-pictures label{display:block;position:relative;background:#eee7e1;border:2px solid transparent;border-radius:14px;padding:10px;cursor:pointer}.connection-pictures label:has(input:checked){border-color:#72548c;background:#e6dcec}.connection-pictures img{width:100%;height:160px;object-fit:contain}.connection-pictures input{width:auto}.connection-check{display:flex;gap:12px;align-items:flex-start;margin:18px 0}.connection-check input{width:20px;min-width:20px;height:20px}.connection-profile{display:flex;gap:28px;margin-top:24px;align-items:center}.connection-profile>img{width:160px;height:220px;object-fit:contain;background:#ede6e0;border-radius:16px}.connection-profile p{white-space:pre-wrap}.connection-columns{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}.connection-columns .form-card{min-width:0}.connection-dates article{border-top:1px solid #dcd4cf;padding:20px 0;display:grid;gap:8px}.connection-columns blockquote{margin:18px 0;border-left:3px solid #9275a3;padding:0 14px;overflow-wrap:anywhere}.connection-columns blockquote p{white-space:pre-wrap}.connection-columns textarea{min-height:110px}.connection-columns .secondary,.connection-form .secondary{white-space:normal}.companion-session .guide-header,.companion-session #session-learning,.companion-session .be-yourself,.companion-session #switch-training,.companion-session #portrait-reuse,.companion-session #portrait-delete{display:none!important}.connection-session-actions{margin:16px 0;display:flex;flex-wrap:wrap;gap:12px}.connection-columns small{line-height:1.6}.connection-form label,.connection-columns label{line-height:1.6}#connection-image{display:grid;gap:12px;margin:18px 0}#connection-image small{display:block}.connection-grid button:focus-visible,.connection-pictures label:focus-within{outline:3px solid #705088;outline-offset:3px}@media(max-width:760px){.connection-columns{grid-template-columns:1fr}.connection-profile{align-items:flex-start;gap:16px}.connection-profile>img{width:100px;height:160px}.connection-profile h2{font-size:28px}.connection-pictures img{height:120px}.connection-grid{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}}

.reminder-settings{margin:24px 0}.reminder-settings select,.reminder-settings input{max-width:360px}.reminder-settings form{display:grid;gap:12px;margin:16px 0}.reminder-settings button{width:fit-content;white-space:normal}.reminder-settings p{max-width:76ch}#companion-date-notice{border:1px solid #ae97bc;background:#f8f3fa;margin:20px 0}#companion-date-notice p{margin:12px 0}
.companion-session .scene-dialogue{display:flex;flex-direction:column;overflow:hidden}.companion-session #scene-line{overflow:auto;min-height:0;flex:1}.companion-session #scene-speaker,.companion-session .scene-dialogue .compose{flex-shrink:0}
.connection-status{margin:20px 0;display:grid;grid-template-columns:minmax(190px,1fr) 2fr auto;gap:16px;align-items:center}.connection-status p{margin:0;color:#615969}.connection-status .field{margin:0}.connection-status button{white-space:normal}.connection-status [role=status]:empty{display:none}.reminder-settings summary{font-weight:600;cursor:pointer}.reminder-settings [hidden]{display:none!important}.reminder-settings .connection-check{margin:0}.reminder-settings .field{display:grid;gap:8px}.reminder-settings #reminder-verify{border-top:1px solid #dcd4cf;padding-top:16px}.connection-card>span>span{font-weight:600;color:#654575}@media(max-width:760px){.connection-status{grid-template-columns:1fr}.connection-status button{justify-self:start}}

#connection-speak{margin:12px 0 12px 10px}.companion-voice-dialog{width:min(570px,calc(100vw - 32px));max-height:90vh;overflow:auto;color:#302b3e;background:#fffaf6}.companion-voice-dialog p{line-height:1.65;margin:16px 0}.companion-voice-dialog details{border-top:1px solid #d7cec8;padding-top:14px}.voice-offer-reason{font-weight:600}@media(max-width:620px){#connection-speak{margin-left:0;display:block}}

.connection-initiation{display:grid;gap:8px;max-width:420px;margin:20px 0}.connection-initiation small{color:#615969}
.connection-tile{display:flex;flex-direction:column;min-width:0;gap:8px}.connection-tile>.connection-card{width:100%;flex:1}.connection-delete{color:#8b3348;min-height:44px;align-self:flex-start;padding:10px 12px;text-decoration:underline;text-underline-offset:3px}.connection-manage-actions{display:flex;justify-content:flex-end;margin:8px 0 20px}

.connection-pictures .connection-picture{min-width:0;display:flex;flex-direction:column;gap:6px}
.connection-pictures .connection-picture label{margin:0;flex:1}
.connection-pictures img{display:block;height:240px}
.connection-picture-preview{min-height:44px;border:1px solid #d3c6dc;border-radius:10px;color:#584067;background:#faf7fc;font:inherit;font-size:13px;cursor:zoom-in}
.connection-picture-preview:hover{background:#eee5f4}.connection-picture-preview:focus-visible,.connection-profile-picture:focus-visible{outline:3px solid #705088;outline-offset:3px}
.connection-profile-picture{flex:none;width:190px;padding:0;border:1px solid #ded2e5;border-radius:16px;overflow:hidden;background:#ede6e0;color:#584067;cursor:zoom-in}
.connection-profile-picture img{display:block;width:100%;height:270px;object-fit:contain}.connection-profile-picture span{display:block;background:#faf7fc;font-size:12px;padding:12px}
@media(max-width:760px){.connection-pictures>div{grid-template-columns:repeat(2,minmax(0,1fr))}.connection-pictures img{height:200px}.connection-profile{flex-wrap:wrap}.connection-profile-picture{width:130px}.connection-profile-picture img{height:190px}}
