*,*:before,*:after{box-sizing:border-box}:root{--walnut: #24160e;--wood-dark: #4a2c18;--wood-mid: #6b4226;--brass: #c4a35a;--paper: #f3e6d0;--paper-hot: #efe0c4;--ink: #3a2414;--danger: #8f3a32;--danger-hot: #7a2f28;--ease-out: cubic-bezier(.23, 1, .32, 1);--font-sans: "M PLUS Rounded 1c", "Hiragino Maru Gothic ProN", "Hiragino Sans", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";--wood-face: repeating-linear-gradient( 90deg, transparent 0 2px, rgba(20, 10, 4, .07) 2px 3px ), repeating-linear-gradient( 0deg, rgba(255, 214, 160, .07) 0 1px, transparent 1px 28px ), linear-gradient(180deg, #7a4a28 0%, #5a341c 48%, #432616 100%)}html,body{margin:0;height:100%}body{background:radial-gradient(1200px 700px at 50% 18%,rgba(90,52,28,.35),transparent 62%),var(--walnut);color:var(--paper);font-family:var(--font-sans);font-weight:500;line-height:1.45;-webkit-font-smoothing:antialiased}#app{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh}.headline,.toolbar,#selection-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;padding:.7rem 1.1rem;background:var(--wood-face);border-bottom:1px solid rgba(20,10,4,.45);box-shadow:inset 0 1px #ffdcaa2e}.chrome{box-shadow:0 8px 18px #00000038;border-bottom:1px solid rgba(20,10,4,.45)}.toolbar{border-bottom:0}#selection-bar{border-top:1px solid rgba(20,10,4,.35);box-shadow:inset 0 1px #ffdcaa1a,inset 1px 0 #140a041f}.headline strong{color:#f7ead4;font-size:1.35rem;font-weight:800;letter-spacing:-.03em;line-height:1.1}.headline strong:before{content:"";display:inline-block;width:.58em;height:.58em;margin-right:.5em;border-radius:50%;background:radial-gradient(circle at 32% 28%,#f07167,#c0392b 46%,#6d1c16 78%);box-shadow:0 1px 1px #00000073;vertical-align:.08em}.stamp{flex:1;font-size:.8rem;font-weight:700;letter-spacing:-.01em;color:#ead7b8;opacity:.92;border:1px solid rgba(196,163,90,.45);padding:.2rem .7rem;border-radius:1rem}.save-pill{font-size:.8rem;font-weight:700;color:#efe0c4;background:#140a0447;border:1px solid rgba(196,163,90,.35);border-radius:999px;padding:.22rem .85rem}.tool-group{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}.tool-group+.tool-group{padding-left:.75rem;border-left:1px solid rgba(20,10,4,.35);box-shadow:inset 1px 0 #ffdcaa1a}.selection-label{font-size:.85rem;color:#ead7b8}button,select,input[type=number]{font:inherit;font-weight:700;color:var(--ink);background:repeating-linear-gradient(0deg,transparent,transparent 11px,rgba(90,50,20,.04) 12px),var(--paper);border:1px solid var(--brass);border-radius:999px;padding:.42rem 1rem;box-shadow:inset 0 1px #fff8e8e6,0 1px 2px #00000038}select,input[type=number]{font-weight:500;border-radius:.75rem}button{cursor:pointer;transition:transform .16s var(--ease-out),background-color .16s var(--ease-out),box-shadow .16s var(--ease-out)}button:active{transform:scale(.97);box-shadow:inset 0 1px 2px #50281040}@media(hover:hover)and (pointer:fine){button:hover{background-color:var(--paper-hot)}button.danger:hover{background-color:var(--danger-hot)}}button:focus-visible,select:focus-visible,input[type=number]:focus-visible{outline:2px solid var(--brass);outline-offset:2px}button.danger{background:var(--danger);color:#f8e6dc;border-color:#6d2a24;box-shadow:inset 0 1px #ffd2be40,0 1px 2px #00000038}label{display:inline-flex;align-items:center;gap:.4rem;color:#f0e0c8}.error{color:#ffc4b8;font-size:.85rem}#board-host{flex:1;width:100%;min-height:0;display:flex;align-items:center;justify-content:center;padding:1.1rem 1.25rem;background:radial-gradient(ellipse at center,rgba(72,42,24,.55),transparent 62%),#1c110b}#board-host canvas{border-radius:2px;box-shadow:0 18px 40px #00000061,0 2px #d2aa6e29}#toast{position:fixed;bottom:1.1rem;left:50%;z-index:100;margin:0;padding:.65rem 1.2rem;color:var(--ink);background:var(--paper);border:1px solid var(--brass);border-radius:999px;font-weight:700;box-shadow:inset 0 1px #fff8e8e6,0 8px 22px #00000047;opacity:0;transform:translate(-50%) translateY(12px);pointer-events:none;transition:opacity .2s var(--ease-out),transform .2s var(--ease-out)}#toast:not([hidden]){opacity:1;transform:translate(-50%) translateY(0);pointer-events:auto}#help-dialog{background:var(--paper);color:var(--ink);border:2px solid var(--brass);border-radius:1.5rem;padding:1.35rem 1.45rem;max-width:36rem;box-shadow:inset 0 1px #fff8e8d9,0 24px 48px #0006;opacity:1;transform:scale(1);transition:opacity .2s var(--ease-out),transform .2s var(--ease-out)}#help-dialog[open]{animation:none}@starting-style{#help-dialog[open]{opacity:0;transform:scale(.96)}}#help-dialog h2{margin:0 0 1rem;color:var(--ink);font-weight:800;letter-spacing:-.03em}#help-dialog pre{background:#efe4cc;padding:.75rem;border-radius:1rem;border:1px solid rgba(176,137,74,.35);overflow-x:auto;white-space:pre-wrap}#help-dialog::backdrop{background:#140c0894}#help-close{margin-top:.4rem}#selection-bar[data-kind=photo] .note-only,#selection-bar[data-kind=note] .photo-only{display:none!important}#note-dialog{background:var(--paper);color:var(--ink);border:2px solid var(--brass);border-radius:1.5rem;padding:1.35rem 1.45rem;width:min(28rem,calc(100vw - 2rem));box-shadow:inset 0 1px #fff8e8d9,0 24px 48px #0006}#note-dialog h2{margin:0 0 1rem;color:var(--ink);font-weight:800;letter-spacing:-.03em}#note-dialog::backdrop{background:#140c0894}.note-dialog-field{display:flex;flex-direction:column;align-items:stretch;gap:.4rem;color:var(--ink);font-weight:700}#note-text{font:inherit;font-weight:500;color:var(--ink);background:#efe4cc;border:1px solid rgba(176,137,74,.45);border-radius:1rem;padding:.75rem .85rem;resize:vertical;min-height:7rem}#note-text:focus-visible{outline:2px solid var(--brass);outline-offset:2px}.note-colors{margin:1rem 0 0;padding:.7rem .85rem .85rem;border:1px solid rgba(176,137,74,.35);border-radius:1rem;display:flex;flex-wrap:wrap;gap:.45rem .7rem}.note-colors legend{padding:0 .35rem;font-weight:700}.note-colors label{color:var(--ink);font-weight:700}.note-dialog-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1rem}[hidden]{display:none!important}#toast[hidden]{display:block!important;transition-duration:.15s}@media(prefers-reduced-transparency:reduce){.headline,.toolbar,#selection-bar{background:var(--wood-mid)}}@media(prefers-reduced-motion:reduce){button,#help-dialog{transition:opacity .2s ease;transform:none}#toast{transition:opacity .2s ease;transform:translate(-50%)}button:active{transform:none}#toast:not([hidden]),#toast[hidden]{transform:translate(-50%)}}
