/* The supplied letter stays intact; only its viewing frame changes. */
:is(#arfom-living,#arfom-menu,#arfom-punch) dialog.punch-note-viewer{position:fixed;inset:0;z-index:100;margin:auto;width:min(840px,calc(100vw - 40px));height:auto;max-width:none;max-height:calc(100dvh - 40px);min-height:0;padding:0;border:1px solid #625b51;background:#0c0b0a;color:#eeeae3;overflow:hidden;box-sizing:border-box}
:is(#arfom-living,#arfom-menu,#arfom-punch) dialog.punch-note-viewer[open]{display:flex;flex-direction:column}
:is(#arfom-living,#arfom-menu,#arfom-punch) dialog.punch-note-viewer::backdrop{background:#000d;backdrop-filter:blur(7px)}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 16px;border-bottom:1px solid #4b433b;flex-shrink:0;background:#0c0b0a}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-bar h2{margin:0;font:400 14px/1.4 'Oswald',sans-serif;letter-spacing:.06em}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-bar>div{display:flex;align-items:center;gap:10px}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-bar button{display:flex;align-items:center;justify-content:center;gap:10px;min-width:44px;min-height:44px;padding:9px 12px;border:1px solid #6a5e54;border-radius:0;background:#211c18;color:#f2eee7;font:14px/1.3 Inter,Arial,sans-serif;white-space:nowrap;cursor:pointer}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-bar .punch-note-close{border-color:#e6382c}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-close span{font:24px/1 Arial,sans-serif}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-bar button:hover{background:#eeeae3;color:#080808}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-scroll{min-height:0;flex:1 1 auto;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:#171512}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-scroll .punch-note-image{display:block;width:100%;max-width:none;height:auto;object-fit:contain;margin:0 auto;filter:none}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-viewer.is-enlarged .punch-note-image{width:1122px;max-width:none}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-explore{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:48px;padding:10px 18px;flex-shrink:0;border-top:1px solid #4b433b;color:#eeeae3;background:#0c0b0a;font:400 17px/1.3 'Oswald',sans-serif;text-decoration:none}
:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-viewer :is(button,a,.punch-note-scroll):focus-visible{outline:2px solid #ff796a;outline-offset:-3px}
@media(max-width:600px){:is(#arfom-living,#arfom-menu,#arfom-punch) dialog.punch-note-viewer{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-bar{padding:8px 10px;gap:8px}:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-bar>div{gap:6px}:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-bar button{padding-inline:10px}:is(#arfom-living,#arfom-menu,#arfom-punch) .punch-note-bar h2{font-size:13px;max-width:95px}}
