@import url('/static/css/size.scale.css');

:root {
    --fab-size: 52px;
    --fab-top: 16px;
    --fab-left: 16px;
    --flow-gutter: 14px;
}

html,
body {
    margin: 0;
    padding: 0;
    background: #ffffff;
    color: #111111;
    font-family: "Times New Roman", Georgia, serif;
}

.legal_page {
    max-width: 980px;
    margin: 0 auto;
    padding: var(--space-6) var(--space-5) var(--space-12);
}

.doc_wrap {
    --flow-track-y: 40px;
    --flow-height: 0rem;
    position: relative;
}

.doc_flow_spacer {
    float: left;
    width: calc(var(--fab-size) + var(--flow-gutter));
    height: var(--flow-height);
    pointer-events: none;
    shape-margin: 8px;
    shape-outside: radial-gradient(
        circle calc(var(--fab-size) * 0.58) at calc(var(--fab-size) / 2) var(--flow-track-y),
        #000 98%,
        transparent 100%
    );
}

.doc_wrap::after {
    content: "";
    display: block;
    clear: both;
}

.doc {
    margin: 0;
    font-size: var(--font-size-lg);
    line-height: var(--line-height-relaxed);
    white-space: pre-wrap;
    word-break: break-word;
}

.doc_wrap.no-shape .doc_flow_spacer {
    display: none;
}

.doc_wrap.no-shape .doc {
    padding-left: calc(var(--fab-size) + var(--flow-gutter));
}

.back_fab {
    position: fixed;
    top: var(--fab-top);
    left: var(--fab-left);
    width: var(--fab-size);
    height: var(--fab-size);
    border-radius: 62.4375rem;
    background: linear-gradient(135deg, #6caefc 0%, #3f88ff 100%);
    box-shadow: 0 10px 24px rgba(63, 136, 255, 0.35);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    text-decoration: none;
    z-index: 3000;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.back_fab:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(63, 136, 255, 0.4);
}

.back_fab:active {
    transform: translateY(0);
}

.back_fab svg {
    width: 24px;
    height: 1.5rem;
    display: block;
}

@media (max-width: 640px) {
    :root {
        --fab-size: 46px;
        --fab-top: 12px;
        --fab-left: 12px;
        --flow-gutter: 10px;
    }

    .legal_page {
        padding: var(--space-5) var(--space-3) var(--space-10);
    }

    .doc {
        font-size: var(--font-size-md);
        line-height: var(--line-height-relaxed);
    }
}
