:root {
    --bg: #1C1C1E;
    --panel: #2C2C2E;
    --panel-2: #262628;
    --text: #FFFFFF;
    --muted: #AEAEB2;
    --light: #AEAEB2;
    --border: rgba(255, 255, 255, 0.09);
    --orange: #FF6B35;
}

* { box-sizing: border-box; }

html { color-scheme: dark; }

body {
    margin: 0;
    min-height: 100vh;
    background: var(--bg);
    color: var(--text);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.65;
}

.legal-shell {
    width: min(100% - 32px, 760px);
    margin: 0 auto;
    padding: 34px 0 56px;
}

.legal-header { margin-bottom: 22px; }

.brand {
    display: inline-block;
    background: linear-gradient(135deg, #FF9933, #FF5733);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    font-size: 28px;
    font-weight: 750;
    letter-spacing: -0.4px;
    text-decoration: none;
}

.legal-card {
    background: linear-gradient(145deg, var(--panel), var(--panel-2));
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: clamp(22px, 5vw, 38px);
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.28);
}

h1 {
    margin: 0 0 5px;
    font-size: clamp(28px, 6vw, 40px);
    line-height: 1.15;
    letter-spacing: -0.7px;
}

h2 {
    margin: 30px 0 8px;
    font-size: 20px;
    line-height: 1.3;
}

p, ul { margin: 9px 0; }

ul { padding-left: 23px; }

.effective { color: var(--light); font-size: 14px; }

a { color: #FF9F55; text-underline-offset: 3px; }

a:focus-visible {
    outline: 3px solid rgba(255, 159, 85, 0.55);
    outline-offset: 3px;
    border-radius: 3px;
}

.legal-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
    color: var(--muted);
    font-size: 14px;
}

.legal-nav a { color: var(--muted); }

.notice {
    margin-top: 20px;
    padding: 13px 15px;
    border-left: 3px solid var(--orange);
    background: rgba(255, 107, 53, 0.08);
    color: var(--muted);
    border-radius: 0 10px 10px 0;
}

@media (max-width: 520px) {
    .legal-shell { width: min(100% - 20px, 760px); padding-top: 18px; }
    .legal-card { border-radius: 14px; }
}

@media (forced-colors: active) {
    .brand {
        background: none;
        color: LinkText;
        -webkit-text-fill-color: LinkText;
    }

    .legal-card {
        border: 1px solid CanvasText;
        box-shadow: none;
    }
}
