
:root{--journey-ink:#17324d;--journey-teal:#087577}
:focus-visible{outline:3px solid #b47500;outline-offset:4px}button:disabled{cursor:not-allowed;opacity:.5}
#studio-loading,#draft-message,.draft-note,.studio-help{max-width:1240px;margin:16px auto;padding:0 18px}#draft-message:empty{display:none}#draft-message{background:#fff8ed;padding:16px;border-radius:12px}#save-state{max-width:250px}.draft-note{font-size:14px;color:#596775}.studio-help a{color:#087577}.photo-help{margin:16px 0}.photo-help summary{cursor:pointer;font-weight:700}.photo-help p{max-width:72ch}.drop:focus-within{outline:3px solid #b47500;outline-offset:4px}.drop input{pointer-events:auto}
.thumbs{grid-template-columns:repeat(4,minmax(0,1fr))}.thumbs figure{aspect-ratio:auto;overflow:hidden}.thumbs img{display:block;aspect-ratio:1;max-height:220px}.thumbs figcaption{padding:10px;background:white}.photo-actions{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}.thumbs .photo-actions button{position:static;width:auto;height:auto;min-height:44px;padding:8px;border-radius:7px;font-size:12px}.thumbs figcaption span{font-weight:700}
.sample-book{padding:12px;border-radius:12px;background:#f3ede1;color:#26394b;display:grid;grid-template-columns:.62fr 1fr;gap:10px}.sample-cover{padding:10px;background:#fdf8ea;border:1px solid #ded0ab;display:flex;flex-direction:column;gap:8px;box-shadow:2px 3px 6px #0002}.sample-cover>span{font-size:8px;letter-spacing:2px}.sample-cover strong{font:700 14px Georgia}.sample-cover img{width:100%;height:85px;object-fit:cover}.sample-spread{display:grid;grid-template-columns:1fr 1fr;background:#fffdf9;box-shadow:2px 3px 6px #0002;min-height:145px}.sample-spread>div{padding:7px;display:flex;flex-direction:column;gap:8px;justify-content:center}.sample-spread>div+div{border-left:1px solid #dfdcd3}.sample-spread img{width:100%;height:60px;object-fit:cover}.sample-spread b{font:700 10px Georgia}.sample-spread i{font:italic 9px Georgia}.sample-lines{height:28px;background:repeating-linear-gradient(transparent 0 5px,#d9d3c7 5px 6px)}.sample-spread.second{grid-column:1/-1;min-height:80px}.sample-spread.second img{height:65px}.style-1{background:#e6ecef}.style-1 .sample-cover{background:#17324d;color:white}.style-2{background:#f6e5db}.style-2 .sample-cover{background:#a64f3d;color:white}.sample-label{display:block;font-size:12px;color:#596775;line-height:1.5}.template p{min-height:0}.template .sample-book{margin-bottom:16px}
.journey-links{display:flex;gap:16px;flex-wrap:wrap;margin:18px 0}.journey-links a{color:inherit}.journey-process{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.journey-process article{border:1px solid #dfe5e5;padding:22px;border-radius:16px}.journey-process b{color:#087577}.enquiry-status{padding:16px;background:#fff8ed;border-radius:12px;white-space:pre-line}.enquiry-status:empty{display:none}.enquiry-status.error{border:2px solid #a23c30}.hp-field{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.contact-options{display:flex;flex-wrap:wrap;gap:14px;margin:18px 0}.form small{font-weight:400}.form select{width:100%;padding:13px;border:1px solid #aebbc3;border-radius:9px;background:white;font:inherit}.form .check{display:flex;align-items:start;gap:12px}.form .check input{width:auto}.steps button[aria-current=step]{font-weight:900}
@media(max-width:600px){.studio-header{height:auto;min-height:76px;padding:10px 12px;gap:10px}.studio-header>div{gap:8px}.studio-header>div #save-state{display:block;font-size:11px;max-width:125px;line-height:1.3}.steps{top:76px}.thumbs{grid-template-columns:repeat(2,minmax(0,1fr))}.photo-actions{display:grid;grid-template-columns:1fr 1fr}.photo-actions button:last-child{grid-column:1/-1}.sample-book{max-width:480px}.journey-process{grid-template-columns:1fr}.bar{padding-bottom:max(13px,env(safe-area-inset-bottom))}.summary-row{gap:12px;overflow-wrap:anywhere}.summary-row b{text-align:right}.studio-help{padding-bottom:30px}.draft-note{margin-top:30px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
@media(max-width:600px){.studio-header .brand{font-size:1.2rem}.studio-header>div{min-width:0}.studio-header>div #save-state{max-width:100px}.studio-header #save-exit{font-size:12px;padding:9px 10px;white-space:nowrap}}
