/* styles/base.css — reset, типографика, layout, утилиты */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    height: 100%;
    overscroll-behavior: none;
}

body {
    font-family: "Segoe UI", system-ui, sans-serif;
    background: var(--bg);
    color: var(--text);
    -webkit-tap-highlight-color: transparent;
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
}

.app {
    display: flex;
    height: 100vh;
    height: 100dvh;
}

h1 {
    font-size: 18px;
    color: var(--accent);
}

h2 {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--muted);
    margin-bottom: 8px;
}

.hidden {
    display: none !important;
}

button:focus-visible,
input:focus-visible,
select:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

svg {
    vertical-align: middle;
}

.draw-tool svg {
    width: 16px;
    height: 16px;
}

.view-reset svg {
    margin-right: 4px;
}