/* A shared phone layout. Generation, account checks and pricing stay in their owners. */
.native-tabs svg{width:24px;height:24px}
.native-tools-back,.browse-tools{min-height:44px;border:0;background:transparent;color:var(--cobalt);font:600 14px Inter,sans-serif;padding:10px 0;text-align:left}
.project-name-option{margin:16px 0}.project-name-option summary{min-height:44px;cursor:pointer;font-weight:600;padding:10px 0}.project-name-option summary span{font-weight:400;color:var(--muted);margin-left:8px}
.gallery-search-row{display:flex;align-items:flex-start;gap:10px;width:100%;position:relative}
#ylSearch{min-width:0;flex:1;min-height:44px;padding:10px 12px;border:1px solid var(--hair);border-radius:12px;background:white;font:inherit}
.gallery-filter-panel>summary{list-style:none;min-height:44px;padding:10px 16px;border:1px solid var(--hair);border-radius:12px;cursor:pointer;background:white;font-weight:600}
.gallery-filter-panel .yl-filters{position:absolute;z-index:12;right:0;top:52px;width:min(320px,100%);padding:14px;background:var(--paper);border:1px solid var(--hair);border-radius:14px;box-shadow:0 12px 35px #17212c18;display:grid}
.gallery-filter-panel select,.gallery-filter-panel button{min-height:44px;font:inherit;max-width:100%}
.project-cover{grid-column:1/-1;display:block;position:relative;overflow:hidden;aspect-ratio:16/10;background:#eceae5;border-radius:14px;margin-bottom:12px}
.project-cover img{width:100%;height:100%;object-fit:cover;display:block}.project-cover>span{position:absolute;bottom:10px;left:10px;padding:5px 9px;border-radius:8px;background:#fff;color:#444;font-size:12px}
.project-cover-empty{display:grid;place-items:center}.project-cover-empty svg{width:40px;height:40px;color:#818994}
.design-card-heading{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:center!important;gap:4px 12px;list-style:none!important}.design-card-heading::-webkit-details-marker{display:none}
.design-card-heading h3{font-size:18px!important}.design-card-heading .tag{white-space:normal;text-align:center}
#myProps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:18px;align-items:start}#myProps>.design-card{margin:0!important;min-width:0}#myProps>.design-card[open]{grid-column:1/-1}
.design-card[open]>.design-card-heading>.project-cover{max-height:180px;aspect-ratio:auto}.design-card[open]>.design-card-heading>.project-cover img{object-fit:contain}
.hd-gallerywrap{scroll-margin-top:calc(var(--native-header-height,111px) + 20px)}
.design-failure-summary{font-size:15px;color:#7e2626;line-height:1.5}.design-failure-summary p{margin:5px 0}.failure-details{font-size:14px;margin:8px 0;color:var(--muted)}.failure-details summary{min-height:44px;padding:10px 0;cursor:pointer}.failure-details p{overflow-wrap:anywhere}
.image-viewer-actions{display:flex;gap:8px;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--paper,#faf8f4);border-top:1px solid #ddd}.image-viewer-actions[hidden]{display:none}.image-viewer-actions button{flex:1;font-size:14px}.image-viewer-actions button:first-child{background:#2451ed;color:white;border-color:#2451ed}
#cmpOvl::backdrop,#rcOvl::backdrop{background:#171717cc}#rcPrint,#rcClose{min-height:44px}#cmpPrev,#cmpNext{min-width:44px;min-height:44px}
@media(max-width:899px){
  .app-layout body{--mobile-nav-height:76px;font-size:16px}
  .app-layout .native-tabs button{font-size:12px;gap:4px}
  .app-layout .native-tools{padding:20px 16px}.native-tools h1{font-size:26px;margin:8px 0 16px}
  .native-categories{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;margin:12px -16px 16px;padding:0 16px 6px}.native-categories button{min-height:44px;font-size:14px}
  .native-category-hint{display:none}.native-comparison-controls{font-size:14px;margin-bottom:16px}
  .native-tool-launch{padding:12px;min-height:88px}.native-tool-launch strong{font-size:15px}.native-tool-launch small{font-size:14px;line-height:1.45}
  html.flow-guided.app-layout #wiz{padding:0 16px!important}.app-layout #wiz .wiz-head{padding:16px 0 0}.app-layout #wiz .wiz-body{padding:0 0 32px}
  .app-layout #wiz .plain-guide{display:none}.app-layout #wiz .wiz-meta{margin:10px 0 14px;font-size:13px}.app-layout #wiz .wiz-step h2{font:700 28px/1.15 Inter,sans-serif;letter-spacing:-.7px;margin:0 0 8px}.app-layout #wiz .wiz-sub{font-size:15px;line-height:1.5;margin:0 0 18px}
  .app-layout .project-purpose{margin:0 0 12px!important;padding:0!important;border:0!important}.app-layout .project-purpose legend{font-size:14px;margin-bottom:8px;font-weight:600}.app-layout .purpose-choices{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}.app-layout .purpose-choices button{padding:10px!important;min-height:80px!important;border-radius:12px!important;text-align:left}.app-layout .purpose-choices strong{font-size:14px!important;line-height:1.3}.app-layout .purpose-choices span{font-size:12px!important;line-height:1.4;margin-top:4px!important}
  .app-layout #wizDrop{min-height:146px!important;border:1.5px dashed #9aafe9!important;background:#f4f6ff!important;border-radius:18px!important;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:20px!important}.app-layout #wizDrop b{font-size:18px;color:var(--cobalt)}.app-layout #wizDrop span{font-size:13px;line-height:1.4;color:#536078}
  .app-layout .inspo-entry{min-height:44px;padding:8px 0;margin:0 0 8px;font-size:14px}.app-layout .browse-tools{display:block;margin-top:8px}
  .app-layout .project-name-option{margin:8px 0}.app-layout .project-name-option summary{font-size:14px;color:var(--muted)}
  .app-layout .has-mobile-action #wiz .wiz-body{padding-bottom:100px}
  .app-layout .mobile-primary-action{position:fixed!important;z-index:105;bottom:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + 10px);left:50%;transform:translateX(-50%);width:calc(100% - 32px)!important;max-width:608px;min-height:50px!important;margin:0!important;border-radius:14px!important;box-shadow:0 0 0 10px var(--paper),0 8px 24px #17212c12;font-size:15px!important}
  .app-layout .mobile-keyboard-open .mobile-primary-action{bottom:calc(var(--mobile-keyboard) + 10px)}.app-layout .mobile-keyboard-open .native-tabs{visibility:hidden}
  .app-layout #wizBack{min-height:44px;padding:8px;font-size:14px}
  .app-layout .yl-head{display:flex;flex-direction:column;align-items:stretch;gap:16px;margin-bottom:16px}.app-layout .yl-head h2{font:700 28px/1.15 Inter,sans-serif}.app-layout #ylStatus{font-size:13px;color:var(--muted);margin:8px 0 18px}.app-layout #myProps{grid-template-columns:1fr}.app-layout .design-card-heading{padding:0!important}.app-layout .design-card{padding:14px!important;border-radius:20px!important}.app-layout .design-card-heading h3{font-family:Inter,sans-serif!important}.app-layout .design-purpose-label{font-size:12px}.app-layout .design-card .tag{font-size:11px}
  .app-layout .design-image-actions>button,.app-layout .image-view-tabs>button,.app-layout .design-card-footer button,.app-layout .design-card-footer summary,.app-layout .design-image-more summary{min-height:44px;font-size:14px}.app-layout .image-download{background:var(--cobalt)!important;border-color:var(--cobalt)!important;color:white!important}.app-layout .design-image-actions{gap:8px;align-items:stretch}.app-layout .design-image-actions>.image-download,.app-layout .design-image-actions>.editbtn{flex:1 1 calc(50% - 4px)}
  /* The download fallback appears later; give it a row so Edit stays readable. */
  .app-layout .design-image-actions>.image-open{flex:1 0 100%}
  .app-layout #editModal{padding:12px!important;z-index:450}.app-layout #editModal .ed-card{border-radius:20px;max-height:calc(100dvh - 24px);padding:16px;overflow-y:auto}.app-layout #editModal .ed-head{position:sticky;top:-16px;background:var(--paper);z-index:2;padding-top:4px}.app-layout #editTitle{font:700 24px/1.2 Inter,sans-serif}.app-layout #editClose{min-width:44px;min-height:44px;flex-shrink:0}.app-layout #editModal .ed-sub{font-size:14px;margin:4px 0 14px}.app-layout #editStage{max-height:27dvh;min-height:120px;overflow:hidden;border-radius:14px;background:#eeece6}.app-layout #editImg{width:100%;height:27dvh;object-fit:contain}.app-layout #editText{font-size:16px;min-height:80px}.app-layout .ed-tips{gap:6px}.app-layout .ed-tips button{min-height:44px;font-size:13px;padding:8px 10px}.app-layout #editModal .ed-note{font-size:13px;line-height:1.5}.app-layout #editModal .ed-note summary{min-height:44px;padding:10px 0}.app-layout #editGo{position:sticky;bottom:0;min-height:50px;z-index:2;box-shadow:0 8px 0 8px var(--paper);margin:8px 0}.app-layout body:has(#editModal.on) .native-tabs{visibility:hidden}
  .app-layout .inspo-try{font-size:15px}.app-layout .inspo-head h2{font:700 26px/1.2 Inter,sans-serif}
}

@media(max-width:899px){.app-layout .project-purpose button{text-align:left!important;align-items:flex-start!important;justify-content:flex-start!important}.app-layout #wiz .project-purpose .purpose-choices{margin:0}.app-layout #wiz .project-purpose .purpose-choices button{min-height:74px!important}.app-layout #wiz .project-purpose .purpose-choices strong{font-size:14px!important}.app-layout #wiz .project-purpose .purpose-choices span{font-size:12px!important}.app-layout #wiz .wiz-step{padding-top:0!important}.app-layout #wiz .inspo-entry{margin:6px 0}.app-layout #wiz{scroll-margin-top:var(--native-header-height,111px)}}

@media(max-width:899px){
  .app-layout #wizReviewPhotoMount #wizPhotoFields{display:flex;flex-direction:column;gap:8px}
  .app-layout #wizReviewPhotoMount #selectedPhotoWork{order:-1}
  .app-layout #wizReviewPhotoMount #selectedPhotoPreview{max-height:190px;object-fit:contain;margin:0 auto}
  .app-layout #wizReviewPhotoMount #wizDrop{min-height:48px!important;padding:12px!important;border-style:solid!important}
  .app-layout #wizReviewPhotoMount #wizDrop b{font-size:15px}
  .app-layout #wizReviewPhotoMount #wizDrop span{display:none}
  .app-layout body:has(#wizGo.mobile-primary-action) #designImageCount{position:fixed;z-index:106;bottom:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + 64px);left:50%;transform:translateX(-50%);width:calc(100% - 32px);max-width:608px;margin:0;padding:8px 5px 6px;background:var(--paper);font-size:12px;line-height:1.4;text-align:center;border-radius:10px 10px 0 0}
  .app-layout body:has(#wizGo.mobile-primary-action) #wiz .wiz-body{padding-bottom:155px}
  .app-layout .mobile-keyboard-open:has(#wizGo.mobile-primary-action) #designImageCount{bottom:calc(var(--mobile-keyboard) + 64px)}
}
@media(max-width:899px){.app-layout .mobile-primary-action:disabled{opacity:1!important;background:#8ca7ed!important;color:#fff!important;box-shadow:0 0 0 10px var(--paper),0 8px 24px #17212c12}}

/* Shared action shape; card actions stay aligned even with different title lengths. */
:root{--studio-action-radius:14px;--studio-action-height:50px}
.app-layout :is(.native-primary,.mobile-primary-action,#editGo,.reno-continue),.app-layout #inspirationBrowser .inspo-try{min-height:var(--studio-action-height);border-radius:var(--studio-action-radius);font:700 15px/1.3 Inter,system-ui,sans-serif;padding:12px 16px;display:flex;align-items:center;justify-content:center;text-align:center}
#inspirationBrowser .inspo-tile{display:flex;flex-direction:column}
#inspirationBrowser .inspo-tile>.inspo-card{height:auto;flex:1}
#inspirationBrowser .inspo-tile>.inspo-try{flex:none;height:var(--studio-action-height);white-space:nowrap;padding:12px 8px}
