:root {
    --paper-yellow: #fff3c4;
    --paper-highlight: #ffe8a0;
    --notebook-brown: #8c5c3a;
    --accent-red: #f58c7a;
    --action-blue: #f58c7a;
    --action-blue-soft: #ffd7b5;
    --line-blue: rgba(61, 123, 255, 0.18);
    --border-blue-soft: rgba(245, 140, 122, 0.18);
    --border-blue: rgba(245, 140, 122, 0.32);
    --border-blue-bold: rgba(204, 150, 232, 0.45);
    --border-ai-soft: rgba(253, 215, 166, 0.5);
    --border-ai: rgba(245, 140, 122, 0.6);
    --frame-border: #1d1109;
    --desk-dark: #120b06;
    --text-dark: #2f2618;
    --text-gray: #7b6a58;
    --text-light-gray: #f8e9cb;
    --btn-paper: #ffe8b5;
    --btn-paper-shadow: rgba(61, 45, 23, 0.16);
    --btn-ink: #3d2c18;
    --btn-lavender: #8a76c8;
    --btn-lavender-soft: #cbbef5;
    --btn-peach: #f7b17a;
    --btn-peach-soft: #fdd7a6;
}
* {
    box-sizing: border-box;
}
body {
    margin: 0;
    min-height: 100vh;
    font-family: 'Patrick Hand', cursive;
    color: var(--text-dark);
    background-color: #f4dcb8;
    display: flex;
    align-items: stretch;
    justify-content: center;
    padding: 0;
    /* Enable mobile touch scrolling */
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
}