.guestbook-page{max-width:1180px;margin:auto;padding:32px 24px 60px}.guestbook-intro{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:15px 0 25px;border-bottom:1px solid #ead5df}.guestbook-intro h1{font-size:clamp(27px,4vw,42px);color:#7e2247;margin:6px 0;line-height:1.5}.guestbook-intro p{margin:0;color:#806474}.guestbook-kicker{font-size:12px}.sign-button{font:700 14px "IBM Plex Sans Arabic",Tahoma,Arial,sans-serif;background:#7e2247;border:1px solid #7e2247;color:white;border-radius:26px;padding:14px 24px;min-height:48px;cursor:pointer;white-space:nowrap}.sign-button:disabled{opacity:.5;cursor:default}.feed-heading{display:flex;align-items:center;gap:14px;margin:24px 0 16px}.feed-heading h2{font-size:22px;color:#7e2247;margin:0}.feed-heading span{font-size:12px;color:#8a7180}.signature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.signature-card{padding:23px;background:white;border:1px solid #ead5df;border-radius:20px;overflow-wrap:anywhere}.signature-person{display:flex;align-items:center;gap:13px}.signature-person h3{margin:0;color:#7e2247;font-size:17px}.visitor-avatar{width:54px;aspect-ratio:1;border-radius:50%;overflow:hidden;display:grid;place-items:center;flex-shrink:0;background:var(--avatar-color)}.visitor-avatar svg{width:100%;height:100%;fill:#fff;opacity:.88}.color-0{--avatar-color:#7e2247}.color-1{--avatar-color:#d4ac26}.color-2{--avatar-color:#ef518f}.color-3{--avatar-color:#66c2cd}.color-4{--avatar-color:#a48bc9}.color-5{--avatar-color:#ca456e}.signature-stars{color:#be9000;font-size:20px;letter-spacing:1px}.signature-comment{white-space:pre-wrap;font-size:15px;line-height:1.95;margin:18px 0;color:#513341}.signature-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px}.signature-bottom time{font-size:11px;color:#8a7180}.signature-like,.signature-actions button,.load-signatures{font:inherit;background:#fff;border:1px solid #e4ced8;border-radius:22px;padding:7px 15px;color:#7e2247;cursor:pointer}.signature-like[aria-pressed=true]{background:#fbe7ef;color:#a72553}.signature-actions{display:flex;gap:12px;margin-top:18px}.signature-actions button{font-size:12px}.signature-actions .remove-signature{color:#a12649}.own-signature{background:#fff9fc;border-color:#c798af;margin-top:20px}.own-label{font-size:12px;color:#7e2247;margin:0 0 14px}.signature-empty{text-align:center;grid-column:1/-1;color:#8a7180;padding:35px}.load-signatures{display:block;margin:25px auto}#guestbook-message{font-size:13px;color:#7e2247;min-height:24px}#signature-dialog{width:min(490px,94vw);max-height:90vh;overflow:auto;border:0;border-radius:22px;background:#fffcfd;color:#513341;padding:28px;font:14px/1.8 "IBM Plex Sans Arabic",Tahoma,Arial,sans-serif}#signature-dialog::backdrop{background:#290a1aaf;backdrop-filter:blur(5px)}#signature-dialog h2{color:#7e2247;font-size:25px;margin:5px 0 20px}.signature-close{position:absolute;left:12px;top:10px;font:28px Tahoma;border:0;background:transparent;color:#7e2247;width:42px;height:42px;cursor:pointer}.avatar-picker{display:flex;align-items:center;gap:18px;margin-bottom:15px}fieldset{border:0;padding:0;margin:0}fieldset legend{font-size:12px;margin-bottom:8px;font-weight:700}.color-options{display:flex;gap:7px;flex-wrap:wrap}.color-choice{width:31px;height:31px;display:grid;place-items:center;position:relative;border-radius:50%;background:var(--avatar-color);cursor:pointer}.color-choice input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.color-choice span{color:white;opacity:0}.color-choice:has(input:checked){outline:2px solid var(--avatar-color);outline-offset:3px}.color-choice input:checked+span{opacity:1}.color-choice:focus-within{outline:3px solid #7e2247;outline-offset:3px}.rating-options{display:flex;gap:8px;margin:15px 0}.rating-options label{position:relative;cursor:pointer}.rating-options input{position:absolute;inset:0;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}.rating-options span{font-size:32px;line-height:1;color:#c9c0c5}.rating-options .is-filled span{color:#be9000}.rating-options label:focus-within{outline:2px solid #7e2247;outline-offset:3px}.signature-field{display:grid;gap:7px;margin:14px 0;font-weight:700;font-size:12px}.signature-field input,.signature-field textarea{font:14px/1.8 "IBM Plex Sans Arabic",Tahoma,Arial,sans-serif;border:1px solid #decbd5;border-radius:10px;padding:11px;background:white;color:#513341;width:100%;max-width:100%;resize:vertical}.signature-help{font-size:11px;color:#8a7180}.guestbook-trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}#signature-error{color:#ad264c;font-size:12px}#signature-form>.sign-button{width:100%}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #7e2247;outline-offset:3px}@media(max-width:850px){.signature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:550px){.guestbook-page{padding:22px 16px 40px}.guestbook-intro{align-items:flex-start;gap:15px;flex-direction:column;padding:0 0 20px}.guestbook-intro h1{font-size:29px}.guestbook-intro .sign-button{padding:12px 22px;min-height:44px}.signature-grid{grid-template-columns:1fr}.signature-card{padding:20px}#signature-dialog{padding:24px 20px}.avatar-picker{gap:14px}.color-options{gap:7px}.color-choice{width:27px;height:27px}}
.guestbook-trap{left:auto;position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.color-options{min-width:0;flex:1}.rating-options label{min-height:40px;min-width:32px}
