/* Reused sticker recorder controls, refined to match the collection gallery. */
[hidden]{display:none!important}
.record-controls{position:fixed;z-index:40;top:20px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:19px;white-space:nowrap;padding:10px 12px 10px 18px;background:var(--surface);border:1px solid var(--line);border-radius:13px;box-shadow:0 8px 28px #18223706;color:var(--ink);font:12px Inter,'PingFang TC',sans-serif}
.record-format{display:flex;flex-direction:column;gap:3px}.record-format strong{font-size:13px;font-weight:500}.record-format span{color:var(--muted);font-size:9px;letter-spacing:.025em}
.record-frame-toggle{display:flex;gap:5px;align-items:center;color:var(--muted);font-size:11px;cursor:pointer}.record-frame-toggle input{accent-color:#637582;margin:0;width:12px;height:12px}
.record-time{font:12px monospace;min-width:38px;color:var(--muted)}
.record-primary,.record-download{display:flex;align-items:center;gap:7px;padding:9px 13px;border:0;border-radius:8px;background:var(--ink);color:#fff;font:11px Inter,'PingFang TC',sans-serif;text-decoration:none;cursor:pointer}
[data-theme=dark] .record-primary{color:#242729}.record-primary span{color:#da7378;font-size:9px}.record-primary:disabled{opacity:.5;cursor:wait}.record-download{color:var(--ink);background:var(--hover)}
.record-close{width:26px;height:26px;border:0;border-radius:50%;color:var(--muted);background:transparent;font-size:20px;cursor:pointer}.record-close:hover{background:var(--hover)}.record-close:disabled{opacity:.4;cursor:default}
.record-viewfinder{position:fixed;z-index:20;left:calc(var(--capture-left) - 2px);top:calc(var(--capture-top) - 2px);width:calc(var(--capture-width) + 4px);height:calc(var(--capture-height) + 4px);pointer-events:none}
.record-viewfinder i{position:absolute;width:15px;height:15px;border-color:#a1a9ae;border-style:solid;border-width:0}
.record-viewfinder i:nth-child(1){left:-1px;top:-1px;border-top-width:1px;border-left-width:1px}.record-viewfinder i:nth-child(2){right:-1px;top:-1px;border-top-width:1px;border-right-width:1px}.record-viewfinder i:nth-child(3){right:-1px;bottom:-1px;border-bottom-width:1px;border-right-width:1px}.record-viewfinder i:nth-child(4){left:-1px;bottom:-1px;border-bottom-width:1px;border-left-width:1px}
.is-recording .record-viewfinder i{border-color:#b87578}.is-recording .record-time{color:#b75d64}
.record-message{position:fixed;z-index:30;left:20px;right:20px;bottom:18px;margin:0;text-align:center;color:var(--muted);font:11px/1.5 Inter,'PingFang TC',sans-serif;pointer-events:none}
@media(max-width:650px){.record-controls{top:14px;width:calc(100% - 28px);padding:10px;gap:12px;white-space:normal;flex-wrap:wrap;justify-content:center}.record-format{min-width:105px}.record-frame-toggle{font-size:10px}.record-primary,.record-download{padding:9px 11px}.record-message{bottom:12px;font-size:10px}.gallery.capture-mode .card-picker button{padding:9px 8px;min-width:0}.capture-mode.capture-caption .caption{gap:10px}.capture-mode .attribute{display:none}}

.record-format select{appearance:auto;border:0;background:transparent;color:var(--ink);font:12px/20px Inter,'PingFang SC','PingFang TC',sans-serif;padding:0 16px 0 0;cursor:pointer;max-width:110px}
.record-format select:disabled{opacity:.65;cursor:default}
.record-format select:focus-visible{outline:2px solid #93a6b5;outline-offset:3px;border-radius:3px}

.record-page-active .record-controls,.record-page-active .record-message{visibility:hidden}
.record-controls{max-width:calc(100% - 28px)}

.record-viewfinder{border:1px solid #879ca078;box-sizing:border-box}
.record-viewfinder::before{content:'卡片錄製範圍';position:absolute;left:0;bottom:calc(100% + 7px);padding:3px 6px;border-radius:4px;color:var(--muted);background:var(--surface);font:10px/16px Inter,'PingFang TC',sans-serif;white-space:nowrap}
.record-viewfinder[data-scope=page]::before{content:'全網頁錄製範圍';bottom:auto;top:7px;left:7px}
.record-viewfinder[data-scope=page]{left:4px;top:4px;width:calc(100vw - 8px);height:calc(100vh - 8px)}
.is-recording .record-viewfinder{border-color:#b8757866}

/* 48px hand, twice the standard 24px pointer, only while recording. */
body.is-recording .card,body.is-recording button,body.is-recording a,body.is-recording input[type=range]{cursor:url("assets/record-hand.svg") 19 5,pointer}

.record-format label,.record-duration span{font-size:10px;color:var(--muted)}
.record-duration{display:flex;flex-direction:column;gap:3px}.record-duration input{width:64px;padding:3px 5px;border:1px solid var(--line);border-radius:5px;color:var(--ink);background:var(--surface);font:12px Inter,sans-serif}.record-controls{gap:14px;flex-wrap:wrap;justify-content:center}
/* A real 9:16 crop region with room for the full lifted / tilted card. */
.gallery.portrait-capture #capture-scene{width:var(--portrait-width);height:var(--portrait-height);padding:0;margin:0;max-width:none;background:var(--page);overflow:hidden;isolation:isolate;flex-shrink:0}
.gallery.portrait-capture .flat-card-entry[aria-hidden=true]{visibility:hidden}
.gallery.portrait-capture main{padding-top:20px;padding-bottom:70px;min-height:0}
.gallery.portrait-capture .flat-gallery{height:calc(var(--card-w)*1.4);margin:0}

.gallery.portrait-capture .controls,.gallery.portrait-capture .fan-navigation,.gallery.portrait-capture .status{visibility:hidden}
.record-preview{padding:7px 9px;border:1px solid var(--line);border-radius:7px;background:var(--hover);color:var(--ink);font:11px Inter,sans-serif;cursor:pointer}

/* Fill the available viewport rather than enlarging a thumbnail in the MP4. */
.gallery.portrait-capture #capture-scene{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:19}
.gallery.portrait-capture::before{content:'';position:fixed;inset:0;z-index:18;background:var(--page)}
.gallery.portrait-capture .collection-section{visibility:hidden}

body.is-generating .record-controls,body.is-generating .record-message{visibility:visible}
body.is-generating .record-controls{z-index:40}
body.is-generating .record-message{z-index:40;background:var(--surface);padding:8px;border-radius:8px}
body.is-generating main,body.is-generating header,body.is-generating .collection-sidebar{pointer-events:none}