
/* «Созерцание», v0.96.7. Only scoped classes; do not alter approved common UI. */
.contemplation-screen{--gallery-plum:#4d3459;--gallery-muted:#7f6d86}
.contemplation-top{background-image:linear-gradient(180deg,rgba(253,251,253,.97) 0%,rgba(253,251,253,.91) 52%,rgba(253,251,253,.20) 94%),url('./assets/coast-practices.jpg')!important}
.contemplation-intro{font:italic 15px/1.6 Georgia,serif;text-align:center;color:#735e7a;padding:8px 15px 17px}
.contemplation-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.contemplation-tile{display:flex;flex-direction:column;min-width:0;padding:7px;text-align:left;min-height:0;border-radius:19px;border:1px solid #e6dae8;background:#fffcff;color:var(--gallery-plum);box-shadow:0 4px 14px #4c2b5910}
.contemplation-tile:focus-visible,.art-controls button:focus-visible,.art-close:focus-visible{outline:3px solid #a98cc2;outline-offset:2px}
.contemplation-thumb{display:flex;position:relative;align-items:center;justify-content:center;width:100%;height:clamp(128px,38vw,190px);overflow:hidden;border-radius:14px;background:#eeedf1}
.contemplation-thumb img{width:100%;height:100%;object-fit:contain;display:block}
.contemplation-label{display:flex;flex-direction:column;gap:4px;padding:9px 6px 10px}
.contemplation-label strong{font:400 17px/1.18 Georgia,serif;color:#4e345b;overflow-wrap:anywhere}
.contemplation-label>span{font-size:11px;line-height:1.45;color:#82718c}
.contemplation-footnote{text-align:center;color:#8b7a8b;font-size:11px;line-height:1.5;margin:18px 6px 5px}
.art-modal-overlay{z-index:60;background:#1e1b2494;padding:0;align-items:center}
.art-modal-overlay>.modal{width:min(100vw,740px);height:100dvh;max-height:100dvh;border-radius:0;padding:0;overflow:auto;background:#faf8fb;overscroll-behavior:contain}
.art-viewer{padding:16px clamp(15px,4vw,30px) 27px;color:#4e395c}
.art-viewer-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin:0 0 12px}
.art-viewer-header h2{font:400 clamp(25px,6vw,34px)/1.16 Georgia,serif;color:#492f56;margin:5px 0 4px}
.art-viewer-header p{font-size:13px;color:#857389}
.art-eyebrow{color:#947da3;font:600 10px/1.4 system-ui;letter-spacing:.12em}
.art-close{border:1px solid #e5d9e4;border-radius:50%;width:42px;height:42px;flex:none;background:#fff;color:#5e4c67;font-size:19px}
.art-painting-frame{display:flex;position:relative;align-items:center;justify-content:center;background:#ece9ef;border-radius:10px;min-height:170px;overflow:hidden}
.art-painting-frame img{display:block;max-width:100%;width:auto;height:auto;max-height:min(57dvh,660px);object-fit:contain;box-shadow:0 2px 12px #30233b16}
.art-short{font:400 15px/1.65 Georgia,serif;color:#5f4c69;margin:15px 2px}
.art-story{border:1px solid #e7dce8;border-radius:15px;background:#fffefe;padding:0 14px}
.art-story summary{cursor:pointer;display:list-item;list-style:revert;padding:14px 0;font-size:13px;font-weight:650;color:#6b4e7e}
.art-story-copy{padding:0 1px 15px;color:#615569;font-size:13px;line-height:1.75}
.art-story-copy p+p{margin-top:11px}
.art-story-copy strong{font-weight:600;color:#684c79}
.art-source{display:flex;justify-content:space-between;align-items:center;gap:7px;flex-wrap:wrap;font-size:11px;color:#928498;padding:14px 2px;border-bottom:1px solid #e7dce8}
.art-source a{color:#70528c;text-decoration:underline;text-underline-offset:2px}
.art-controls{display:flex;justify-content:space-between;gap:10px;margin:17px 0}
.art-controls button{padding:12px;border:1px solid #ded1e4;border-radius:13px;background:#f7f2f9;color:#624879;font-size:12px;min-height:44px;min-width:110px}
.art-controls button:disabled{opacity:.35}
.art-image-unavailable{background:#ece7f0;min-height:140px;position:relative}
.art-image-unavailable img{display:none}
.art-image-unavailable::after{content:'Изображение пока недоступно. Открой галерею при подключении к интернету.';color:#7f7087;font-size:12px;line-height:1.5;padding:20px;text-align:center}
@media(min-width:620px){.contemplation-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.art-painting-frame img{max-height:66dvh}}
@media(prefers-reduced-motion:no-preference){.contemplation-tile{transition:transform .18s,box-shadow .18s}.contemplation-tile:hover{transform:translateY(-2px);box-shadow:0 7px 18px #4c2b591c}}
