/* =========================================================
   simple.css — centered single-column pages (credits, updates)
   Reuses the teal widget look from home, on a tidy centered
   column with a page title + back link. Load after tokens +
   base + home (it borrows .widget from home.css).
   ========================================================= */

.simple-body {
    background-color: #b8ecea;
    background-image:
        radial-gradient(circle at 20% 20%, rgba(255,192,203,0.22), transparent 45%),
        radial-gradient(circle at 80% 80%, rgba(129,223,154,0.28), transparent 45%);
    min-height: 100vh;
    margin: 0;
}

.simple-page {
    max-width: 680px;
    margin: 0 auto;
    padding: var(--page-top-pad) 1.5rem 3rem;
}

.simple-title {
    font-family: var(--font-display);
    color: var(--title-color);
    text-align: center;
    font-size: 3rem;
    margin: 0 0 0.3rem;
    text-shadow: 3px 3px 0 rgba(0,121,107,0.25);
}
.simple-sub {
    font-family: var(--font-hand);
    text-align: center;
    color: var(--burnt);
    font-size: 1.6rem;
    margin: 0 0 2rem;
}

/* the widget content here uses a roomier list */
.simple-page .widget-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.simple-page .widget-content li {
    padding: 0.6rem 0 0.6rem 1.6rem;
    position: relative;
    border-bottom: 1px dashed rgba(255,255,255,0.35);
    color: #fff;
}
.simple-page .widget-content li:last-child { border-bottom: none; }
.simple-page .widget-content li::before {
    content: '✶';
    position: absolute; left: 0;
    color: var(--mango);
}
.simple-page .widget-content a { color: var(--widget-bg); }
.simple-page .widget-content a:hover { color: var(--border-pink); }

/* a date tag for the updates log */
.log-date {
    font-family: var(--font-western);
    color: var(--green-mid);
    font-size: 0.95rem;
    letter-spacing: 0.5px;
    display: block;
    margin-bottom: 0.1rem;
}