* {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            min-height: 100vh;
            font-family: Inter, "Segoe UI", sans-serif;
            color: #3b3734;
            background: #f5f7fa;
        }

        .page {
            min-height: 100vh;
            padding: 32px 18px;

            background:
                repeating-linear-gradient(
                    90deg,
                    rgba(160,120,80,.08) 0,
                    rgba(160,120,80,.08) 1px,
                    transparent 1px,
                    transparent 5px
                ),
                linear-gradient(
                    to bottom,
                    #fcebd1,
                    #dec9a2
                );
        }

        .card {
            max-width: 1080px;
            margin: 0 auto;
            padding: 34px 30px 42px;

            background: #fff;
            border-radius: 16px;
            box-shadow: 0 10px 25px rgba(0,0,0,.1);
        }

        h1 {
            margin: 0 0 8px;
            text-align: center;
        }

        .intro {
            max-width: 720px;
            margin: 0 auto 22px;

            color: #6c655f;
            text-align: center;
            line-height: 1.55;
        }

        .back {
            margin-bottom: 30px;
            text-align: center;
        }

        .back a {
            color: #3a2f2f;
        }


        /* ---------------------------------------------------------
           RELEASE
        --------------------------------------------------------- */

        .release {
            margin-top: 10px;
        }

        .release + .release {
            margin-top: 45px;
            padding-top: 35px;
            border-top: 1px solid #ebe5dc;
        }

        .release-head {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            gap: 20px;

            margin-bottom: 22px;
            padding-bottom: 15px;

            border-bottom: 1px solid #ebe5dc;
        }

        .release-head h2 {
            margin: 0 0 4px;

            color: #302925;
            font-size: 26px;
        }

        .release-subtitle {
            margin: 0;
            color: #6c655f;
            font-size: 14px;
        }

        .release-date {
            flex-shrink: 0;

            color: #888;
            font-size: 13px;
        }


        /* ---------------------------------------------------------
           SECTION
        --------------------------------------------------------- */

        .update-section {
            margin-top: 28px;
        }

        .update-section:first-of-type {
            margin-top: 0;
        }

        .update-section-title {
            display: flex;
            align-items: center;
            gap: 7px;

            margin: 0 0 12px;

            color: #6c655f;
            font-size: 12px;
            font-weight: 700;
            letter-spacing: .08em;
            text-transform: uppercase;
        }


        /* ---------------------------------------------------------
           UPDATE GRID
        --------------------------------------------------------- */

        .update-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
        }

        .update {
            padding: 17px 18px;

            background: #fff;
            border: 1px solid #ebe5dc;
            border-radius: 10px;
        }

        .update.featured {
            background: #fdfbf9;
        }

        .update.wide {
            grid-column: span 2;
        }

        .update-head {
            display: flex;
            align-items: center;
            gap: 8px;

            margin-bottom: 7px;
        }

        .update h3 {
            margin: 0;
            color: #302925;
            font-size: 15px;
        }

        .update p {
            margin: 0;

            color: #5f5954;
            font-size: 14px;
            line-height: 1.5;
        }

        .badge {
            display: inline-block;

            margin-left: auto;
            padding: 3px 7px;

            border-radius: 999px;
            background: #f2efe9;

            color: #6c655f;
            font-size: 10px;
            font-weight: 700;
            letter-spacing: .05em;
            text-transform: uppercase;
        }

        .update-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 5px;

            margin-top: 11px;
        }

        .update-tag {
            padding: 3px 8px;

            background: #f2efe9;
            border-radius: 999px;

            color: #5f5954;
            font-size: 12px;
        }


        /* ---------------------------------------------------------
           SMALL / TECHNICAL ITEMS
        --------------------------------------------------------- */

        .small-updates {
            display: grid;
            gap: 7px;
        }

        .small-update {
            display: flex;
            gap: 9px;

            padding: 11px 13px;

            background: #fdfbf9;
            border: 1px solid #ebe5dc;
            border-radius: 8px;

            color: #5f5954;
            font-size: 13px;
            line-height: 1.45;
        }

        .small-update strong {
            color: #302925;
        }


        /* ---------------------------------------------------------
           COMING NEXT
        --------------------------------------------------------- */

        .coming-next {
            margin-top: 34px;
            padding: 22px;

            background: #fdfbf9;
            border: 1px solid #ebe5dc;
            border-radius: 10px;
        }

        .coming-next h2 {
            margin: 0 0 7px;
            color: #302925;
            font-size: 20px;
        }

        .coming-next p {
            margin: 0;
            color: #6c655f;
            line-height: 1.55;
        }

        .coming-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;

            margin-top: 14px;
        }

        .coming-tag {
            padding: 5px 9px;

            background: #f2efe9;
            border-radius: 999px;

            color: #5f5954;
            font-size: 12px;
        }


        /* ---------------------------------------------------------
           END
        --------------------------------------------------------- */

        .ending {
            margin-top: 35px;
            padding-top: 28px;

            border-top: 1px solid #ebe5dc;

            color: #6c655f;
            text-align: center;
            line-height: 1.55;
        }

        .ending strong {
            color: #3b3734;
        }


        /* ---------------------------------------------------------
           RESPONSIVE
        --------------------------------------------------------- */

        @media (max-width: 700px) {

            .page {
                padding: 18px 10px;
            }

            .card {
                padding: 26px 16px 32px;
                border-radius: 12px;
            }

            .release-head {
                display: block;
            }

            .release-date {
                display: block;
                margin-top: 7px;
            }

            .update-grid {
                grid-template-columns: 1fr;
            }

            .update.wide {
                grid-column: auto;
            }
        }