.hero-art:has(.diy-wall){height:560px}.diy-wall{position:relative;height:480px;isolation:isolate;user-select:none}.wall-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.wall-line{fill:none;stroke:#a38c69;stroke-width:2;vector-effect:non-scaling-stroke;pointer-events:stroke;cursor:pointer;outline:none;stroke-linecap:round;filter:drop-shadow(0 2px 1px #6b53342b)}.wall-line:hover,.wall-line:focus-visible{stroke:#6f5535;stroke-width:4}.wall-line{stroke-width:2}#wall-guide{fill:#ad8150;stroke:#ad8150;stroke-width:1;stroke-dasharray:2 2;vector-effect:non-scaling-stroke;pointer-events:none}.wall-nail{position:absolute;width:28px;height:28px;padding:0;translate:-50% -50%;z-index:6;touch-action:none;border-radius:var(--radius-pill);cursor:grab}.wall-nail>span{position:absolute;inset:8px;border-radius:var(--radius-pill);background:radial-gradient(circle at 35% 30%,#e1d6bf,#9b8967 55%,#5c523e);border:1px solid #74684f;box-shadow:2px 3px 3px #392c2755}.wall-nail:hover>span{box-shadow:2px 4px 5px #392c2766}.wall-slot{position:absolute;translate:-50% 0;z-index:2;transform-origin:50% 0;pointer-events:none}.wall-slot:focus-within{z-index:5}.wall-slot>*{pointer-events:auto}.wall-clip{position:absolute;left:50%;top:0;translate:-50% -50%;width:30px;height:40px;padding:0;z-index:4;touch-action:none;cursor:grab}.wall-clip>span{position:absolute;left:11px;top:2px;width:9px;height:31px;background:linear-gradient(90deg,#96784f,#ddc393 40%,#b09162);border:1px solid #ac8c5f;box-shadow:1px 3px 3px #3a291c44;transform:rotate(5deg)}.wall-clip>span:after{content:"";position:absolute;left:-2px;right:-2px;top:12px;border-top:2px solid #8b7851}.diy-wall .hanging-print.diy-print{position:relative;inset:auto;width:100%;margin:9px 0 0;padding:var(--wall-border,4%);background:#fffcf1;color:#705b3d;transform:rotate(var(--wall-angle));transform-origin:50% 0;box-shadow:3px 10px 17px #51402b30;transition:box-shadow .2s;touch-action:pan-y pinch-zoom;cursor:grab}.diy-wall .diy-print img{width:100%;height:auto;aspect-ratio:var(--photo-ratio,1.15);object-fit:cover;margin:0;pointer-events:none}.diy-caption{display:block;padding:9px 2px 5px;min-height:25px;font:10px/1.5 var(--serif);text-align:center;overflow-wrap:anywhere;pointer-events:none}.diy-wall .diy-print:hover{transform:rotate(var(--wall-angle));box-shadow:3px 13px 23px #51402b44}.empty-clip-mark{display:block;pointer-events:none;text-align:center;margin-top:35px;color:#b3a68d;font-size:19px}.wall-bottom{display:flex;gap:18px;align-items:center;justify-content:space-between;position:absolute;bottom:0;left:0;right:0}.wall-caption{max-width:65%;font:12px/1.8 var(--serif);letter-spacing:.6px;color:var(--muted)}.wall-caption button{font:12px Arial;padding:7px 10px 5px 0;color:var(--muted)}#wall-settings{display:inline-block}#wall-settings>summary{cursor:pointer;padding:6px 0}#wall-settings>div{position:absolute;bottom:70px;left:0;display:flex;gap:12px;padding:8px 12px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--paper);box-shadow:0 8px 24px #342f2814;z-index:7}.wall-tray{display:flex;align-items:center;gap:13px;padding:4px 7px;background:#e9e0cc4a;border:1px solid #b5a17b30;border-radius:var(--radius-md);flex-shrink:0}.wall-tray>button{width:47px;min-height:58px;padding:3px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font:12px var(--serif);border-radius:var(--radius-sm)}.wall-tray>button[aria-pressed=true]{background:#b99d6533;outline:1px solid #a58d65}.wall-tray svg{width:42px;height:35px;fill:none;stroke:#aa8a57;stroke-width:2;stroke-linecap:round}.diy-wall.placing{cursor:crosshair}.diy-wall.placing .wall-slot{pointer-events:none}.wall-moving .diy-print{transition:none!important}.wall-moving .wall-slot{z-index:5}.invalid-drop{opacity:.45}.wall-nail:active,.wall-clip:active{cursor:grabbing}
#wall-photo-dialog{width:min(1010px,95vw)}.wall-edit-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:35px}.wall-edit-print{padding:4%;background:#fffcf1;box-shadow:0 8px 22px #392d2117;color:#705b3d}#wall-crop-stage{height:330px;background:#e5dfd2;min-width:0;overflow:hidden;position:relative}#wall-crop-stage>img{max-width:100%;max-height:100%;display:block}#wall-crop-stage>p{font:14px var(--serif);text-align:center;padding:100px 20px;line-height:2}.wall-edit-print>p{font:13px/1.7 var(--serif);text-align:center;margin:12px 4px 2px;min-height:22px;overflow-wrap:anywhere}.wall-edit-hint{font-size:13px;color:var(--muted);line-height:1.9}.wall-crop-actions{display:flex;align-items:center;gap:8px;font-size:13px}.wall-crop-actions button{padding:10px}.wall-crop-actions button:first-child{margin-right:auto;padding-left:0}#wall-sources{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;margin:10px 0}#wall-sources button{padding:3px;background:var(--white);border:1px solid var(--line)}#wall-sources img{width:100%;height:46px;object-fit:cover}.wall-edit-controls label{display:block;margin:0 0 22px;font-size:13px;color:var(--accent)}.wall-edit-controls input,.wall-edit-controls select{display:block;margin-top:10px;width:100%;padding:9px 0;border:0;border-bottom:1px solid var(--line);color:var(--ink);background:var(--paper);font:13px Arial;border-radius:0}.wall-edit-controls input[type=range]{accent-color:var(--accent);cursor:pointer}.wall-item-actions{border-top:1px solid var(--line);padding-top:15px;display:flex;gap:20px}.wall-item-actions button{padding:10px 0;font-size:13px;color:var(--muted)}#wall-edit-error{font-size:13px;color:#aa5c43}.cropper-view-box,.cropper-face{border-radius:0!important}#rope-dialog{width:min(520px,94vw)}#rope-dialog>p{font-size:12px;line-height:2;color:var(--muted)}#rope-remove{display:block;font-size:12px;color:var(--accent);margin-top:15px;padding-left:0}
[data-theme=dark] .wall-tray{background:#c3b1880b}[data-theme=dark] .wall-line{stroke:#b9a078}[data-theme=dark] .wall-nail>span{border-color:#8c7954}[data-theme=dark] .diy-wall .diy-print{box-shadow:3px 12px 22px #0006}
@media(max-width:900px){.hero-art:has(.diy-wall){height:480px}.diy-wall{height:400px}.diy-caption{font-size:12px;min-height:23px;padding:8px 1px 4px}.wall-tray{gap:5px}.wall-caption{font-size:12px}}
@media(max-width:650px){.hero-art:has(.diy-wall){height:385px;margin-top:20px}.diy-wall{height:300px}.diy-caption{font-size:12px;min-height:20px;padding:6px 0 3px}.wall-clip>span{width:7px;height:24px;left:12px;top:5px}.wall-clip>span:after{top:10px}.wall-caption{max-width:60%;font-size:12px;letter-spacing:0}.wall-caption button{font-size:12px}.wall-tray{gap:2px;padding:3px 5px}.wall-tray>button{width:40px;min-height:53px;font-size:12px}.wall-tray svg{width:34px}.wall-edit-grid{grid-template-columns:1fr;gap:18px}#wall-crop-stage{height:260px}#wall-sources img{height:35px}.wall-edit-controls{padding-top:10px}.wall-edit-controls label{margin-bottom:18px}.wall-bottom{gap:10px}.wall-crop-actions{font-size:12px}}

#wall-guide path{fill:none;vector-effect:non-scaling-stroke;stroke-width:1;stroke-dasharray:4 4}.wall-nail:active>span{transform:translateY(-2px);box-shadow:3px 6px 5px #392c2755}.clip-box-svg rect{fill:#d6c7a52e;stroke:#ad9063;stroke-width:1}.clip-box-svg path{stroke-width:3}

.wall-edit-controls output{float:right;font:12px Georgia;color:var(--muted)}.cropper-line,.cropper-point{background-color:#a1875f}.cropper-view-box{outline-color:#a1875f}.cropper-face{background-color:#fff6de}.wall-edit-controls label{margin-bottom:17px}
@media(hover:none){.wall-clip{width:44px;height:44px}.wall-clip>span{left:17px}.wall-nail{width:34px;height:34px}.wall-nail>span{inset:11px}}
#wall-sources{max-height:150px;overflow:auto;padding:2px}
.diy-wall{--wall-base-height:480px}.rope-length-preview{display:block;width:100%;height:175px;margin:5px 0 20px;overflow:visible}.rope-length-preview path{fill:none;stroke:var(--accent);stroke-width:2;vector-effect:non-scaling-stroke}.rope-length-preview circle{fill:#aa936b;stroke:var(--line);stroke-width:2}.rope-length-label{display:block;color:var(--accent);font-size:12px}.rope-length-label output{display:block;margin-top:8px;font:12px Georgia;color:var(--muted)}#rope-length{width:100%;margin:18px 0 8px;accent-color:var(--accent)}.rope-length-limits{display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}#rope-dialog .rope-length-note{font-size:10px;margin:17px 0 25px;line-height:1.9}#wall-guide circle{stroke-dasharray:none}
@media(max-width:900px){.diy-wall{--wall-base-height:400px}}@media(max-width:650px){.diy-wall{--wall-base-height:300px}}
.diy-caption{font-size:12px}.rope-length-limits,#rope-dialog .rope-length-note{font-size:12px}
@media(max-width:650px), (hover:none){
 .wall-clip{width:44px;height:44px}.wall-clip>span{left:17px;top:5px}
 .wall-nail{width:44px;height:44px}.wall-nail>span{inset:15px}
 .wall-tray>button{width:48px;min-height:56px}.wall-caption button{min-height:44px}
}
