.board{position:absolute;inset:0;z-index:3;cursor:crosshair;touch-action:manipulation}.board:focus{outline:none}.board:focus-visible{outline:2px solid var(--teal-dark);outline-offset:-4px}.app-stage{position:relative;height:calc(100vh - var(--appbar-h));height:calc(100svh - var(--appbar-h));min-height:480px;overflow:hidden;background:var(--board)}.board-empty{position:absolute;left:50%;top:50%;z-index:1;width:min(560px,calc(100% - 48px));transform:translate(-50%,-50%);text-align:center;pointer-events:none}.board-empty .be-title{margin:0;font-size:clamp(2rem,1.5rem + 1.6vw,2.75rem);font-weight:720;line-height:1.05;letter-spacing:-.025em}.board-empty .be-text{margin:16px auto 0;max-width:30em;font-size:17px;line-height:1.45;color:var(--grey);text-wrap:balance}.hint{display:inline-flex;align-items:center;gap:10px;margin:22px 0 0;font-size:15px;font-weight:600;color:var(--teal-dark)}.note{position:absolute;z-index:3;box-sizing:border-box;min-width:208px;max-width:320px;min-height:144px;padding:20px;color:var(--note-ink);font-size:16px;line-height:1.6;font-weight:430;white-space:pre-wrap;overflow-wrap:anywhere;border-radius:var(--radius-note);box-shadow:var(--shadow-note);cursor:grab;-moz-user-select:none;user-select:none;-webkit-user-select:none;touch-action:none;transition:transform .25s ease,box-shadow .25s ease,opacity .25s ease}.note.is-lifted{transform:rotate(var(--tilt,4deg)) scale(1.04);box-shadow:var(--shadow-lifted);cursor:grabbing}.note.is-editing{outline:2px solid var(--teal);outline-offset:3px;cursor:text}.note:focus-visible{outline:2px solid var(--teal-dark);outline-offset:3px}.note.is-entering{opacity:0;transform:scale(.96)}.note-x{top:-10px;right:-10px;width:26px;height:26px;padding:3px;border:2px solid #fff;background:var(--ink);color:#fff;opacity:0;cursor:pointer;transition:opacity .2s ease}.note-x,.note-x:after{position:absolute;border-radius:50%}.note-x:after{content:"";inset:-11px}.note-x svg{display:block;width:16px;height:16px}.note-x:focus-visible,.note.is-hint .note-x,.note:focus-within .note-x,.note:hover .note-x{opacity:1}@media (hover:none){.note-x{opacity:1}}.note-text.is-empty{color:rgba(31,35,41,.7)}.note-input{display:block;width:100%;min-height:100px;border:0;padding:0;margin:0;background:transparent;font:inherit;color:inherit;resize:none;outline:none;-moz-user-select:text;user-select:text;-webkit-user-select:text}.note-input::-moz-placeholder{color:rgba(31,35,41,.7);opacity:1}.note-input::placeholder{color:rgba(31,35,41,.7);opacity:1}@media (prefers-reduced-motion:reduce){.note,.note-x{transition:none}}