.hidden-page{box-sizing:border-box;width:min(100% - 20px,720px);margin:0 auto;padding:12px 0 108px;color:var(--ink,#252820)}
.hidden-heading h1{margin:0;font-size:1.35rem}.hidden-heading p{margin:.16em 0 0;color:#586052;font-size:.84rem}.hidden-status{min-height:1.3em;margin:7px 0;color:#485044;font-size:.84rem;line-height:1.45}
.hidden-setup{display:grid;gap:9px;max-width:480px;margin:12px auto;padding:14px;border:1px solid #d5d9cf;border-radius:16px;background:#fff}.hidden-setup label{display:grid;gap:4px;font-size:.86rem;font-weight:700}.hidden-setup select{box-sizing:border-box;width:100%;min-height:42px;padding:7px 10px;border:1px solid #c5cbbd;border-radius:10px;background:#fff;color:inherit;font:inherit;font-weight:400}.hidden-setup button,.hidden-target-create button,.hidden-tools button,.hidden-target-list button,.hidden-confirm,.hidden-new{min-height:40px;padding:7px 12px;border:1px solid #c5cbbd;border-radius:12px;background:#fff;color:inherit;font:inherit;font-size:.84rem;cursor:pointer}.hidden-setup #hidden-start,.hidden-confirm{border-color:#49643c;background:#49643c;color:#fff;font-weight:700}.hidden-setup button:disabled,.hidden-confirm:disabled{opacity:.45;cursor:default}.hidden-setup p{margin:0;color:#586052;font-size:.78rem;line-height:1.5}
.hidden-editor[hidden]{display:none!important}.hidden-editor{display:grid;min-width:0;gap:8px}.hidden-source-label,.hidden-mask-summary{margin:0;color:#586052;font-size:.78rem;line-height:1.45}.hidden-target-create{display:grid;gap:4px;font-size:.82rem;font-weight:700}.hidden-target-create>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px}.hidden-target-create input{box-sizing:border-box;min-width:0;min-height:40px;padding:7px 10px;border:1px solid #c5cbbd;border-radius:10px;font:inherit;font-weight:400}.hidden-target-list{display:flex;gap:6px;overflow-x:auto;min-width:0;padding:2px;overscroll-behavior-x:contain;scrollbar-width:none}.hidden-target-list button{flex:0 0 auto;min-height:36px;padding:5px 9px;font-size:.78rem}.hidden-target-list button[aria-pressed=true]{border-color:#335cbe;box-shadow:0 0 0 2px #335cbe;background:#f2f5ff}.hidden-target-list button[data-mask-empty=true]{border-style:dashed}.hidden-tools{display:flex;flex-wrap:wrap;gap:7px}.hidden-tools button[aria-pressed=true]{border-color:#49643c;background:#e5eddf;font-weight:700}.hidden-preview{display:grid;justify-items:center;gap:5px;margin:0}.hidden-preview figcaption{color:#586052;font-size:.78rem;line-height:1.45}.hidden-preview canvas{box-sizing:border-box;display:block;width:min(100%,min(48vh,512px));height:auto;max-width:100%;object-fit:contain;image-rendering:pixelated;touch-action:none;border:1px solid #c5cbbd;border-radius:5px;background-color:#fff;background-image:linear-gradient(45deg,#e3e5df 25%,transparent 25%),linear-gradient(-45deg,#e3e5df 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e3e5df 75%),linear-gradient(-45deg,transparent 75%,#e3e5df 75%);background-size:14px 14px;background-position:0 0,0 7px,7px -7px,-7px 0}.hidden-confirmed{margin:0;padding:10px;border-radius:12px;background:#e5eddf;color:#31482a;font-weight:700;text-align:center}.hidden-page :focus-visible{outline:3px solid #335cbe;outline-offset:2px}.hidden-page [hidden]{display:none!important}.hidden-page .app-tabs{z-index:30}
.hidden-new{width:100%}
#hidden-play-local{width:100%;min-height:44px;padding:.55rem .8rem;border:1px solid #49643c;border-radius:12px;background:#e5eddf;color:#31482a;font:inherit;font-size:.84rem;font-weight:700;cursor:pointer}

/* Editing mode follows the camera: the artwork owns the viewport and controls float at the edges. */
body.hidden-object-editing{height:100%;min-width:320px;overflow:hidden;overscroll-behavior:none}
body.hidden-object-editing .site-header,body.hidden-object-editing .site-footer,body.hidden-object-editing .hidden-heading{display:none}
body.hidden-object-editing #hidden-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body.hidden-object-editing .hidden-page{position:fixed;inset:0;width:100%;height:100vh;height:100dvh;margin:0;padding:0;overflow:hidden}
body.hidden-object-editing .hidden-editor{position:absolute;inset:0;display:block;min-height:0}
.hidden-preview{position:absolute;inset:0;display:grid;place-items:center;overflow:hidden;margin:0;background:radial-gradient(ellipse at 50% 45%,#fff 0%,#f1f2ed 72%,#e7e9e3 100%)}
.hidden-preview figcaption{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.hidden-preview canvas{width:min(calc(100vw - 12px),calc((100dvh - 9.5rem)*var(--hidden-aspect,1)));height:auto;max-width:calc(100vw - 12px);max-height:calc(100dvh - 9.5rem);border:0;border-radius:0;box-shadow:0 18px 55px rgba(25,35,30,.14);transform:translate3d(var(--hidden-pan-x,0px),var(--hidden-pan-y,0px),0) scale(var(--hidden-zoom,1));transform-origin:center;will-change:transform}
.hidden-source-label{position:absolute;top:max(.55rem,env(safe-area-inset-top));left:.65rem;z-index:4;max-width:calc(100% - 5.5rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:.38rem .62rem;border:1px solid rgba(27,32,37,.08);border-radius:999px;color:#485044;background:rgba(255,255,255,.76);backdrop-filter:blur(12px);font-size:.68rem}
.hidden-settings{position:absolute;top:calc(max(.55rem,env(safe-area-inset-top)) + 2.5rem);left:.6rem;z-index:8;width:min(19rem,calc(100% - 1.2rem));pointer-events:none}
.hidden-settings summary{display:flex;width:max-content;min-height:2.25rem;align-items:center;padding:0 .8rem;border:1px solid rgba(27,32,37,.11);border-radius:999px;color:#26312a;background:rgba(255,255,255,.82);box-shadow:0 5px 18px rgba(20,30,24,.08);backdrop-filter:blur(14px);font-size:.78rem;font-weight:700;cursor:pointer;pointer-events:auto;list-style:none}.hidden-settings summary::-webkit-details-marker{display:none}.hidden-settings summary::before{content:"＋";margin-right:.38rem;font-size:.9rem}.hidden-settings[open] summary::before{content:"−"}
.hidden-settings__sheet{display:grid;gap:9px;max-height:min(52dvh,25rem);margin-top:.45rem;padding:12px;overflow:auto;overscroll-behavior:contain;border:1px solid rgba(27,32,37,.12);border-radius:16px;color:var(--ink);background:rgba(255,255,255,.94);box-shadow:0 14px 35px rgba(20,30,24,.18);backdrop-filter:blur(18px);pointer-events:auto}.hidden-settings__sheet .hidden-tools{justify-content:flex-start}.hidden-settings__sheet .hidden-confirm,.hidden-settings__sheet .hidden-new{width:100%}.hidden-settings__sheet .hidden-mask-summary{font-size:.72rem}
.hidden-target-list{position:absolute;right:.6rem;bottom:calc(4.8rem + env(safe-area-inset-bottom));left:.6rem;z-index:6;width:auto;min-height:2.45rem;align-items:center;justify-content:flex-start;padding:.28rem .35rem;border:1px solid rgba(27,32,37,.08);border-radius:999px;background:rgba(255,255,255,.72);backdrop-filter:blur(14px);pointer-events:auto}.hidden-target-list:empty{display:none}
.hidden-zoom{position:absolute;right:.75rem;bottom:calc(7.45rem + env(safe-area-inset-bottom));z-index:5;padding:.28rem .5rem;border-radius:999px;color:#fff;background:rgba(20,28,24,.62);font-size:.68rem;font-variant-numeric:tabular-nums;opacity:0;pointer-events:none}.hidden-zoom[data-visible=true]{opacity:1}
.hidden-edit-hint{position:absolute;top:calc(max(.55rem,env(safe-area-inset-top)) + 2.5rem);right:.65rem;z-index:5;max-width:42%;margin:0;padding:.35rem .55rem;border-radius:999px;color:#485044;background:rgba(255,255,255,.72);font-size:.68rem;line-height:1.3;pointer-events:none}.hidden-settings[open]~.hidden-edit-hint{opacity:0}
body.hidden-object-editing .app-tabs{z-index:30}
@media(max-width:380px){.hidden-page{width:calc(100% - 14px);padding-top:8px}.hidden-heading h1{font-size:1.18rem}.hidden-heading p,.hidden-status{font-size:.76rem}.hidden-status{margin:4px 0 6px}.hidden-setup{gap:8px;margin:7px auto;padding:11px}.hidden-setup label{font-size:.8rem}.hidden-setup select{min-height:38px}.hidden-setup button,.hidden-target-create button,.hidden-tools button,.hidden-confirm,.hidden-new{min-height:36px;padding:5px 8px;font-size:.78rem}.hidden-target-create input{min-height:36px;padding:5px 7px}.hidden-preview canvas{width:min(100%,min(44vh,512px))}}
@media(max-height:650px){.hidden-page{padding-top:5px;padding-bottom:86px}.hidden-heading h1{font-size:1.15rem}.hidden-heading p,.hidden-status,.hidden-source-label,.hidden-mask-summary,.hidden-preview figcaption{font-size:.72rem}.hidden-status{min-height:1em;margin:2px 0 4px}.hidden-setup{gap:7px;margin:5px auto;padding:10px}.hidden-setup select{min-height:36px}.hidden-editor{gap:5px}.hidden-preview canvas{width:min(100%,min(40vh,512px));max-height:40vh}.hidden-target-list{max-height:44px}.hidden-target-list button{min-height:32px}.hidden-confirm{min-height:34px}.hidden-settings__sheet{max-height:48dvh}}
@media(max-width:380px) and (max-height:650px){.hidden-page{padding-bottom:80px}.hidden-preview canvas{width:min(100%,min(36vh,512px));max-height:36vh}.hidden-editor{gap:4px}}
@media(max-width:380px) and (max-height:650px){body.hidden-object-editing .hidden-preview canvas{width:min(calc(100vw - 12px),calc((100dvh - 8.5rem)*var(--hidden-aspect,1)));max-height:calc(100dvh - 8.5rem)}.hidden-target-list{bottom:calc(4.65rem + env(safe-area-inset-bottom));gap:4px}.hidden-settings__sheet{max-height:45dvh}.hidden-edit-hint{max-width:36%;font-size:.62rem}}
@media(orientation:landscape) and (max-height:500px){body.hidden-object-editing .hidden-preview canvas{width:min(calc(100vw - 12px),calc((100dvh - 5.5rem)*var(--hidden-aspect,1)));max-height:calc(100dvh - 5.5rem)}.hidden-source-label{top:max(.35rem,env(safe-area-inset-top))}.hidden-settings{top:calc(max(.35rem,env(safe-area-inset-top)) + 2.25rem)}.hidden-target-list{right:4.7rem;bottom:max(.45rem,env(safe-area-inset-bottom));left:.6rem}.hidden-zoom{right:.75rem;bottom:max(.5rem,env(safe-area-inset-bottom))}.hidden-settings__sheet{max-height:68dvh}}
@media(prefers-reduced-motion:reduce){.hidden-page button{transition:none}.hidden-preview canvas{will-change:auto}}
@media(orientation:landscape) and (max-height:500px){
  body.hidden-object-editing .hidden-preview{bottom:calc(80px + env(safe-area-inset-bottom))}
  body.hidden-object-editing .hidden-preview canvas{width:min(calc(100vw - 12px),calc((100dvh - 7rem)*var(--hidden-aspect,1)));max-height:calc(100dvh - 7rem)}
}
@media(orientation:landscape) and (max-height:400px){
  .app-page--tool-hidden-object:not(.hidden-object-editing) .site-header,.app-page--tool-hidden-object:not(.hidden-object-editing) .site-footer{display:none}
  .app-page--tool-hidden-object:not(.hidden-object-editing) .hidden-page{padding-top:5px}
  .app-page--tool-hidden-object:not(.hidden-object-editing) .hidden-heading p,.app-page--tool-hidden-object:not(.hidden-object-editing) .hidden-setup p{display:none}
  .app-page--tool-hidden-object:not(.hidden-object-editing) .hidden-setup{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:5px 8px;margin-top:3px;padding:8px}
  .app-page--tool-hidden-object:not(.hidden-object-editing) .hidden-setup button{min-height:36px}
  .app-page--tool-hidden-object:not(.hidden-object-editing) #hidden-resume:not([hidden]){grid-column:1/-1}
}
@media(orientation:portrait){
  body.hidden-object-editing .hidden-preview{top:2.5rem;bottom:calc(8rem + env(safe-area-inset-bottom))}
  body.hidden-object-editing .hidden-preview canvas{width:min(calc(100vw - 12px),calc((100dvh - 10.5rem)*var(--hidden-aspect,1)));max-height:calc(100dvh - 10.5rem)}
}
.hidden-publish { display: block; width: min(100%, 28rem); min-height: 44px; margin: 12px auto; }
.hidden-publish-actions { position: absolute; right: .6rem; bottom: calc(5.4rem + env(safe-area-inset-bottom)); left: .6rem; z-index: 12; display: flex; justify-content: center; gap: .4rem; width: min(100% - 1.2rem, 28rem); margin-inline: auto; pointer-events: none; }
.hidden-publish-actions button { box-sizing: border-box; flex: 1 1 0; min-width: 0; min-height: 44px; margin: 0; padding: .45rem .5rem; border: 1px solid #49643c; border-radius: 999px; background: #49643c; color: #fff; box-shadow: 0 8px 24px rgba(20,30,24,.22); font: inherit; font-size: clamp(.66rem, 2.6vw, .78rem); font-weight: 700; line-height: 1.2; cursor: pointer; pointer-events: auto; }
.hidden-publish-actions button[hidden] { display: none !important; }
body.hidden-object-editing .hidden-preview { bottom: calc(12rem + env(safe-area-inset-bottom)); }
body.hidden-object-editing .hidden-preview canvas { width: min(calc(100vw - 12px), calc((100dvh - 13rem) * var(--hidden-aspect,1))); max-height: calc(100dvh - 13rem); }
body.hidden-object-editing .hidden-target-list { bottom: calc(9rem + env(safe-area-inset-bottom)); }
body.hidden-object-editing .hidden-edit-hint { bottom: calc(10rem + env(safe-area-inset-bottom)); }
@media (orientation: landscape) and (max-height: 500px) {
  body.spot-editing .spot-preview { bottom: calc(9rem + env(safe-area-inset-bottom)); }
  body.spot-editing .spot-preview canvas { width: min(calc(100vw - 16px), calc((100dvh - 10rem) * var(--spot-aspect,1))); max-height: calc(100dvh - 10rem); }
  body.hidden-object-editing .hidden-preview { bottom: calc(12rem + env(safe-area-inset-bottom)); }
  body.hidden-object-editing .hidden-preview canvas { width: min(calc(100vw - 12px), calc((100dvh - 13rem) * var(--hidden-aspect,1))); max-height: calc(100dvh - 13rem); }
  body.hidden-object-editing .hidden-target-list { right: .6rem; bottom: calc(9rem + env(safe-area-inset-bottom)); left: .6rem; }
}