/* YIMU storefront navigation and category-led gallery. */
:root{--header-height:78px;--sidebar-width:218px}
.site-header{height:var(--header-height);padding:0 30px;background:#000;border:0;color:#fff;gap:38px;position:sticky;top:0;z-index:20}
.wordmark{font-family:YimuDisplay,Georgia,serif;font-size:28px;letter-spacing:2px;flex-shrink:0}
.site-header nav{margin:0;gap:27px;flex-shrink:0}.site-header nav a,.site-header nav button{font-size:14px;letter-spacing:.025em;white-space:nowrap;color:#cecece}.site-header nav .active{color:#fff;border-bottom:2px solid #b09a7c}.site-header a:hover,.site-header button:hover{color:#cfbfa6}.site-header :focus-visible{outline-color:#d7c19d}
.header-actions{margin-left:auto;display:flex;align-items:center;gap:22px;min-width:0}.header-search{display:flex;align-items:center;gap:9px;width:clamp(160px,16vw,280px);border:1px solid #454545;background:#1a1a1a;border-radius:3px;padding:8px 11px}.header-search input{background:transparent;color:#fff;border:0;min-width:0;width:100%;font-size:14px;outline-offset:0}.header-search input::placeholder{color:#aaa}.header-search svg,.icon-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.4;flex-shrink:0}.header-search svg{color:#b0b0b0}.pricing-link{padding:8px 0;font-size:14px}.icon-button{padding:6px;width:34px;height:36px;display:grid;place-items:center;flex-shrink:0}.tool-label{position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden}
.page-layout{display:grid;grid-template-columns:var(--sidebar-width) minmax(0,1fr);min-height:calc(100vh - var(--header-height))}.category-sidebar{border-right:1px solid var(--line);padding:35px 16px 28px;position:sticky;top:var(--header-height);align-self:start;height:calc(100vh - var(--header-height));overflow:auto;background:#fff}.sidebar-heading{display:flex;justify-content:space-between;padding:0 12px 22px;font-size:11px;letter-spacing:1.6px;color:#8b877d}.sidebar-heading>span:last-child{font-size:16px;line-height:1}.category-list{display:flex;flex-direction:column;gap:4px}.category-list [data-category]{box-sizing:border-box;width:100%;color:inherit;text-decoration:none;text-align:left;min-height:43px;padding:10px 12px;border-radius:3px;font-size:15px;display:flex;justify-content:space-between;gap:8px;align-items:center;position:relative}.category-list [data-category]:hover{background:#f8f7f4}.category-list .selected{background:#f0ede6;color:#755333;font-weight:bold}.category-list .selected:before{content:'';position:absolute;left:0;height:18px;width:2px;background:#917355}.category-count{flex:0 0 auto;font-size:12px;line-height:1;border:1px solid #d8d1c4;border-radius:3px;padding:3px 5px;color:#837563}.sidebar-secondary{border-top:1px solid var(--line);margin-top:27px;padding-top:20px;display:flex;flex-direction:column;gap:8px}.sidebar-secondary button{padding:8px 12px;text-align:left;font-size:14px;color:var(--muted)}.sidebar-secondary button span{display:inline-block;width:24px;font-size:17px}.sidebar-secondary .selected{color:var(--accent);background:var(--soft)}.sidebar-note{font:italic 18px/1.5 YimuDisplay,serif;color:#a49b8f;margin:35px 12px 0}
main{width:auto;max-width:none;min-width:0;margin:0;padding:0 clamp(24px,2.4vw,48px);container-type:inline-size;container-name:gallery}
.intro{grid-template-columns:1fr 1.08fr;gap:35px;padding:34px 0 36px}.intro h1{font-size:clamp(42px,4vw,64px);margin-bottom:17px}.intro-copy{font-size:16px;margin-bottom:17px}.feature{height:290px}.feature-bottom{font-size:22px}.library{padding-top:24px;scroll-margin-top:calc(var(--header-height) + 20px)}.library-heading{margin-bottom:16px}.library h2{font-size:29px}.library h2 #categoryTitle{display:inline;font:inherit;vertical-align:baseline;color:inherit;margin:0}.library h2 #count{font-size:13px;margin-left:12px}.toolbar{padding:9px 0 17px;border-bottom:1px solid var(--line);margin:0 0 23px;align-items:center}.filter-summary{font-size:14px;color:var(--muted);margin:0}.filter-set label{font-size:14px}.grid-scroll{overflow:auto}.grid{grid-template-columns:repeat(4,minmax(0,1fr));min-width:640px;gap:28px 18px}.card-media{aspect-ratio:1}.card h3{font-size:17px}.card p{font-size:13px}.card-bottom{gap:5px}.card-arrow{font-size:20px}.card-action{font-size:13px;padding:9px 11px;left:10px;right:10px;bottom:10px}.media-label{left:10px;top:11px;font-size:10px;padding:4px 7px}.heart{right:9px;top:9px;width:29px;height:29px;font-size:22px}.collection-end{margin:42px 0}.empty h3{margin-top:0}.empty p{max-width:480px;margin:0 auto 18px}
@container gallery (min-width:1080px){.grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@container gallery (min-width:1370px){.grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
.info-dialog{max-width:570px;padding:50px 38px}.info-dialog h2{font:36px/1.2 YimuDisplay,serif;margin:0 0 22px}.info-dialog>p:not(.eyebrow){color:var(--muted);margin-bottom:28px}.collection-choices{display:grid;grid-template-columns:1fr 1fr;gap:9px}.collection-choices button{text-align:left;border-bottom:1px solid var(--line);padding:13px 0}.queue-status{text-align:center;border:1px solid var(--line);padding:30px 20px;margin-bottom:24px;color:var(--muted)}.queue-status svg{width:32px;height:32px;fill:none;stroke:#9b856a;stroke-width:1.2}.queue-status h3{color:var(--ink);font-weight:400;font-size:20px;margin:15px 0 10px}.queue-status p{font-size:15px;margin:0}
@media(min-width:1700px){:root{--sidebar-width:234px}.intro{padding:38px 0}.feature{height:315px}.site-header{gap:50px}.site-header nav{gap:34px}}
@media(max-width:1150px){.site-header{padding:0 20px;gap:24px}.site-header nav{gap:18px}.header-actions{gap:14px}.header-search{width:170px}:root{--sidebar-width:195px}.category-sidebar{padding-inline:11px}main{padding-inline:24px}.intro{gap:24px}.intro h1{font-size:45px}.feature{height:280px}.feature-bottom{font-size:18px}.feature-bottom,.feature-top{left:20px;right:20px}.hover-hint{display:none}.filter-set{gap:12px}}
@media(max-width:950px){:root{--header-height:120px}.site-header{height:auto;min-height:var(--header-height);display:grid;grid-template-columns:auto 1fr;gap:0 25px;padding-block:10px}.site-header nav{margin:0;justify-content:flex-end;gap:22px;height:42px;align-self:auto}.site-header nav a,.site-header nav button{display:flex}.header-actions{grid-column:1/-1;width:100%;gap:20px;margin:5px 0 0}.header-search{flex:1;width:auto}.intro{grid-template-columns:1fr}.intro h1 br{display:none}.intro h1{font-size:44px}.intro-copy br{display:none}.feature{height:230px}.toolbar{flex-wrap:wrap;align-items:center;gap:10px}.filter-set{margin-left:auto}.grid{gap:22px 14px}.card-action{opacity:1;transform:none}}
@media(max-width:650px){:root{--sidebar-width:158px}.site-header{padding-inline:15px;gap:0 14px}.wordmark{font-size:24px}.site-header nav{gap:13px}.site-header nav a,.site-header nav button{font-size:12px}.header-actions{gap:15px}.category-sidebar{padding:24px 8px}.sidebar-heading{font-size:10px;letter-spacing:1px;padding-inline:6px}.category-list [data-category]{padding-inline:8px;font-size:14px}.category-count{display:none}.sidebar-secondary button{padding-inline:8px;font-size:13px}.sidebar-secondary button span{width:19px}.sidebar-note{font-size:15px;margin-left:8px}main{padding-inline:18px}.intro{padding-top:26px;gap:22px}.intro h1{font-size:34px;letter-spacing:-1px}.intro-copy{font-size:15px}.intro .eyebrow{font-size:10px;letter-spacing:1.5px}.feature{height:200px}.feature-top{font-size:9px;left:14px;top:15px;letter-spacing:1px}.feature-bottom{left:14px;bottom:15px;right:14px;font-size:17px}.feature-bottom small{font-size:12px}.play-round{width:30px;height:30px;font-size:10px}.library h2{font-size:25px}.filter-set{flex-direction:column;align-items:flex-start;gap:2px;margin:0}.filter-set select{max-width:150px}.card p{font-size:13px}.grid{grid-template-columns:repeat(4,minmax(0,1fr))}.collection-end{font-size:15px}.info-dialog{padding:45px 25px}.info-dialog h2{font-size:30px}}

/* Compact intro and a non-modal queue drawer, keeping the gallery usable. */
.intro{display:block;padding:30px 0 27px}.intro h1{font-size:clamp(34px,3.3vw,52px);margin-bottom:12px;letter-spacing:-1.3px}.intro .eyebrow{margin-bottom:11px}.intro-copy{margin:0 0 12px}.intro .text-link{font-size:14px;gap:22px}.library{padding-top:22px}
.queue-dialog{position:fixed;inset:calc(var(--header-height) + 14px) 14px 14px auto;margin:0;width:min(320px,calc(100vw - 28px));height:auto;max-height:none;max-width:none;border:1px solid #e0e1dc;border-radius:8px;background:#f7f8f5;box-shadow:-12px 10px 40px #24251f18;padding:28px 20px 20px;z-index:30;overflow:auto}
.queue-dialog[open]{display:flex;flex-direction:column;animation:queue-slide-in .24s ease-out}.queue-dialog .eyebrow{font-size:10px;letter-spacing:1.4px;margin:9px 30px 10px 0}.queue-dialog h2{font-size:24px;margin-bottom:24px}.queue-dialog .close{border:1px solid var(--line);border-radius:5px;width:27px;height:27px;top:16px;right:15px;font-size:21px;line-height:1}.queue-dialog .queue-status{border:0;border-top:1px solid var(--line);padding:35px 4px;background:transparent}.queue-dialog .queue-status h3{font-size:18px}.queue-dialog .queue-status p{font-size:14px}.queue-dialog>.primary-button{margin-top:auto;font-size:14px}
@keyframes queue-slide-in{from{transform:translateX(calc(100% + 20px));opacity:0}to{transform:translateX(0);opacity:1}}
@media(prefers-reduced-motion:reduce){.queue-dialog[open]{animation:none}}
@media(max-width:650px){.intro{padding:25px 0}.intro h1{font-size:32px}.queue-dialog{inset:calc(var(--header-height) + 8px) 8px 8px auto;width:min(320px,calc(100vw - 16px))}}

/* Keep the scene action discreet until the action itself is targeted. */
.card .card-action,.card:hover .card-action{left:10px;right:auto;bottom:10px;width:max-content;max-width:calc(100% - 20px);min-height:32px;padding:6px 9px;gap:9px;justify-content:flex-start;border-radius:3px;background:rgba(255,255,255,.38);color:#24251f;font-size:12px;line-height:1.4;opacity:.55;transform:none;transition:background-color .16s ease,opacity .16s ease;box-shadow:none}
.card .card-action:hover,.card .card-action:focus-visible{background:rgba(255,255,255,.94);color:#24251f;opacity:1}
@media(prefers-reduced-motion:reduce){.card .card-action{transition:none}}

.preview-copy{display:flex;flex-direction:column;min-height:100%}.preview-copy .preview-note{margin-bottom:25px}.preview-copy .preview-use-button{margin-top:auto;align-self:flex-end;min-height:44px;width:190px;max-width:100%;background:#000;color:#fff;padding:13px 18px;font-size:14px;gap:25px;text-align:left;flex-shrink:0}.preview-copy .preview-use-button:hover{background:#292929;color:#fff}.preview-copy .action-notice{color:#765b3f;border-left:2px solid #a68d6d;padding-left:10px}

.site-header .wordmark{display:flex;align-items:center;line-height:1;letter-spacing:0}.brand-logo{display:block;width:90px;height:30px;object-fit:contain;flex-shrink:0}.footer-mark{display:flex;align-items:center;background:#000;padding:0 6px;line-height:1}.footer-mark .brand-logo{width:90px;height:30px}@media(max-width:650px){.site-header .brand-logo{width:90px;height:30px}}
.cart-button svg{stroke-width:2.7}

.card .heart{display:grid;place-items:center;padding:0;line-height:1;border:0;box-sizing:border-box}.card .heart svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}.card .heart[aria-pressed="true"] svg{fill:currentColor}
