/* Warm paper and a spacious reference viewer, shared by gallery and detail URLs. */
body.gallery-theme{--paper:#f8f6f2;--surface:#fffdfa;--line:#deddd9;background:var(--paper)}
.gallery-theme .closing{background:#eeebe5}
.modal{padding:24px;z-index:50}
.modal-backdrop{background:#28282191;backdrop-filter:blur(5px)}
.modal-panel{width:min(1520px,100%);height:calc(100dvh - 48px);max-height:1020px;padding:18px;gap:28px;grid-template-columns:minmax(0,1fr) minmax(340px,390px);border:1px solid #fff9;border-radius:32px;background:#f8f6f2;overflow:hidden;box-shadow:0 32px 100px #1d203333;color:var(--ink)}
.modal-close{position:absolute;top:12px;right:12px;z-index:5;width:42px;height:42px;display:grid;place-items:center;border:1px solid #deddd9;border-radius:50%;background:#fffdfa;color:var(--ink);font:28px/1 var(--ui-font)}
.modal-close:hover{background:#e9e3f6}
.modal-image{position:relative;isolation:isolate;min-height:0;height:100%;display:flex;align-items:stretch;justify-content:center;gap:14px;overflow:hidden;border-radius:23px;background:#e3dfef;padding:46px 24px 28px;touch-action:pan-y}
.media-pane{position:relative;flex:1;min-width:0;min-height:0;margin:0;display:flex;align-items:center;justify-content:center}
.modal-image .media-pane img{position:relative;width:100%;height:100%;max-height:100%;object-fit:contain;mix-blend-mode:multiply;pointer-events:none;user-select:none}
.modal-image .photo-pane img{mix-blend-mode:normal;border-radius:18px}
.media-pane figcaption{position:absolute;bottom:0;left:12px;border:1px solid #ffffff66;border-radius:99px;padding:6px 12px;background:#fffdfaeb;color:#666379;font-size:12px;z-index:1}
.modal-image[data-media-mode=sketch] .sketch-pane figcaption{display:none}
.modal-image[data-media-mode=photo]{background:#eeebe5}
.modal-image[data-media-mode=compare]{background:#eeebe5;padding-inline:52px;gap:22px}
.photo-placeholder{width:100%;height:100%;min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;border:1px dashed #bbb4c9;border-radius:22px;background:linear-gradient(155deg,#f7f5fb,#e8e2f0);text-align:center;padding:22px;color:#6c6580}
.photo-placeholder svg{width:48px;height:48px;stroke:#8a7da7;stroke-width:1.3;fill:none;margin-bottom:5px}
.photo-placeholder strong{font-size:17px;color:#514564}
.photo-placeholder p{font-size:13px;line-height:1.8;max-width:230px;margin:0}
.modal-image-index{position:absolute;z-index:2;top:18px;bottom:auto;left:20px;pointer-events:none;padding:8px 13px;border-radius:99px;background:#f3efac;color:#464333;font:600 12px/1.3 var(--ui-font);letter-spacing:.03em}
.image-arrow{position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:48px;height:48px;border:1px solid #fff8;border-radius:50%;background:#fffdf4ed;color:var(--ink);font:32px/1 var(--ui-font);display:grid;place-items:center;transition:background .2s,box-shadow .2s}
.image-arrow.prev{left:14px}.image-arrow.next{right:14px}
.image-arrow:hover{background:#fff;box-shadow:0 4px 16px #29234220}
.viewer-stage-note{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-size:10px;letter-spacing:.16em;color:#78738c;pointer-events:none}
.modal-info{min-width:0;min-height:0;padding:20px 16px 8px 0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#c7c0d5 transparent;display:flex;flex-direction:column;gap:18px}
.viewer-eyebrow{display:flex;align-items:center;gap:8px;color:#777382;font:500 11px/1.5 var(--ui-font);letter-spacing:.1em;text-transform:uppercase}
.viewer-eyebrow span:first-child{color:#6754dc;font-size:18px}.viewer-eyebrow span:last-child{margin-left:auto;padding-right:36px}
.modal-sub{margin:0 0 7px;font:500 12px/1.7 var(--ui-font);color:#777382;overflow-wrap:anywhere}
.modal-info h2{margin:0 14px 0 0;color:var(--ink);font-size:clamp(24px,2.2vw,34px);line-height:1.4;letter-spacing:0;overflow-wrap:anywhere}
.pose-description{font-size:13px;line-height:1.8;color:#777382;margin:8px 0 0;white-space:pre-wrap}
.angle-buttons{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0;padding:2px}
.angle-buttons button{height:auto;padding:0;border:0;border-radius:0;background:none;color:#777382;overflow:visible;font:500 12px/1.5 var(--ui-font);box-shadow:none}
.angle-buttons button img{display:block;width:100%;height:86px;padding:4px;object-fit:contain;background:#e3dfef;mix-blend-mode:multiply;border:2px solid transparent;border-radius:13px;transition:border-color .2s,background .2s}
.angle-buttons button span{display:block;position:static;background:none;color:inherit;line-height:1.6;margin-top:6px;font-size:12px}
.angle-buttons button.active{color:var(--ink);background:none;border:0;box-shadow:none;font-weight:700}
.angle-buttons button.active img{border-color:var(--ink);background:#e6e0f4}
.angle-buttons button:hover img{border-color:#9184b3}
.viewer-mode-row{display:flex;align-items:center;gap:12px}
.media-tabs{display:inline-flex;gap:3px;background:#eae6df;padding:4px;border-radius:99px}
.media-tabs button{border:0;border-radius:99px;padding:9px 17px;color:#68636a;background:none;font-size:13px;line-height:1.4;font-weight:600;min-height:38px}
.media-tabs button[aria-pressed=true]{background:var(--ink);color:white;box-shadow:0 2px 4px #19275320}
.mode-key{color:#847f89;font-size:11px;white-space:nowrap}
.mode-key kbd,.keyboard kbd{border:1px solid #dedbd6;border-bottom-width:2px;background:#fffdfa;border-radius:5px;padding:2px 5px;font:500 10px var(--ui-font)}
.prompt-panel{margin:0;padding:16px 17px 12px;border:1px solid #e5e1da;border-radius:21px;background:#fff;flex:none;min-width:0}
.prompt-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}
.prompt-heading h3{font:700 14px/1.5 var(--ui-font);color:var(--ink);margin:0}
.prompt-heading button{min-height:30px;border:1px solid #e5e1da;background:#f8f6f2;border-radius:99px;padding:5px 11px;color:#5c5666;font-size:11px}
.prompt-heading button:hover{background:#eae4f6;border-color:#d0c7e3}
.prompt-languages{display:flex;gap:4px;margin:12px 0 8px}
.prompt-languages button{border:0;border-radius:6px;padding:5px 9px;background:transparent;color:#827987;font-size:11px;font-weight:600}
.prompt-languages button[aria-pressed=true]{background:#eee8fa;color:#6550a0}
.prompt-help{font-size:11px;line-height:1.6;color:#867f8a;margin:0 0 10px}
.prompt-panel textarea{display:block;width:100%;height:170px;min-height:100px;max-height:420px;resize:vertical;border:0;border-radius:0;padding:0 7px 0 0;background:transparent;color:#4c4955;font:400 13px/1.85 var(--ui-font);scrollbar-width:thin;scrollbar-color:#d7d0df transparent}
.copy-status{font-size:11px;line-height:1.6;color:#6754aa;min-height:0;margin:7px 0 0}.copy-status:empty{display:none}
.viewer-downloads{display:flex;gap:8px}.viewer-downloads .download{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:99px;background:var(--ink);color:#fff;font:700 13px/1.5 var(--ui-font);padding:15px 12px;margin:0;text-align:center;min-height:49px}
.viewer-downloads .download:hover{background:#354274}.viewer-downloads .download[aria-disabled=true]{background:#ded9e5;color:#867c93;cursor:not-allowed;pointer-events:none}
.detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.detail-actions button,.detail-actions a{display:flex;justify-content:center;align-items:center;gap:7px;min-height:39px;border:1px solid #dedbd6;border-radius:99px;background:#fffdfa;color:#625b70;font:500 12px/1.5 var(--ui-font);padding:8px 10px;text-align:center}
.detail-actions button:hover,.detail-actions a:hover{background:#eae4f6;border-color:#c6bdd8}
.detail-actions button:disabled{opacity:.6;cursor:wait}
.detail-action-status{margin:0;color:#6754aa;font-size:12px;line-height:1.6}.detail-action-status:empty{display:none}
.keyboard{display:flex;flex-wrap:wrap;gap:8px 12px;margin:0;padding:0;color:#918a96;font-size:10px;line-height:1.8}
.viewer-pose-nav{display:flex;align-items:center;justify-content:space-between;padding-top:12px;margin-top:auto;border-top:1px solid #e1ddd8}
.viewer-pose-nav button{border:0;background:transparent;color:#6f667e;font-size:12px;padding:5px 0;min-height:30px}
.viewer-pose-nav span{color:#a29aa9;font:500 11px var(--ui-font)}
.modal :is(button,a,textarea):focus-visible{outline:3px solid #9683c8;outline-offset:3px}
.detail-page>.topbar,.detail-page>main:not(#poseDetailPage),.detail-page>footer,.detail-page>.site-ad{display:none!important}

@media(min-width:761px) and (max-height:800px){.modal-info{gap:13px;padding-top:10px}.modal-info h2{font-size:26px}.angle-buttons button img{height:70px}.prompt-panel textarea{height:120px}.prompt-panel{padding:13px 15px 11px}.prompt-languages{margin-top:8px}.modal-sub{margin-bottom:4px}}
@media(min-height:850px){.prompt-panel textarea{height:220px}.modal-info{gap:22px}.angle-buttons button img{height:100px}}
@media(max-width:1050px){.modal{padding:16px}.modal-panel{height:calc(100dvh - 32px);grid-template-columns:minmax(0,1fr) 330px;gap:20px;padding:14px;border-radius:26px}.modal-info{padding-right:8px;gap:16px}.modal-image{padding-inline:12px}.modal-image[data-media-mode=compare]{padding-inline:34px;gap:10px}.image-arrow{width:40px;height:40px}.image-arrow.prev{left:8px}.image-arrow.next{right:8px}.photo-placeholder{padding:12px}.photo-placeholder strong{font-size:14px}.photo-placeholder p{font-size:12px}.mode-key{display:none}}
@media(max-width:760px){.modal{padding:8px}.modal-panel{height:auto;max-height:calc(100dvh - 16px);grid-template-columns:minmax(0,1fr);gap:20px;padding:10px;border-radius:24px;overflow-y:auto;overscroll-behavior:contain}.modal-close{position:fixed;top:20px;right:20px;width:38px;height:38px;background:#fffdf9f5}.modal-image{height:52dvh;min-height:300px;max-height:650px;border-radius:17px;padding:44px 15px 20px}.modal-info{overflow:visible;padding:0 10px 12px;gap:18px}.modal-info h2{font-size:27px}.viewer-eyebrow span:last-child{padding:0}.modal-image-index{left:13px;top:14px;font-size:11px}.angle-buttons button img{height:90px}.prompt-panel textarea{font-size:16px;line-height:1.7;height:190px}.viewer-stage-note{font-size:8px;bottom:7px}.viewer-mode-row{justify-content:space-between}.mode-key{display:block}.keyboard{display:none}.media-tabs button{min-height:44px}.modal-image[data-media-mode=compare]{padding:52px 28px 25px;gap:8px}.photo-placeholder{min-height:180px;gap:8px;padding:8px}.photo-placeholder svg{width:32px;height:32px}.photo-placeholder p{font-size:11px}.media-pane figcaption{left:4px;font-size:10px;padding:4px 9px}.detail-actions button,.detail-actions a{min-height:44px}.viewer-pose-nav button{min-height:44px}}
@media(prefers-reduced-motion:reduce){.modal *{animation:none!important;transition:none!important}}

/* Fixed prompt viewport: scroll the text, never stretch the operation panel. */
.modal .prompt-heading{gap:6px;flex-wrap:nowrap}
.modal .prompt-heading h3{font-size:13px;white-space:nowrap}
.modal .prompt-languages{margin:0 0 0 auto;flex:none;gap:1px}
.modal .prompt-languages button{padding:5px 7px;min-height:28px;border:0;border-radius:6px;background:transparent;font-size:11px}
.modal .prompt-languages button[aria-pressed=true]{background:#eee8fa;color:#6550a0}
.modal .prompt-panel textarea{height:92px;min-height:92px;max-height:92px;resize:none;overflow-y:auto}
.modal .prompt-help{margin:8px 0}
.modal .copy-status{height:16px;min-height:16px;line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:5px}
.modal .copy-status:empty{display:block}
.modal .detail-action-status:empty{display:none}
@media(min-width:761px) and (max-height:850px){
 .modal-info{gap:10px;padding-top:8px;padding-bottom:4px}
 .viewer-eyebrow{display:none}
 .modal .angle-buttons button img{height:60px}
 .modal .prompt-panel{padding:11px 13px 8px}
 .modal .prompt-panel textarea{height:92px;min-height:92px;max-height:92px;margin-top:9px}
 .modal .prompt-help{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:0}
 .modal .detail-actions{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
 .modal .detail-actions button,.modal .detail-actions a{font-size:11px;padding:7px 3px;min-height:36px;white-space:nowrap}
 .modal .viewer-pose-nav{display:none}
 .modal .viewer-downloads .download{min-height:44px;padding:12px 8px}
 .modal .keyboard{gap:6px;font-size:9px}
}
@media(max-width:760px){.modal .prompt-panel textarea{height:112px;min-height:112px;max-height:112px}.modal .prompt-heading h3{font-size:12px}.modal .prompt-languages button{font-size:10px;padding-inline:5px}.modal .prompt-heading>button{padding-inline:9px}.modal .prompt-panel{padding-inline:12px}}
@media(min-width:761px) and (min-height:680px) and (max-height:850px){.modal .viewer-pose-nav{display:flex}}
