@font-face{font-family:'Patrick Hand';src:url('fonts/PatrickHand-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{font-family:'Patrick Hand','Trebuchet MS',sans-serif;font-size:18px;--ink:#654c54;--green:#a45270;--muted:#826773}.brand{font-family:'Patrick Hand',sans-serif;font-weight:400;font-size:1.6rem;letter-spacing:0}.eyebrow{font-weight:400;letter-spacing:1.3px}.intro h1,h2,.footnote,.small-label{font-family:'Patrick Hand',sans-serif;font-weight:400}h1{letter-spacing:0;font-size:clamp(2.5rem,4.7vw,3.9rem)}h1 em{font-style:normal;text-decoration:underline;text-decoration-color:#e5b4c4;text-decoration-thickness:5px;text-underline-offset:7px}.intro p{font-size:1.1rem}.mascot{width:175px;height:175px;transform:rotate(-3deg);right:1%;bottom:12px}.soft-button,.primary,select,.note-list-item{border:2px solid #ad7288;border-radius:15px 19px 13px 18px / 18px 13px 20px 14px;font-weight:400;font-family:inherit;box-shadow:2px 3px 0 #e6c6d0;transition:transform .15s,box-shadow .15s}.soft-button,.primary{font-size:1rem}.soft-button:hover:not(:disabled){transform:translateY(-2px) rotate(-1deg)}.soft-button:active:not(:disabled){transform:translateY(2px);box-shadow:none}.primary{border-color:#81475d;box-shadow:3px 4px 0 #d7a0b4}.draw-panel,.color-card{border:2px solid #dbb3c1;border-radius:20px 17px 23px 15px / 15px 23px 16px 22px}.counter{border:1px dashed #b78699}.color-title{font-size:1rem}.hex,.revealed .hex{font-family:Consolas,monospace;font-size:.875rem;letter-spacing:0}.note-custom{display:flex;flex-direction:column;min-width:0;min-height:0;border:2px solid #bca58f;border-radius:6px 9px 19px 8px;background:var(--note-paper,#fff1c8);padding-bottom:42px;overflow:hidden;max-width:calc(100vw - 16px);max-height:calc(100dvh - 106px)}.note-custom .note-handle{background:var(--note-header,#ffe3a1);padding:4px 12px;flex-shrink:0;font-family:inherit;font-weight:400;font-size:1.1rem}.note-options{padding:5px 12px;flex-shrink:0}.note-options label{font-size:.9rem}.note-options select{font-size:.85rem;min-height:36px;padding:3px 7px;background:#fff8;border:1px solid #b39481;box-shadow:none}.note-custom textarea{flex:1;min-height:40px;height:auto;max-height:none;resize:none;font-family:'Patrick Hand',sans-serif;font-size:1.15rem;background-color:transparent}.note-custom p{padding:3px 42px 0 12px;font-size:.72rem;line-height:1.2;flex-shrink:0}.note-resize{position:absolute;right:0;bottom:0;min-width:44px;min-height:44px;border:0;background:transparent;color:#79584f;font-size:1.5rem;touch-action:none;cursor:nwse-resize}.notes-toolbar{border-radius:14px 20px 16px 18px}.notes-toolbar .soft-button{font-size:.95rem}.notes-list{font-family:inherit}.design-shelf{margin:25px 0;border-top:1px dashed #c797aa;padding:24px 0}.design-controls{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.design-controls input{flex:1;min-width:220px}.design-controls input,dialog input{border:1px solid #d5a8b9;border-radius:12px;padding:11px;font:inherit;color:var(--ink);background:#fffafb}.saved-palettes{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}.saved-palette{background:#fff;border:1px solid #d8adbe;border-radius:12px;padding:10px;text-align:left;color:var(--ink);font:inherit;overflow-wrap:anywhere}.mini-swatches{display:flex;height:55px;margin-bottom:8px;border-radius:7px;overflow:hidden}.mini-swatches span{flex:1}dialog{width:480px;max-width:calc(100vw - 24px);max-height:90dvh;border:2px solid #b2778d;border-radius:20px 16px 23px 18px;background:#fff1f6;color:var(--ink);padding:24px;box-shadow:0 15px 60px #68384b40}dialog::backdrop{background:#49303a66}.dialog-heading{display:flex;justify-content:space-between;gap:12px;align-items:center}.dialog-heading button{background:none;border:0;font-size:1.7rem;color:var(--ink);min-width:44px;min-height:44px}#login-form{display:flex;flex-direction:column;gap:9px}#login-form .primary{margin-top:12px}#account-actions{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}#backup-draft{margin-top:14px}#account-status{font-size:1rem}#sync-status{font-size:.8rem;color:var(--muted);text-align:right;margin:10px 0}.account-alert{color:#9b3456!important;font-weight:700}@media(max-width:1000px){.mascot{width:115px;height:115px;right:0}.brand{font-size:1.3rem}}@media(max-width:760px){.mascot{width:110px;height:110px}.intro h1{font-size:2.6rem}.note-custom{max-width:calc(100vw - 16px)}.notes-toolbar .soft-button{font-size:.85rem}.header{gap:10px}.header .soft-button{font-size:.9rem;padding:8px}.page{padding:0 4%}}
