/* Editorial craft shelf: user-approved photographs, restrained chrome. */
:root { --paper:#fffdfa;--purple:#dc4264;--purple-dark:#b33150; }
.home-hero { grid-template-columns:minmax(0,2.9fr) minmax(215px,1fr);gap:26px; }
.hero-photograph { border-radius:18px;box-shadow:0 8px 25px #886f4414; }
.hero-copy h2 { font-size:35px;line-height:1.45;color:#403640; }
.hero-copy .eyebrow { font-size:11px; }.hero-copy .hero-desc { color:#6d6168; }
.material-sample { margin-top:12px; }.material-sample #materialCanvas { height:45px;width:135px; }
.curated-card { padding:9px;background:white;border:1px solid #e9e2db;border-radius:16px;box-shadow:none;min-width:0;text-align:left; }
.cover-button { display:block;border:0;background:none;padding:0;width:100%;text-align:left;cursor:pointer; }
.curated-card .pattern-thumb { display:block;aspect-ratio:1;overflow:hidden;border-radius:10px;background:#eee0d1!important; }
.curated-card .pattern-thumb:before { display:none; }
.pattern-thumb img { width:100%;height:100%;object-fit:contain;display:block;transition:transform .25s; }
@media(hover:hover){.cover-button:hover .pattern-thumb img { transform:scale(1.025); }}
.curated-card .pattern-name { margin:12px 4px 7px;font-size:14px;line-height:1.6; }
.curated-card .pattern-detail { padding:0 4px;font-size:11px;color:#74636c;min-height:18px; }
.card-actions { display:flex;gap:8px;margin:11px 3px 3px; }
.card-actions button { flex:1;min-height:44px;border-radius:9px;border:1px solid #e7d9dc;background:white;color:#804252;font-size:12px;cursor:pointer; }
.card-actions button:first-child { background:#fff0f3;border-color:#f6d2dd;color:#9c2d4b; }
button:disabled { opacity:.55;cursor:wait; }
.theme-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
.curated-theme { display:flex;align-items:center;justify-content:space-between;padding:16px 17px;height:145px;border:1px solid #e9e2da;background:#fbf6ee;gap:12px; }
.curated-theme:nth-child(2) { background:#f8f0f4; }.curated-theme:nth-child(3) { background:#eff5f3; }
.curated-theme span { min-width:0; }.curated-theme strong { font-size:16px; }.curated-theme small { display:block;font-size:11px;line-height:1.8;margin-top:8px; }
.curated-theme img { width:105px;height:115px;object-fit:cover;border-radius:9px; }
.continue-art img,.banner-sticker img,.sample-preview img,.curated-small img { display:block;width:100%;height:100%;object-fit:contain; }
.continue-art { overflow:hidden; }.banner-sticker { overflow:hidden;width:190px;height:170px;transform:rotate(3deg);border-radius:12px; }
.curated-small { display:block;width:100%;height:100%; }
.challenge-banner { background:#f7edf0; }.play-list { align-items:start; }
.modal { width:min(600px,100%);max-height:calc(100dvh - 30px);padding:22px; }
.modal-scene { background:#faf5ed;height:340px;margin:12px 0; }
#modalCover { width:100%;height:100%;max-height:340px;object-fit:contain; }
.modal-scene canvas { width:100%;height:320px; }
[hidden] { display:none!important; }
.preview-switch { margin:4px 0 14px;gap:8px; }.preview-switch button { padding:0 13px;min-height:44px; }
.modal h2 { font-size:22px; }.modal p { font-size:12px;line-height:1.65; }.modal-meta { flex-wrap:wrap;gap:5px;margin:12px 0; }
.chart-download-row { display:flex;gap:9px;margin-top:13px; }.chart-download-row select { width:45%;min-width:0;border:1px solid #e1d9d5;border-radius:10px;padding:8px;background:white;color:#60545d;font-size:12px; }
.chart-download-row .btn { width:auto;flex:1; }.chart-explain { font-size:11px!important;line-height:1.7;color:#736772;margin:10px 0 0!important; }
.empty-collection { padding:26px;background:#f9f2ea;border-radius:14px;color:#6b5b65;line-height:1.9;grid-column:1/-1; }
.palette-line .color-pick { display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;width:54px;height:70px;border:1px solid #e8dfd9;border-radius:12px;background:#fff!important;outline-offset:0;transform:none; }
.palette-line .color-pick.active { background:#fff0f4!important;border-color:#d94670;outline:1px solid #d94670; }
.color-pick-bead { display:block;width:34px;height:37px;background-size:contain;background-position:center;background-repeat:no-repeat; }
.color-pick strong { font:700 12px/1.4 Arial,sans-serif;color:#493a43;letter-spacing:.4px; }
.color-pick.active strong { color:#a02346; }
.palette-line { gap:8px;flex-wrap:wrap;padding:15px 2px 6px; }.palette-current { flex:1 0 100%;margin:5px 0 0;font-size:12px; }
.color-guide { margin-top:12px; }.color-guide-actions { display:flex;gap:7px;flex-wrap:wrap; }
.color-guide-actions button { min-height:44px;border:1px solid #e8dce0;border-radius:10px;background:white;color:#694853;padding:8px 12px;font-size:12px;cursor:pointer; }
.color-guide-actions button[aria-pressed="true"] { color:#a02346;background:#fff0f4;border-color:#e8a7ba; }
.color-guide p { color:#5e5059;font-size:12px;line-height:1.7;margin:10px 0 4px; }
.color-guide small { display:block;color:#857782;font-size:11px;line-height:1.7; }
.color-guide button:focus-visible,.color-pick:focus-visible { outline:3px solid #7043b6;outline-offset:3px; }
.color-guide-actions button:active { background:#ffe2eb; }
.zoom-controls button { min-width:44px;height:44px; }.zoom-controls { gap:4px; }
.tools-panel .chart-explain { margin:0!important; }
.collection-grid .curated-card { min-width:0; }
@media(max-width:960px) and (min-width:641px){.home-hero { grid-template-columns:minmax(0,2fr) minmax(190px,1fr); }.hero-copy h2 { font-size:29px; }.curated-theme { padding:12px; }.curated-theme img { width:70px;height:90px; }.curated-theme strong { font-size:14px; }}
@media(max-width:640px){
 .hero-copy h2 { font-size:25px;margin-bottom:16px; }.hero-image-caption { font-size:9px; }
 .theme-strip { display:flex;overflow:auto;gap:10px;scroll-snap-type:x proximity; }.curated-theme { flex:0 0 86%;height:135px;scroll-snap-align:start; }
 .curated-theme img { width:110px;height:112px; }.pattern-grid { gap:12px; }
 .curated-card { padding:7px;border-radius:13px; }.curated-card .pattern-name { font-size:12px;margin:9px 2px 5px;min-height:38px; }.curated-card .pattern-detail { font-size:10px;padding:0 2px; }
 .card-actions { gap:6px;margin:8px 0 0; }.card-actions button { font-size:11px;padding:0 4px; }
 .modal { padding:17px; }.modal-scene { height:260px; }.modal-scene canvas { height:246px; }#modalCover { max-height:260px; }
 .modal h2 { font-size:19px; }.preview-switch { gap:6px; }.preview-switch button { font-size:11px;padding:0 10px; }
 .modal-meta span { font-size:10px;padding:6px; }.modal .chart-explain { font-size:10px!important; }
 .banner-sticker { width:125px;height:140px; }.challenge-banner h2 { font-size:21px; }
 .play-list { grid-template-columns:repeat(2,minmax(0,1fr)); }.collection-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}