/* ════════════════════════════════════════════════════════════════════
   sym-papyrus.css — «Επιστολή σε πάπυρο» (SymposiON message component)
   Pairs with js/sym-papyrus.js. Every class is prefixed sym-papyrus;
   every colour / size is a custom property on .sym-papyrus, so a theme
   or a one-off letter can override them without touching the rules.
   Fonts: GFS Didot + Noto Serif are already local in css/fonts.css
   (no fonts.googleapis.com request — same rule as the rest of the shell).
   The sheet stays papyrus-coloured on EVERY site theme; only the backdrop
   (dim + blur) changes via [data-theme="dark"], set by the JS.
   ════════════════════════════════════════════════════════════════════ */
.sym-papyrus{--sym-papyrus-paper:#EBDAB0;--sym-papyrus-paper-light:#F3E7C8;--sym-papyrus-paper-dark:#DBC392;--sym-papyrus-fibre-dark:rgba(118,80,32,.045);--sym-papyrus-fibre-light:rgba(255,246,218,.14);--sym-papyrus-edge:rgba(120,78,28,.16);--sym-papyrus-ink:#2A1C10;--sym-papyrus-ink-soft:#5B4126;--sym-papyrus-accent:#9A3F1B;--sym-papyrus-meander:#8A6232;--sym-papyrus-rod-dark:#5E3F1C;--sym-papyrus-rod-mid:#B28A52;--sym-papyrus-rod-light:#E6CE9A;--sym-papyrus-btn-bg:#2A1C10;--sym-papyrus-btn-bg-hover:#452E1A;--sym-papyrus-btn-fg:#F4E6C4;--sym-papyrus-focus:#9A3F1B;--sym-papyrus-backdrop:rgba(38,26,12,.44);--sym-papyrus-backdrop-blur:4px;--sym-papyrus-shadow:rgba(30,16,4,.38);--sym-papyrus-font-body:"Noto Serif","Gentium Book Plus",Georgia,"Times New Roman",serif;--sym-papyrus-font-display:"GFS Didot","Noto Serif",Georgia,serif;--sym-papyrus-fs-body:17px;--sym-papyrus-fs-title:clamp(22px,5.4vw,29px);--sym-papyrus-lh:1.62;--sym-papyrus-max-w:520px;--sym-papyrus-max-h:min(calc(100vh - 32px),720px);--sym-papyrus-gutter:16px;--sym-papyrus-pad:28px;--sym-papyrus-roll-h:24px;--sym-papyrus-seal-size:68px;--sym-papyrus-mini-w:360px;--sym-papyrus-duration:350ms;--sym-papyrus-z:9600;font-family:var(--sym-papyrus-font-body);color:var(--sym-papyrus-ink);-webkit-font-smoothing:antialiased}
@supports (height:100dvh){.sym-papyrus{--sym-papyrus-max-h:min(calc(100dvh - 32px),720px)}}
.sym-papyrus[data-theme="dark"]{--sym-papyrus-backdrop:rgba(6,5,4,.72);--sym-papyrus-backdrop-blur:8px;--sym-papyrus-shadow:rgba(0,0,0,.6)}
.sym-papyrus *,.sym-papyrus *::before,.sym-papyrus *::after{box-sizing:border-box}
.sym-papyrus--letter:not(.sym-papyrus--preview){position:fixed;inset:0;z-index:var(--sym-papyrus-z);display:grid;place-items:center;padding:var(--sym-papyrus-gutter)}
.sym-papyrus__backdrop{position:absolute;inset:0;background:var(--sym-papyrus-backdrop);-webkit-backdrop-filter:blur(var(--sym-papyrus-backdrop-blur)) saturate(.85);backdrop-filter:blur(var(--sym-papyrus-backdrop-blur)) saturate(.85);transition:opacity 220ms ease}
.sym-papyrus__dialog{position:relative;width:100%;max-width:var(--sym-papyrus-max-w);max-height:var(--sym-papyrus-max-h);display:flex;flex-direction:column;filter:drop-shadow(0 18px 28px var(--sym-papyrus-shadow)) drop-shadow(0 2px 3px rgba(30,16,4,.25));transition:opacity 180ms ease,transform var(--sym-papyrus-duration) cubic-bezier(.2,.7,.2,1)}
.sym-papyrus__dialog:focus{outline:none}
/* rolled ends */
.sym-papyrus__roll{position:relative;z-index:2;flex:none;height:var(--sym-papyrus-roll-h);margin:0 -10px;border-radius:calc(var(--sym-papyrus-roll-h)/2);background:linear-gradient(180deg,var(--sym-papyrus-rod-dark) 0%,var(--sym-papyrus-rod-mid) 26%,var(--sym-papyrus-rod-light) 44%,var(--sym-papyrus-rod-mid) 70%,var(--sym-papyrus-rod-dark) 100%)}
.sym-papyrus__roll::before,.sym-papyrus__roll::after{content:"";position:absolute;top:50%;width:14px;height:calc(var(--sym-papyrus-roll-h) - 6px);margin-top:calc((var(--sym-papyrus-roll-h) - 6px)/-2);border-radius:5px;background:linear-gradient(180deg,#3E2810,#7A5428 45%,#3E2810)}
.sym-papyrus__roll::before{left:-8px}.sym-papyrus__roll::after{right:-8px}
/* the unrolling part: grid-template-rows 0fr → 1fr is the opening animation */
.sym-papyrus__unroll{flex:1 1 auto;min-height:0;display:grid;grid-template-rows:1fr;margin:-6px 0;transition:grid-template-rows var(--sym-papyrus-duration) cubic-bezier(.3,.7,.2,1)}
.sym-papyrus__clip{min-height:0;overflow:hidden;display:flex;flex-direction:column}
/* the sheet: CSS-only fibres + tone; the SVG feTurbulence grain sits underneath (JS) */
.sym-papyrus__sheet,.sym-papyrus__mini-sheet{position:relative;isolation:isolate;background:radial-gradient(130% 95% at 50% 42%,transparent 58%,var(--sym-papyrus-edge) 100%),repeating-linear-gradient(0deg,transparent 0 5px,var(--sym-papyrus-fibre-dark) 5px 6px,transparent 6px 11px,var(--sym-papyrus-fibre-light) 11px 12px,transparent 12px 19px,var(--sym-papyrus-fibre-dark) 19px 21px),repeating-linear-gradient(90deg,transparent 0 7px,var(--sym-papyrus-fibre-dark) 7px 8px,transparent 8px 15px,var(--sym-papyrus-fibre-light) 15px 16px,transparent 16px 23px),linear-gradient(180deg,var(--sym-papyrus-paper-light),var(--sym-papyrus-paper) 38%,var(--sym-papyrus-paper) 72%,var(--sym-papyrus-paper-dark))}
.sym-papyrus__sheet{display:flex;flex-direction:column;min-height:0;max-height:calc(var(--sym-papyrus-max-h) - 2*var(--sym-papyrus-roll-h) + 12px);padding-top:6px}
.sym-papyrus__grain{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;mix-blend-mode:multiply}
.sym-papyrus__head{position:relative;padding:calc(var(--sym-papyrus-pad) - 4px) calc(var(--sym-papyrus-pad) + 44px) 10px var(--sym-papyrus-pad)}
/* title/body/buttons are hardened against host heading + text rules (the shell styles h2/p/button broadly) */
.sym-papyrus .sym-papyrus__title{margin:0;padding:0;font:400 var(--sym-papyrus-fs-title)/1.18 var(--sym-papyrus-font-display);letter-spacing:.005em;text-transform:none;text-align:left;opacity:1;color:var(--sym-papyrus-ink);text-wrap:balance}
.sym-papyrus__close{position:absolute;top:10px;right:12px;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:var(--sym-papyrus-ink-soft);cursor:pointer;transition:background 150ms ease,color 150ms ease}
.sym-papyrus__close:hover{background:rgba(42,28,16,.09);color:var(--sym-papyrus-ink)}
.sym-papyrus__close svg{width:18px;height:18px}
.sym-papyrus__meander{flex:none;height:9px;margin:4px var(--sym-papyrus-pad) 6px;background:var(--sym-papyrus-meander);opacity:.55;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='9' viewBox='0 0 18 9'%3E%3Cpath d='M0 8.5h12.5v-8h-8v5.5h4.5v-3h-1.5M12.5 8.5H18' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E") repeat-x left center/18px 9px;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='9' viewBox='0 0 18 9'%3E%3Cpath d='M0 8.5h12.5v-8h-8v5.5h4.5v-3h-1.5M12.5 8.5H18' fill='none' stroke='%23000' stroke-width='1'/%3E%3C/svg%3E") repeat-x left center/18px 9px}
/* long bodies scroll INSIDE the sheet; the page never scrolls */
.sym-papyrus__scroll{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:12px var(--sym-papyrus-pad) 4px;scrollbar-width:thin;scrollbar-color:rgba(91,65,38,.45) transparent}
.sym-papyrus__scroll.is-scrollable{-webkit-mask:linear-gradient(transparent,#000 14px,#000 calc(100% - 22px),transparent);mask:linear-gradient(transparent,#000 14px,#000 calc(100% - 22px),transparent);padding-bottom:18px}
.sym-papyrus__scroll:focus-visible{outline:2px dashed var(--sym-papyrus-focus);outline-offset:-4px}
.sym-papyrus .sym-papyrus__body{font:400 var(--sym-papyrus-fs-body)/var(--sym-papyrus-lh) var(--sym-papyrus-font-body);color:var(--sym-papyrus-ink);text-transform:none;letter-spacing:normal;text-wrap:pretty;hyphens:auto}
.sym-papyrus .sym-papyrus__body p{margin:0 0 .8em;padding:0;font:inherit;color:inherit}
.sym-papyrus__body p:last-child{margin-bottom:0}
.sym-papyrus__body b{font-weight:600}
.sym-papyrus__body>p:first-child::first-letter{float:left;font-family:var(--sym-papyrus-font-display);font-size:3.25em;line-height:.82;padding:.07em .1em 0 0;color:var(--sym-papyrus-accent)}
.sym-papyrus .sym-papyrus__signature{margin:1.1em 0 0;padding:0;font-family:inherit;text-align:right;font-style:italic;font-size:calc(var(--sym-papyrus-fs-body) - 1px);color:var(--sym-papyrus-ink-soft)}
.sym-papyrus__foot{flex:none;display:flex;flex-wrap:wrap;justify-content:center;gap:10px;padding:18px var(--sym-papyrus-pad) calc(var(--sym-papyrus-seal-size)/2 + 6px)}
.sym-papyrus .sym-papyrus__btn{margin:0;min-height:44px;min-width:120px;padding:0 24px;border-radius:3px;font:600 16px/1 var(--sym-papyrus-font-body);letter-spacing:.01em;text-transform:none;cursor:pointer;transition:background 150ms ease,border-color 150ms ease,transform 120ms ease}
.sym-papyrus__btn:active{transform:translateY(1px)}
.sym-papyrus__btn--primary{border:1px solid var(--sym-papyrus-btn-bg);background:var(--sym-papyrus-btn-bg);color:var(--sym-papyrus-btn-fg);box-shadow:inset 0 1px 0 rgba(255,235,200,.12),0 1px 2px rgba(30,16,4,.3)}
.sym-papyrus__btn--primary:hover{background:var(--sym-papyrus-btn-bg-hover)}
.sym-papyrus__btn--secondary{border:1px solid rgba(42,28,16,.55);background:transparent;color:var(--sym-papyrus-ink)}
.sym-papyrus__btn--secondary:hover{background:rgba(42,28,16,.07);border-color:var(--sym-papyrus-ink)}
.sym-papyrus__btn:focus-visible,.sym-papyrus__close:focus-visible,.sym-papyrus__mini-open:focus-visible{outline:2px solid var(--sym-papyrus-focus);outline-offset:2px}
/* wax seal, hanging over the bottom roll */
.sym-papyrus__seal{position:absolute;z-index:3;left:50%;bottom:calc(var(--sym-papyrus-roll-h)/2 - var(--sym-papyrus-seal-size)/2);width:var(--sym-papyrus-seal-size);height:var(--sym-papyrus-seal-size);margin-left:calc(var(--sym-papyrus-seal-size)/-2);filter:drop-shadow(0 3px 3px rgba(50,20,4,.45));transition:opacity 200ms ease 220ms,transform 260ms cubic-bezier(.3,1.5,.5,1) 220ms}
.sym-papyrus__seal svg{display:block;width:100%;height:100%;overflow:visible}
/* enter / leave states (toggled by JS; ~350ms unroll) */
.sym-papyrus.is-entering .sym-papyrus__backdrop,.sym-papyrus.is-leaving .sym-papyrus__backdrop{opacity:0}
.sym-papyrus.is-entering .sym-papyrus__unroll{grid-template-rows:0fr}
.sym-papyrus.is-entering .sym-papyrus__dialog{opacity:0;transform:translateY(-10px)}
.sym-papyrus.is-entering .sym-papyrus__seal{opacity:0;transform:scale(.6);transition:none}
.sym-papyrus.is-leaving .sym-papyrus__dialog{opacity:0;transform:translateY(8px) scale(.985);transition-duration:200ms}
.sym-papyrus.is-leaving .sym-papyrus__seal{transition:none}
/* ── mini: the rolled scroll for the bell / corner toast ── */
.sym-papyrus--mini{--sym-papyrus-seal-size:40px;width:min(var(--sym-papyrus-mini-w),calc(100vw - 2*var(--sym-papyrus-gutter)))}
.sym-papyrus--mini:not(.sym-papyrus--preview){position:fixed;top:var(--sym-papyrus-gutter);right:var(--sym-papyrus-gutter);z-index:var(--sym-papyrus-z)}
.sym-papyrus__mini{display:flex;align-items:stretch;padding:0 4px;filter:drop-shadow(0 10px 16px var(--sym-papyrus-shadow)) drop-shadow(0 1px 2px rgba(30,16,4,.3));transition:opacity 200ms ease,transform 260ms cubic-bezier(.2,.7,.2,1)}
.sym-papyrus__mini-rod{position:relative;z-index:2;flex:none;width:14px;margin:-7px 0;border-radius:7px;background:linear-gradient(90deg,var(--sym-papyrus-rod-dark) 0%,var(--sym-papyrus-rod-mid) 26%,var(--sym-papyrus-rod-light) 44%,var(--sym-papyrus-rod-mid) 70%,var(--sym-papyrus-rod-dark) 100%)}
.sym-papyrus__mini-sheet{flex:1;min-width:0;margin:0 -3px;display:flex;align-items:center;gap:8px;padding:8px 2px 8px 14px}
.sym-papyrus__mini-sheet .sym-papyrus__seal{position:static;flex:none;margin:0;transition:none}
.sym-papyrus .sym-papyrus__mini-open{flex:1;min-width:0;min-height:44px;display:flex;flex-direction:column;justify-content:center;gap:2px;margin:0;padding:6px 4px;border:0;border-radius:3px;background:none;color:var(--sym-papyrus-ink);font:inherit;text-align:left;text-transform:none;cursor:pointer}
.sym-papyrus__mini-title{font-family:var(--sym-papyrus-font-display);font-size:18px;line-height:1.2;color:var(--sym-papyrus-ink)}
.sym-papyrus__mini-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:14px;line-height:1.4;color:var(--sym-papyrus-ink-soft)}
.sym-papyrus__mini-sheet .sym-papyrus__close{position:static;flex:none}
.sym-papyrus--mini.is-entering .sym-papyrus__mini{opacity:0;transform:translateY(-12px)}
.sym-papyrus--mini.is-leaving .sym-papyrus__mini{opacity:0;transform:translateX(16px)}
/* phones: full-width sheet with 16px margins */
@media (max-width:420px){.sym-papyrus{--sym-papyrus-pad:20px;--sym-papyrus-fs-body:16px}.sym-papyrus__btn{flex:1 1 0}}
/* reduced motion: OS setting OR the site's html[data-reduce-motion] switch → no animation at all */
@media (prefers-reduced-motion:reduce){.sym-papyrus,.sym-papyrus *{transition:none!important;animation:none!important}}
html[data-reduce-motion]:not([data-reduce-motion="false"]) .sym-papyrus,html[data-reduce-motion]:not([data-reduce-motion="false"]) .sym-papyrus *{transition:none!important;animation:none!important}
html.sym-papyrus-lock{overflow:hidden}
/* ── SymposiON glue (js/sym-papyrus-mail.js): the «Επιστολές» archive screen ── */
.sym-papyrus-letters{display:flex;flex-direction:column;gap:18px;max-width:560px;margin:8px 0 24px}
.sym-papyrus-letters .sym-papyrus--mini{width:100%}
.sym-papyrus-letters__when{margin:0 0 4px 18px;font:500 12px/1 ui-monospace,Menlo,monospace;letter-spacing:.06em;opacity:.7}