.viewer-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:18px;align-items:start;--compact-view:clamp(200px,42svh,430px)}
.viewer-layout>#viewport{position:sticky;top:12px;align-self:start;max-height:calc(100dvh - 24px);min-height:min(380px,calc(100dvh - 24px));z-index:2}
.studies-panel{min-width:0;padding:20px;background:#ebe8df;border:1px solid #d0d3c8;border-radius:8px;font-size:13px;line-height:1.5}.studies-panel h2{margin:0 0 6px;font:400 24px/1.2 Georgia,serif}.studies-intro{margin:0 0 20px;color:var(--muted);font-size:12px}.sculpture-studies{margin-bottom:18px}.sculpture-studies h3{font-size:12px;letter-spacing:.04em;margin:0 0 10px;color:#455b39}.study-picker{display:block;font-size:12px;margin-bottom:6px;color:var(--muted)}.studies-panel select{width:100%;min-width:0;font-size:13px}
.study-check{display:flex;align-items:center;gap:9px;min-height:44px;margin:2px 0;padding:6px 0;cursor:pointer;font-size:13px}.study-check input{flex:none}.study-range{display:block;margin:12px 0;min-width:0}.study-range>span{display:flex;justify-content:space-between;gap:10px;align-items:baseline;font-size:13px;line-height:1.45}.study-range output{font-size:12px;font-variant-numeric:tabular-nums;color:#45533d;min-width:4ch;text-align:right;white-space:nowrap}.study-range input{display:block;width:100%;height:36px;margin:2px 0 0;accent-color:var(--accent);cursor:pointer}.study-color{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:44px;margin:10px 0;font-size:13px}.study-color input{width:54px;height:44px;border:1px solid var(--line);padding:4px;background:var(--surface);border-radius:5px;cursor:pointer}
#study-context{font-size:12px;line-height:1.5;color:#405135;margin:10px 0 6px;font-weight:600}#study-description{font-size:12px;color:var(--muted);margin:8px 0 12px}#study-suggestion{width:100%;margin:4px 0 10px;white-space:normal;line-height:1.5}.effect-strength{padding:6px 0;margin:4px 0 12px;border-bottom:1px solid #cdd0c4}.effect-strength>span{font-weight:600}#study-parameters>*{min-width:0}#studies-reset{margin-top:10px;width:100%}#studies-active{font-size:11px;color:var(--muted);margin:10px 0 0}#studies-status{font-size:12px;line-height:1.5;margin:10px 0 0}#studies-status:empty{display:none}#studies-status.error{color:#812d22}
.study-section{border-top:1px solid #cbd0c2}.study-section:last-of-type{border-bottom:1px solid #cbd0c2}.study-section>summary{cursor:pointer;min-height:48px;padding:14px 2px;font-size:13px;font-weight:600;line-height:1.5;color:#405135}.study-section>summary::marker{color:#6a7a5d}.study-section[open]>summary{padding-bottom:8px}.studies-panel fieldset{min-width:0;border:0;padding:4px 0 10px;margin:0}.study-fieldset-help{font-size:12px;color:var(--muted);margin:5px 0 10px}.studies-panel fieldset button{margin:4px 0}
@media(max-width:1100px){.viewer-layout{grid-template-columns:minmax(0,1fr) 290px;gap:14px}.studies-panel{padding:16px}}
@media(max-width:980px){.viewer-layout{display:flex;flex-direction:column;gap:14px}.viewer-layout #viewport,.studies-panel{width:100%}.viewer-layout>#viewport{height:var(--compact-view);min-height:0;max-height:var(--compact-view);top:8px}.studies-panel{padding:20px;scroll-margin-top:calc(var(--compact-view) + 24px)}.studies-panel h2{font-size:24px}.studies-intro{margin-bottom:16px}#study-parameters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}.study-section fieldset{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}.study-section .study-fieldset-help{grid-column:1/-1}.study-section fieldset button{justify-self:start}.study-section .study-check{min-width:0}.studies-panel :is(button,input,select,summary){scroll-margin-top:calc(var(--compact-view) + 40px);scroll-margin-bottom:24px}}
@media(max-width:600px){.studies-panel{padding:16px}.studies-panel select{font-size:16px}.study-range input{height:44px}#study-parameters{column-gap:16px}.study-section fieldset{column-gap:16px}.study-range>span{font-size:12px;gap:6px}.study-color{font-size:12px}.study-check{font-size:13px}}
@media(max-width:380px){#study-parameters,.study-section fieldset{grid-template-columns:1fr}}
@media(max-height:520px) and (min-width:601px){.viewer-layout{--compact-view:clamp(150px,40svh,220px)}}
