/* ========== レイアウト・基本スタイル ========== */
/* 全体レイアウト、グリッド、基本要素 */

html, body {
    height: 100%;
    margin: 0;
    background: var(--bg);
    color: var(--fg);
    font-family: 'Segoe UI', 'Hiragino Sans', 'Meiryo', sans-serif;
}

.wrap {
    min-height: 100%;
    display: grid;
    grid-template-rows: auto 1fr auto auto;
    place-items: center;
    gap: 16px;
    padding: 16px;
    position: relative;
    overflow: hidden;
}

/* 背景層（紙吹雪用） */
#confetti {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

h1 {
    color: var(--ring-fg);
    margin: 16px 0;
    font-size: clamp(1.3rem, 4vw, 2rem);
    z-index: 1;
}

.timer-shell {
    position: relative;
    z-index: 1;
    width: min(84vw, 400px);
    aspect-ratio: 1;
    display: grid;
    place-items: center;
}