/* Local interaction proposal; existing home and inner pages are unchanged. */
#portrait-workbench .wb-shell{height:auto;min-height:620px;grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr)}
#portrait-workbench .wb-panel{grid-column:1;grid-row:1;display:flex;flex-direction:column;height:auto;border:0;padding:28px;gap:24px;overflow:visible}
#portrait-workbench .wb-stage{grid-column:2;grid-row:1;min-height:620px;height:auto;padding:30px}
#portrait-workbench .wb-upload,#portrait-workbench .wb-action{padding:0;border:0;background:none}
#portrait-workbench .wb-action{margin-top:auto}.wb-selectedline{display:none}
#portrait-workbench .wb-file{height:185px}#portrait-workbench .wb-file.has-photo{height:150px;grid-template-columns:110px 1fr}#portrait-workbench .wb-file.has-photo img{width:110px;height:125px}
#portrait-workbench .wb-sample{font-size:12px;margin-top:14px}
#portrait-workbench .wb-canvas{min-height:410px}#portrait-workbench .wb-frame{width:min(360px,90%);height:440px}
#portrait-workbench .wb-stagebar h3{font-size:28px}#portrait-workbench .wb-stagefoot{min-height:40px}
.hp-template-label{font-size:11px;letter-spacing:.12em;color:var(--brass);text-transform:uppercase;font-weight:600;margin-bottom:10px}
.hp-template-button{width:100%;display:flex;gap:15px;align-items:center;padding:12px;border:1px solid var(--line);background:#fff;border-radius:13px;text-align:left;color:var(--ink);cursor:pointer}
.hp-template-button:hover{border-color:var(--brass)}.hp-template-button img{width:64px;height:80px;object-fit:contain;background:var(--paper-2);border-radius:7px}.hp-template-button span{flex:1}.hp-template-button b{display:block;font:500 20px var(--serif)}.hp-template-button small{display:block;color:var(--ink-soft);margin-top:6px}.hp-template-button em{font-style:normal;font-size:24px;color:var(--green)}
.hp-preview-note{font-size:12px;color:var(--ink-soft);text-align:center;margin:16px 0 0}.hp-template-dialog{width:min(1180px,calc(100vw - 40px));max-height:calc(100dvh - 48px);padding:0;border:1px solid var(--line);border-radius:22px;background:var(--paper);color:var(--ink);box-shadow:0 30px 80px #0005;margin:auto}
.hp-template-dialog::backdrop{background:#11271fc2;backdrop-filter:blur(3px)}
.hp-modal-head{display:flex;align-items:center;justify-content:space-between;padding:25px 28px 16px;gap:16px}.hp-modal-head h2{font:500 32px var(--serif);margin:0}.hp-modal-head p{font-size:13px;color:var(--ink-soft);margin-top:5px}
.hp-search{display:block;width:calc(100% - 56px);margin:0 28px 16px;padding:12px 15px;border:1px solid var(--line);border-radius:10px;background:white;font:14px var(--sans);color:var(--ink)}
.hp-filterbar{display:flex;gap:8px;overflow:auto;padding:0 28px 15px;border-bottom:1px solid var(--line)}.hp-filterbar button{white-space:nowrap;border:1px solid var(--line);border-radius:999px;padding:9px 15px;background:transparent;color:var(--ink);cursor:pointer}.hp-filterbar button.on{background:var(--green);color:var(--paper);border-color:var(--green)}
.hp-template-dialog .wb-library{max-height:58dvh;padding:20px 28px 28px}.hp-template-dialog .wb-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.hp-template-dialog .wb-style{padding:8px;border-radius:12px}.hp-template-dialog .wb-style img{aspect-ratio:4/5;object-fit:contain;background:var(--paper-2)}.hp-template-dialog .wb-style strong{font:500 17px var(--serif);white-space:normal;margin:10px 3px 4px}.hp-template-dialog .wb-style small{font-size:11px;white-space:normal;line-height:1.4}.hp-empty{grid-column:1/-1;padding:45px;text-align:center;color:var(--ink-soft)}
@media(max-width:800px){#portrait-workbench .wb-shell{grid-template-columns:1fr}#portrait-workbench .wb-panel{grid-column:1;grid-row:1;padding:22px;gap:22px}#portrait-workbench .wb-stage{grid-column:1;grid-row:2;min-height:520px;padding:20px}#portrait-workbench .wb-file{height:145px}#portrait-workbench .wb-canvas{min-height:320px}#portrait-workbench .wb-frame{height:350px} .hp-template-dialog .wb-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:520px){.hp-template-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-radius:15px}.hp-modal-head{padding:20px 16px 12px}.hp-modal-head h2{font-size:27px}.hp-search{width:calc(100% - 32px);margin:0 16px 12px}.hp-filterbar{padding:0 16px 12px}.hp-template-dialog .wb-library{padding:16px;max-height:60dvh}.hp-template-dialog .wb-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}#portrait-workbench .wb-stagebar{display:block}#portrait-workbench .wb-views{margin-top:12px;width:max-content}}
#portrait-workbench{scroll-margin-top:95px}#portrait-workbench .wb-file b{font-size:16px}#portrait-workbench .wb-file small{font-size:11px}#portrait-workbench .wb-upload-title div{font-size:11px}#portrait-workbench .wb-actionnote{font-size:11px}

#portrait-workbench .wb-frame:not([style*="none"]){display:grid!important}

/* Match square artwork to square slots; keep card content top-aligned. */
.hp-template-dialog .wb-style{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch}
.hp-template-dialog .wb-style img{display:block;flex:none}
.hp-template-dialog .wb-style strong{min-height:2.5em;line-height:1.25;overflow:visible;text-overflow:clip}
.hp-template-dialog[data-category="Watercolor"] .wb-style img,
.hp-template-dialog[data-category="Oil painting"] .wb-style img,
.hp-template-dialog[data-category="Cartoon"] .wb-style img,
.hp-template-dialog[data-category="Pencil"] .wb-style img,
.hp-template-dialog[data-category="Pop art"] .wb-style img{aspect-ratio:1/1;height:auto}
.hp-template-button img{height:auto;max-height:80px;flex:0 0 64px;display:block;background:transparent}



.hp-template-dialog[data-category="Memorial"] .wb-style img,.hp-template-dialog[data-category="Horses"] .wb-style img,.hp-template-dialog[data-category="Van Gogh"] .wb-style img{aspect-ratio:1/1}.hp-template-dialog .wb-style img{background:#fff}

/* Direct category access: wrap labels instead of nesting category menus. */
.hp-template-dialog .hp-filterbar{flex-wrap:wrap;overflow:visible}
.hp-template-dialog[open]{display:flex;flex-direction:column;overflow:hidden}
.hp-template-dialog .hp-modal-head,.hp-template-dialog .hp-search,.hp-template-dialog .hp-filterbar{flex-shrink:0}
.hp-template-dialog .wb-library{min-height:0;overflow-y:auto}
@media(max-width:520px){.hp-template-dialog .hp-filterbar{gap:6px}.hp-template-dialog .hp-filterbar button{padding:7px 10px;font-size:12px}}