@font-face{font-family:"WF CLASSIC BOLD";src:url("fonts/Didot-Bold.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"WF Adelia";src:url("fonts/Adelia.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"WF Cinzel";src:url("fonts/Cinzel-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"WF CLASSIC";src:url("fonts/Didot.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"WF Darling";src:url("fonts/Darleston.otf") format("opentype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"WF Josefin";src:url("fonts/JosefinSans-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"WF LUXES";src:url("fonts/LaLuxesSerif.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"WF Party";src:url("fonts/Hello.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"WF Signature";src:url("fonts/BrittanySignature.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"WF Abril";src:url("fonts/AbrilFatface-Regular.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
*{box-sizing:border-box}body{margin:0;background:#faf8f5;color:#292b27;font:14px/1.6 Arial,sans-serif}.notice{text-align:center;background:#414b41;color:white;font-size:10px;letter-spacing:1.3px;padding:9px}header{padding:25px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e4e1da}.brand{font:22px Georgia;letter-spacing:3px;text-decoration:none;color:inherit}.brand i{color:#978567}.brand span{display:block;font:8px Arial;letter-spacing:2.5px;margin-top:10px}.header-note{color:#797d72;font-size:12px}main{max-width:1420px;margin:auto;padding:36px 5%}.intro{margin-bottom:32px}.eyebrow{font-size:10px;letter-spacing:3px;color:#77816d}h1{font:46px/1.1 Georgia;margin:16px 0}h1 em{color:#71806b;font-weight:normal}.intro p{color:#777970}.workspace{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(370px,1fr);gap:30px;align-items:start}.preview{position:sticky;top:20px;background:#eeeae3;border:1px solid #e1dcd2;border-radius:5px;overflow:hidden}.preview-top{display:flex;justify-content:space-between;padding:20px 25px;font-size:10px;letter-spacing:2px;align-items:center}.preview-top button{background:transparent;border:0;font-size:12px;letter-spacing:0}.stage{background:radial-gradient(ellipse at 45% 30%,#f8f5ef,#e7e0d5);padding:0 25px 18px}svg{width:100%;display:block;overflow:visible;touch-action:none}svg text{cursor:move;user-select:none}.dimension{text-align:center;color:#8b877d;font-size:11px;letter-spacing:2px}.hint{text-align:center;color:#79796e;font-size:12px;padding:0 15px}.preview-bottom{display:flex;justify-content:space-around;padding:20px 10px;border-top:1px solid #ded8cd;font-size:10px}aside{border:1px solid #e3e1db;background:white;border-radius:5px;overflow:hidden}nav{display:flex;border-bottom:1px solid #e4e2dc}button,input,select,textarea{font:inherit}button{cursor:pointer}nav button{flex:1;border:0;background:white;color:#88897e;padding:20px 5px;font-size:12px}nav button.active{color:#3c4837;box-shadow:inset 0 -2px #65745b}.panel{padding:26px}h2{font:25px Georgia;margin:0 0 8px}.muted{font-size:12px;color:#818278;margin:0 0 22px}label{display:block;font-size:12px;margin:23px 0 10px;font-weight:bold}label span{float:right;font-weight:normal;color:#898a80;font-size:11px}.sizes{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}button{transition:background .15s}.sizes button,.seg button,.smallbutton{border:1px solid #dddcd4;background:#fff;border-radius:3px;padding:10px}.sizes button.active,.seg button.active{background:#edf0e9;border-color:#718166;color:#384632}.seg{display:flex;gap:8px}.seg button{flex:1;font-size:12px}.seg span{font-size:10px}.swatches{display:flex;flex-wrap:wrap;gap:11px}.swatch{width:30px;height:30px;border-radius:50%;border:1px solid #d2d1c9;position:relative}.swatch.active{outline:1.5px solid #63775b;outline-offset:3px}.swatch.active:after{content:'✓';display:block;color:#fff;text-shadow:0 0 3px #000}small{display:block;font-size:10px;color:#8b8c82;margin-top:12px;line-height:1.6}input:not([type=range]),select,textarea{width:100%;padding:11px;border:1px solid #dcded5;border-radius:3px;background:#fff;color:inherit}input[type=range]{width:100%;accent-color:#66745c}textarea{min-height:75px}.primary{display:block;width:100%;background:#46543f;border:0;border-radius:3px;color:#fff;padding:14px;margin-top:25px}.primary:hover{background:#303e29}footer{display:flex;justify-content:space-between;border-top:1px solid #e4e4dc;padding:20px 26px;background:#fafbf7}footer span{display:block;font-size:11px;color:#7b8174}footer strong{font:30px Georgia}footer p{font-size:10px;color:#8b8d83;text-align:right}.endnote{text-align:center;color:#85877b;font-size:12px;margin:30px}a{color:inherit}.placeholder{background:#f5f4ef;padding:16px;margin-top:25px;font-size:12px}.placeholder p{margin:5px 0;color:#858678}.checkout{width:100%;padding:14px;border:1px solid #ddd;color:#999;background:#f2f2ef;border-radius:3px;margin-top:12px;cursor:not-allowed}#summary div{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #ecece6;font-size:12px}#saved{font-size:12px;color:#536848}.textblock{border-bottom:1px solid #eee;padding-bottom:20px}.row{display:flex;gap:10px;align-items:center}.row>*{flex:1}[hidden]{display:none!important}:focus-visible{outline:2px solid #8b6745;outline-offset:3px}@media(max-width:850px){.workspace{grid-template-columns:1fr}.preview{position:relative;top:0}.stage{max-width:540px;margin:auto}.header-note{display:none}h1{font-size:37px}main{padding:25px 5%}.preview-bottom{font-size:9px}}

.view-controls{display:flex;justify-content:center;gap:4px;padding:0 20px 16px}.view-controls button{border:1px solid #d7d1c6;background:transparent;padding:7px 12px;border-radius:3px;color:#676d60;font-size:11px}.view-controls button[aria-pressed=true]{background:#fffdf9;border-color:#8a967f;color:#3e4d36}.scale-caption{font-size:10px;color:#777a6e;text-align:center;margin:10px 0 0;line-height:1.6}#scale-ruler text{cursor:default}#size-reference{vector-effect:non-scaling-stroke}

.font-label{display:block;font-size:12px;margin:23px 0 10px;font-weight:bold}.font-picker{border:1px solid #dcded5;border-radius:3px;background:#fff}.font-picker summary{cursor:pointer;padding:10px 16px;min-height:58px;display:flex;align-items:center;justify-content:space-between;list-style:none}.font-picker summary::-webkit-details-marker{display:none}.font-picker summary:after{content:'⌄';font:18px Arial;color:#69745f}.font-picker[open] summary:after{content:'⌃'}.font-picker summary span{font-size:25px;line-height:1.5;font-weight:400}.font-options{max-height:360px;overflow-y:auto;border-top:1px solid #e4e4dc;padding:6px}.font-options button{display:block;width:100%;text-align:left;min-height:58px;padding:10px 16px;border:0;border-radius:3px;background:white;color:#292b27;font-size:26px;line-height:1.5;font-weight:400;font-synthesis:none}.font-options button:hover,.font-options button:focus-visible{background:#f3f4ef}.font-options button[aria-pressed=true]{background:#eaf0e5;box-shadow:inset 3px 0 #718166}
#add-line{margin-top:14px}#icon-picker{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:8px}#icon-picker svg{width:32px;height:32px;margin:0 auto 4px}#icon-controls .textblock{padding-top:16px}#words .movable{cursor:move}.element-colour select,#icon-controls select{margin-top:8px;font-weight:normal}

#summary section{margin:18px 0 24px}#summary h3{font-size:14px;margin:0 0 4px}#summary div{gap:16px}#summary div span{flex-shrink:0;max-width:50%}#summary strong{text-align:right;min-width:0;overflow-wrap:anywhere;white-space:pre-wrap}
#canvas.wall-view{overflow:hidden;touch-action:pan-y}#canvas.wall-view .movable{cursor:default}
.mirror-gold-edge{filter:drop-shadow(0 -0.35px 0 #f7e7bb) drop-shadow(0 .55px .28px #79582b66)}

.checkout:not(:disabled){background:#46543f;color:#fff;border-color:#46543f;cursor:pointer;font-weight:600}.checkout:not(:disabled):hover{background:#303e29;border-color:#303e29}.checkout:not(:disabled):active{background:#25331f}.checkout:disabled{cursor:wait}

#expand-preview{display:none}
@media(max-width:850px){
 html,body{height:auto;min-height:100%;overflow:visible}
 body>.notice,body>header,.intro,.endnote{display:none}
 main{height:auto;min-height:100svh;padding:0}
 .workspace{display:block;height:auto;gap:0}
 .workspace>*{min-width:0}
 .preview{position:sticky;top:0;z-index:5;border-radius:0;box-shadow:0 2px 8px #00000012}
 .preview-top{padding:6px 12px;font-size:9px;letter-spacing:1px;gap:8px}
 .preview-top>span{margin-right:auto}
 #expand-preview{display:block;min-height:36px;font-weight:bold}
 .view-controls{padding:0 8px 4px}
 .view-controls button{min-height:36px}
 .stage{padding:0 8px 4px;width:100%;max-width:none}
 #canvas{height:clamp(130px,25dvh,230px);width:100%}
 .dimension{font-size:10px;letter-spacing:.6px}
 .preview .hint{font-size:10px;margin:3px 8px}
 .preview .scale-caption,.preview-bottom{display:none}
 aside{height:auto;min-height:0;overflow:visible;overscroll-behavior-y:auto;border-radius:0;padding-bottom:env(safe-area-inset-bottom,16px)}
 aside nav{position:relative;z-index:3;background:white}
 nav button{min-height:48px;padding:12px 4px}
 .panel{padding:16px}
 .panel input:not([type=range]),.panel select,.panel textarea{font-size:16px;min-height:44px;min-width:0}
 .smallbutton,.sizes button,.seg button,.primary,.checkout{min-height:44px}
 .swatch{width:40px;height:40px;flex-shrink:0}
 .swatches{gap:12px}
 .font-options{max-height:200px}
 .preview-expanded{overflow:hidden}.preview-expanded .workspace{display:block}
 .preview-expanded aside{display:none}
 .preview-expanded .preview{position:fixed;inset:0;height:100svh;height:100dvh;z-index:20;display:flex;flex-direction:column;padding-bottom:env(safe-area-inset-bottom,0px)}
 .preview-expanded .stage{flex:1;min-height:0;display:flex;flex-direction:column}
 .preview-expanded #canvas{flex:1;min-height:0;height:auto}
}