/* Art garden */
.art-page { --garden-ink: #36502a; --panel: #f8f5d8; min-height: 100vh; background: linear-gradient(155deg, #effad9 0%, #cfe9bc 45%, #a9d2a2 100%); color: var(--garden-ink); }
.art-page[data-theme="pond"] { --garden-ink: #24525a; --panel: #edf7e8; background: linear-gradient(155deg, #d9f3ed 0%, #b8decb 48%, #9bc7d3 100%); }
.art-page[data-theme="peach"] { --garden-ink: #754628; --panel: #fff4dc; background: linear-gradient(155deg, #fff1c8 0%, #f5cba9 52%, #dba88b 100%); }
.art-page[data-theme="dusk"] { --garden-ink: #4c3f76; --panel: #f4edf8; background: linear-gradient(155deg, #ece3fa 0%, #d1c5e9 52%, #a9a6cf 100%); }
.art-page[data-theme="midnight"] { --garden-ink: #c3dcff; --panel: #102345; background: radial-gradient(circle at 50% 0, #1c3b70 0%, #0b1d3c 46%, #040d20 100%); }
.art-page[data-theme="midnight"] .art-header h1, .art-page[data-theme="midnight"] .gallery-section summary { text-shadow: 0 1px #020916; }.art-page[data-theme="midnight"] .gallery-section { border-color: rgb(147 190 255 / .58); background: rgb(8 24 54 / .42); }.art-page[data-theme="midnight"] .minimal-gallery { color: #b9d8ff; }
.art-main { width: min(1180px, calc(100% - 2rem)); margin: 0 auto; padding: 1.5rem 0 4rem; }
.art-header { position: relative; text-align: center; }
.art-home { display: inline-block; color: var(--garden-ink); font-weight: bold; text-decoration-thickness: 1px; }
.art-header .art-home { position: absolute; left: 0; top: .35rem; }
.art-banner { display: block; width: min(100%, 840px); max-height: 270px; margin: .5rem auto .85rem; object-fit: contain; }
.art-header h1 { margin: 0; font-size: clamp(2rem, 5vw, 3.6rem); text-shadow: 0 1px #fff; }
.art-header p { width: min(640px, 100%); margin: .65rem auto; font-size: 1.08rem; line-height: 1.45; }
.ai-note { font-size: .95rem !important; font-style: italic; }
.ai-note a { color: inherit; font-weight: bold; }
.gallery-settings { display: flex; flex-wrap: wrap; align-items: end; justify-content: center; gap: .85rem 1rem; margin: 2rem 0 .65rem; padding: 1rem; border: 2px solid #725a2a; border-radius: .75rem; background: linear-gradient(135deg, #c89d49, #f4dc9c 25%, #b77d2d 55%, #f4d48c); box-shadow: inset 0 2px #fff4c5, inset 0 -3px #79501f, 0 4px 8px rgb(64 49 20 / .35); color: #251b0d; }
.setting-row { display: grid; gap: .22rem; text-align: left; font: bold .82rem Arial, sans-serif; }
.gallery-settings select { min-width: 125px; border: 2px outset #f9df9c; border-radius: .25rem; background: #fff8dd; color: #34210d; font: .9rem Arial, sans-serif; }
.caption-check { padding-bottom: .15rem; font: bold .82rem Arial, sans-serif; }
.gallery-widget-button, .minimal-gallery { border: 2px solid #593518; border-radius: .35rem; background: linear-gradient(#fff1b5, #d79a3d 52%, #8d4e1e); box-shadow: inset 0 1px #fffbe8, inset 0 -2px #794117, 0 2px 2px #76522a; color: #2e190c; cursor: pointer; font: bold .82rem Arial, sans-serif; padding: .42rem .65rem; text-shadow: 0 1px #fff0bd; }
.minimal-gallery { display: block; margin: .55rem auto 1.25rem; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; color: #0000ee; cursor: pointer; font: 1rem "Times New Roman", Times, serif; text-decoration: underline; text-shadow: none; }
.minimal-gallery:visited { color: #551a8b; }
.art-gallery { display: grid; gap: 1.5rem; }
.gallery-section { border: 2px solid rgb(70 95 44 / .45); border-radius: .5rem; background: rgb(255 255 235 / .23); padding: .45rem .75rem .9rem; }
.gallery-section summary { cursor: pointer; color: var(--garden-ink); font-size: clamp(1.25rem, 3vw, 1.8rem); font-weight: bold; text-shadow: 0 1px #fff; }
.gallery-section summary span { margin-left: .45rem; font-size: .75rem; font-style: italic; font-weight: normal; }
.gallery-section-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.5rem; margin-top: 1rem; }
.art-gallery[data-density="compact"] .gallery-section-grid { gap: .75rem; }
.gallery-piece { margin: 0; padding: .8rem .8rem .65rem; border: 12px ridge #b58a39; background: #f7ebbb; box-shadow: inset 0 0 0 2px #7a5420, 0 5px 10px rgb(45 62 28 / .4); transform: rotate(var(--tilt, 0deg)); }
.gallery-piece:nth-child(3n + 1) { --tilt: -.5deg; }.gallery-piece:nth-child(3n + 2) { --tilt: .4deg; }.gallery-piece:nth-child(3n) { --tilt: -.25deg; }
.art-gallery[data-frame="wood"] .gallery-piece { border-color: #6f3c20; background: #ead3ac; box-shadow: inset 0 0 0 2px #3a1c0f, 0 5px 10px rgb(45 62 28 / .4); }
.art-gallery[data-frame="silver"] .gallery-piece { border-color: #a8afac; background: #e7eeea; box-shadow: inset 0 0 0 2px #666d69, 0 5px 10px rgb(45 62 28 / .4); }
.gallery-piece img { display: block; width: 100%; aspect-ratio: 1.5; object-fit: cover; border: 2px solid #4f391b; background: #d6e3c0; }
.gallery-piece figcaption { margin: .65rem auto 0; padding: .3rem .5rem; border: 1px solid #624720; border-radius: .15rem; background: linear-gradient(#f6da79, #a96d25); box-shadow: inset 0 1px #fff1b0; color: #2d1b0a; font-weight: bold; text-align: center; text-shadow: 0 1px #f8dda0; }
.gallery-piece time { display: block; margin-top: .15rem; font-size: .72rem; font-style: italic; font-weight: normal; }
.art-gallery.hide-captions figcaption { display: none; }
.minimal-gallery-mode .art-gallery { gap: 1rem; }
.minimal-gallery-mode .gallery-settings { display: none; }
.minimal-gallery-mode .gallery-section { padding: 0; border: 0; background: transparent; }.minimal-gallery-mode .gallery-section-grid { gap: 1rem; }
.minimal-gallery-mode .gallery-piece, .minimal-gallery-mode .gallery-piece:nth-child(n) { padding: 0; border: 0; background: transparent; box-shadow: none; transform: none; }
.minimal-gallery-mode .gallery-piece img { border: 0; }
.minimal-gallery-mode .gallery-piece figcaption { margin-top: .35rem; border: 0; background: transparent; box-shadow: none; color: var(--garden-ink); text-shadow: none; }
.ai-page { min-height: 100vh; background: #253032; color: #e6e0d2; font-family: "Times New Roman", Times, serif; }
.ai-main { width: min(680px, calc(100% - 3rem)); margin: 0 auto; padding: 12vh 0; line-height: 1.65; }
.ai-main h1 { font-size: clamp(2rem, 5vw, 3.5rem); }.ai-main .art-home { color: #c9dbaa; }
@media (max-width: 650px) { .art-header .art-home { position: static; margin-bottom: .5rem; }.gallery-settings { align-items: stretch; }.setting-row { flex: 1 1 42%; }.gallery-section-grid { grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: 1rem; } }
