:root {    --bg: #f4f0e8;    --text: #171717;    --muted: #76716a;    --border: #d8d0c4;    --accent: #d6533c;}[data-theme="dark"] {    --bg: #202526;    --text: #f7efe2;    --muted: #a9aaa2;    --border: #414847;    --accent: #f0785f;}* {    box-sizing: border-box;}html,body {    margin: 0;    width: 100%;    min-height: 100%;    background: var(--bg);    color: var(--text);}body {    font-family: "Trebuchet MS", "Segoe UI", sans-serif;    transition: background .2s ease, color .2s ease;}body::before {    content: "";    position: fixed;    inset: 0;    pointer-events: none;    background:        linear-gradient(115deg, rgba(214, 83, 60, .07), transparent 35%),        linear-gradient(transparent 97%, rgba(23, 23, 23, .035) 98%);    background-size: auto, 100% 7px;    z-index: 0;}[data-theme="dark"] body::before {    background: linear-gradient(        transparent 97%,        rgba(247, 239, 226, .012) 98%    );}.header {    position: fixed;    top: 0;    left: 0;    right: 0;    height: 78px;    padding: 0 5vw;    display: flex;    align-items: center;    justify-content: space-between;    border-bottom: 2px solid var(--text);    background: color-mix(in srgb, var(--bg) 94%, transparent);    backdrop-filter: blur(12px);    z-index: 10;}.logo {    color: var(--text);    text-decoration: none;    font: 700 22px Georgia, serif;    letter-spacing: -.08em;}.logo::before {    content: "TR / ";    color: var(--accent);    font: 700 10px "Segoe UI", sans-serif;    letter-spacing: .08em;    vertical-align: middle;}.theme {    width: 36px;    height: 36px;    border: 0;    border-radius: 2px;    background: transparent;    color: var(--muted);    font-size: 17px;    cursor: pointer;}.theme:hover {    background: var(--text);    color: var(--bg);}main {    position: relative;    z-index: 1;    min-height: 100vh;    padding: 78px 5vw 40px;    display: flex;    align-items: center;    justify-content: center;}.message {    width: min(1100px, 100%);    display: grid;    grid-template-columns: 8px 1fr;    gap: 26px;    align-items: center;    animation: reveal .7s ease both;}.line {    width: 8px;    height: 185px;    background: var(--accent);}.eyebrow {    margin: 0 0 18px;    color: var(--muted);    font: 700 10px "Segoe UI", sans-serif;    letter-spacing: .16em;    text-transform: uppercase;}h1 {    margin: 0;    font: 700 clamp(62px, 10vw, 125px) / .86 Georgia, serif;    letter-spacing: -.07em;}h1 span {    color: var(--accent);}.notice {    margin: 32px 0 0;    color: var(--muted);    font: clamp(17px, 2vw, 21px) / 1.5 Georgia, serif;}.status {    display: flex;    align-items: center;    gap: 9px;    margin-top: 28px;    color: var(--text);    font: 10px "Segoe UI", sans-serif;    letter-spacing: .12em;    text-transform: uppercase;}.dot {    width: 7px;    height: 7px;    border-radius: 50%;    background: var(--accent);    box-shadow: 0 0 0 5px rgba(214, 83, 60, .12);    animation: pulse 2s ease-in-out infinite;}@keyframes reveal {    from {        opacity: 0;        transform: translateY(18px);    }    to {        opacity: 1;        transform: translateY(0);    }}@keyframes pulse {    0%,    100% {        opacity: 1;        transform: scale(1);    }    50% {        opacity: .55;        transform: scale(.72);    }}@media (max-width: 700px) {    .header {        height: 58px;        padding: 0 18px;    }    .logo::before {        display: none;    }    main {        padding: 58px 18px 30px;    }    .message {        grid-template-columns: 5px 1fr;        gap: 15px;    }    .line {        width: 5px;        height: 140px;    }    h1 {        font-size: clamp(58px, 18vw, 92px);    }    .notice {        margin-top: 25px;        font-size: 17px;    }}@media (prefers-reduced-motion: reduce) {    * {        animation: none !important;        transition: none !important;    }}