:root{color-scheme:light;--zc-ink:#352e26;--zc-muted:#665a4a;--zc-glass:rgba(251,244,228,.76);--zc-line:rgba(105,81,48,.17);--zc-accent:#67553b;--zc-safe-bottom:env(safe-area-inset-bottom,0px);--zc-safe-left:env(safe-area-inset-left,0px);--zc-safe-right:env(safe-area-inset-right,0px);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;color:var(--zc-ink);background:#b5a183}
*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{overscroll-behavior:none}#app{position:relative;height:100dvh;isolation:isolate}button,select,a{font:inherit;-webkit-tap-highlight-color:transparent}button{color:inherit;border:0;cursor:pointer;min-height:42px;background:transparent;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;transition:background .2s,transform .2s,opacity .2s}button:hover{background:rgba(255,255,255,.47)}button:active{transform:scale(.97)}button:disabled{cursor:wait;opacity:.55}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid #7e5931;outline-offset:4px}button[aria-pressed=true]{background:rgba(120,92,51,.14);box-shadow:inset 0 0 0 1px rgba(98,77,43,.22)}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}button svg{pointer-events:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}canvas#scene{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:grab}canvas#scene:active{cursor:grabbing}.glass{background:var(--zc-glass);backdrop-filter:blur(22px) saturate(.9);-webkit-backdrop-filter:blur(22px) saturate(.9);border:1px solid rgba(255,250,235,.55);box-shadow:0 12px 40px rgba(30,24,16,.12),inset 0 1px 0 rgba(255,255,255,.4)}
.dock{position:absolute;bottom:calc(18px + var(--zc-safe-bottom));left:50%;transform:translateX(-50%);display:flex;gap:4px;padding:7px;border-radius:22px;max-width:calc(100% - 24px - var(--zc-safe-left) - var(--zc-safe-right));white-space:nowrap;z-index:6}.dock button{padding:0 15px;font-size:13px;min-height:46px}.dock button:last-child{border-left:1px solid var(--zc-line);border-radius:0 14px 14px 0}.room-caption{position:absolute;top:calc(24px + env(safe-area-inset-top,0px));right:calc(28px + var(--zc-safe-right));text-shadow:0 1px 12px rgba(255,249,223,.85);font-family:Georgia,serif;font-style:italic;font-size:17px;letter-spacing:.01em;color:#4f402c;pointer-events:none;opacity:.75}.embedded .room-caption{display:none}.count{position:absolute;right:calc(24px + var(--zc-safe-right));top:calc(76px + env(safe-area-inset-top,0px));font-size:11px;color:#584a37;background:rgba(255,244,220,.48);border:1px solid rgba(255,244,225,.25);padding:5px 9px;border-radius:20px;pointer-events:none}.view-tools{position:absolute;right:calc(20px + var(--zc-safe-right));bottom:calc(96px + var(--zc-safe-bottom));padding:3px;display:flex;flex-direction:column;border-radius:18px;z-index:5}.view-tools button{width:40px;min-height:38px;border-radius:12px}.view-tools svg{width:17px;height:17px}
.tray{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(94px + var(--zc-safe-bottom));width:min(650px,calc(100% - 132px));padding:14px 16px 13px;border-radius:20px;z-index:5;animation:arrive .24s ease-out}.tray-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px}.tray-title{font-family:Georgia,serif;font-size:15px;letter-spacing:.01em}.tray-head button{min-height:34px;width:34px}.tabs{display:flex;gap:7px;align-items:center;margin-bottom:10px}.tabs button{min-height:30px;padding:3px 10px;font-size:11px;border-radius:10px}.tabs .upload{margin-left:auto;border:1px dashed rgba(80,65,40,.25)}.tabs .upload svg{width:14px;height:14px}.filmstrip{display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;padding:4px 4px 8px;scrollbar-width:thin;scrollbar-color:rgba(91,71,42,.24) transparent;min-height:87px}.thumb{display:block;position:relative;flex:0 0 70px;height:78px;min-height:78px;border-radius:2px;padding:5px 5px 13px;background:#fffdf4;box-shadow:0 3px 5px rgba(37,25,11,.13);touch-action:pan-x;transition:transform .2s,box-shadow .2s}.thumb:nth-child(3n+1){transform:rotate(-3deg)}.thumb:nth-child(3n+2){transform:rotate(2deg)}.thumb:hover,.thumb[aria-pressed=true]{transform:translateY(-3px) rotate(0);box-shadow:0 5px 8px rgba(37,25,11,.19),0 0 0 2px #aa8050;background:#fffdf4}.thumb img{width:60px;height:60px;object-fit:cover;pointer-events:none;display:block}.tray-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--zc-muted);font-size:11px;min-height:30px;margin-top:4px}.tray-footer button{font-size:11px;min-height:30px;padding:3px 10px;background:rgba(87,65,32,.1);flex-shrink:0}.empty-tray{font-size:12px;line-height:1.6;margin:8px;color:var(--zc-muted)}
.guide{position:absolute;left:50%;top:calc(92px + env(safe-area-inset-top,0px));transform:translateX(-50%);display:flex;align-items:center;gap:8px;width:max-content;max-width:calc(100% - 40px);padding:10px 12px 10px 18px;border-radius:18px;z-index:4;animation:arrive .5s}.guide p{margin:0;font-size:12px;line-height:1.6}.guide p strong{display:block;font-family:Georgia,serif;font-weight:400;font-size:17px;margin-bottom:1px}.guide button{width:30px;min-height:32px;flex:none}.guide svg{width:14px;height:14px}.selection{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(104px + var(--zc-safe-bottom));padding:4px;display:flex;align-items:center;gap:3px;border-radius:18px;z-index:7}.tray-open .selection{bottom:calc(325px + var(--zc-safe-bottom))}.selection button{width:40px;min-height:38px}.selection .remove{color:#855748;border-left:1px solid var(--zc-line);border-radius:0 12px 12px 0}.toast{position:absolute;pointer-events:none;left:50%;bottom:calc(96px + var(--zc-safe-bottom));transform:translateX(-50%);max-width:min(520px,calc(100% - 130px));text-align:center;padding:9px 14px;border-radius:15px;font-size:12px;line-height:1.5;z-index:8;opacity:0;transition:opacity .25s}.toast.show{opacity:1}.tray-open .toast{bottom:calc(326px + var(--zc-safe-bottom))}.admire-return{position:absolute;bottom:calc(20px + var(--zc-safe-bottom));left:50%;transform:translateX(-50%);white-space:nowrap;padding:2px 17px;border-radius:20px;opacity:.6;font-size:12px;z-index:10}.admire-return:hover,.admire-return:focus{opacity:1}.admiring .dock,.admiring .tray,.admiring .selection,.admiring .view-tools,.admiring .count,.admiring .guide,.admiring .toast,.admiring .room-caption{display:none!important}
dialog{color:var(--zc-ink);border-radius:20px;padding:0;border:1px solid rgba(255,250,235,.55);position:absolute;margin:0;left:auto;top:calc(78px + env(safe-area-inset-top,0px));right:calc(20px + var(--zc-safe-right));bottom:calc(95px + var(--zc-safe-bottom));width:min(370px,calc(100% - 32px));max-height:calc(100dvh - 178px - var(--zc-safe-bottom));height:max-content;overflow:auto;overscroll-behavior:contain;animation:arrive .24s ease-out}dialog::backdrop{background:rgba(31,22,12,.12)}.panel-inner{padding:20px}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.panel-heading h1,.panel-heading h2{font-family:Georgia,serif;font-size:23px;font-weight:400;line-height:1.2;margin:0}.panel-heading button{min-width:36px;min-height:36px;flex:none}.field{margin:0 0 22px}.field legend,.field-title{font-size:10px;font-weight:650;letter-spacing:.09em;text-transform:uppercase;margin-bottom:10px;color:var(--zc-muted)}fieldset{padding:0;border:0;min-width:0}.room-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.room-option{position:relative;border-radius:13px;overflow:hidden;display:block;padding:0;min-height:88px;text-align:left;background:#a8926d}.room-option img{display:block;width:100%;height:88px;object-fit:cover;transition:transform .6s}.room-option:hover img{transform:scale(1.06)}.room-option span{position:absolute;inset:auto 0 0;padding:20px 9px 9px;background:linear-gradient(transparent,rgba(24,18,11,.67));color:#fff8e9;font-size:11px;text-shadow:0 1px 4px #443321}.room-option[aria-pressed=true]{outline:2px solid #a17943;outline-offset:2px}.rope-options{display:flex;gap:6px;flex-wrap:wrap}.rope-options button{padding:8px 11px;min-height:37px;font-size:11px;border:1px solid var(--zc-line)}.settings-row{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:8px;font-size:12px}.settings-row button{font-size:11px;padding:0 12px;min-height:37px;border:1px solid var(--zc-line)}.wide-button{width:100%;justify-content:flex-start;padding:0 12px;min-height:41px;font-size:12px;border:1px solid var(--zc-line);margin-bottom:8px}.wide-button svg{width:17px;height:17px}.panel-inner details{font-size:12px;line-height:1.65;margin:16px 0;border-top:1px solid var(--zc-line);padding-top:13px}.panel-inner summary{cursor:pointer;min-height:27px}.panel-inner p{font-size:12px;line-height:1.7;color:var(--zc-muted)}.credits a{display:block;margin:6px 0;color:var(--zc-muted);text-underline-offset:3px;font-size:11px}.wall-list{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}.wall-list button{min-width:40px;min-height:36px;background:rgba(255,255,255,.3)}.danger{color:#865749;margin-top:8px}.confirm{border:1px solid var(--zc-line);padding:12px;border-radius:14px}.confirm button{padding:3px 10px;font-size:12px}.technical{font-size:10px!important;opacity:.7;margin-bottom:0!important}.export-dialog{inset:50% auto auto 50%;transform:translate(-50%,-50%);width:min(920px,calc(100% - 32px));max-height:calc(100dvh - 60px);overflow:auto}.export-dialog .panel-heading{margin-bottom:13px}.export-dialog img{display:block;width:100%;border-radius:9px}.export-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px}.export-actions a{padding:12px 16px;background:#6e583c;color:#fff7e8;border-radius:13px;text-decoration:none;font-size:12px}.export-actions p{margin:0;font-size:11px}.loading{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(135deg,#c7b897,#8f795d);font-family:Georgia,serif;font-size:22px;color:#fff2d5}
@keyframes arrive{from{opacity:0;translate:0 8px}to{opacity:1;translate:0 0}}@supports not (backdrop-filter:blur(1px)){.glass{background:rgba(249,241,223,.93)}}
@media(max-width:700px){.dock{bottom:calc(12px + var(--zc-safe-bottom));gap:1px;padding:6px;width:max-content}.dock button{padding:0 12px;font-size:11px;min-height:44px;gap:6px}.dock svg{width:18px;height:18px}.dock button:last-child span{display:none}.dock button:last-child{padding:0 13px}.tray{bottom:calc(81px + var(--zc-safe-bottom));width:calc(100% - 24px - var(--zc-safe-left) - var(--zc-safe-right));padding:12px;border-radius:18px}.tray-title{font-size:14px}.filmstrip{gap:11px;min-height:78px}.thumb{flex-basis:62px;width:62px;height:70px;min-height:70px;padding:4px 4px 12px}.thumb img{width:54px;height:54px}.tabs{gap:3px;margin-bottom:6px}.tabs button{font-size:10px;padding:3px 8px}.tabs .upload{font-size:0;gap:0;padding:0;width:31px}.tabs .upload svg{width:17px;height:17px}.tray-footer{font-size:10px;gap:3px}.tray-footer button{font-size:10px;padding:3px 7px}.view-tools{right:calc(13px + var(--zc-safe-right));bottom:calc(87px + var(--zc-safe-bottom))}.tray-open .view-tools{bottom:calc(290px + var(--zc-safe-bottom));flex-direction:row}.view-tools button{width:33px;min-height:33px}.selection{bottom:calc(87px + var(--zc-safe-bottom));left:12px;transform:none}.tray-open .selection{bottom:calc(290px + var(--zc-safe-bottom));left:12px}.selection button{width:33px;min-height:33px}.selection svg{width:17px;height:17px}.selection .move-control{display:none}.tray-open .toast{bottom:calc(338px + var(--zc-safe-bottom))}.toast{max-width:calc(100% - 32px);bottom:calc(137px + var(--zc-safe-bottom));font-size:11px}.guide{top:calc(84px + env(safe-area-inset-top,0px));padding:8px 8px 8px 14px;max-width:calc(100% - 32px)}.guide p{font-size:10px}.guide p strong{font-size:15px}.room-caption{font-size:14px;top:calc(24px + env(safe-area-inset-top,0px));right:18px}.count{top:calc(61px + env(safe-area-inset-top,0px));right:16px}dialog{top:auto;bottom:calc(81px + var(--zc-safe-bottom));right:calc(12px + var(--zc-safe-right));width:calc(100% - 24px - var(--zc-safe-left) - var(--zc-safe-right));max-height:calc(100dvh - 158px - var(--zc-safe-bottom));border-radius:20px}.panel-inner{padding:17px}.export-dialog{inset:50% auto auto 50%;max-height:calc(100dvh - 32px)}.export-dialog .panel-heading h2{font-size:19px}}
@media(max-height:550px) and (orientation:landscape){.dock{bottom:calc(10px + var(--zc-safe-bottom));padding:5px}.dock button{min-height:40px;font-size:11px;padding:0 13px}.tray{width:360px;bottom:calc(72px + var(--zc-safe-bottom));left:16px;transform:none;padding:9px 12px}.tray-title{font-size:13px}.tray-head{margin-bottom:3px}.tray-head button{min-height:24px}.tabs{margin-bottom:3px}.tabs button{min-height:25px}.filmstrip{min-height:57px;padding-bottom:4px}.thumb{flex-basis:50px;height:55px;min-height:55px;padding:4px 4px 9px}.thumb img{width:42px;height:42px}.tray-footer{margin-top:0;font-size:10px;min-height:22px}.tray-footer button{min-height:25px;font-size:10px}.view-tools,.tray-open .view-tools{bottom:calc(76px + var(--zc-safe-bottom));right:14px}.selection,.tray-open .selection{bottom:calc(77px + var(--zc-safe-bottom));left:auto;right:80px;transform:none}.guide{top:75px;left:auto;right:18px;transform:none;max-width:calc(100% - 420px)}.guide p strong{font-size:15px}.guide p{font-size:10px}.toast,.tray-open .toast{bottom:calc(130px + var(--zc-safe-bottom));left:auto;right:20px;transform:none;max-width:calc(100% - 420px)}dialog{top:74px;bottom:74px;max-height:calc(100dvh - 148px);width:340px}.export-dialog{inset:50% auto auto 50%;max-height:calc(100dvh - 28px)}.export-dialog img{max-height:230px;object-fit:contain}.room-caption{font-size:14px}.count{top:66px}.tray-open .guide{display:none}}
@media(max-width:340px){.dock button{padding:0 9px;font-size:10px}.dock button svg{width:16px;height:16px}.dock button:last-child{padding:0 11px}.guide{display:none}.tray-title{font-size:12px}.tabs button{font-size:9px}.tray-footer{display:none}.tray{bottom:77px}.tray-open .view-tools,.tray-open .selection{bottom:260px}.tray-open .toast{bottom:300px}.room-caption{font-size:12px}.count{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-height:480px) and (orientation:portrait){.guide{display:none}.tray-head{margin-bottom:1px}.tray-head button{min-height:25px;height:25px}.tray-title{font-size:12px}.tabs{margin-bottom:2px}.tabs button{min-height:25px}.filmstrip{min-height:56px;padding-bottom:3px}.thumb{flex-basis:49px;height:54px;min-height:54px;padding:4px 4px 9px}.thumb img{width:41px;height:41px}.tray-footer{display:none}.tray-open .view-tools,.tray-open .selection{bottom:calc(228px + var(--zc-safe-bottom))}.selection button,.view-tools button{width:31px;min-height:31px}.tray-open .toast{bottom:calc(270px + var(--zc-safe-bottom))}.room-caption{display:none}}
@media(max-width:480px){.dock #export span{display:none}.tray-title{min-width:0;line-height:1.3}}
@media(max-width:340px),(max-height:480px) and (orientation:portrait){.tray-footer:has(#hang-ready:not([hidden])){display:flex;justify-content:center;margin-top:5px}.tray-footer:has(#hang-ready:not([hidden])) #tray-hint{display:none}.tray-footer #hang-ready{min-height:32px;width:100%}}
@media(max-height:480px) and (orientation:portrait){.tray-open .view-tools{display:none}}
.dock button{min-width:40px;flex-shrink:0}
@media(max-width:340px){.dock button{padding-right:7px;padding-left:7px;gap:4px}.dock button:last-child{padding-right:10px;padding-left:10px}}
@media(min-width:701px) and (min-height:551px){.has-selection .toast{bottom:calc(164px + var(--zc-safe-bottom))}.has-selection.tray-open .toast{bottom:calc(389px + var(--zc-safe-bottom))}}
