/* Gifting Artistry — styles for orders, hand-off, account and the studio dashboard (self-contained copy). */
.ga-chip{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;line-height:1;padding:5px 9px;border-radius:12px;background:#f1ece8;color:#4a2a16;font-weight:600;max-width:100%;line-height:1.3}
.ga-chip.warn{background:#fff3d6;color:#6b4a00}.ga-chip.bad{background:#fde7e5;color:#8a1c12}.ga-chip.ok{background:#e5f4ea;color:#155d2c}.ga-chip.info{background:#e8f0fb;color:#1d4c8a}.ga-chip.mute{background:#f1f1f1;color:#555}
.ga-tstate{display:flex;flex-direction:column;gap:3px;border-left:4px solid #c99a5b;background:#fbf7f3;padding:10px 14px;margin:0 0 12px;border-radius:4px}
.ga-tstate.ga-t-confirmed{border-color:#2f8a4f;background:#f0f8f2}.ga-tstate.ga-t-saved{border-color:#b3261e;background:#fdf3f2}
.ga-tstate span{color:#555;font-size:14.5px}
.ga-steps{margin:0 0 6px;padding-left:22px;display:flex;flex-direction:column;gap:14px}
.ga-steps li{line-height:1.5}.ga-steps .row{margin:8px 0 4px;align-items:center}.ga-steps small{display:block;font-size:13px}
.ga-fn{font-size:13px;word-break:break-all}
.ga-chk{display:flex;gap:10px;align-items:flex-start;margin:8px 0;cursor:pointer;font-size:15.5px}.ga-chk input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:#4a2a16}
.ga-pay{font-size:14px;margin:10px 0 0}
.ga-gift .row .field{flex:1;min-width:200px}
.ga-dlg .ga-dlg-b p{line-height:1.55}.ga-dlg .ga-dlg-b ul{padding-left:20px}
.btn.danger{background:#9b1c13;color:#fff}
.ga-notice{border:1px solid #e6dcd3;background:#fbf8f5;border-radius:6px;padding:12px 16px;font-size:14.5px;line-height:1.55;margin:0 0 18px}
.ga-notice b{color:#4a2a16}
.ga-kv{display:grid;grid-template-columns:max-content 1fr;gap:4px 16px;margin:8px 0;font-size:15px}.ga-kv dt{color:#6b6b6b}.ga-kv dd{margin:0;word-break:break-word}
.ga-sec{margin-top:26px}.ga-sec>h3,.ga-sec>h2{margin:0 0 8px}
.ga-tbl{width:100%;border-collapse:collapse;font-size:14.5px}.ga-tbl th,.ga-tbl td{text-align:left;padding:8px 10px;border-bottom:1px solid #ececec;vertical-align:top}.ga-tbl th{font-weight:600;color:#555;background:#faf8f6;position:sticky;top:0}
.ga-tbl td.num,.ga-tbl th.num{text-align:right;white-space:nowrap}.ga-tbl tr.click{cursor:pointer}.ga-tbl tr.click:hover td{background:#fbf7f3}
.ga-tblw{overflow:auto;max-width:100%;border:1px solid #ececec;border-radius:6px}
.ga-thumbs{display:flex;flex-wrap:wrap;gap:8px}.ga-thumbs figure{margin:0;width:110px}.ga-thumbs img{width:110px;height:82px;object-fit:cover;border-radius:4px;display:block;background:#f2f2f2}.ga-thumbs figcaption{font-size:11.5px;color:#777;word-break:break-all}
.ga-outbox li{margin:6px 0}.ga-outbox{padding-left:18px}
.ga-proofs{display:flex;flex-wrap:wrap;gap:12px}.ga-proofs img{max-width:100%;width:320px;border:1px solid #e6e6e6;border-radius:4px}
.ga-drop{border:2px dashed #cdbfb2;border-radius:8px;padding:18px;text-align:center;background:#fdfbf9;color:#555;cursor:pointer}.ga-drop.over{background:#f5ece3;border-color:#4a2a16}
.ga-hist{font-size:13.5px;color:#555;max-height:220px;overflow:auto;padding-left:18px}
.ga-stars{display:flex;gap:4px}.ga-stars button{font-size:24px;background:none;border:0;cursor:pointer;color:#c9b8a8;padding:0 2px}.ga-stars button[aria-pressed="true"]{color:#b8860b}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid #c99a5b;outline-offset:2px}

/* ---- studio dashboard ---- */
body.studio-page .st-shell{max-width:1280px;margin:0 auto;padding:18px 16px 60px}
body.studio-page .st-top{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:8px}
body.studio-page .st-top h1{margin:0;font-size:28px}
body.studio-page .st-tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid #e6e6e6;margin:10px 0 18px}body.studio-page .st-tabs button{background:none;border:0;padding:10px 14px;font-size:15px;cursor:pointer;border-bottom:3px solid transparent;color:#444}body.studio-page .st-tabs button[aria-selected="true"]{border-color:#4a2a16;color:#1a1a1a;font-weight:600}
body.studio-page .st-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
body.studio-page .st-card{border:1px solid #e6e6e6;border-radius:6px;padding:12px 14px;background:#fff;text-align:left;cursor:pointer;font:inherit;color:inherit}body.studio-page .st-card:hover{border-color:#4a2a16}body.studio-page .st-card b{display:block;font-size:26px;line-height:1.1}body.studio-page .st-card span{font-size:13.5px;color:#555}
body.studio-page .st-card.hot{border-color:#c99a5b;background:#fffaf3}
body.studio-page .st-filters{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;margin-bottom:12px}body.studio-page .st-filters .field{margin:0;min-width:140px;flex:1}body.studio-page .st-filters .field.wide{flex:2;min-width:220px}body.studio-page .st-filters label{font-size:13px;color:#555;display:block;margin-bottom:3px}
body.studio-page .st-filters .in,body.studio-page .st-grid .in,body.studio-page .st-pane .in{min-height:40px;font-size:15px;padding:7px 10px}
body.studio-page .st-pane{border:1px solid #e6e6e6;border-radius:6px;padding:16px;background:#fff;margin-bottom:14px}body.studio-page .st-pane h3{margin:0 0 10px;font-size:18px}
body.studio-page .st-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
body.studio-page .st-detail{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:16px}
@media (max-width:900px){body.studio-page .st-detail{grid-template-columns:1fr}}
body.studio-page .st-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
body.studio-page .st-row .field{margin:0;flex:1;min-width:140px}body.studio-page .st-row label{font-size:13px;color:#555}
body.studio-page .st-pv{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}body.studio-page .st-pv svg{width:100%;height:auto;display:block;border:1px solid #eee}body.studio-page .st-pv small{font-size:12px;color:#666}
body.studio-page .st-attn{list-style:none;padding:0;margin:0}body.studio-page .st-attn li{display:flex;gap:10px;align-items:baseline;padding:8px 0;border-bottom:1px solid #f0f0f0;cursor:pointer}body.studio-page .st-attn li:hover{background:#fbf7f3}
body.studio-page .st-warn{background:#fff8e6;border:1px solid #f0d58a;border-radius:6px;padding:10px 14px;font-size:14.5px;margin-bottom:14px}
body.studio-page .st-empty{padding:30px;text-align:center;color:#666}
body.studio-page .st-big{font-size:22px;font-weight:600}
body.studio-page .st-back{margin-bottom:10px}
@media (max-width:700px){body.studio-page .st-ohead{flex-direction:column;align-items:stretch!important}body.studio-page .st-ohead h2{font-size:22px}body.studio-page .st-top h1{font-size:24px}}
#printArea{display:none}
@media print{
  body.ga-printing>*:not(#printArea){display:none!important}
  body.ga-printing #printArea{display:block!important}
  #printArea{font:12pt/1.45 Georgia,serif;color:#000}
  #printArea table{width:100%;border-collapse:collapse}#printArea td,#printArea th{border-bottom:1px solid #999;padding:4px 6px;text-align:left}
  #printArea h1{font-size:18pt;margin:0 0 6pt}#printArea h2{font-size:13pt;margin:12pt 0 4pt}
}
#acct .item{flex-wrap:wrap}#acct .item .tx{flex:1;min-width:160px}
/* number boxes in the album order form look like the other fields */
#orderForm input[type=number]#oQty{width:100%;min-height:52px;border:1px solid #e6e6e6;border-radius:var(--r,6px);padding:12px 16px;font:16px 'Inter',system-ui,sans-serif;background:#fff;color:var(--ink)}
#orderForm #oSpreads{min-height:40px;border:1px solid #e6e6e6;border-radius:var(--r,6px);padding:6px 10px;font:16px 'Inter',system-ui,sans-serif}
#oTotal .sum{width:100%}

/* public album gallery (Albums → Samples) */
.ga-galw{margin:0 0 34px}.ga-gal{margin:0 0 26px}.ga-gal h4{margin:0 0 4px;font-size:18px}
.ga-gal-strip{display:flex;gap:10px;overflow-x:auto;padding:4px 0 10px;scroll-snap-type:x mandatory}
.ga-gal-strip button{flex:none;border:0;padding:0;background:#f4f1ee;cursor:zoom-in;scroll-snap-align:start;border-radius:4px;overflow:hidden}
.ga-gal-strip img{height:220px;width:auto;display:block}
@media (max-width:600px){.ga-gal-strip img{height:150px}}
.fcols6{flex-wrap:wrap}
/* Studio → Prices */
body.studio-page .st-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:4px 16px}
body.studio-page .st-sticky{position:sticky;bottom:0;z-index:5;box-shadow:0 -4px 14px rgba(0,0,0,.08)}
body.studio-page .st-pane .ga-tbl input.in,body.studio-page .st-pane .ga-tbl select.in{min-height:36px}
body.studio-page .st-pane h4{margin:16px 0 6px}
@media (max-width:640px){body.studio-page .st-pane .ga-tbl{display:block;overflow-x:auto}}
.fprice .ga-pimg{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;margin-bottom:10px;display:block}
@media (max-width:640px){body.studio-page .st-pane .ga-tbl input[type=text]{min-width:160px}body.studio-page .st-pane .ga-tbl select.in{min-width:140px}body.studio-page .st-pane .ga-tbl td{white-space:nowrap}}
/* Designer, Step 5: compact design picker (small thumbnails + names, selected one highlighted) */
.st-covers{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px 8px!important}
@media (max-width:700px){.st-covers{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
.st-covers button{min-width:0;padding:2px 0 4px}
.st-covers .pv{width:100%;max-width:120px;margin:0 auto}
.st-covers b{font-size:11.5px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:5px!important}
.st-covers button:hover .pv{box-shadow:0 0 0 1px rgba(0,0,0,.25)}
.st-covers button[aria-pressed=true] .pv{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--accent,#4a2a16)!important}
.st-covers button[aria-pressed=true] b{color:var(--accent,#4a2a16)!important;font-weight:700!important}
/* Flip through: the photo side was pushed out of view (the watermark style made both faces stack). Keep both faces on top of each other. */
.fv-face.wm{position:absolute}
/* Flip through: "See All Pages" (photo page above date page for every month) */
.fv-mode{background:none;border:1px solid #d9d4cf;border-radius:999px;color:var(--accent,#4a2a16);font:inherit;font-size:14px;font-weight:600;cursor:pointer;padding:6px 12px;margin-right:6px}
.fv-mode[aria-pressed=true]{background:var(--accent,#4a2a16);border-color:var(--accent,#4a2a16);color:#fff}
.fv.fv-all .fv-wrap,.fv.fv-all .fv-bar{display:none}
.fv-list{flex:1;overflow:auto;width:100%;padding:6px 16px 32px;-webkit-overflow-scrolling:touch}
.fv-item{max-width:620px;margin:0 auto 30px}
.fv-item h4{margin:0 0 8px;font-size:15px}.fv-item h4 small{font-weight:400;color:#777;margin-left:6px}
.fv-pair{display:flex;flex-direction:column;gap:6px}
.fv-pg{background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.08),0 8px 24px rgba(0,0,0,.08);overflow:hidden}
.fv-pg svg{display:block;width:100%;height:auto}
.fv-pg.wm::after{font-size:clamp(28px,6vw,72px)}
@media (max-width:600px){.fv-mode{padding:5px 9px;font-size:13px}}
@media (max-width:600px){.fv-top{gap:8px}.fv-lbl{font-size:13px;line-height:1.25}}
/* ---- Album add-ons (Prices page + order form), js/addons.js ---- */
.adx .sub{margin-bottom:0}
.adx-jump{display:flex;gap:6px;margin:22px 0 0;flex-wrap:wrap}
.adx-jump a{flex:1;min-width:60px;text-align:center;font-size:13.5px;font-weight:500;border:1px solid #d9d9d9;border-radius:var(--r,8px);padding:8px 4px;color:var(--ink,#1a1a1a);background:#fff;text-decoration:none}
.adx-jump a:hover{border-color:var(--acc,#4a2a16);color:var(--acc,#4a2a16)}
.adx-sec{padding:36px 0 4px;border-top:1px solid var(--hair,#e8e2dc);margin-top:36px}
.adx-sec h3,.adx-sec h4{font-family:var(--head,Georgia,serif);font-weight:700;font-size:24px;letter-spacing:-.02em;line-height:1.2;display:flex;align-items:baseline;gap:12px;margin:0}
.adx-sec h4{font-size:19px}
.adx-no{font-size:14px;font-weight:400;font-style:italic;color:var(--acc,#4a2a16)}
.adx-intro{color:var(--muted,#6b6b6b);font-size:14.5px;margin:6px 0 0}
.adx-list{list-style:none;margin:14px 0 0;padding:0;border-top:1px solid var(--hair,#e8e2dc)}
.adx-row{display:flex;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--hair,#e8e2dc)}
.adx-row.off{opacity:.5}
.adx-lab{display:flex;align-items:center;gap:14px;flex:1;min-width:0;cursor:pointer;margin:0;font-weight:inherit}
.adx-row>.adx-lab+*{flex-basis:100%}
.adx-pick{flex-wrap:wrap}
.adx-lab input{width:20px;height:20px;flex:none;accent-color:var(--acc,#4a2a16);margin:0}
.adx-ph{flex:none;width:68px;height:52px;border-radius:6px;overflow:hidden;background:#f2efec}
.adx-ph img{width:100%;height:100%;object-fit:cover;display:block}
.adx-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.adx-t b{font-size:15px;font-weight:600;color:var(--ink,#1a1a1a)}
.adx-t span{font-size:13.5px;color:var(--muted,#6b6b6b)}
.adx-p{flex:none;font-weight:600;font-size:15px;white-space:nowrap;text-align:right}
.adx-sub{list-style:none;border-bottom:1px solid var(--hair,#e8e2dc);padding:4px 0 14px}
.adx-tabs{display:flex;gap:8px;margin:6px 0 10px}
.adx-tabs button{flex:1;border:1px solid #cfc8c1;background:#fff;border-radius:var(--r,8px);padding:9px 6px;font:inherit;font-size:14px;cursor:pointer;color:var(--ink,#1a1a1a)}
.adx-tabs button[aria-selected=true]{background:var(--acc,#4a2a16);border-color:var(--acc,#4a2a16);color:#fff}
.adx-mp{border:1px solid var(--hair,#e8e2dc);border-radius:var(--r,8px);padding:12px}
.adx-mp p{margin:0;font-size:13.5px;color:var(--muted,#6b6b6b)}
.adx-sws{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:10px 6px;margin:12px 0}
.adx-sw{background:none;border:0;padding:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:5px;font:inherit}
.adx-sw small{font-size:11.5px;line-height:1.2;text-align:center;color:var(--muted,#6b6b6b)}
.adx-dot{width:38px;height:38px;border-radius:50%;overflow:hidden;display:block;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.adx-dot img{width:100%;height:100%;object-fit:cover;display:block}
.adx-sw[aria-pressed=true] .adx-dot{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--acc,#4a2a16)}
.adx-sw[aria-pressed=true] small{color:var(--ink,#1a1a1a);font-weight:600}
.adx-chosen{font-size:13.5px}
.adx-in{width:100%;margin:6px 0 2px 34px;max-width:calc(100% - 34px)}
.adx-var,.adx-txt,.adx-warn{width:100%;margin:8px 0 0 34px;max-width:calc(100% - 34px);font-size:14px}
.adx-var{display:flex;gap:8px;align-items:center;cursor:pointer}.adx-var input{width:18px;height:18px;accent-color:var(--acc,#4a2a16)}
.adx-txt label{display:block;font-size:13px;color:var(--muted,#6b6b6b);margin-bottom:4px}
.adx-txt input{width:100%}
.adx-warn{color:#9b1c13;font-weight:600}
.adx-sizes{display:flex;align-items:center;gap:6px;margin:14px 0 4px;flex-wrap:wrap}
.adx-sizes span{font-size:13px;color:var(--muted,#6b6b6b);margin-right:4px}
.adx-sizes button{border:1px solid #cfc8c1;background:#fff;border-radius:var(--r,8px);padding:7px 11px;font:inherit;font-size:13.5px;cursor:pointer}
.adx-sizes button[aria-pressed=true]{background:var(--acc,#4a2a16);border-color:var(--acc,#4a2a16);color:#fff}
.adx-boxes{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 14px}
.adx-box{display:flex;flex-direction:column;gap:3px}
.adx-box.off{opacity:.45}
.adx-bph{display:block;aspect-ratio:3/2;border-radius:6px;overflow:hidden;background:#f2efec;margin-bottom:6px}
.adx-bph img{width:100%;height:100%;object-fit:cover;display:block}
.adx-box b{font-size:14.5px}
.adx-d{font-size:13px;color:var(--muted,#6b6b6b);line-height:1.35}
.adx-bp{display:flex;justify-content:space-between;align-items:center;margin-top:4px}
.adx-bp .adx-p{text-align:left}
.adx-bp em{font-style:normal;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;border:1px solid #cfc8c1;border-radius:4px;padding:2px 6px;color:#6b6b6b}
.adx-std{margin-top:18px}.adx-std span{display:block;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:#6b6b6b;margin-bottom:4px}
.adx-std table{width:100%;border-collapse:collapse;font-size:14px}.adx-std td{padding:8px 0;border-top:1px solid var(--hair,#e8e2dc)}.adx-std td+td{text-align:right;font-weight:600}
.adx-picker .adx-sec{margin-top:18px;padding-top:18px}
.adx-picker .adx-sec:first-child{margin-top:4px;border-top:0;padding-top:0}
.adx-picker .adx-ph{width:56px;height:44px}
@media (max-width:700px){.adx-boxes{grid-template-columns:repeat(2,minmax(0,1fr))}.adx-sec h3{font-size:21px}.adx-jump{flex-wrap:wrap}.adx-in,.adx-var,.adx-txt,.adx-warn{margin-left:0;max-width:100%}}
.fform .adx-lab{display:flex;margin:0;font-size:inherit;font-weight:inherit}
.fform .adx-var{display:flex;margin:8px 0 0 34px;font-size:14px}
.fform .adx-txt label{margin-bottom:4px;font-size:13px;font-weight:400}
.fform .adx-txt input[type=number]{max-width:120px}
@media (max-width:700px){.fform .adx-var{margin-left:0}}
/* Studio → Prices: album add-ons editor */
body.studio-page .st-adg{border-top:1px solid #eee;padding:14px 0 18px}
body.studio-page .st-adt td{vertical-align:top}
body.studio-page .st-adpic{width:96px}
body.studio-page .st-adpic img{width:84px;height:62px;object-fit:cover;border-radius:6px;display:block;margin-bottom:4px;background:#f3eee8}
body.studio-page .st-adnone{display:flex;align-items:center;justify-content:center;width:84px;height:62px;border:1px dashed #ccc;border-radius:6px;font-size:12px;color:#888;margin-bottom:4px}
body.studio-page .st-szp{display:grid;grid-template-columns:repeat(2,auto);gap:6px 10px;font-size:13px;white-space:nowrap}
body.studio-page .st-mats{margin-top:8px}body.studio-page .st-mats summary{cursor:pointer;color:#4a2a16;font-size:14px}
body.studio-page .st-mat{border:1px solid #eee;border-radius:6px;padding:8px;margin-top:8px;display:grid;gap:6px}
body.studio-page .st-cols{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px}
body.studio-page .st-col{display:flex;align-items:center;gap:6px}
body.studio-page .st-col img,body.studio-page .st-col input[type=color]{width:30px;height:30px;border-radius:50%;object-fit:cover;flex:none;border:1px solid #ddd;padding:0;background:none}
body.studio-page .st-col .in{min-height:32px;padding:4px 8px;font-size:14px}