/* Detail pages use the reference's dark media panel against the blue page. */
#site-base{background:#303030;color:#eee;border-radius:15px;overflow:hidden}
.detail-toolbar{background:#242424;padding:8px 20px}
.legend-line{display:flex;align-items:center;gap:8px;font-size:13px}
.legend-reachable{color:#9adbac}
.legend-blocked{color:#ffda7a}
.legend-offline{color:#ffa0ad}
.detail-content{padding:20px}
/* Blocked and offline notices share a quiet treatment within the dark panel. */
.detail-notice{margin:0 0 16px;padding:8px 10px;border-left:2px solid #967a5a;background:#ffffff08;color:#d1c0ac;font-size:13px;line-height:1.7}
.detail-notice a{display:inline-block;padding:5px 0;color:#ead2b3;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.detail-notice-offline{border-left-color:#b96c78;color:#ffa0ad}
.detail-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px;margin-bottom:20px}
.detail-actions .site-row-actions{margin-left:auto}
.detail-score{padding:10px;border:1px dashed currentColor;border-radius:10px;flex-shrink:0;color:color-mix(in srgb,var(--rating-color) 65%,white);text-align:center}
.detail-score strong{display:block;font-size:20px}
.detail-score span{font-size:12px}
.visit-button{display:block;text-align:center;border:0;border-radius:15px;padding:18px;background:var(--accent);color:white;font-size:22px;font-weight:700}
.visit-button:hover{background:#e51650;text-decoration:none}
.detail-actions .bookmark-btn{color:#ddd;min-height:40px}
.detail-actions .bookmarked{color:#ffb151}
.detail-actions .share-button{border:0;border-radius:5px;background:#444;color:#ccc;padding:6px 14px;min-height:40px}
.site-history,#review-base{padding:20px;border-radius:15px;background:#ffffffc9;margin-top:24px;color:#31464d}
.site-history .section-title{background:transparent;color:var(--blue);margin:0;padding:0 0 10px;font-size:22px}
.site-history .activity-section{max-height:320px;overflow:auto;scrollbar-width:thin}
#review-status,.review-label span{font-size:13px;color:var(--muted)}
#review-form{border-bottom:1px solid var(--border);padding:0 0 20px}
#review-form fieldset{border:0;margin:0;padding:0;min-width:0}
#review-form fieldset:disabled{opacity:.5}
.review-stars{display:flex;gap:4px;margin:4px 0 12px}
/* Average scores, score selection and published reviews share the same rating colors. */
.detail-score,.review-stars,.review-rating{--rating-color:#b8860b}
:is(.detail-score,.review-stars,.review-rating):is([data-score="1"],[data-score="2"]){--rating-color:#d94a48}
:is(.detail-score,.review-stars,.review-rating):is([data-score="4"],[data-score="5"]){--rating-color:#278651}
.detail-score[data-score="0"]{--rating-color:#aaa}
.review-stars label{position:relative;display:grid;place-items:center;width:44px;height:44px;font-size:30px;color:#ccc;cursor:pointer}
.review-stars input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.review-stars label.active,.review-rating .rated{color:var(--rating-color)}
.review-stars label:focus-within{outline:2px solid var(--accent);border-radius:5px}
.review-label{display:block;margin-bottom:6px}
.review-list-title{font-size:18px;margin:20px 0 8px}
.public-review{padding:15px 0;border-top:1px solid var(--border);overflow-wrap:anywhere}
.public-review p{margin:8px 0;line-height:1.65}
.review-meta{display:flex;justify-content:space-between;gap:10px}
.review-rating{color:#ccc;white-space:nowrap}
.review-meta time{font-size:13px;color:var(--muted)}
.review-empty{padding:12px;color:var(--muted)}
#review-status:empty{display:none}
#review-status.review-error{color:#b42338}
/* The same form styling serves submissions and visitor reviews. */
#submission-form{margin-top:24px}
#submission-form label{display:block;margin:16px 0 6px}
#submission-form :is(input:not([type=hidden]),select,textarea),#review-content{display:block;width:100%;min-width:0;border:1px solid #92c5d7;border-radius:10px;background:white;color:#172c33;padding:10px 12px;min-height:44px;font:inherit;font-size:16px}
#submission-form textarea,#review-content{resize:vertical;min-height:128px}
#submission-form [aria-invalid=true]{border-color:#b42338}
#submission-form button,#review-form button{display:block;margin:20px 0 0;min-height:48px;border:0;border-radius:10px;background:var(--accent);color:#fff;padding:10px 20px;font:inherit;font-weight:700;font-size:18px;width:100%}
.submission-page{font-size:16px;line-height:1.65}
.submission-help,#submission-form label span{font-size:14px;color:#567985}
.submission-notice{padding:12px 16px;border:1px dashed #3088a3;background:#def3f8;border-radius:10px;color:#307d94}
.submission-error,.submission-error a{color:#b42338}
.submission-notice p{margin:0}
.submission-notice ul{margin:8px 0 0;padding-left:20px}
.submission-replies{margin-top:32px}
.submission-replies h2{font-size:22px;color:var(--blue)}
.submission-reply{padding:20px 0;border-top:1px solid var(--border)}
.submission-reply h3{margin:0 0 4px;font-size:16px}
.submission-reply p{margin:12px 0 0}
.about-page{font-size:16px;line-height:1.85;word-break:keep-all;overflow-wrap:anywhere}
.about-page .about-lead{font-size:18px;font-weight:500}
.about-page section{margin-top:28px;padding-top:24px;border-top:1px solid var(--border)}
.about-page h2{color:var(--blue);font-size:22px;margin:0 0 12px}
.about-page p{margin:12px 0 0}
.about-page li+li{margin-top:8px}
.about-page dl>div+div{margin-top:18px}
.about-page dt{font-weight:700}
.about-page dd{margin:6px 0 0}
.about-page .addtag{padding:3px 6px;font-size:13px}
.about-note{padding:14px 16px;border:1px dashed var(--blue);border-radius:10px;background:#def3f8}
.about-page p a{text-decoration:underline}
@media(max-width:767px){
.detail-content{padding:15px 10px}
.detail-toolbar{padding:8px 15px}
.detail-toolbar .legend-line{font-size:12px}
.detail-actions .share-button{font-size:13px;padding:6px;min-width:44px;min-height:44px}
.detail-actions .bookmark-btn{min-height:44px}
.detail-score{padding:5px}
.visit-button{font-size:18px;padding:15px 10px}
.site-history,#review-base{padding:16px}
.site-history .section-title{font-size:20px}
}
