:root{--guide-bg:#f7f8f2;--guide-paper:#fffefa;--guide-ink:#273d2f;--guide-muted:#66755f;--guide-line:#dce3d3;--guide-accent:#385637;--guide-soft:#eaf0e1;--guide-radius:14px}
/* The catalog dialog and standalone guides share the same surfaces and controls. */
#detail{--guide-accent:#6c4f80;--guide-soft:#eee8f3;background:var(--guide-bg);color:var(--guide-ink);border:1px solid var(--guide-line);border-radius:20px;width:min(1120px,94vw);max-height:92dvh;padding:0;box-shadow:0 30px 100px #15251640}
#detail::backdrop{background:#18271fcc;backdrop-filter:blur(6px)}#detail .detail-top{position:sticky;top:0;z-index:3;padding:17px 26px;background:#f7f8f2f5;border-bottom:1px solid var(--guide-line);backdrop-filter:blur(12px);font-size:10px;letter-spacing:1.6px;color:#738266;display:flex;align-items:center;justify-content:space-between}
#detail #close-detail{width:40px;height:40px;border:1px solid var(--guide-line);border-radius:50%;background:var(--guide-paper);font-size:25px;color:var(--guide-ink)}#detail .detail-grid{padding:28px;gap:32px;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}#detail .detail-visual{border-radius:var(--guide-radius);min-width:0}#detail #detail-preview{border-radius:var(--guide-radius);overflow:hidden;background:var(--guide-soft)}#detail #detail-preview img{width:100%;max-height:520px;object-fit:contain}#detail #preview-credit,#detail .detail-note{font-size:11px;line-height:1.85;color:#7d8870}#detail #detail-kind{font-size:11px;color:#7a886d;letter-spacing:.3px}#detail #detail-title{font-size:30px;line-height:1.45;letter-spacing:-1px;margin:12px 0 15px;word-break:keep-all}#detail #detail-desc{font-size:14px;line-height:1.85;color:var(--guide-muted)}#detail .detail-tools{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:20px 0 24px}#detail .detail-tools button{font-size:11px;border:1px solid var(--guide-line);border-radius:7px;background:var(--guide-paper);padding:10px 13px;min-height:40px;color:var(--guide-ink)}#detail .detail-tools a{font-size:11px;color:#6d805d;line-height:1.7;padding:7px 0}#detail .analysis-modal-link[hidden]{display:none}#detail .modal-how{display:flex;gap:14px;flex-wrap:wrap;padding:15px;background:var(--guide-soft);border-radius:9px;margin-bottom:22px;color:#5e7151;font-size:11px}#detail .modal-how b{display:inline-grid;place-items:center;background:#fffdf7;width:22px;height:22px;border-radius:50%;margin-right:5px;font-weight:550}#detail label[for=prompt-editor]{font-size:13px;font-weight:600;color:#43593a}#detail #prompt-editor{background:var(--guide-paper);border:1px solid #ced8c4;border-radius:10px;padding:18px;font:13px/1.9 'SFMono-Regular',Consolas,monospace;color:#394d31;height:320px;margin-top:12px;width:100%;resize:vertical}#detail #copy{background:var(--guide-accent);color:#fffef6;border:0;border-radius:8px;min-height:47px;font-size:13px;width:100%;padding:13px 18px;display:flex;justify-content:space-between;margin-top:13px}#detail #copy-status{font-size:12px;line-height:1.7}#detail details{border-block:1px solid var(--guide-line);margin-top:20px;padding:17px 0}#detail summary{font-size:12px;cursor:pointer;min-height:30px;display:flex;align-items:center}#detail #sources h3{font-size:15px;margin:22px 0 10px}#detail #sources p,#detail #sources li,#detail #sources a{font-size:12px;line-height:1.9;color:var(--guide-muted);overflow-wrap:anywhere}#detail :is(button,a,textarea):focus-visible{outline:3px solid #a68cb7;outline-offset:3px}
@media(max-width:700px){#detail{width:96vw;max-height:95dvh;border-radius:14px}#detail .detail-top{padding:12px 17px;font-size:9px;letter-spacing:1px}#detail .detail-grid{padding:19px;display:flex;flex-direction:column;gap:20px}#detail #detail-title{font-size:25px}#detail #detail-preview img{max-height:270px}#detail .detail-visual .art{max-height:220px}#detail .detail-note{margin:7px 0}#detail .modal-how{gap:10px;padding:12px;font-size:10px}#detail #prompt-editor{font-size:12px}#detail #detail-desc{font-size:13px}}
