/* pen-pad.css — the large writing surface for the pen (pen-pad.js; owner 2026-10-31): lined paper over the whole screen, big type, the
   device's handwriting recognition writes into it. Identical copy in friendly-apps-home and site.
   1.1.0: Tipp-Ex instead of the fist wipe.
   version: 1.1.0 · created 2026-10-31 by Pascal Ehlig, ITS · edited 2026-10-31 by Pascal Ehlig, ITS */
.pen-pad{position:fixed;inset:0;z-index:1100;display:flex;flex-direction:column;background:var(--surface);color:var(--text)}
.pen-pad[hidden]{display:none}
.pen-pad-head{display:flex;align-items:center;gap:8px;padding:max(10px,env(safe-area-inset-top)) 14px 10px;border-bottom:1px solid var(--border)}
.pen-pad-title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:1.05rem}
.pen-pad-head button{min-height:44px;padding:0 16px;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text);font:inherit;font-weight:600;cursor:pointer}
.pen-pad-head .pen-pad-done{background:var(--action);color:var(--on-action);border-color:var(--action)}
.pen-pad-head button:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.pen-pad-area{flex:1;min-height:0;margin:0;padding:12px 20px;border:0;resize:none;outline:none;background-color:var(--surface);color:var(--text);
  font:400 1.7rem/52px var(--sans,system-ui);background-image:repeating-linear-gradient(to bottom,transparent 0 51px,var(--border) 51px 52px);
  background-attachment:local;background-position:0 12px;touch-action:pan-y}
.pen-pad-area.is-tipex{touch-action:none;cursor:crosshair;background-color:color-mix(in srgb,var(--accent) 6%,var(--surface))}
.pen-pad-head .pen-pad-tipex[aria-pressed="true"]{background:var(--accent);color:#fff;border-color:var(--accent)}
.pen-pad-hint{margin:0;padding:8px 20px max(10px,env(safe-area-inset-bottom));color:var(--muted);font-size:.85rem;border-top:1px solid var(--border)}
[data-pen-pad] body{overflow:hidden}