@import url('/rebuild/the-held-create-fonts.css');
/* Internal presentation copied from 올리기문-목업-v1.1-20260921.
   Demo toolbar/device frame removed; layout values remain the supplied values. */
#heldCreate{--ink:#0F1524;--ink2:#161D30;--line:rgba(255,255,255,.12);--txt:#F3F1EA;--mut:rgba(243,241,234,.62);--gold:#D9B26A;--sea:#7FB2C9;--cream:#FBF8F1;--pill:rgba(255,255,255,.10);--dawn1:#2B2140;--dawn2:#8C4A3E;--dawn3:#D9A05B;position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;border:0;padding:0;background:var(--ink);color:var(--txt);font-family:-apple-system,"Pretendard","Apple SD Gothic Neo","Noto Sans KR",sans-serif;overflow:auto;overscroll-behavior:contain}
#heldCreate::backdrop{background:rgba(0,0,0,.45)}
#heldCreate *{box-sizing:border-box}#heldCreate button,#heldCreate input,#heldCreate textarea,#heldCreate select{font:inherit;color:inherit}#heldCreate button{cursor:pointer;border:0}#heldCreate button:disabled{opacity:.4;cursor:default}#heldCreate button:focus-visible{outline:2px solid var(--sea);outline-offset:2px}#heldCreate h4,#heldCreate p{margin:0}#heldCreate [hidden]{display:none!important}
#heldCreate .scr{width:100%;max-width:520px;min-height:100%;margin:0 auto;position:relative;padding:14px 16px max(24px,env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:10px;background:var(--ink)}
#heldCreate .top{display:flex;align-items:center;justify-content:space-between;min-height:44px;gap:8px}#heldCreate .top .t{font-weight:700;font-size:16px}#heldCreate .x,#heldCreate .ic{width:44px;height:44px;border-radius:50%;background:var(--pill);display:grid;place-items:center;font-size:16px;flex:none}
#heldCreate .strip{display:flex;justify-content:center;gap:22px;font-size:14px;color:var(--mut);margin-top:auto;padding-top:14px;overflow:auto;scrollbar-width:none}#heldCreate .strip button{background:none;min-height:44px;white-space:nowrap;flex:none}#heldCreate .strip .on{color:#fff;font-weight:700}
#heldCreate .pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--pill);border-radius:999px;padding:9px 16px;font-size:14px;min-height:44px}#heldCreate .pill.on{background:#dee9f5;color:#1f2a36}#heldCreate .pill .dot{width:22px;height:22px;border-radius:50%;background:var(--gold);display:grid;place-items:center;font-size:12px;color:#222}
#heldCreate .shutter{width:82px;height:82px;border-radius:50%;border:6px solid rgba(255,255,255,.35);background:#fff;flex:none}#heldCreate .shutter.recording{background:#d74f4f}#heldCreate .rnd{width:52px;height:52px;border-radius:50%;background:var(--pill);display:grid;place-items:center;font-size:20px;flex:none}#heldCreate .rnd img,#heldCreate .ic img,#heldCreate .i img{width:24px;height:24px;object-fit:contain}
#heldCreate .camrow{display:flex;align-items:center;justify-content:center;gap:34px;margin-top:22px}#heldCreate .sheet{position:fixed;inset:0;z-index:10;display:flex;background:rgba(0,0,0,.45);align-items:flex-end;justify-content:center}#heldCreate .sh{width:100%;max-width:520px;background:rgba(22,29,48,.9);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);color:var(--txt);border-radius:24px 24px 0 0;padding:10px 18px max(24px,env(safe-area-inset-bottom));max-height:78dvh;overflow:auto}#heldCreate .sh .hd{width:40px;height:4px;border-radius:2px;background:rgba(255,255,255,.28);margin:0 auto 14px}#heldCreate .sh h4{font-size:15px;margin:6px 0 10px}
#heldCreate .row{display:flex;align-items:center;gap:12px;width:100%;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px;background:transparent;min-height:44px;text-align:left}#heldCreate .row .i{width:28px;text-align:center}#heldCreate .row input{margin-left:auto}#heldCreate .row.danger{color:#e0443a}
#heldCreate .canvas textarea.txt{touch-action:none;cursor:grab}#heldCreate .canvas textarea.txt.dragging{cursor:grabbing;transform:scale(1.04);opacity:.95;transition:none;z-index:3}#heldCreate .canvas div.txt{touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;transition:transform .12s}
#heldCreate .canvas div.txt.dragging{cursor:grabbing;transform:scale(1.04);opacity:.95;transition:none;z-index:3}
#heldCreate .trash{position:absolute;left:50%;bottom:210px;transform:translateX(-50%);width:62px;height:62px;border-radius:50%;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.35);display:grid;place-items:center;align-content:center;font-size:18px;line-height:1;z-index:4;color:#fff;animation:held-pop .2s ease-out}
#heldCreate .trash small{font-size:10px;margin-top:2px}
#heldCreate .trash.hot{background:#e0443a;transform:translateX(-50%) scale(1.15)}
#heldCreate .ttools button.on{background:var(--pill);border-radius:8px}
#heldCreate .tray{min-height:56px;margin-top:10px;position:relative}
#heldCreate .tray .pane[data-pane=mention]{height:auto;flex-direction:column;align-items:stretch;gap:6px;padding:4px 0}
#heldCreate .tray .pane[data-pane=mention] .search{min-height:40px;padding:8px 12px}
#heldCreate .filterrow{position:absolute;left:0;right:0;bottom:150px;display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:6px 16px 14px;z-index:4;animation:held-up .22s cubic-bezier(.2,.8,.2,1)}
#heldCreate .filterrow::-webkit-scrollbar{display:none}
#heldCreate.tools-left .filterrow{left:62px}
#heldCreate .filterrow .swf{flex:none;width:58px;background:none;padding:0;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--txt);font-size:10px}
#heldCreate .filterrow .swf img,#heldCreate .filterrow .swf i{width:58px;height:58px;border-radius:12px;object-fit:cover;border:2px solid rgba(255,255,255,.4);display:block;background:linear-gradient(135deg,#f0c27b,#d9646a 50%,#4b79a1);box-shadow:0 4px 14px rgba(0,0,0,.35);transition:transform .15s}
#heldCreate .filterrow .swf.on img,#heldCreate .filterrow .swf.on i{border-color:#fff;transform:scale(1.08)}
#heldCreate .filterrow .swf small{text-shadow:0 1px 6px rgba(0,0,0,.6);white-space:nowrap}
#heldCreate .bgrow{position:absolute;left:16px;right:16px;bottom:230px;display:flex;gap:14px;justify-content:center;z-index:4;animation:held-up .22s cubic-bezier(.2,.8,.2,1)}
#heldCreate .bgrow .swb{width:48px;height:48px;border-radius:50%;border:2px solid rgba(255,255,255,.45);padding:0;position:relative;flex:none;box-shadow:0 4px 14px rgba(0,0,0,.35)}
#heldCreate .bgrow .swb.on{border-color:#fff;transform:scale(1.12)}
#heldCreate .bgrow .swb small{position:absolute;left:50%;top:100%;transform:translateX(-50%);margin-top:5px;font-size:10px;white-space:nowrap;color:var(--txt);text-shadow:0 1px 6px rgba(0,0,0,.6)}
#heldCreate .tray .pane{display:flex;gap:8px;align-items:center;height:56px;overflow:auto;scrollbar-width:none;padding:0 2px}
#heldCreate .tray .pane[hidden]{display:none}
#heldCreate .tray .pane button{flex:none;background:var(--pill);border-radius:999px;padding:7px 12px;font-size:13px;white-space:nowrap;min-height:44px}
#heldCreate .tray .pane button.on{background:#fff;color:#111}
#heldCreate .ttools{justify-content:space-around}
#heldCreate .tray .sw{width:36px;height:36px;border-radius:50%;flex:none;padding:0;min-height:0;border:2px solid transparent}
#heldCreate .tray .sw.on{border-color:#fff;transform:scale(1.1)}
#heldCreate .tray .swpick{width:36px;height:36px;border-radius:50%;overflow:hidden;flex:none;background:conic-gradient(red,yellow,lime,cyan,blue,magenta,red)}
#heldCreate .tray .swpick input{width:200%;height:200%;margin:-50%;opacity:0}
#heldCreate .row .i .sw{display:block;width:26px;height:26px;border-radius:8px;border:1px solid rgba(255,255,255,.25)}
#heldCreate .people{display:flex;gap:14px;overflow:auto;padding:8px 0 4px;scrollbar-width:none}
#heldCreate .people .person{display:flex;flex-direction:column;align-items:center;gap:6px;background:none;min-width:64px;flex:none;font-size:12px;color:var(--mut)}
#heldCreate .people .av{width:56px;height:56px;border-radius:50%;background:var(--pill);display:grid;place-items:center;font-size:20px;color:var(--txt);overflow:hidden;border:2px solid rgba(217,178,94,.6)}
#heldCreate .people .av img{width:100%;height:100%;object-fit:cover}
#heldCreate .hint{padding:16px 0;text-align:center;font-size:13px;color:var(--mut)}
#heldCreate .rnd.on{background:#dee9f5;color:#1f2a36}
#heldCreate .count{position:absolute;inset:0;display:grid;place-items:center;font-size:96px;font-weight:700;text-shadow:0 4px 30px rgba(0,0,0,.6);z-index:5;pointer-events:none;animation:held-pop .4s ease-out}
#heldCreate .notice{position:fixed;left:50%;bottom:120px;transform:translateX(-50%);background:rgba(0,0,0,.72);color:#fff;padding:10px 16px;border-radius:999px;font-size:13px;z-index:60;animation:held-up .26s cubic-bezier(.2,.8,.2,1)}
#heldCreate .reply{display:flex;gap:8px;align-items:center;margin-top:10px}
#heldCreate .reply input{flex:1;min-width:0;background:var(--pill);border:1px solid var(--line);border-radius:999px;padding:11px 14px;color:#fff;font-size:14px}
#heldCreate .reply .go{width:48px;height:44px;border-radius:999px;background:var(--gold);color:#222;display:grid;place-items:center;flex:none}
#heldCreate .reacts{display:flex;justify-content:center;gap:12px;margin-top:10px}
#heldCreate .bgm{display:flex;flex-direction:column;gap:6px;margin-top:10px}
#heldCreate .bgm audio{width:100%;height:36px}
#heldCreate .ic.tr{font-size:13px;font-weight:700;width:auto;min-width:44px;padding:0 12px;border-radius:999px}
#heldCreate .canvas .txt.fx-sparkle{animation:held-sparkle 1.4s ease-in-out infinite}
#heldCreate .canvas .txt.fx-neon{text-shadow:0 0 6px currentColor,0 0 14px currentColor,0 0 28px var(--sea)}
#heldCreate .canvas .txt.fx-glow{text-shadow:0 0 10px rgba(255,255,255,.55),0 2px 18px rgba(255,255,255,.35);animation:held-glow 2.4s ease-in-out infinite}
#heldCreate .canvas .txt.fx-pixel{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:1px;text-shadow:2px 2px 0 rgba(0,0,0,.55)}
#heldCreate .tray .fx-neon{text-shadow:0 0 6px currentColor,0 0 12px var(--sea)}#heldCreate .tray .fx-glow{text-shadow:0 0 8px rgba(255,255,255,.6)}#heldCreate .tray .fx-pixel{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:1px}#heldCreate .tray .fx-sparkle{display:inline-block;animation:held-sparkle 1.4s ease-in-out infinite}
@keyframes held-sparkle{0%,100%{text-shadow:0 0 0 rgba(255,255,255,0)}50%{text-shadow:0 0 12px rgba(255,255,255,.9),0 0 24px rgba(217,178,94,.7)}}
@keyframes held-glow{0%,100%{opacity:1}50%{opacity:.82}}
#heldCreate .sheet{animation:held-fade .18s ease-out}
#heldCreate .sh{animation:held-up .26s cubic-bezier(.2,.8,.2,1)}
#heldCreate button:not(:disabled):active{transform:scale(.96);transition:transform .08s}
#heldCreate .chips button,#heldCreate .pill,#heldCreate .rnd,#heldCreate .row{transition:background .15s,color .15s,transform .08s}
#heldCreate .canvas{transition:background .35s ease}
@keyframes held-up{from{transform:translateY(24px);opacity:.6}}
@keyframes held-fade{from{opacity:0}}
@media(prefers-reduced-motion:reduce){#heldCreate .sheet,#heldCreate .sh,#heldCreate .canvas{animation:none!important;transition:none!important}}
#heldCreate .row .r{margin-left:auto;width:22px;height:22px;border-radius:50%;border:2px solid rgba(255,255,255,.35)}#heldCreate .row .r.on{background:var(--gold);border-color:var(--gold);position:relative}#heldCreate .row .r.on:after{content:"✓";color:#222;font-size:13px;position:absolute;inset:0;display:grid;place-items:center}
#heldCreate.plus-mode{background:transparent}#heldCreate .plus .sh{background:var(--ink2);color:#fff}#heldCreate .plus .row{border-color:var(--line)}
#heldCreate .canvas{flex:1;min-height:400px;border-radius:22px;background:linear-gradient(160deg,var(--dawn1),var(--dawn2) 55%,var(--dawn3));position:relative;padding:22px;display:flex;flex-direction:column;overflow:hidden;isolation:isolate}
#heldCreate .canvas>.media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;background:var(--ink)}
#heldCreate .canvas .txt{margin:64px 60px 0 0;font-size:26px;line-height:1.35;font-weight:700;text-shadow:0 2px 12px rgba(0,0,0,.3);white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%;cursor:text;min-height:44px;background:none;border:0;resize:none}
#heldCreate .canvas .txt{padding:0}#heldCreate .canvas .txt.box{background:rgba(0,0,0,.35);padding:8px 12px;border-radius:12px;display:inline-block}#heldCreate .canvas .txt.fill{background:var(--cream);color:var(--ink);padding:8px 12px;border-radius:12px}#heldCreate .canvas .txt.selected{outline:1px dashed rgba(255,255,255,.5)}
#heldCreate .tools{position:absolute;right:12px;top:12px;display:flex;flex-direction:column;gap:10px;z-index:2}#heldCreate .tools .rnd{width:44px;height:44px;font-size:17px}#heldCreate.tools-left .tools{right:auto;left:12px}#heldCreate.tools-left .canvas .txt{margin-right:0;margin-left:60px}
#heldCreate.kind-story:is(.mode-editor,.mode-camera) .scr{padding:0;gap:0;max-width:none}
#heldCreate.kind-story .canvas{flex:none;height:var(--held-canvas-h,100dvh);min-height:0;margin:0;border-radius:0;padding:22px 22px 150px}
#heldCreate.kind-story .canvas .tools{top:72px}
#heldCreate.kind-story:is(.mode-editor,.mode-camera) .top{position:absolute;left:0;right:0;top:0;z-index:8;padding:max(14px,env(safe-area-inset-top)) 16px 0}#heldCreate .top{position:relative;z-index:8;flex-shrink:0}
#heldCreate.kind-story .dest{position:absolute;left:16px;right:16px;bottom:calc(max(24px,env(safe-area-inset-bottom)) + 66px);z-index:3;margin:0}
#heldCreate.kind-story:is(.mode-editor,.mode-camera) .strip{position:absolute;left:0;right:0;bottom:0;z-index:3;margin:0;padding:8px 16px max(24px,env(safe-area-inset-bottom))}
#heldCreate:is(.mode-picker,.mode-collage) .scr{padding-top:max(14px,env(safe-area-inset-top))}
#heldCreate .camera-status{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:76px 24px 130px;background:var(--ink2);text-align:center;font-size:14px;line-height:1.6}
#heldCreate .camera-status p{max-width:340px}
#heldCreate .vf .camera-status{padding:24px}
#heldCreate .cap{display:flex;gap:10px;align-items:center;margin-top:12px}#heldCreate .cap input{width:100%;min-width:0;flex:1;background:var(--pill);border:0;border-radius:999px;padding:10px 14px;color:#fff;font-size:14px}
#heldCreate .chips{display:flex;gap:8px;overflow:auto;scrollbar-width:none;margin-top:10px}#heldCreate .chips button{flex:none;background:var(--pill);border-radius:999px;padding:7px 12px;font-size:13px;white-space:nowrap;min-height:44px}#heldCreate .chips button.on{background:#fff;color:#111}
#heldCreate .ttools{display:flex;justify-content:space-between;background:rgba(0,0,0,.35);border-radius:14px;padding:8px 10px;margin-top:10px;font-size:15px}#heldCreate .ttools button{min-width:44px;min-height:44px;text-align:center;opacity:.9;background:none}#heldCreate .twoline{display:flex;justify-content:space-around;padding:10px 0;font-size:14px;color:var(--mut);border-top:1px solid var(--line);margin-top:10px;gap:8px}#heldCreate .twoline button{background:none;min-height:44px}
#heldCreate .dest{display:flex;gap:8px;margin-top:auto}#heldCreate .dest .pill{flex:1}
#heldCreate .dest .ic{font-size:18px}
#heldCreate .dest .ic.dl{font-size:22px;font-weight:700}#heldCreate .dest .go{width:52px;height:44px;border-radius:999px;background:var(--gold);color:#222;display:grid;place-items:center;font-weight:700;flex:none}
#heldCreate .vf{aspect-ratio:1;border-radius:120px;background:var(--ink2);margin:16px auto 0;width:100%;max-width:400px;position:relative;overflow:hidden}#heldCreate .vf video,#heldCreate .vf img{width:100%;height:100%;object-fit:cover}#heldCreate .audience{display:flex;justify-content:center;margin-top:24px}
#heldCreate .reelcam{flex:1;min-height:500px;border-radius:22px;background:linear-gradient(180deg,#1B2233,#0B0F19);position:relative;overflow:hidden}#heldCreate .reelcam>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}#heldCreate .ltools{position:absolute;left:12px;top:120px;display:flex;flex-direction:column;gap:14px}#heldCreate .ltools .rnd{width:44px;height:44px;font-size:17px;background:rgba(255,255,255,.14)}#heldCreate.tools-left .ltools{left:auto;right:12px}
#heldCreate .script{position:absolute;left:64px;right:12px;top:60px;background:rgba(0,0,0,.6);border-radius:14px;padding:14px;font-size:16px;line-height:1.5;max-height:150px;overflow:hidden;mask-image:linear-gradient(#000 70%,transparent)}#heldCreate .script textarea{width:100%;height:110px;background:none;border:0;resize:none;font:inherit}#heldCreate .script .scrolling{animation:held-script linear var(--script-speed,30s) infinite;white-space:pre-wrap}#heldCreate .sliders{position:absolute;left:64px;right:120px;top:230px;background:rgba(40,44,60,.9);border-radius:14px;padding:12px;font-size:12px;color:var(--mut)}#heldCreate .sliders input{width:100%;display:block;min-height:32px}#heldCreate.tools-left .script{left:12px;right:64px}#heldCreate.tools-left .sliders{right:120px;left:12px}
#heldCreate .reelbot{position:absolute;bottom:18px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:34px}#heldCreate .grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px}#heldCreate .grid button{aspect-ratio:1;background:var(--ink2);padding:0;position:relative;overflow:hidden}#heldCreate .grid img,#heldCreate .grid video{width:100%;height:100%;object-fit:cover}
#heldCreate .set{background:var(--cream);color:#111;border-radius:22px;padding:10px 16px 20px;flex:1}#heldCreate .set h4{font-size:14px;margin:16px 0 4px}#heldCreate .set .row{border-color:#eee;font-size:15px}#heldCreate select,#heldCreate .search{background:var(--pill);border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:14px;min-height:44px;width:100%;min-width:0}#heldCreate select option{color:#111}#heldCreate .field{display:grid;gap:8px;font-size:14px;margin:10px 0}#heldCreate .field textarea,#heldCreate .field input{width:100%;padding:12px;min-height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.3);background:transparent}#heldCreate .field textarea{min-height:110px}
#heldCreate .error{border:1px solid var(--line);border-radius:12px;padding:12px;font-size:13px;line-height:1.5}#heldCreate .busy{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:rgba(0,0,0,.65);font-size:15px}
#heldCreate [data-anim=typewriter]{animation:held-type 2s steps(20)}#heldCreate [data-anim=pop]{animation:held-pop .4s ease-out}#heldCreate [data-anim=jump]{animation:held-jump .6s ease-in-out}
.creation-ring-list{display:flex;gap:12px;overflow:auto;scrollbar-width:none;padding:12px}.creation-ring-list button{flex:none;border:2px solid var(--sea,#7FB2C9);background:transparent;color:inherit;border-radius:50%;width:56px;height:56px}.creation-ring-list button.circle{border-color:var(--gold,#D9B26A)}.creation-ring-list img{width:100%;height:100%;object-fit:cover;border-radius:50%}.creation-ring-list span{font-size:11px}.post .creation-layer{position:absolute;white-space:pre-wrap;overflow-wrap:anywhere;max-width:85%}.post .creation-canvas{min-height:300px;position:relative;overflow:hidden}.post .creation-canvas img,.post .creation-canvas video{width:100%;max-height:600px;object-fit:contain}.post .creation-actions{display:flex;gap:12px;justify-content:flex-end;padding:10px}.post .creation-actions button{min-height:44px;background:none;color:inherit;border:0}
@keyframes held-script{from{transform:translateY(100%)}to{transform:translateY(-100%)}}@keyframes held-pop{from{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}@keyframes held-jump{50%{transform:translateY(-12px)}}@keyframes held-type{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
@media(max-width:640px){#heldCreate .chips,#heldCreate .strip,.creation-ring-list{mask-image:linear-gradient(90deg,#000 calc(100% - 20px),transparent)}#heldCreate .scr{max-width:none}#heldCreate .canvas{min-height:360px}#heldCreate .sliders{right:80px}#heldCreate.tools-left .sliders{right:80px;left:12px}}
@media(prefers-reduced-motion:reduce){#heldCreate [data-anim],#heldCreate .script .scrolling{animation:none!important}}
.post .creation-layer.box{background:rgba(0,0,0,.35);padding:8px 12px;border-radius:12px}.post .creation-layer.fill{background:var(--cream,#FBF8F1);padding:8px 12px;border-radius:12px}
.post .creation-layer.fx-sparkle{animation:held-sparkle 1.4s ease-in-out infinite}.post .creation-layer.fx-neon{text-shadow:0 0 6px currentColor,0 0 14px currentColor,0 0 28px #7FB2C9}.post .creation-layer.fx-glow{text-shadow:0 0 10px rgba(255,255,255,.55);animation:held-glow 2.4s ease-in-out infinite}.post .creation-layer.fx-pixel{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:1px;text-shadow:2px 2px 0 rgba(0,0,0,.55)}
.post .tags{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 12px}.post .tags button{color:var(--sea,#3f6f8a);font-size:13px;background:none;padding:2px 6px;border-radius:8px;min-height:32px}.post .tags button.on{background:var(--chip,#f1ede6);color:var(--ink,#1c1b19)}
#heldCreate .strip .soon{opacity:.45}
#heldCreate .canvas .ink{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
#heldCreate .canvas .ink.live{z-index:6}
#heldCreate .canvas.drawing .tools{opacity:0;pointer-events:none}
#heldCreate .inkpad{position:absolute;inset:0;z-index:5;touch-action:none;cursor:crosshair}
#heldCreate .inkbar{position:absolute;left:16px;right:16px;top:72px;display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;z-index:7;animation:held-up .22s cubic-bezier(.2,.8,.2,1)}
#heldCreate .inkbar .sw{width:32px;height:32px;border-radius:50%;padding:0;border:2px solid transparent;flex:none}
#heldCreate .inkbar .sw.on{border-color:#fff;transform:scale(1.12)}
#heldCreate .inkbar .width{width:44px;height:44px;border-radius:50%;background:var(--pill);display:grid;place-items:center;padding:0}
#heldCreate .inkbar .width i{display:block;border-radius:50%;background:#fff}
#heldCreate .inkbar .done{background:var(--gold);color:#222;border-radius:999px;padding:0 16px;min-height:40px;font-weight:700}
#heldCreate .canvas .txt.sticker{padding:0;background:none;min-height:0;cursor:grab;z-index:2}
#heldCreate .canvas .txt.sticker.selected{outline:1px dashed rgba(255,255,255,.6);outline-offset:4px}
#heldCreate .canvas .txt.sticker img{width:100%;display:block;pointer-events:none;filter:drop-shadow(0 4px 12px rgba(0,0,0,.35))}
#heldCreate .stickerrow,#heldCreate .musicrow{position:absolute;left:16px;right:16px;bottom:230px;display:flex;gap:12px;overflow:auto;scrollbar-width:none;z-index:4;animation:held-up .22s cubic-bezier(.2,.8,.2,1);align-items:center}
#heldCreate .stickerrow button{width:66px;height:66px;border-radius:16px;background:var(--pill);padding:8px;flex:none}
#heldCreate .stickerrow img{width:100%;height:100%;object-fit:contain;display:block}
#heldCreate .musicrow button{flex:none;background:var(--pill);border-radius:999px;padding:9px 14px;font-size:13px;min-height:44px;white-space:nowrap}
#heldCreate .musicrow button.on{background:#fff;color:#111}
#heldCreate .canvas .pill.audio{position:absolute;left:22px;bottom:170px;z-index:2;font-size:12px;padding:6px 12px;min-height:0}
.post .creation-canvas .ink{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.post .creation-layer.sticker{padding:0;background:none}.post .creation-layer.sticker img{width:100%;display:block}
.post .tags.audio{color:var(--mute,#8a847a)}
#heldCreate .hilites{display:flex;gap:14px;overflow:auto;scrollbar-width:none;padding:6px 0 12px}
#heldCreate .hilites .hl,.hl-strip .hl{display:flex;flex-direction:column;align-items:center;gap:6px;background:none;min-width:66px;flex:none;font-size:11px;color:var(--mut,#8a847a)}
#heldCreate .hilites .av,.hl-strip .av{width:60px;height:60px;border-radius:50%;background:var(--pill,rgba(255,255,255,.1));display:grid;place-items:center;font-size:20px;overflow:hidden;border:2px solid rgba(217,178,94,.6)}
#heldCreate .hilites .av img,.hl-strip .av img{width:100%;height:100%;object-fit:cover}
#heldCreate .hilites .hl.on .av{border-color:#fff}
#heldCreate .grid.picking button.on{outline:3px solid var(--gold);outline-offset:-3px}
#heldCreate .grid .chk{position:absolute;right:6px;top:6px;width:22px;height:22px;border-radius:50%;border:2px solid #fff;background:rgba(0,0,0,.35)}
#heldCreate .grid button.on .chk{background:var(--gold);border-color:var(--gold)}
#heldCreate .hlbar{position:sticky;bottom:0;display:flex;gap:8px;align-items:center;padding:12px 0 max(12px,env(safe-area-inset-bottom));background:var(--ink);margin-top:auto}
#heldCreate .hlbar input{flex:1;min-width:0;background:var(--pill);border:1px solid var(--line);border-radius:999px;padding:11px 14px;color:#fff;font-size:14px}
#heldCreate .hlbar .n{font-size:12px;color:var(--mut);flex:none}
#heldCreate .hlbar .go{background:var(--gold);color:#222;border-radius:999px;padding:0 16px;min-height:44px;font-weight:700;flex:none}
.hl-strip{display:flex;gap:14px;overflow:auto;scrollbar-width:none;padding:4px 16px 12px}
.hl-strip .av{background:var(--chip,#f1ede6);color:var(--ink,#1c1b19)}
#heldCreate .promptcard{position:absolute;left:22px;right:22px;top:76px;z-index:2;background:rgba(0,0,0,.42);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.25);border-radius:16px;padding:10px 14px;display:flex;flex-direction:column;gap:2px;pointer-events:none;animation:held-pop .3s ease-out}
#heldCreate .promptcard small{font-size:10px;letter-spacing:1px;color:var(--gold)}
#heldCreate .promptcard b{font-size:15px;line-height:1.35}
#heldCreate .promptcard.view{pointer-events:auto;flex-direction:row;align-items:center;flex-wrap:wrap;gap:6px 10px;top:96px}
#heldCreate .promptcard.view small{width:100%}
#heldCreate .promptcard.view b{flex:1;min-width:0}
#heldCreate .promptcard .join{background:var(--gold);color:#222;border-radius:999px;padding:8px 14px;font-weight:700;font-size:13px;min-height:36px;flex:none}
#heldCreate .promptrow{position:absolute;left:16px;right:16px;bottom:230px;z-index:4;display:flex;flex-direction:column;gap:8px;animation:held-up .22s cubic-bezier(.2,.8,.2,1)}
#heldCreate .promptrow .promptnew{display:flex;gap:8px}
#heldCreate .promptrow .promptnew input{flex:1;min-width:0;background:rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:10px 14px;color:#fff;font-size:14px}
#heldCreate .promptrow .promptnew button{background:var(--gold);color:#222;border-radius:999px;padding:0 14px;font-weight:700;min-height:44px;flex:none}
#heldCreate .promptrow .chips{margin-top:0}
#heldCreate .promptrow .chips button.off{background:rgba(224,68,58,.25);color:#fff}
#heldCreate .promptlead{text-align:left;padding:4px 0 10px}
#heldCreate .promptlead small{display:block;font-size:10px;letter-spacing:1px;color:var(--gold)}
.sea-v5-prompts{display:flex;gap:8px;overflow:auto;scrollbar-width:none;padding:4px 16px 8px}
.sea-prompt{flex:none;width:108px;height:156px;border-radius:16px;position:relative;overflow:hidden;background:linear-gradient(170deg,#ffffff,#eef3fa);border:1px solid #dfe6ef;box-shadow:0 1px 2px rgba(31,42,54,.05)}
.sea-prompt::after{content:"✦";position:absolute;top:8px;right:10px;font-size:14px;color:#c9dbf1;pointer-events:none}
.sea-prompt-main{position:absolute;inset:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:3px;padding:10px 10px 38px;text-align:left;background:none;color:inherit;width:100%}
.sea-prompt .ring{position:absolute;top:10px;left:10px;width:36px;height:36px;padding:2px;border-radius:50%;background:linear-gradient(135deg,#f3f7fc,#dee9f5 45%,#a9c4e4)}
.sea-prompt .ring img,.sea-prompt .ring i{width:100%;height:100%;border-radius:50%;border:2px solid #fff;background:#eef2f7;object-fit:cover;display:grid;place-items:center;font-size:13px;font-style:normal;color:#26314b;font-weight:700}
.sea-prompt .cnt{position:absolute;top:34px;left:38px;font-size:9px;font-style:normal;font-weight:700;background:#fff;border:1px solid var(--line,#e6e0d6);border-radius:999px;padding:1px 5px;color:var(--ink2,#5d5951)}
.sea-prompt small{font-size:9px;letter-spacing:1.2px;color:#6b7a94;font-weight:700}
.sea-prompt-main b{font-family:var(--held-font-serif,var(--serif,serif));font-size:13px;line-height:1.3;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#26314b}
.sea-prompt-join{position:absolute;bottom:9px;right:9px;background:#dee9f5;color:#26314b;border:1px solid #cfdff2;border-radius:999px;padding:2px 7px;font-size:10px;font-weight:700;min-height:22px;letter-spacing:-.2px}
post .creation-layer[data-anim=typewriter]{animation:held-type 2s steps(20)}.post .creation-layer[data-anim=pop]{animation:held-pop .4s ease-out}.post .creation-layer[data-anim=jump]{animation:held-jump .6s ease-in-out}
@media(prefers-reduced-motion:reduce){.post .creation-layer[data-anim]{animation:none!important}}

#heldCreate .busy{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
#heldCreate .busy .pill{background:rgba(255,255,255,.14);color:#fff}
#heldCreate .row.share{align-items:center}
#heldCreate .row.share .sm{display:flex;flex-direction:column;flex:1;min-width:0;text-align:left;gap:2px}
#heldCreate .row.share .sm small{font-size:12px;opacity:.7}
#heldCreate .row.share .rd{width:22px;height:22px;border-radius:50%;border:2px solid rgba(255,255,255,.55);flex:none;position:relative;background:none;padding:0}
#heldCreate .row.share .rd.on{border-color:#dee9f5}
#heldCreate .row.share .rd.on::after{content:"";position:absolute;inset:4px;border-radius:50%;background:#dee9f5}
#heldCreate .pill.go.wide{width:100%;margin-top:10px;background:#dee9f5;color:#1f2a36;font-weight:700;border-radius:14px}
#heldCreate .story-settings h5{margin:14px 0 4px;font-size:13px;opacity:.85}
#heldCreate .story-settings .opt{display:flex;align-items:center;gap:10px;padding:8px 4px;font-size:14px}
#heldCreate .story-settings .chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
#heldCreate .story-settings .chip{background:rgba(255,255,255,.14);border-radius:999px;padding:5px 10px;font-size:12px}
#heldCreate .story-settings .search{width:100%;margin-top:6px}
#heldCreate .viewers{display:flex;flex-direction:column;gap:8px;max-height:50vh;overflow:auto}
#heldCreate .viewer{display:flex;align-items:center;gap:10px;font-size:14px}
#heldCreate .viewer .av{width:34px;height:34px;border-radius:50%;background:#eef2f7;color:#1f2a36;display:grid;place-items:center;overflow:hidden;flex:none;font-weight:700}
#heldCreate .viewer .av img{width:100%;height:100%;object-fit:cover}
#heldCreate .viewer small{margin-left:auto;opacity:.6}
#heldCreate .dest .pill.act{flex:1;gap:6px}
.sea-v5-prompts .sea-prompt-hide{flex:none;align-self:center;width:28px;height:28px;border-radius:50%;background:#eef2f7;color:#55627a;font-size:12px}

.sea-v5-feedpage .searchbox{display:flex;padding:10px 16px 4px}
.sea-v5-feedpage .searchbox input{flex:1;min-width:0;height:40px;border-radius:12px;border:1px solid #e3e8ef;background:#fff;padding:0 14px;font-size:14px}
.sea-v5-feedpage .feedchips{display:flex;gap:8px;overflow:auto;scrollbar-width:none;padding:8px 16px 10px}
.sea-v5-feedpage .feedchips button{flex:none;border-radius:999px;padding:8px 14px;font-size:13px;background:#fff;border:1px solid #e3e8ef;color:#1f2a36}
.sea-v5-feedpage .feedchips button.on{background:#dee9f5;border-color:#c6d8ee;font-weight:700}
.sea-v5-profile .pbtn.hub{flex-wrap:wrap}
#heldCreate .story-settings .opt{background:none;color:inherit;border-radius:10px;margin:0}
#heldCreate .story-settings .opt input{accent-color:#dee9f5}
#heldCreate .story-settings .hint{text-align:left;margin:2px 0 6px;opacity:.7}
#heldCreate .story-settings .people{margin-top:8px}

.pagetag{display:inline-block;margin-left:6px;font-style:normal;font-size:10px;font-weight:700;letter-spacing:.5px;background:#dee9f5;color:#1f2a36;border-radius:999px;padding:2px 7px;vertical-align:middle;line-height:1.4}

#heldCreate .canvas .txt,#heldCreate .canvas .txt *{touch-action:none;-webkit-touch-callout:none}
#heldCreate .canvas .sticker img{pointer-events:none;-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
#heldCreate .canvas textarea.txt{touch-action:none}

#heldCreate .editrow{position:absolute;left:16px;right:16px;bottom:150px;z-index:4;background:rgba(0,0,0,.48);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:10px 12px;display:flex;flex-direction:column;gap:8px;animation:held-up .22s cubic-bezier(.2,.8,.2,1)}
#heldCreate.tools-left .editrow{left:62px}
#heldCreate .editrow label{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--txt)}
#heldCreate .editrow input[type=range]{flex:1;min-width:0;accent-color:#dee9f5;height:28px;margin:0}
#heldCreate .editrow .dur{font-size:12px;min-width:44px;text-align:right;opacity:.85}
#heldCreate .editrow .acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
#heldCreate .editrow .acts .pill{min-height:34px;padding:6px 10px;font-size:12px}
#heldCreate .editrow .coverthumb{width:40px;height:56px;object-fit:cover;border-radius:8px;border:2px solid #dee9f5}

#heldCreate .musicrow.mtabs{bottom:286px;gap:6px}
#heldCreate .musicrow .tab{font-size:12px;padding:6px 10px;min-height:32px;border-radius:999px;background:rgba(255,255,255,.12);color:#fff;flex:none}
#heldCreate .musicrow .tab.on{background:#dee9f5;color:#1f2a36;font-weight:700}
#heldCreate .editrow .tl{position:relative;height:44px;border-radius:10px;overflow:hidden;background:rgba(255,255,255,.08)}
#heldCreate .editrow .tl .frames{position:absolute;inset:0;display:flex}
#heldCreate .editrow .tl .frames img{flex:1;min-width:0;height:100%;object-fit:cover;opacity:.9}
#heldCreate .editrow .tl .dim{position:absolute;top:0;bottom:0;background:rgba(0,0,0,.55);pointer-events:none}
#heldCreate .editrow .tl .bar{position:absolute;height:6px;border-radius:3px;bottom:3px;pointer-events:none}
#heldCreate .editrow .tl .bar.voice{background:#e04ad1}
#heldCreate .editrow .tl .bar.file{background:#4ad1c6;bottom:11px}
#heldCreate .editrow .tl .bar.text{background:#8b6cf0;top:3px;height:6px;bottom:auto;opacity:.75}
#heldCreate .editrow .tl .bar.text.sel{opacity:1;box-shadow:0 0 0 1px #fff}
#heldCreate .editrow .tl .ph{position:absolute;top:0;bottom:0;width:2px;background:#fff;box-shadow:0 0 6px rgba(0,0,0,.6);pointer-events:none;transform:translateX(-1px)}
#heldCreate .editrow label.tt{color:#c9b8ff}
#heldCreate .editrow.rec{align-items:center}
#heldCreate .recwrap{display:flex;flex-direction:column;align-items:center;gap:6px;padding:6px 0 2px}
#heldCreate .recbtn{width:72px;height:72px;border-radius:50%;padding:0;background:conic-gradient(#e04ad1 calc(var(--p,0)*1%),rgba(255,255,255,.18) 0);display:grid;place-items:center}
#heldCreate .recbtn i{width:28px;height:28px;border-radius:8px;background:#fff;display:block}
#heldCreate .rectime{font-size:13px;font-variant-numeric:tabular-nums}
#heldCreate .canvas canvas.ink,.creation-canvas canvas.ink{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
#heldCreate .txt[hidden],.creation-layer[hidden]{display:none!important}
#heldCreate.tools-left .musicrow,#heldCreate.tools-left .stickerrow,#heldCreate.tools-left .bgrow,#heldCreate.tools-left .promptrow{left:66px}
#heldCreate .musicrow .hint{white-space:normal;line-height:1.35}

#heldCreate .canvas .overlay{border-radius:14px;overflow:hidden;box-shadow:0 6px 20px rgba(0,0,0,.35);border:2px solid rgba(255,255,255,.75);z-index:3;cursor:grab;padding:0;min-height:0;line-height:0}
#heldCreate .canvas .overlay video,#heldCreate .canvas .overlay img{display:block;width:100%;height:auto;pointer-events:none}
#heldCreate .editrow .tl .bar.ov{background:#f0a468;top:11px;height:6px;bottom:auto}
#heldCreate .editrow label.ov{color:#f5c9a0}

#heldCreate .editrow{max-height:58%;overflow:auto;scrollbar-width:none}

/* 2026-09-24 슈아: 흘려보내기 창 시트 = 우리 결(아쿠아 유리 · 빛) · ⊕ 고르기 = 링 꽂힌 카드. 캔버스(사진·영상)는 인스타 문법대로 어둡게 유지 */
#heldCreate .sheet{background:rgba(31,42,54,.22);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
#heldCreate .sh,#heldCreate .plus .sh{background:rgba(22,29,48,.92);color:#f3f1ea;border:1px solid rgba(255,255,255,.14);border-bottom:0;box-shadow:0 -10px 34px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.14);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
#heldCreate .sh .hd{background:rgba(31,42,54,.16)}
#heldCreate .sh h4{font-family:var(--held-font-serif,"Noto Serif KR",serif);font-size:17px;font-weight:600;letter-spacing:-.2px;color:#1f2a36}
#heldCreate .sh .row{color:#1f2a36;border-bottom-color:rgba(31,42,54,.09)}
#heldCreate .sh .row .i{color:#3f6f8a}
#heldCreate .sh .row .r{border-color:rgba(31,42,54,.22)}
#heldCreate .sh .row .r.on{background:var(--held-light,#B9CDE3);border-color:var(--held-light,#B9CDE3)}
#heldCreate .sh .row.share .rd{border-color:rgba(31,42,54,.28)}
#heldCreate .sh .row.share .rd.on{border-color:transparent;background:var(--ring,linear-gradient(135deg,#f6f9fd,#dee9f5 40%,#6f9bd6));box-shadow:0 0 8px rgba(169,196,228,.8)}
#heldCreate .sh .row.share .rd.on::after{inset:5px;background:#fff}
#heldCreate .sh .row.share .sm small{color:#6b7790;opacity:1}
#heldCreate .sh .row.danger{color:#c9453b}
#heldCreate .sh .ic{background:rgba(31,42,54,.06);color:#1f2a36}
#heldCreate .sh .pill{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);color:#f3f1ea}
#heldCreate .sh .pill.go{background:var(--held-light,#B9CDE3);border-color:transparent;color:#1f2a36;box-shadow:0 0 0 4px color-mix(in srgb,var(--held-light,#B9CDE3) 22%,#fff),0 4px 12px rgba(31,42,54,.1)}
#heldCreate .sh>p,#heldCreate .sh .hint{color:#6b7790}
#heldCreate .sh input[type=checkbox]{accent-color:#3f6f8a}
#heldCreate .pick-hint{margin:-4px 0 10px;font-size:12px;color:#6b7790}
#heldCreate .pick{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:2px 0 14px}
#heldCreate .pcard{display:flex;flex-direction:column;align-items:center;gap:7px;padding:18px 10px 14px;border-radius:18px;border:1px solid rgba(31,42,54,.12);background:linear-gradient(180deg,#fff 0%,color-mix(in srgb,var(--held-glass,#DEE9F5) 45%,#fff) 100%);box-shadow:0 4px 14px rgba(31,42,54,.08),inset 0 1px 0 #fff;color:#1f2a36;text-align:center;transition:transform .12s,box-shadow .12s}
#heldCreate .pcard:active{transform:scale(.97)}
#heldCreate .pcard:focus-visible{outline:2px solid var(--held-light,#B9CDE3);outline-offset:2px}
#heldCreate .pcard .ring{display:block;width:58px;height:58px;padding:2.5px;border-radius:50%;background:var(--ring,linear-gradient(135deg,#f6f9fd,#dee9f5 40%,#6f9bd6));box-shadow:0 0 14px 2px rgba(169,196,228,.65),0 0 0 1px rgba(255,255,255,.95) inset}
#heldCreate .pcard .ring .i{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:#fff;border:2px solid #f6f8fb;font-size:20px;color:#3f6f8a}
#heldCreate .pcard .ring .i img{width:58%;height:58%;object-fit:contain}
#heldCreate .pcard b{font-size:14px;font-weight:700;letter-spacing:-.1px}
#heldCreate .pcard small{font-size:11px;line-height:1.4;color:#6b7790}
@media (prefers-reduced-motion:reduce){#heldCreate .pcard{transition:none}}

/* 2026-09-25 슈아: 창(시트)은 어두운 남색 유리 하나로 — 글자·줄·아이콘도 밝게 */
#heldCreate .sh h4,#heldCreate .sh .row,#heldCreate .sh .ic,#heldCreate .sh .row .r{color:#f3f1ea}
#heldCreate .sh .row{border-bottom-color:rgba(255,255,255,.09)}
#heldCreate .sh .row .i{color:#b9cde3}
#heldCreate .sh .row .r{border-color:rgba(255,255,255,.3)}
#heldCreate .sh .row .r.on{color:#1f2a36}
#heldCreate .sh .row.share .rd{border-color:rgba(255,255,255,.38)}
#heldCreate .sh .row.share .sm small,#heldCreate .sh>p,#heldCreate .sh .hint,#heldCreate .pick-hint{color:rgba(243,241,234,.62)}
#heldCreate .sh .ic{background:rgba(255,255,255,.1)}
#heldCreate .sh .hd{background:rgba(255,255,255,.22)}
#heldCreate .sh .row.danger{color:#ff6b61}
#heldCreate .sh input[type=checkbox]{accent-color:#b9cde3}
#heldCreate .pcard{border-color:rgba(255,255,255,.14);background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04));color:#f3f1ea}
#heldCreate .pcard small{color:rgba(243,241,234,.62)}
#heldCreate .pcard .ring .i{background:#1b2236;border-color:#2a3350;color:#dfe8fb}

/* 2026-09-25 슈아: 템플릿 창 두 탭 · ★ 저장 */
#heldCreate .ptabs{display:flex;gap:16px;justify-content:center;margin:2px 0 8px}
#heldCreate .ptabs button{background:none;font-size:15px;font-weight:600;color:var(--mut);padding:6px 2px;min-height:36px;border-bottom:2px solid transparent;border-radius:0}
#heldCreate .ptabs button.on{color:#fff;border-bottom-color:#fff}
#heldCreate .pfor{display:block;font-size:12px;color:var(--mut);margin:0 0 6px 2px}
#heldCreate .pchips{flex-wrap:wrap}
#heldCreate .pchip{display:inline-flex;align-items:center;gap:0;border-radius:999px;background:var(--pill);padding-right:4px}
#heldCreate .pchip button:first-child{background:none;min-height:40px}
#heldCreate .pchip.on{background:#fff;color:#111}#heldCreate .pchip.on button{color:#111}
#heldCreate .pstar{width:30px;height:30px;min-height:0;padding:0;border-radius:50%;background:none;font-size:15px;color:var(--mut)}
#heldCreate .pstar.on{color:var(--gold)}
#heldCreate .pempty{width:100%;text-align:center;font-size:13px;color:var(--mut);padding:14px 0}

/* 2026-09-25 슈아: 올리기 시작 화면(위 세 버튼 · 최근 항목 ▾ · 선택 · 격자 · 관리) · 콜라주 · 길이 조절 */
#heldCreate .pk{display:flex;flex-direction:column;gap:10px;flex:1;min-height:0}
#heldCreate .pk-three{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
#heldCreate .pk-big{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:72px;border-radius:18px;background:var(--pill);font-size:13px;padding:10px 6px}
#heldCreate .pk-big img,#heldCreate .pk-big svg{width:24px;height:24px}
#heldCreate .pk-bar{display:flex;align-items:center;justify-content:space-between;gap:8px}
#heldCreate .pk-src{background:none;font-weight:700;font-size:15px;min-height:40px;padding:0 4px}
#heldCreate .pk-sel{background:var(--pill);border-radius:999px;padding:6px 14px;min-height:36px;font-size:13px}
#heldCreate .pk-sel.on{background:#dee9f5;color:#1f2a36}
#heldCreate .pk-srcs{display:flex;flex-direction:column;background:rgba(255,255,255,.08);border-radius:14px;overflow:hidden}
#heldCreate .pk-srcs .row{text-align:left;padding:12px 14px;min-height:44px;background:none}
#heldCreate .pk-srcs .row.on{font-weight:700}
#heldCreate .pk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;overflow:auto;flex:1;min-height:120px;align-content:start;scrollbar-width:none}
#heldCreate .pk-tile{position:relative;aspect-ratio:1;border-radius:6px;overflow:hidden;background:rgba(255,255,255,.08);padding:0;display:grid;place-items:center}
#heldCreate .pk-tile img,#heldCreate .pk-tile video{width:100%;height:100%;object-fit:cover;display:block}
#heldCreate .pk-tile.cam,#heldCreate .pk-tile.draft{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--mut)}
#heldCreate .pk-tile.draft{outline:1.5px dashed rgba(255,255,255,.55);outline-offset:-3px}
#heldCreate .pk-tile.draft img,#heldCreate .pk-tile.draft video{position:absolute;inset:0;opacity:.55}
#heldCreate .pk-tile.draft small,#heldCreate .pk-tile.cam small{position:relative;z-index:1;background:rgba(0,0,0,.35);border-radius:999px;padding:2px 8px;color:#fff}
#heldCreate .pk-tile.on{outline:2px solid #fff;outline-offset:-2px}
#heldCreate .pk-tile .pk-n{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;border:1.5px solid #fff;background:rgba(0,0,0,.25);color:#fff;font-size:12px;font-style:normal;display:grid;place-items:center}
#heldCreate .pk-tile.on .pk-n{background:#dee9f5;color:#1f2a36;border-color:#dee9f5}
#heldCreate .pk-empty{grid-column:1/-1;text-align:center;color:var(--mut);font-size:13px;padding:24px 0}
#heldCreate .pk-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px}
#heldCreate .pk-manage{background:none;color:var(--mut);font-size:14px;min-height:44px;padding:0 6px}
#heldCreate .cg{flex:1;min-height:0;display:grid;place-items:center}
#heldCreate .cg canvas{max-height:100%;max-width:100%;border-radius:18px;aspect-ratio:9/16;background:#dee9f5}
#heldCreate .cg-modes{display:flex;justify-content:center;gap:8px;padding:8px 0}
#heldCreate .cg-strip{display:flex;gap:4px;overflow:auto;scrollbar-width:none;padding:2px 0}
#heldCreate .cg-strip img{width:44px;height:44px;object-fit:cover;border-radius:8px;flex:none}
#heldCreate .cg-hint{color:var(--mut);font-size:12px;text-align:center}
#heldCreate .pill.busy{opacity:.7;pointer-events:none}
#heldCreate .canvas.trim{display:grid;place-items:center}
#heldCreate .canvas.trim video.media{max-height:100%;max-width:100%}

/* 2026-09-25 슈아: 인스턴츠 — 공감 줄(가운데 크게) · 하트 날리기 · 소개 시트 */
#heldCreate .reacts button:first-child{width:64px;height:64px;font-size:28px;border:2px solid rgba(255,255,255,.8)}
#heldCreate .fly{position:absolute;bottom:22%;font-size:26px;pointer-events:none;animation:heldFly 1.4s ease-out forwards;z-index:5}
@keyframes heldFly{0%{transform:translate(0,0) scale(.6);opacity:0}15%{opacity:1}100%{transform:translate(var(--dx,0),-70vh) scale(1.2) rotate(12deg);opacity:0}}
#heldCreate .sheet p.row{display:flex;gap:10px;align-items:center;font-size:14px;margin:0}
/* 24시 카메라 1판(10-09 슈아 「인스타 결 · 이모지 ✗ · 촬영 단추 보이게」): 유리 도구줄 · 촬영 줄은 모드 줄 위 · 선 아이콘 */
#heldCreate svg.ci{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}
#heldCreate .x svg.ci,#heldCreate .ic svg.ci{width:20px;height:20px}
#heldCreate.mode-camera .reelcam{border-radius:0;min-height:0}
#heldCreate .reelcam .ltools{top:max(84px,calc(env(safe-area-inset-top) + 70px));left:14px;gap:12px;z-index:4}
#heldCreate .reelcam .ltools .rnd,#heldCreate .reelcam .reelbot .rnd,#heldCreate.mode-camera .top .x,#heldCreate.mode-camera .top .ic{background:rgba(16,20,30,.42);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.18);color:#fff;font-size:12px;font-weight:700}
#heldCreate .reelcam .ltools .rnd{width:46px;height:46px}#heldCreate .reelcam .ltools .rnd.on{background:rgba(255,255,255,.9);color:#0F1524}
#heldCreate .reelcam .reelbot{position:absolute;left:0;right:0;bottom:calc(max(22px,env(safe-area-inset-bottom)) + 62px);z-index:4;display:flex;align-items:center;justify-content:center;gap:40px;margin:0;padding:0 24px}
#heldCreate .reelcam .reelbot .rnd{width:48px;height:48px}
#heldCreate .reelcam .reelbot .shutter{width:78px;height:78px;border:5px solid rgba(255,255,255,.55);background:rgba(255,255,255,.92);box-shadow:0 0 0 4px rgba(0,0,0,.18);transition:transform .15s}
#heldCreate .reelcam .reelbot .shutter:active{transform:scale(.94)}#heldCreate .reelcam .reelbot .shutter.recording{background:#d74f4f;border-color:rgba(255,255,255,.8)}
#heldCreate.mode-camera .strip{position:absolute;left:0;right:0;bottom:0;z-index:5;margin:0;padding:10px 16px max(20px,env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.5));justify-content:center;gap:18px;mask-image:none}
#heldCreate.mode-camera .strip button{font-size:13px;letter-spacing:.02em;color:rgba(255,255,255,.72);min-height:40px;padding:0 6px}
#heldCreate.mode-camera .strip .on{color:#fff}
#heldCreate.mode-camera .top .t{font-size:15px;font-weight:600;letter-spacing:.02em;text-shadow:0 1px 8px rgba(0,0,0,.35)}
#heldCreate .camera-status .pill svg.ci{width:18px;height:18px}

/* 24시 카메라 1판 b: 리플 카메라도 24시처럼 전체 화면(틀 ✗ · 머리는 영상 위에) */
#heldCreate.mode-camera .scr{padding:0;gap:0;max-width:none}
#heldCreate.mode-camera .top{position:absolute;left:0;right:0;top:0;z-index:8;padding:max(14px,env(safe-area-inset-top)) 16px 0}
#heldCreate.mode-camera .reelcam{border-radius:0;min-height:0;flex:1}
/* 24시 카메라 1b(코덱스 CAM1-001): 도구줄은 폭 고정 · 오른쪽 설정 · 대본·슬라이더는 도구줄 위 */
#heldCreate .reelcam .ltools{width:46px;right:auto}
#heldCreate.tools-left .reelcam .ltools{left:auto;right:14px}
#heldCreate.tools-left .reelcam .script{left:12px;right:64px}#heldCreate.tools-left .reelcam .sliders{left:12px;right:70px}
#heldCreate .reelcam .script,#heldCreate .reelcam .sliders{z-index:6}
/* 24시 카메라 1c(코덱스 CAM1B-002): 도구줄 위치 = 설정 그대로(기본·오른쪽 → 오른쪽 · 왼쪽 → 왼쪽) · 대본·슬라이더는 반대쪽 */
#heldCreate .reelcam .ltools{left:auto;right:14px}
#heldCreate .reelcam .script{left:12px;right:64px}#heldCreate .reelcam .sliders{left:12px;right:70px}
#heldCreate.tools-left .reelcam .ltools{left:14px;right:auto}
#heldCreate.tools-left .reelcam .script{left:64px;right:12px}#heldCreate.tools-left .reelcam .sliders{left:64px;right:120px}
/* 10-22 슈아 「카메라 칸 아이콘 가운데 · 세 화면 최적화」 */
#heldCreate .pk-tile.cam{justify-content:center;align-items:center}
/* 패드 = 가운데 넓은 창(스토리 = 세로 전체 화면 그대로) · 사진 4칸 */
@media(min-width:700px){
  #heldCreate[open]:not(.kind-story){inset:0;margin:auto;width:min(94vw,760px);height:min(92dvh,1000px);border-radius:18px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.45)}
  #heldCreate[open]:not(.kind-story) .scr{max-width:none;min-height:100%;padding:16px 20px 20px}
  #heldCreate[open]:not(.kind-story) .scr{height:100%;overflow-y:auto}/* ui-74 R008: 창 안에서 세로 스크롤(보관함 긴 목록 끝까지) */
  #heldCreate[open]:not(.kind-story) .scr>*{align-self:stretch}#heldCreate[open]:not(.kind-story) .scr>.top{width:100%;max-width:none}
  #heldCreate .pk-three{max-width:520px}
  #heldCreate .pk-grid{grid-template-columns:repeat(4,1fr)}
}
/* 웹 = 인스타 웹 「새 게시물」 결: 가운데 창 · 사진 5칸 */
@media(min-width:1024px){
  #heldCreate[open]:not(.kind-story){width:min(88vw,920px);height:min(88dvh,860px);border-radius:14px}
  #heldCreate .pk-grid{grid-template-columns:repeat(5,1fr);gap:4px}
}

/* 10-22 슈아 「게시글 기본 첫 페이지 = 인스타 문법 · 음원 · YouTube 도」 */
#heldCreate.kind-post .pk-three{grid-template-columns:repeat(4,1fr);max-width:none}
#heldCreate .pk-g{font-style:normal;font-size:22px;line-height:1}#heldCreate .pk-ytg{position:relative;width:30px;height:21px;border-radius:6px;background:currentColor}#heldCreate .pk-ytg::after{content:"";position:absolute;left:12px;top:5px;border-left:9px solid var(--ink,#0F1524);border-top:5.5px solid transparent;border-bottom:5.5px solid transparent}
#heldCreate .lp-prev{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;width:100%;height:100%;min-height:320px;background:radial-gradient(circle at 50% 35%,#2B3150,#161D30 70%)}
#heldCreate .lp-prev .lp-disc{width:min(70%,340px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:conic-gradient(from 30deg,rgba(255,255,255,.14),rgba(255,255,255,0) 18%,rgba(255,255,255,.1) 50%,rgba(255,255,255,0) 68%,rgba(255,255,255,.14)),repeating-radial-gradient(circle,#24283C 0 1.5px,#30344B 1.5px 3px);box-shadow:0 18px 40px rgba(0,0,0,.45),inset 0 0 0 6px #1E2133;animation:crLp 3.6s linear infinite}
#heldCreate .lp-prev .lp-label{width:36%;aspect-ratio:1;border-radius:50%;background:#D0DFF0 center/cover no-repeat;box-shadow:0 0 0 3px rgba(251,250,246,.9)}
#heldCreate .lp-prev audio{width:min(86%,420px)}
@keyframes crLp{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){#heldCreate .lp-prev .lp-disc{animation:none}}
#heldCreate iframe.media.yt{width:100%;aspect-ratio:16/9;height:auto;border:0;align-self:center}
#heldCreate .ytf{display:flex;flex-direction:column;gap:14px;padding-top:6px}
#heldCreate .ytf label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--mut)}
#heldCreate .ytf input{min-height:48px;padding:0 14px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.06);color:var(--txt);font:inherit;font-size:15px}
#heldCreate .ytf .ytp{border-radius:14px;overflow:hidden;background:rgba(255,255,255,.04);aspect-ratio:16/9}#heldCreate .ytf .ytp:empty{display:none}#heldCreate .ytf .ytp img{width:100%;height:100%;object-fit:cover;display:block}
#heldCreate .ytf .row{display:flex;justify-content:space-between;gap:8px;margin-top:auto}
/* 10-22 음악 카드 미리보기(💿 LP · 🎞 위젯 · ▶ 16:9) = 편집 칸 꽉 · 만들기 단추 규칙에 안 덮이게 */
#heldCreate .canvas .media.hac-prev{position:relative;flex:1 1 auto;align-self:stretch;width:100%;max-width:none;height:auto;min-height:320px;margin:0;border-radius:16px;overflow:auto;object-fit:initial}
#heldCreate .hac-prev .hac{margin-left:auto;margin-right:auto;width:min(100%,560px)}
#heldCreate .hac-pick button{min-width:0;width:auto;height:auto;min-height:36px;padding:0 14px!important;border:1px solid rgba(62,67,96,.18)!important;border-radius:999px!important;background:#fff!important;color:#3E4360!important;font:700 13px/1 Pretendard,system-ui,sans-serif!important;box-shadow:none!important}
#heldCreate .hac-pick button[aria-pressed="true"]{background:#3E4360!important;color:#fff!important;border-color:#3E4360!important}
#heldCreate .hac .hac-play{color:#fff!important;font-size:15px!important;background:#3E4360!important;padding:0!important}
#heldCreate .hac .hac-wave{background:rgba(62,67,96,.38)!important;padding:0!important}
