.poster-workspace { --ink:#34261b; --paper:#ead6ae; --red:#8d3427; position:absolute; display:grid; grid-template-columns:1fr 1fr; gap:6%; color:var(--ink); font:12px/1.35 Georgia,serif; isolation:isolate; }
.poster-workspace[hidden] { display:none; }
.poster-workspace button { font:inherit; color:inherit; cursor:pointer; border:0; border-radius:0; padding:0; background:none; }
.poster-workspace button:disabled { cursor:default; opacity:.65; }
.poster-workspace button:focus-visible, .poster-modal button:focus-visible { outline:3px solid #6a361d; outline-offset:3px; }
.poster-left-page,.poster-right-page { min-width:0; min-height:0; display:flex; flex-direction:column; position:relative; }
.poster-left-page { container-type:inline-size; }
.poster-heading h2 { font:bold clamp(16px,6.2cqw,27px)/1.05 'Courier New',monospace; margin:0; letter-spacing:-1px; white-space:nowrap; }
.poster-red-rule { display:block; width:87%; height:2px; background:var(--red); transform:rotate(-1deg); margin:6px 0 8px; }
.poster-heading p { margin:0 0 12px; font-size:12px; }
.poster-zones { display:grid; grid-template-columns:1fr 1fr; gap:16px 12px; flex:1; min-height:0; width:92%; max-height:calc(100% - 150px); margin:4px 0 0 -3px; }
.poster-zone { min-width:0; display:flex; flex-direction:column; border:1px dashed #72513799; outline:1px solid #ead7b34d; outline-offset:2px; border-radius:4px; transition:background .15s,transform .15s; }
.poster-zone.is-drop-target { background:#f5e7cbbd; outline:3px solid #80512a; transform:translateY(-3px); }
.poster-workspace .poster-zone-target { display:flex; flex-direction:column; text-align:left; width:100%; padding:8px; flex:1; min-height:90px; }
.zone-label { display:flex; justify-content:space-between; gap:4px; font:bold 13px/1.2 'Courier New',monospace; background:#f2ddafe0; padding:5px; margin:-15px -4px 3px; box-shadow:1px 2px 3px #34210d36; transform:rotate(-1deg); }
.zone-label { align-items:center; }
.zone-title { display:flex; align-items:center; gap:6px; min-width:0; text-align:left; }
.zone-icon { display:inline-block; width:18px; height:18px; flex:0 0 18px; color:#663f28; vertical-align:middle; }
.zone-label b { border:1px solid #73512f; border-radius:50%; min-width:18px; flex-shrink:0; text-align:center; align-self:center; }
.poster-mobile-actions button { display:flex; align-items:center; justify-content:center; gap:7px; width:100%; }
.zone-hint { font-size:10px; }
.poster-pile { display:flex; align-items:center; justify-content:center; position:relative; min-height:39px; flex:1; margin:5px 0 0; }
.zone-empty { opacity:.7; font-style:italic; font-size:10px; }
.poster-pile-thumb { --thumb-width:34px; --thumb-height:43px; display:block; width:var(--thumb-width); height:var(--thumb-height); overflow:hidden; box-shadow:1px 2px 3px #21160c55; background:#ebdbbb; border:2px solid #ebdbbb; transform:rotate(-8deg); margin-right:-13px; }
.poster-pile-thumb:nth-child(2) { transform:rotate(4deg); }.poster-pile-thumb:nth-child(3) { transform:rotate(11deg); }
.poster-pile-thumb img { width:100%; height:100%; object-fit:cover; }
.poster-pile-thumb .poster-placeholder { font-size:2px; justify-content:center; }.poster-pile-thumb .poster-placeholder b { font-size:15px; padding:0; }.poster-pile-thumb .poster-placeholder>span { display:none; }
.poster-workspace .poster-pile-open { min-height:26px; border-top:1px solid #6c4b2a38; font-size:10px; text-decoration:underline; }
.poster-workspace .poster-note { position:absolute; top:-8px; right:-8px; width:205px; height:205px; box-sizing:border-box; margin:0; padding:15px; background:#e7cc78; color:#382a1d; box-shadow:3px 5px 6px #291a0f55; transform:rotate(-6deg); z-index:3; font:italic 10.5px/1.25 Georgia,serif; text-align:left; }
.poster-note::before { content:''; position:absolute; width:10px; height:10px; border-radius:50%; background:#9f2920; box-shadow:1px 3px 2px #46291b88; top:-5px; left:50%; }
.poster-note-text { display:block; height:100%; white-space:pre-line; overflow:hidden; }
.poster-note-expanded { width:100%; max-width:440px; margin:auto; padding:0; background:transparent; white-space:pre-line; font:italic clamp(20px,2.3vw,28px)/1.55 Georgia,serif; box-shadow:none; }
.poster-stack { position:relative; flex:none; align-self:center; margin:110px 0 6px; }
.poster-stack-under { position:absolute; inset:0; background:#c8ad79; border:5px solid #e7d9b9; box-shadow:3px 4px 6px #221b1488; }
.under-one { transform:rotate(-7deg) translate(-5px,1px); }.under-two { transform:rotate(6deg) translate(6px,2px); background:#736b59; }
.poster-workspace .poster-card,.poster-modal .poster-card { position:relative; display:block; text-align:left; padding:0; border:0; background:transparent; box-shadow:2px 4px 5px #291b1266; color:#2c261e; }
.poster-workspace .poster-top { height:100%; width:100%; transform:rotate(-2deg); touch-action:none; cursor:grab; }
.poster-workspace .poster-lifted-slot { position:relative; display:grid; place-items:center; width:100%; height:100%; color:#68533a; border:1px dashed #8c7450; background:#ddcaa5; font:12px 'Courier New',monospace; }
.poster-card.is-selected { outline:3px solid #8b3426; outline-offset:3px; }
.poster-face { display:flex; flex-direction:column; width:100%; height:100%; background:#f0e4cf; color:#2c261e; container-type:inline-size; box-shadow:inset 0 0 0 1px #b8a17e; }
.poster-art { display:block; width:92cqw; margin:4cqw 4cqw 0; aspect-ratio:var(--image-ratio, .6666667); overflow:hidden; flex:none; }
.poster-art img { display:block; width:100%; height:100%; object-fit:contain; pointer-events:none; }
.poster-placeholder { display:flex; flex-direction:column; justify-content:space-between; width:100%; height:100%; min-height:0; padding:10%; box-sizing:border-box; color:#dfd2ad; background:#283a3d; font:9px/1.4 'Courier New',monospace; border:1px solid #ad9a6d; flex:1; }
.poster-placeholder b { font:normal clamp(36px,5vw,72px)/1 Georgia,serif; text-align:center; border-top:1px solid #d1c49e55; border-bottom:1px solid #d1c49e55; padding:8px 0; }
.poster-placeholder.tone-1 { background:#46332e; }.poster-placeholder.tone-2 { background:#35402e; }.poster-placeholder.tone-3 { background:#3a3545; }
.poster-face .poster-placeholder { font-size:3cqw; padding:8cqw; }.poster-face .poster-placeholder b { font-size:23cqw; padding:2cqw 0; }
.poster-caption { box-sizing:border-box; flex:0 0 15cqw; height:15cqw; overflow:hidden; padding:2cqw 4cqw 0; font:bold 4cqw/1.1 'Courier New',monospace; }.poster-caption small { display:block; font:2.7cqw/1.2 Georgia,serif; margin-top:1cqw; }
.poster-page-actions { flex:none; margin-top:6px; text-align:center; }
.poster-progress { display:grid; gap:4px; width:86%; align-self:center; margin:auto 0 0; padding:0 0 28px; background:transparent; box-shadow:none; font:12px/1.2 'Courier New',monospace; flex:none; }
.poster-progress progress { width:100%; height:7px; accent-color:#715335; }.poster-progress span { font-size:9px; }
.poster-save-state { font-size:10px; margin:5px 0; }.poster-save-state:empty { display:none; }
.poster-workspace .poster-retry { color:#812a22; text-decoration:underline; min-height:26px; }
.poster-workspace .poster-group-link { width:100%; min-height:24px; margin-bottom:5px; font-size:10px; text-align:center; text-decoration:underline; }
.poster-workspace .poster-complete,.poster-modal .poster-complete { border:2px solid #7c3928; padding:9px 12px; background:#ead2a4; font: bold 13px 'Courier New',monospace; color:#652b22; }
.poster-stack-empty { flex:1; min-height:0; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:24px; padding:24px 18px; text-align:center; }.poster-stack-empty p { margin:0; line-height:1.5; white-space:pre-wrap; overflow:auto; max-width:100%; min-height:0; }.archive-stamp { flex:none; width:85%; box-sizing:border-box; color:#8b3b2d; border:3px double currentColor; padding:10px; margin:12px 0; transform:rotate(-8deg); font:bold 21px 'Courier New',monospace; text-align:center; }
.poster-stack-empty { justify-content:flex-start; padding-bottom:12px; }
.poster-stack-empty .archive-stamp { width:75%; font-size:17px; padding:6px; margin:0; }
.poster-stack-empty p { line-height:1.45; }
.poster-message { grid-column:1/-1; background:#ebd7b3; padding:24px; align-self:center; box-shadow:2px 4px 10px #0004; }.poster-message button { display:block; padding:12px; text-decoration:underline; }.poster-countdown { display:block; }
.poster-held { position:fixed; z-index:10000; pointer-events:none; transform:translate(-50%,-50%) rotate(4deg); box-sizing:border-box; padding:0; border:0; background:#f0e4cf; color:#34261b; box-shadow:8px 14px 25px #0009; display:block; overflow:hidden; transition:width 280ms cubic-bezier(.22,.61,.36,1),height 280ms cubic-bezier(.22,.61,.36,1); }
.poster-card { user-select:none; }.poster-modal-grid .poster-card { touch-action:none; cursor:grab; }
.poster-modal { max-width:min(90vw,750px); width:650px; max-height:85dvh; padding:22px; background:#eddfc7; color:#33291f; border:1px solid #98754d; border-radius:2px; box-shadow:0 20px 80px #0009; overflow:auto; }
.poster-modal::backdrop { background:#080b0dba; }.poster-modal header { display:flex; justify-content:space-between; align-items:center; gap:20px; }.poster-modal h2 { font: bold 24px 'Courier New',monospace; margin:0; }.poster-modal button { cursor:pointer; }.poster-modal-close { padding:10px; border:1px solid #9b7b55; background:transparent; color:inherit; }
.poster-modal.poster-note-modal { position:fixed; inset:0; width:100vw; max-width:none; height:100dvh; max-height:none; box-sizing:border-box; margin:0; padding:76px 28px 50px; color:#f3e7cd; background:transparent; border:0; box-shadow:none; }
.poster-note-modal[open] { display:grid; place-items:center; }
.poster-note-modal::backdrop { background:#07090ca6; backdrop-filter:blur(12px); }
.poster-note-modal .poster-note-close { position:fixed; top:18px; right:22px; display:grid; place-items:center; width:48px; height:48px; padding:0; border:0; background:transparent; color:inherit; font:300 42px/1 Georgia,serif; }
.poster-modal-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(135px,1fr)); align-items:start; gap:18px; margin:20px 0; }.poster-modal .poster-card { width:100%; height:auto; aspect-ratio:var(--poster-ratio, .637); }
.poster-roster { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:20px; padding:0; list-style:none; }.poster-roster li { display:flex; flex-direction:column; gap:6px; }.poster-roster img,.poster-avatar-placeholder { width:100%; height:155px; object-fit:cover; background:#b5a88d; border:6px solid #f0e7d7; box-shadow:2px 3px 4px #31211444; }.poster-avatar-placeholder { display:grid; place-content:center; text-align:center; font:15px 'Courier New',monospace; }
.poster-editor { border-top:1px solid #ab9675; padding:15px 0; }.poster-editor summary { cursor:pointer; font-weight:bold; padding:8px 0; }.poster-editor .stack { max-width:650px; }.poster-editor form { margin:15px 0; }.poster-admin-preview { max-width:140px; max-height:190px; object-fit:contain; }.poster-zone-fields { display:grid; grid-template-columns:1fr 1fr; gap:15px; }.poster-zone-fields label { display:flex; flex-direction:column; gap:5px; }
.participant-archive-row { display:flex; align-items:center; gap:14px; }.participant-archive-row img { width:54px; height:66px; object-fit:cover; border:4px solid #f1e4cf; box-shadow:1px 2px 4px #3e2a1644; }.participant-archive-row small { display:block; margin-top:4px; }
.poster-preview-page { background:#161311; }.poster-preview-page .top { display:none; }.poster-preview-page main.shell { max-width:1100px; }.preview-toolbar { color:#e2d1ac; }.preview-toolbar a { color:inherit; }
.poster-preview-folder { position:relative; margin:25px auto; min-height:710px; background:linear-gradient(90deg,#bc8d50 0%,#d7ae70 47%,#9c6c34 49.8%,#d4a460 51%,#c89a5a 100%); border:12px solid #a8793e; border-radius:20px 8px 12px 18px; box-shadow:5px 15px 25px #000a; }.poster-preview-folder .poster-workspace { inset:35px 32px; }
.poster-back { display:none; }
.poster-mobile-actions { display:none; }
@media(max-height:720px) and (min-width:701px) { .poster-heading p { font-size:10px; margin-bottom:8px; }.poster-zone-target { min-height:68px!important; }.zone-label { font-size:11px; }.zone-hint { font-size:9px; }.poster-pile { min-height:22px; }.poster-pile-thumb { --thumb-height:25px; --thumb-width:22px; }.poster-stack { margin-top:175px; }.poster-save-state { font-size:8px; } }
@media(max-width:700px) {
  .poster-workspace { position:fixed; inset:0!important; width:auto!important; height:auto!important; padding:14px 18px 25px; gap:24px; display:flex; flex-direction:column; overflow:auto; overscroll-behavior:contain; background:#d6ae72; background-image:linear-gradient(90deg,#8e5f2426,transparent 7%,transparent 94%,#865d2c33); z-index:5; font-size:14px; }
  .poster-left-page { order:2; }.poster-right-page { order:1; }.poster-workspace .poster-back { display:block; min-height:38px; color:#38271b; align-self:start; text-decoration:underline; font:14px Georgia,serif; }
  .poster-left-page,.poster-right-page { flex:0 0 auto; min-height:auto; }
  .poster-heading h2 { font-size:clamp(16px,6.2cqw,24px); }.poster-heading p { font-size:14px; }.poster-heading { margin-bottom:10px; }
  .poster-workspace .poster-note { position:relative; top:auto; right:auto; align-self:flex-end; width:250px; height:250px; margin:0 0 12px; padding:20px; font-size:13px; }
  .poster-stack { margin:8px auto; }.poster-placeholder { font-size:11px; }.poster-placeholder b { font-size:65px; }
  .poster-workspace .poster-group-link { font-size:13px; min-height:38px; }.poster-progress { font-size:14px; margin-top:22px; padding:0 0 24px; }.poster-progress span { font-size:12px; }.poster-save-state { font-size:12px; }
  .poster-zones { flex:none; min-height:auto; width:100%; max-height:none; margin:4px 0 0; grid-auto-rows:minmax(180px,auto); gap:24px 16px; }.poster-workspace .poster-zone-target { min-height:128px; padding:12px; }.zone-label { font-size:15px; }.zone-hint { font-size:12px; }.poster-workspace .poster-pile-open { font-size:12px; min-height:36px; }.poster-pile-thumb { --thumb-height:50px; --thumb-width:37px; }
  .poster-workspace .poster-complete { min-height:44px; }.poster-zone-fields { grid-template-columns:1fr; }.poster-modal { max-width:94vw; padding:16px; }.poster-modal h2 { font-size:20px; }
  .poster-preview-page main.shell { width:100%; padding:0; }.poster-preview-folder { border:0; margin:0; }.preview-toolbar { display:none; }.poster-preview-folder .poster-workspace { position:relative; min-height:100dvh; }
  .poster-workspace[data-selecting] .poster-mobile-actions,.poster-workspace[data-dragging] .poster-mobile-actions { position:fixed; display:grid; grid-template-columns:1fr 1fr; gap:8px; bottom:0; left:0; right:0; z-index:7; background:#eddbb8; padding:12px 16px max(14px,env(safe-area-inset-bottom)); box-shadow:0 -5px 20px #301b1555; }
  .poster-mobile-actions>span { grid-column:1/-1; font:13px 'Courier New',monospace; }.poster-mobile-actions .poster-zone { border:1px dashed #8f714f; }.poster-mobile-actions button { min-height:44px; padding:8px; font-weight:bold; }.poster-workspace[data-selecting] { padding-bottom:180px; }
}
@media(prefers-reduced-motion:reduce) { .poster-zone { transition:none; } }
.poster-zone.is-just-sorted { animation:poster-filed .28s ease-out; }
@keyframes poster-filed { from { background:#f1dcac; transform:translateY(-3px); } to { background:transparent; transform:translateY(0); } }
@media(prefers-reduced-motion:reduce) { .poster-zone.is-just-sorted { animation:none; } }
@media(prefers-reduced-motion:reduce) { .poster-held { transition:none; } }
