/* Catalogue shell: one hierarchy for discovery, filtering, preview and selection. */
:root{--muted:#626b5b}body{font-size:14px}.header{padding-block:20px}.quiet{font-size:12px;color:#59624f;min-height:40px}.intro{padding-block:46px 40px;gap:42px}.intro p{color:#606953;font-size:14px}.intro-art{height:300px}.intro h1{font-size:clamp(34px,3.5vw,52px)}.intro-stats span,.offline-note{color:#5c6752}.recipes{margin-bottom:28px}.recipe-label>span,.recipes button small{color:#61704f}.discovery{max-width:1280px;margin:0 auto 52px;padding:0 15px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}.discovery button{border:1px solid #d4dacb;background:#e9edde;text-align:left;padding:21px;border-radius:12px;transition:transform .2s}.discovery button:first-child{background:#23382e;color:#eef2dc;border-color:#23382e}.discovery button:last-child{background:#e1e9e9}.discovery button:hover{transform:translateY(-3px)}.discovery small{font:9px ui-monospace,monospace;letter-spacing:1.4px;opacity:.7}.discovery strong{display:block;font-size:17px;font-weight:550;margin-top:14px}.discovery strong span{float:right}.discovery p{font-size:12px;opacity:.8;margin:9px 0 0}.catalog-heading{margin-bottom:20px}.catalog h2{font-size:28px}.catalog h2>span{font-size:12px;color:#657157}.catalog-controls{position:sticky;top:0;z-index:8;background:#f6f5f1f5;backdrop-filter:blur(16px);border-bottom:1px solid var(--line);margin-bottom:24px;padding-top:8px}.toolbar{border-top:1px solid var(--line);border-bottom:0;padding:12px 0;align-items:end;gap:14px}.search{flex:1;max-width:none;width:auto;min-height:46px;background:#fff;padding:11px 14px}.search input{font-size:13px}.search button{border:0;background:none;font-size:22px;color:#69745c;padding:0 5px}.control-label{display:flex;flex-direction:column;gap:6px;font-size:10px;color:#626e54}.control-label select{min-height:44px;font-size:12px;padding:8px 28px 8px 12px;border:1px solid #cbd2c1;border-radius:7px;background:#fff;color:#2b3921;max-width:100%}.filters{gap:3px}.filters button{font-size:12px;padding:10px 11px;min-height:40px}.filters button span{color:#657354}.filters button.active span{color:#e1ead5}.subtoolbar{font-size:12px;padding:12px 0 15px;color:#5d6c50}.subtoolbar p{max-width:75%;line-height:1.6}.filter-actions{display:flex;align-items:center;gap:16px}.filter-actions button{border:0;background:none;text-decoration:underline;text-underline-offset:3px;font-size:11px;white-space:nowrap}.mobile-category{display:none}.grid{align-items:stretch;gap:24px}.effect-card{display:flex;flex-direction:column}.effect-card .stage{height:270px;min-height:270px}.effect-meta{display:flex;flex:1;flex-direction:column;padding:20px}.effect-top h3{font-size:17px;line-height:1.4}.effect-top small{font-size:10px;color:#6f7965}.effect-meta p{font-size:13px;color:#58634d;line-height:1.75;margin:14px 0}.meta-bottom{margin-top:auto;padding-top:6px}.tags span{font-size:10px;color:#5b6b48;background:#edf1e6}.open-effect{font-size:12px;padding:10px 0;color:#3c5429;min-height:40px}.select-effect{width:36px;height:36px;min-width:36px}.effect-source{font-size:11px;line-height:1.6;color:#4b6837}.pagination{display:flex;justify-content:center;align-items:center;gap:24px;margin:34px 0 16px;font-size:12px;color:#546247}.pagination button{border:1px solid #c9d2be;border-radius:7px;padding:12px 18px;background:#fff;color:#344529;min-height:44px}.pagination button:disabled{opacity:.4;cursor:default}.stage-prompt{letter-spacing:.3px;font-size:10px}.stage-label{font-size:9px}.stage[data-active=false] *:before,.stage[data-active=false] *:after,body.preview-open #grid *,body.preview-open #grid *:before,body.preview-open #grid *:after{animation-play-state:paused!important}body.modal-open{overflow:hidden}dialog{width:min(1080px,94vw);max-height:92dvh;overscroll-behavior:contain;padding:24px;border-radius:18px}#preview-dialog{scrollbar-gutter:stable}.preview-top{position:sticky;top:-24px;background:#f6f5f1f5;z-index:10;padding:12px 0;gap:12px;margin-top:-12px;backdrop-filter:blur(12px)}.preview-top .eyebrow{font-size:10px;flex:1;letter-spacing:.7px}.preview-controls{display:flex;align-items:center;gap:6px}.preview-controls button{border:1px solid #d0d7c6;background:#fff;border-radius:7px;padding:8px 10px;font-size:12px;min-height:38px;white-space:nowrap}.preview-controls button:disabled{opacity:.4;cursor:default}#preview-position{font:10px monospace;color:#62724e;padding:0 4px;white-space:nowrap}.close-dialog{min-width:40px;min-height:40px}.preview-stage,.preview-stage.github-demo,.preview-stage.advanced-demo,.preview-stage.fluid-cloud{height:clamp(320px,52vh,520px);min-height:320px}.preview-info{gap:24px;padding-top:24px}.preview-info h2{font-size:26px}.preview-info p{font-size:14px;line-height:1.85;color:#5c6752}.preview-help{font-size:12px;line-height:1.8;color:#536245}.preview-info .primary{min-height:46px}.preview-stage .demo-content{scale:1.15}.preview-stage.advanced-demo .demo-content{scale:1}.frame-status{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px;background:#12231d;color:#e3edd5;text-align:center;padding:24px;z-index:5;font-size:13px;line-height:1.7}.frame-status button{border:1px solid #9eae85;background:#d9e4c5;color:#24351f;padding:10px 16px;border-radius:8px}.selection-dock{max-width:760px}.dock-caption{font-size:11px}.selection-dock b{font-size:12px}.selected-row{font-size:14px}.selected-row button{min-width:40px;min-height:40px}#selection-dialog{width:min(780px,94vw)}#selection-dialog input,#selection-dialog select,#brief{font-size:14px}.local-note{font-size:12px;color:#627053}#back-top{position:fixed;right:24px;bottom:105px;width:44px;height:44px;border-radius:50%;border:1px solid #b9c6aa;background:#f6f5f1f5;font-size:24px;z-index:9;color:#435437}.toast{z-index:100;padding:14px 20px;max-width:min(90vw,550px)}.catalog{scroll-margin-top:12px}#grid{scroll-margin-top:210px}.primary,.secondary{min-height:44px}button:disabled{cursor:default}.stage .demo-word{overflow-wrap:normal}.tilt-card .demo-word{font-size:28px;white-space:nowrap}
@media(max-width:1100px){.discovery{padding:0 5%}.toolbar{flex-wrap:nowrap}.control-label select{max-width:200px}.search{width:auto}.filters{gap:2px}.filters button{padding:9px}.intro-art{height:280px}.discovery strong{font-size:15px}}
@media(max-width:760px){.intro{grid-template-columns:1fr;padding:32px 6%;gap:20px}.intro h1{font-size:36px}.intro-art{height:190px}.art-card{transform:scale(.8);top:0!important}.art-card.front{top:8px!important;width:145px;height:170px;padding:12px}.art-card.front b{font-size:22px;margin-top:5px}.art-spark{font-size:45px}.art-card.front small{bottom:12px;font-size:5px}.art-card.back{width:140px;height:170px;padding:12px}.wire-sphere{width:70px;height:70px;margin:18px 0 12px}.art-card.back b{font-size:15px}.art-note{display:none}.art-tag{bottom:9px;padding:6px}.recipes{margin-bottom:20px}.discovery{grid-template-columns:1fr;gap:8px;margin-bottom:32px}.discovery button{padding:15px 18px}.discovery small{font-size:8px}.discovery strong{margin-top:5px;font-size:16px}.discovery p{font-size:12px;margin-top:5px}.catalog h2{font-size:22px}.catalog h2>span{font-size:11px}.catalog-controls{padding-top:4px}.toolbar{display:grid;grid-template-columns:1.35fr 1fr;gap:10px;padding-top:9px}.search{grid-column:1/-1;width:100%}.control-label select{max-width:100%;width:100%;font-size:12px;min-height:40px}.filters{display:none}.mobile-category{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px}.mobile-category select{width:70%}.subtoolbar{font-size:11px;padding:10px 0}.subtoolbar p{max-width:56%;font-size:11px}.filter-actions{gap:8px;align-items:flex-end;flex-direction:column}.grid{grid-template-columns:1fr}.effect-card .stage{height:270px;min-height:270px}.effect-meta{padding:18px}.pagination{gap:12px}.pagination button{padding:10px 12px}.preview-top{flex-wrap:wrap;top:-17px;padding:8px 0;margin-top:-5px;gap:8px}.preview-top .eyebrow{flex-basis:75%;order:0}.preview-top .close-dialog{order:1}.preview-controls{order:2;flex-basis:100%;justify-content:space-between;gap:3px}.preview-controls button{font-size:11px;padding:7px 8px}.preview-stage,.preview-stage.github-demo,.preview-stage.advanced-demo,.preview-stage.fluid-cloud{height:360px;min-height:360px}.preview-stage .demo-content{scale:1}.preview-info h2{font-size:23px}.preview-info p{font-size:13px}.preview-help{font-size:12px}.selection-dock{bottom:10px;width:calc(100% - 24px)}#back-top{right:16px;bottom:84px;width:40px;height:40px}dialog{padding:17px;width:95vw;max-height:94dvh}.header-actions{gap:9px}.quiet{font-size:10px}.header{padding:15px 5%}.intro p{font-size:13px}.catalog-controls #category-description{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.new-tag{display:none}#grid{scroll-margin-top:290px}.preview-top #preview-position{font-size:9px}.preview-stage .tilt-card .demo-word{font-size:26px}}
@media(prefers-reduced-motion:reduce){.discovery button,.primary{transition:none}}
/* Keep one preview height across mixed rows; forms and controls must remain reachable. */
.effect-card .stage{height:320px;min-height:320px}