:root {
    --ink: #12263a;
    --ink-soft: #54708c;
    --paper: #f6efe5;
    --paper-strong: rgba(255, 251, 245, 0.88);
    --glass: rgba(255, 255, 255, 0.54);
    --glass-strong: rgba(255, 255, 255, 0.72);
    --glass-dark: rgba(8, 28, 38, 0.56);
    --line: rgba(18, 38, 58, 0.12);
    --line-strong: rgba(255, 255, 255, 0.18);
    --primary: #1f7a70;
    --primary-dark: #134f48;
    --accent: #d67832;
    --accent-soft: #f3b173;
    --warning: #d8982f;
    --danger: #bc5353;
    --success: #31946e;
    --title-gradient: linear-gradient(135deg, #e1722b 0%, #af5a17 38%, #115d71 100%);
    --surface-shadow: 0 20px 50px rgba(17, 36, 51, 0.12);
    --surface-shadow-strong: 0 28px 68px rgba(17, 36, 51, 0.18);
}

html {
    scroll-behavior: smooth;
}

body {
    min-height: 100vh;
    margin: 0;
    padding-bottom: 6rem;
    color: var(--ink);
    font-family: 'Manrope', sans-serif !important;
    background:
        radial-gradient(circle at 12% 18%, rgba(31, 122, 112, 0.22), transparent 28%),
        radial-gradient(circle at 86% 14%, rgba(214, 120, 50, 0.18), transparent 24%),
        linear-gradient(180deg, #ecf0eb 0%, #f9f5ef 36%, #f7efe6 100%);
}

body.menu-open {
    overflow: hidden;
}

html.helpers-off .page-summary,
html.helpers-off .section-description,
html.helpers-off .field-note,
html.helpers-off .helper-note {
    display: none !important;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -3;
    opacity: 0.4;
    pointer-events: none;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: radial-gradient(circle at center, black, transparent 82%);
}

h1,
h2,
h3,
h4,
h5,
h6,
.display-font {
    font-family: 'Cormorant Garamond', serif;
    letter-spacing: 0;
}

a {
    color: var(--primary);
}

a:hover {
    color: var(--primary-dark);
    text-decoration: none;
}

.ambient-background {
    position: fixed;
    inset: 0;
    z-index: -2;
    overflow: hidden;
    pointer-events: none;
}

.ambient-background::before,
.ambient-background::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    filter: blur(14px);
    opacity: 0.72;
    transform: translate3d(var(--orb-shift-x, 0px), var(--orb-shift-y, 0px), 0);
}

.ambient-background::before {
    width: min(46vw, 700px);
    height: min(46vw, 700px);
    top: -10%;
    left: -10%;
    background: radial-gradient(circle, rgba(31, 122, 112, 0.26) 0%, rgba(31, 122, 112, 0.02) 70%, transparent 100%);
}

.ambient-background::after {
    width: min(40vw, 560px);
    height: min(40vw, 560px);
    top: 6%;
    right: -8%;
    background: radial-gradient(circle, rgba(214, 120, 50, 0.24) 0%, rgba(214, 120, 50, 0.02) 72%, transparent 100%);
}

.container,
.container-fluid {
    position: relative;
    z-index: 1;
}

.card {
    border: 1px solid var(--line);
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.68), rgba(255, 255, 255, 0.44));
    box-shadow: var(--surface-shadow);
    backdrop-filter: blur(18px);
}

.card:hover {
    box-shadow: var(--surface-shadow-strong) !important;
    background-color: rgba(255, 255, 255, 0.82) !important;
}

.btn {
    border-radius: 999px;
    border: 1px solid transparent;
    font-weight: 700;
    letter-spacing: 0.01em;
    padding: 0.72rem 1.35rem;
    transition: transform 0.22s ease, box-shadow 0.22s ease, filter 0.22s ease, background-color 0.22s ease;
}

.btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 32px rgba(18, 38, 58, 0.16);
}

.btn-primary {
    color: #fff;
    background: linear-gradient(135deg, #1c84ff, #0e72e8);
}

.btn-warning {
    color: #17212e;
    background: linear-gradient(135deg, #ffbf28, #ef9f16);
}

.btn-success {
    color: #fff;
    background: linear-gradient(135deg, var(--success), #46ab83);
}

.btn-danger {
    color: #fff;
    background: linear-gradient(135deg, var(--danger), #a94343);
}

.btn-secondary {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.14);
}

.btn-light {
    color: var(--ink);
    background: rgba(255, 255, 255, 0.3);
    border-color: rgba(18, 38, 58, 0.12);
    backdrop-filter: blur(14px);
}

.btn-link {
    color: var(--primary);
}

.form-control,
select.form-control,
textarea.form-control {
    min-height: 54px;
    border: 1px solid rgba(18, 38, 58, 0.12);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(14px);
}

textarea.form-control {
    min-height: 140px;
    padding-top: 0.9rem;
}

.form-control:focus,
select.form-control:focus,
textarea.form-control:focus {
    border-color: rgba(31, 122, 112, 0.38);
    box-shadow: 0 0 0 0.2rem rgba(31, 122, 112, 0.12);
}

.dropdown-menu {
    margin-top: 0;
    border: 1px solid rgba(18, 38, 58, 0.1);
    border-radius: 24px;
    padding: 0.6rem;
    background: rgba(255, 255, 255, 0.86);
    box-shadow: var(--surface-shadow-strong);
    backdrop-filter: blur(20px);
}

.dropdown-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    border-radius: 16px;
    padding: 0.8rem 1rem;
    color: var(--ink);
}

.dropdown-item:hover {
    background: rgba(31, 122, 112, 0.08);
}

.badge {
    padding: 0.34rem 0.58rem;
    font-size: 0.78rem;
}

.div-hover-1 {
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.div-hover-1:hover {
    transform: translateY(-3px);
    box-shadow: var(--surface-shadow);
}

.filter_style {
    padding: 1.3rem !important;
    border-radius: 26px !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0.3));
    backdrop-filter: blur(16px);
}

.filter_style label {
    font-weight: 700;
    color: var(--ink);
}

.primary-menu {
    position: sticky;
    top: 0;
    display: grid;
    grid-template-columns: minmax(230px, 300px) minmax(0, 1fr);
    align-items: center;
    justify-content: stretch;
    z-index: 2600;
    gap: 0.65rem 1rem;
    padding: 0.62rem clamp(0.85rem, 1.3vw, 1.25rem);
    overflow: visible !important;
    background: linear-gradient(135deg, rgba(7, 28, 47, 0.88), rgba(12, 72, 81, 0.76) 58%, rgba(24, 111, 91, 0.68));
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 24px 56px rgba(7, 28, 47, 0.24);
    backdrop-filter: blur(22px);
}

.primary-menu::after {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
}

body.is-scrolling .primary-menu {
    box-shadow: 0 28px 64px rgba(7, 28, 47, 0.3);
}

.primary-menu .btn {
    white-space: nowrap;
}

.primary-menu .btn,
.primary-menu .btn-group > .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.38rem;
    margin: 0 !important;
    min-height: 42px;
    padding: 0.62rem 0.82rem;
    border-radius: 17px;
    font-size: 0.88rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: 0;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.primary-menu .btn-primary,
.primary-menu .btn-secondary {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(14px);
}

.primary-menu .btn-primary:hover,
.primary-menu .btn-secondary:hover {
    background: rgba(255, 255, 255, 0.14);
}

.primary-menu .btn-warning {
    border-color: rgba(255, 255, 255, 0.18);
}

.menu-brand {
    display: flex;
    align-items: center;
    gap: 0.58rem;
    min-width: 0;
    flex: 0 0 auto;
    isolation: isolate;
}

.menu-top-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.65rem;
    width: 100%;
    min-width: 0;
}

.menu-top-row .tag-row {
    flex: 0 1 auto;
    justify-content: flex-start;
    margin: 0;
}

.menu-context-row .tag-chip {
    max-width: min(220px, 32vw);
    overflow: hidden;
    text-overflow: ellipsis;
}

.menu-brand img {
    width: clamp(176px, 12vw, 238px);
    max-width: 100%;
    filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.24));
}

.menu-brand img.menu-brand-mark {
    width: clamp(36px, 2.6vw, 44px);
    height: clamp(36px, 2.6vw, 44px);
    flex: 0 0 auto;
    border-radius: 31%;
    filter: drop-shadow(0 10px 22px rgba(4, 18, 30, 0.28));
}

.menu-brand img.menu-brand-wordmark {
    width: clamp(144px, 9vw, 200px);
}

.menu-mobile-toggle {
    display: none !important;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    padding: 0;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: #fff;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(14px);
}

.menu-mobile-toggle i {
    font-size: 1.35rem;
}

.menu-actions {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    margin-left: auto;
    gap: 0.42rem;
    overflow: visible;
}

.menu-actions::-webkit-scrollbar {
    display: none;
}

.menu-actions .btn-group {
    position: relative;
    flex: 0 0 auto;
    display: flex;
    align-items: stretch;
}

.menu-actions .menu-dropdown-group:not(.menu-tools-group) > .btn:first-child:not(:last-child) {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

.menu-actions .menu-dropdown-group:not(.menu-tools-group) > .dropdown-toggle-split {
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

.menu-actions .menu-tools-group > .btn {
    border-radius: 17px;
}

.menu-actions .dropdown-toggle-split {
    min-width: 44px;
    padding-left: 0.55rem;
    padding-right: 0.55rem;
}

.menu-dropdown-group.is-open {
    z-index: 2702;
}

.drop-menu-custom {
    top: calc(100% + 0.8rem) !important;
    left: auto !important;
    right: 0 !important;
    min-width: 290px;
    max-height: min(68vh, 520px);
    overflow-y: auto;
    z-index: 2700;
}

.drop-menu-custom .dropdown-item {
    width: 100%;
    border: 0;
    text-align: left;
    font-weight: 750;
    background: transparent;
}

.drop-menu-custom button.dropdown-item {
    cursor: pointer;
    font: inherit;
}

.drop-menu-custom .dropdown-item span {
    min-width: 0;
}

.drop-menu-custom .dropdown-item i {
    flex: 0 0 auto;
    color: rgba(31, 122, 112, 0.9);
}

.section-shell {
    position: relative;
    margin-top: 1.6rem;
    scroll-margin-top: 7.4rem;
    padding: 1.55rem;
    border: 1px solid rgba(255, 255, 255, 0.42);
    border-radius: 34px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.58), rgba(255, 255, 255, 0.3));
    box-shadow: var(--surface-shadow);
    backdrop-filter: blur(20px);
}

.section-shell.has-live-preview {
    z-index: 1800;
}

.app-shell {
    padding-top: 1.5rem;
    padding-bottom: 2.5rem;
}

.app-shell-wide {
    width: min(1540px, calc(100vw - 2rem));
    max-width: none;
}

.app-page-hero {
    margin-top: 1.45rem;
}

.app-page-hero .page-title {
    max-width: 12ch;
    font-size: clamp(3rem, 4.4vw, 4.95rem);
    line-height: 0.94;
}

.app-page-hero .section-description,
.page-summary {
    max-width: 56rem;
    color: var(--ink-soft);
    font-size: 1.02rem;
}

.app-page-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    justify-content: flex-end;
}

.settings-list {
    display: grid;
    gap: 1rem;
}

.settings-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(250px, 320px);
    align-items: center;
    gap: 1.1rem 1.25rem;
    padding: 1rem 1.05rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.44);
    border: 1px solid rgba(18, 38, 58, 0.08);
}

.settings-row-form {
    align-items: flex-start;
}

.settings-copy {
    min-width: 0;
    display: grid;
    gap: 0.2rem;
}

.settings-title {
    margin: 0 0 0.18rem;
    color: var(--ink);
    font-size: 1rem;
    font-weight: 800;
}

.settings-text {
    margin: 0;
    color: var(--ink-soft);
    font-size: 0.92rem;
}

.settings-field {
    width: 100%;
    min-width: 0;
}

.switch-control {
    position: relative;
    display: inline-flex;
    width: 64px;
    height: 36px;
    flex: 0 0 auto;
}

.switch-control input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.switch-slider {
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background: rgba(18, 38, 58, 0.14);
    border: 1px solid rgba(18, 38, 58, 0.08);
    transition: background-color 0.22s ease, border-color 0.22s ease;
}

.switch-slider::after {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 10px 18px rgba(18, 38, 58, 0.18);
    transition: transform 0.22s ease;
}

.switch-control input:checked + .switch-slider {
    background: linear-gradient(135deg, rgba(31, 122, 112, 0.92), rgba(17, 93, 113, 0.92));
    border-color: rgba(31, 122, 112, 0.26);
}

.switch-control input:checked + .switch-slider::after {
    transform: translateX(28px);
}

.switch-control input:focus + .switch-slider {
    box-shadow: 0 0 0 0.2rem rgba(31, 122, 112, 0.14);
}

.floating-stack {
    position: fixed;
    left: 1rem;
    bottom: 10rem;
    z-index: 1605;
    display: grid;
    gap: 0.75rem;
    pointer-events: none;
}

.floating-action,
.floating-toggle {
    pointer-events: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border: 0;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(135deg, #c89205, #d67832);
    box-shadow: 0 20px 34px rgba(18, 38, 58, 0.22);
    backdrop-filter: blur(18px);
}

.floating-action:hover,
.floating-toggle:hover {
    color: #fff;
}

.floating-panel {
    position: fixed;
    left: 1rem;
    bottom: 4.8rem;
    width: min(420px, calc(100vw - 2rem));
    max-height: min(72vh, 720px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem;
    border-radius: 28px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: linear-gradient(180deg, rgba(9, 31, 46, 0.94), rgba(12, 57, 73, 0.88));
    box-shadow: 0 28px 56px rgba(6, 22, 33, 0.32);
    backdrop-filter: blur(28px);
    color: #fff;
    overflow: hidden;
    transform: translateY(18px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease, transform 0.22s ease;
    z-index: 1604;
}

.floating-panel.is-open {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.floating-panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.85rem;
}

.floating-panel-title {
    margin: 0;
    color: #fff;
    font-family: 'Manrope', sans-serif;
    font-size: 1.18rem;
    font-weight: 800;
    letter-spacing: 0.01em;
}

.floating-panel-text {
    margin: 0.3rem 0 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.92rem;
}

.floating-panel-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 0;
    flex-shrink: 0;
    border-radius: 999px;
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

.floating-panel-close:hover {
    background: rgba(255, 255, 255, 0.14);
}

.floating-panel-body {
    min-height: 0;
    max-height: 100%;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding-right: 0.35rem;
}

.changelog-list {
    display: grid;
    gap: 0.85rem;
}

.changelog-card {
    padding: 1rem;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.changelog-card h5 {
    margin: 0 0 0.35rem;
    color: #fff;
    font-family: 'Manrope', sans-serif;
    font-size: 1rem;
    font-weight: 800;
}

.changelog-date {
    display: inline-flex;
    margin-bottom: 0.55rem;
    color: rgba(255, 255, 255, 0.66);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.changelog-card ul {
    margin: 0;
    padding-left: 1.1rem;
    color: rgba(255, 255, 255, 0.86);
}

.speed-widget {
    position: fixed;
    right: 1rem;
    bottom: 10rem;
    width: min(360px, calc(100vw - 2rem));
    display: grid;
    gap: 0.9rem;
    padding: 1rem;
    border-radius: 28px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(247, 240, 231, 0.82));
    box-shadow: 0 24px 48px rgba(18, 38, 58, 0.22);
    backdrop-filter: blur(24px);
    z-index: 1602;
    transform: translateY(16px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease, transform 0.22s ease;
}

.speed-widget.is-open {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.speed-widget-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.8rem;
}

.speed-widget-title {
    margin: 0;
    color: var(--ink);
    font-family: 'Manrope', sans-serif;
    font-size: 1.1rem;
    font-weight: 800;
}

.speed-widget-text {
    margin: 0.28rem 0 0;
    color: var(--ink-soft);
    font-size: 0.92rem;
}

.speed-widget .floating-panel-close {
    color: var(--ink);
    background: rgba(18, 38, 58, 0.08);
    border: 1px solid rgba(18, 38, 58, 0.08);
}

.speed-widget .floating-panel-close:hover {
    background: rgba(18, 38, 58, 0.14);
}

.speed-chart-shell {
    position: relative;
    height: 220px;
}

.speed-readout {
    padding: 0.9rem 1rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.68);
    border: 1px solid rgba(18, 38, 58, 0.08);
    text-align: center;
}

.speed-value {
    display: block;
    color: var(--ink);
    font-size: clamp(1.7rem, 3vw, 2.2rem);
    font-weight: 800;
}

.speed-caption,
.speed-message {
    margin: 0.2rem 0 0;
    color: var(--ink-soft);
}

.speed-launcher {
    position: fixed;
    right: 1rem;
    bottom: 10rem;
    z-index: 1601;
}

.soul-orb-launcher {
    position: fixed;
    right: 1rem;
    bottom: 15rem;
    z-index: 1603;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 999px;
    color: #fff;
    background:
        radial-gradient(circle at 28% 24%, rgba(255, 255, 255, 0.95), transparent 16%),
        linear-gradient(135deg, rgba(19, 116, 120, 0.96), rgba(25, 67, 94, 0.96) 52%, rgba(214, 120, 50, 0.92));
    box-shadow: 0 22px 46px rgba(10, 33, 48, 0.28);
    backdrop-filter: blur(20px);
    overflow: hidden;
}

.soul-orb-launcher::before {
    content: "";
    position: absolute;
    inset: -36%;
    background: conic-gradient(from 120deg, transparent, rgba(255, 255, 255, 0.7), transparent, rgba(244, 182, 79, 0.64), transparent);
    animation: soulOrbSpin 5.4s linear infinite;
}

.soul-orb-launcher i {
    position: relative;
    z-index: 2;
    font-size: 1.2rem;
}

.soul-orb-glow {
    position: absolute;
    inset: 7px;
    border-radius: inherit;
    background: rgba(16, 76, 87, 0.76);
    z-index: 1;
}

.soul-quick-overlay {
    position: fixed;
    inset: 0;
    z-index: 10080;
    display: grid;
    place-items: center;
    padding: clamp(0.75rem, 2vw, 1.5rem);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.24s ease;
}

.soul-quick-overlay.is-open {
    opacity: 1;
    pointer-events: auto;
}

body.soul-quick-open {
    overflow: hidden;
}

.soul-quick-backdrop {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 16% 16%, rgba(214, 120, 50, 0.24), transparent 28%),
        radial-gradient(circle at 84% 18%, rgba(31, 122, 112, 0.22), transparent 30%),
        rgba(8, 26, 39, 0.5);
    backdrop-filter: blur(18px);
}

.soul-quick-shell {
    position: relative;
    display: grid;
    grid-template-columns: minmax(230px, 0.3fr) minmax(0, 1fr);
    width: min(1180px, 100%);
    height: min(820px, calc(100dvh - 2rem));
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 34px;
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(244, 250, 249, 0.86)),
        radial-gradient(circle at 70% 10%, rgba(31, 122, 112, 0.12), transparent 34%);
    box-shadow: 0 34px 84px rgba(3, 18, 29, 0.36);
    overflow: hidden;
    transform: translateY(18px) scale(0.98);
    transition: transform 0.24s ease;
}

.soul-quick-overlay.is-open .soul-quick-shell {
    transform: translateY(0) scale(1);
}

.soul-quick-rail,
.soul-quick-main,
.soul-quick-side {
    min-width: 0;
}

.soul-quick-rail {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    gap: 1rem;
    padding: 1.1rem;
    color: #fff;
    background:
        radial-gradient(circle at 20% 12%, rgba(255, 255, 255, 0.16), transparent 30%),
        linear-gradient(160deg, rgba(17, 50, 70, 0.98), rgba(18, 105, 104, 0.92));
}

.soul-quick-rail h3,
.soul-quick-topbar h3 {
    margin: 0;
}

.soul-quick-rail .field-note {
    color: rgba(255, 255, 255, 0.7);
}

.soul-quick-conversations {
    display: grid;
    gap: 0.6rem;
    overflow: auto;
    padding-right: 0.25rem;
}

.soul-conversation-pill {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.35rem;
    align-items: stretch;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.soul-conversation-pill.is-active {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.24);
}

.soul-conversation-open,
.soul-conversation-delete {
    border: 0;
    color: #fff;
    background: transparent;
}

.soul-conversation-open {
    display: grid;
    gap: 0.2rem;
    min-width: 0;
    padding: 0.75rem;
    text-align: left;
}

.soul-conversation-open span,
.soul-conversation-open small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.soul-conversation-open span {
    font-weight: 800;
}

.soul-conversation-open small {
    color: rgba(255, 255, 255, 0.68);
    font-size: 0.78rem;
}

.soul-conversation-delete {
    width: 38px;
    border-left: 1px solid rgba(255, 255, 255, 0.08);
    opacity: 0.75;
}

.soul-conversation-delete:hover {
    opacity: 1;
    color: #ffd8b0;
}

.soul-quick-main {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    gap: 1rem;
    padding: 1.1rem;
    min-height: 0;
}

.soul-quick-topbar,
.soul-quick-actions,
.soul-tokenizer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.soul-quick-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 999px;
    color: var(--ink);
    background: rgba(18, 38, 58, 0.08);
}

.soul-quick-insights {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.soul-quick-insights article {
    padding: 0.85rem 0.95rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(18, 38, 58, 0.08);
}

.soul-quick-insights span {
    display: block;
    color: var(--ink-soft);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.soul-quick-insights strong {
    color: var(--ink);
    font-size: 1.08rem;
}

.soul-quick-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 0.34fr);
    gap: 1rem;
    min-height: 0;
}

.soul-quick-chat {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 0.85rem;
    min-height: 0;
}

.soul-quick-log {
    display: grid;
    align-content: start;
    gap: 0.75rem;
    overflow: auto;
    padding: 0.2rem 0.35rem 0.2rem 0;
}

.soul-quick-bubble {
    display: grid;
    gap: 0.35rem;
    width: min(92%, 680px);
    padding: 0.9rem 1rem;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(18, 38, 58, 0.08);
    box-shadow: 0 16px 28px rgba(18, 38, 58, 0.08);
}

.soul-quick-bubble.is-user {
    justify-self: end;
    color: #fff;
    background: linear-gradient(140deg, rgba(29, 121, 111, 0.94), rgba(17, 93, 113, 0.94));
}

.soul-quick-bubble.is-error {
    color: #744315;
    background: rgba(255, 241, 218, 0.92);
}

.soul-quick-bubble.is-thinking,
.soul-chat-bubble.is-thinking {
    position: relative;
    overflow: hidden;
    background: linear-gradient(110deg, rgba(255, 255, 255, 0.74), rgba(235, 247, 246, 0.94), rgba(255, 249, 240, 0.82));
}

.soul-quick-bubble.is-thinking::after,
.soul-chat-bubble.is-thinking::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.62), transparent);
    transform: translateX(-100%);
    animation: soulThinkingSweep 1.35s ease-in-out infinite;
}

.soul-quick-bubble span {
    color: var(--accent);
    font-size: 0.72rem;
    font-weight: 900;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.soul-quick-bubble.is-user span {
    color: rgba(255, 255, 255, 0.72);
}

.soul-quick-form {
    display: grid;
    gap: 0.6rem;
    padding: 0.8rem;
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.76);
    border: 1px solid rgba(18, 38, 58, 0.08);
}

.soul-quick-form textarea {
    width: 100%;
    min-height: 92px;
    resize: vertical;
    border: 1px solid rgba(18, 38, 58, 0.12);
    border-radius: 20px;
    padding: 0.85rem 0.95rem;
    background: rgba(255, 255, 255, 0.92);
}

.soul-tokenizer {
    color: var(--ink-soft);
    font-size: 0.82rem;
    font-weight: 800;
}

.soul-quick-side {
    display: grid;
    gap: 1rem;
    align-content: start;
    overflow: auto;
    padding-right: 0.25rem;
}

.soul-quick-goals,
.soul-quick-memories {
    display: grid;
    gap: 0.65rem;
}

.soul-goal-mini,
.soul-memory-mini,
.soul-quick-empty {
    display: grid;
    gap: 0.25rem;
    margin: 0;
    padding: 0.75rem 0.85rem;
    border-radius: 18px;
    color: var(--ink);
    background: rgba(255, 255, 255, 0.68);
    border: 1px solid rgba(18, 38, 58, 0.08);
}

.soul-goal-mini:hover {
    color: var(--ink);
    text-decoration: none;
    transform: translateY(-1px);
}

.soul-goal-mini span,
.soul-memory-mini span,
.soul-quick-empty {
    color: var(--ink-soft);
    font-size: 0.88rem;
}

.soul-memory-mini strong {
    color: var(--accent);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.soul-memory-mini span {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.clean-view-toggle {
    position: fixed;
    right: 1rem;
    bottom: 4.95rem;
    z-index: 1700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(135deg, rgba(17, 93, 113, 0.96), rgba(31, 122, 112, 0.9));
    box-shadow: 0 18px 34px rgba(18, 38, 58, 0.2);
    backdrop-filter: blur(18px);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.clean-view-toggle:hover {
    transform: translateY(-1px);
    color: #fff;
    box-shadow: 0 22px 42px rgba(18, 38, 58, 0.24);
}

.clean-view-toggle i {
    font-size: 1.1rem;
}

.bookyhe-clean-view {
    padding-bottom: 2rem;
}

.bookyhe-clean-view .floating-stack,
.bookyhe-clean-view .floating-panel,
.bookyhe-clean-view .speed-widget,
.bookyhe-clean-view .speed-launcher,
.bookyhe-clean-view .soul-orb-launcher,
.bookyhe-clean-view .footer-shell .fixed-bottom,
.bookyhe-clean-view .app-logo-footer {
    display: none !important;
}

.bookyhe-clean-view .clean-view-toggle {
    bottom: 1rem;
    background: linear-gradient(135deg, #c89205, #d67832);
}

.floating-toggle.is-hidden,
.speed-widget.is-hidden,
.speed-launcher.is-hidden {
    display: none !important;
}

@keyframes soulOrbSpin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes soulThinkingSweep {
    to {
        transform: translateX(100%);
    }
}

@media (max-width: 900px) {
    .soul-orb-launcher {
        right: 0.75rem;
        bottom: calc(17.8rem + env(safe-area-inset-bottom, 0px));
        width: 52px;
        height: 52px;
    }

    .soul-quick-overlay {
        padding: 0;
        overflow: hidden;
        place-items: stretch;
    }

    .soul-quick-shell {
        display: block;
        width: 100%;
        height: 100dvh;
        max-height: 100dvh;
        border-radius: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .soul-quick-rail {
        position: sticky;
        top: 0;
        z-index: 5;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-rows: auto auto;
        padding: calc(env(safe-area-inset-top, 0px) + 0.85rem) 0.85rem 0.85rem;
        gap: 0.75rem;
    }

    .soul-quick-rail > div:first-child .field-note {
        display: none;
    }

    .soul-quick-rail h3 {
        font-size: 1.08rem;
    }

    .soul-new-chat {
        align-self: center;
        white-space: nowrap;
    }

    .soul-quick-conversations {
        grid-column: 1 / -1;
        display: flex;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0 0 0.2rem;
    }

    .soul-conversation-pill {
        min-width: 220px;
    }

    .soul-quick-main {
        min-height: auto;
        padding: 0.85rem;
        overflow: visible;
        grid-template-rows: none;
    }

    .soul-quick-topbar {
        align-items: flex-start;
    }

    .soul-quick-actions .btn {
        display: none;
    }

    .soul-quick-insights {
        display: flex;
        overflow-x: auto;
        padding-bottom: 0.2rem;
        scroll-snap-type: x proximity;
    }

    .soul-quick-insights article {
        min-width: 9.2rem;
        scroll-snap-align: start;
    }

    .soul-quick-grid {
        display: flex;
        flex-direction: column;
        min-height: auto;
    }

    .soul-quick-side {
        display: grid;
        overflow: visible;
        padding-right: 0;
    }

    .soul-quick-bubble {
        width: 100%;
        border-radius: 18px;
    }

    .soul-quick-chat {
        min-height: auto;
    }

    .soul-quick-log {
        min-height: 240px;
        max-height: 44dvh;
        overflow-y: auto;
    }

    .soul-quick-form {
        position: sticky;
        bottom: calc(env(safe-area-inset-bottom, 0px) + 0.65rem);
        z-index: 4;
        box-shadow: 0 18px 36px rgba(18, 38, 58, 0.14);
    }

    .soul-tokenizer {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.15rem;
    }
}

.app-page-aside {
    display: grid;
    gap: 1rem;
}

.hero-library-preview {
    display: grid;
    gap: 0.9rem;
    min-width: 0;
}

.hero-library-preview-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
}

.hero-library-preview-copy {
    margin: 0;
    color: var(--ink-soft);
    font-size: 0.94rem;
}

.hero-preview-list {
    display: grid;
    gap: 0.75rem;
}

.hero-preview-item {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 0.8rem;
    align-items: center;
    padding: 0.75rem;
    border-radius: 20px;
    border: 1px solid rgba(18, 38, 58, 0.08);
    background: rgba(255, 255, 255, 0.5);
}

.hero-preview-item img {
    width: 56px;
    height: 80px;
    object-fit: cover;
    border-radius: 14px;
    box-shadow: 0 12px 24px rgba(18, 38, 58, 0.14);
}

.hero-preview-meta {
    display: grid;
    gap: 0.14rem;
    min-width: 0;
}

.hero-preview-title {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    color: var(--ink);
    font-size: 1.02rem;
    font-weight: 800;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.hero-preview-text {
    display: -webkit-box;
    overflow: hidden;
    margin: 0;
    color: var(--ink-soft);
    font-size: 0.84rem;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.split-grid,
.dual-panel-grid {
    display: grid;
    gap: 1.2rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.stack-grid {
    display: grid;
    gap: 1.2rem;
}

.kpi-grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.kpi-card {
    padding: 1.15rem 1.2rem;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.42);
    background: rgba(255, 255, 255, 0.48);
    backdrop-filter: blur(16px);
}

.kpi-label {
    display: block;
    margin-bottom: 0.35rem;
    color: var(--ink-soft);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.kpi-value {
    display: block;
    font-size: clamp(1.6rem, 2.2vw, 2.1rem);
    font-weight: 800;
    color: var(--ink);
}

.soft-panel {
    padding: 1.2rem;
    border-radius: 24px;
    border: 1px solid rgba(255, 255, 255, 0.34);
    background: rgba(255, 255, 255, 0.42);
    box-shadow: 0 18px 40px rgba(17, 36, 51, 0.1);
    backdrop-filter: blur(16px);
}

.form-shell {
    display: grid;
    gap: 1.25rem;
}

.form-grid {
    display: grid;
    gap: 1rem 1.1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.form-grid-single {
    grid-template-columns: 1fr;
}

.form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.field-stack {
    display: grid;
    gap: 1rem;
}

.field-note,
.helper-note {
    margin: 0;
    color: var(--ink-soft);
    font-size: 0.95rem;
}

.scanner-panel {
    display: grid;
    gap: 1rem;
}

.scanner-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) auto;
    gap: 1rem;
    align-items: end;
}

.scanner-field-group {
    display: grid;
    gap: 0.45rem;
}

.scanner-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.75rem;
}

.scanner-actions .btn {
    min-width: 168px;
}

.scanner-preview-shell {
    position: relative;
    overflow: hidden;
    min-height: 260px;
    border-radius: 28px;
    border: 1px solid rgba(18, 38, 58, 0.1);
    background: linear-gradient(180deg, rgba(7, 28, 47, 0.96), rgba(9, 42, 64, 0.88));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 18px 38px rgba(18, 38, 58, 0.12);
}

.scanner-video {
    display: block;
    width: 100%;
    min-height: 260px;
    height: 100%;
    object-fit: cover;
    background: #071c2f;
}

.scanner-library-root {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: inherit;
    background: #071c2f;
}

.scanner-library-root > div,
.scanner-library-root video,
.scanner-library-root canvas,
.scanner-library-root img {
    width: 100% !important;
    height: 100% !important;
}

.scanner-library-root video,
.scanner-library-root canvas {
    object-fit: cover;
}

.scanner-library-root img {
    object-fit: contain;
    background: #071c2f;
}

.scanner-frame {
    position: absolute;
    top: 50%;
    left: 50%;
    width: min(72%, 380px);
    height: min(42%, 180px);
    max-width: calc(100% - 2rem);
    max-height: calc(100% - 2rem);
    transform: translate(-50%, -50%);
    border: 2px solid rgba(255, 255, 255, 0.92);
    border-radius: 22px;
    box-shadow: 0 0 0 999px rgba(4, 16, 27, 0.3);
}

.scanner-status {
    margin: 0;
    padding: 0.9rem 1rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.48);
    color: var(--ink-soft);
    font-weight: 600;
}

.scanner-status[data-tone="success"] {
    color: #14513f;
    background: rgba(227, 245, 236, 0.92);
}

.scanner-status[data-tone="warning"] {
    color: #7a4d0b;
    background: rgba(255, 244, 219, 0.94);
}

.scanner-status[data-tone="error"] {
    color: #8c1d2d;
    background: rgba(252, 232, 236, 0.94);
}

.scanner-hint-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.85rem;
}

.scanner-hint-card {
    padding: 0.95rem 1rem;
    border-radius: 22px;
    border: 1px solid rgba(18, 38, 58, 0.08);
    background: rgba(255, 255, 255, 0.48);
}

.scanner-hint-card strong {
    display: block;
    margin-bottom: 0.28rem;
    color: var(--ink);
}

.scanner-hint-card p {
    margin: 0;
    color: var(--ink-soft);
    font-size: 0.92rem;
}

.profile-grid {
    display: grid;
    gap: 1.2rem;
    grid-template-columns: minmax(0, 1.15fr) minmax(380px, 0.85fr);
}

.profile-avatar-card {
    text-align: center;
}

.profile-avatar {
    width: 124px;
    height: 124px;
    object-fit: cover;
    border-radius: 50%;
    border: 3px solid rgba(255, 255, 255, 0.72);
    box-shadow: 0 18px 34px rgba(18, 38, 58, 0.16);
}

.profile-avatar-inline {
    width: 92px;
    height: 92px;
}

.settings-field-avatar {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0.85rem 1rem;
}

.detail-list {
    display: grid;
    gap: 0.8rem;
}

.detail-item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 0.95rem 1rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.46);
    border: 1px solid rgba(18, 38, 58, 0.06);
}

.detail-item strong {
    color: var(--ink);
}

.detail-item span,
.detail-item a {
    color: var(--ink-soft);
    text-align: right;
}

.news-grid {
    display: grid;
    gap: 1.15rem;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.news-card {
    height: 100%;
}

.news-card .card-body {
    display: grid;
    gap: 0.9rem;
    padding: 1.45rem;
}

.news-card h4 {
    margin: 0;
    font-size: 2rem;
    color: var(--ink);
}

.news-card p {
    margin: 0;
    color: var(--ink-soft);
}

.checklist-grid {
    display: grid;
    gap: 0.8rem;
}

.checklist-option {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.95rem 1rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.48);
    border: 1px solid rgba(18, 38, 58, 0.08);
}

.checklist-option input[type="checkbox"] {
    width: 1.1rem;
    height: 1.1rem;
    accent-color: var(--primary);
}

.checklist-option label {
    margin: 0;
    font-weight: 700;
    color: var(--ink);
}

.position-checklist-option {
    align-items: flex-start;
}

.position-option-content {
    display: grid;
    gap: 0.45rem;
    min-width: 0;
}

.position-option-metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.position-option-metric {
    display: inline-flex;
    align-items: center;
    padding: 0.32rem 0.58rem;
    border-radius: 999px;
    background: rgba(31, 122, 112, 0.08);
    color: var(--ink-soft);
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.2;
}

.progress-shell {
    display: grid;
    gap: 0.55rem;
    margin-top: 1rem;
}

.progress-caption {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    color: var(--ink-soft);
    font-size: 0.92rem;
    font-weight: 700;
}

.progress-track {
    width: 100%;
    height: 12px;
    border-radius: 999px;
    background: rgba(18, 38, 58, 0.08);
    overflow: hidden;
}

.progress-track > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--accent), var(--primary));
}

.note-editor {
    display: grid;
    gap: 0.7rem;
    margin-top: 1rem;
}

.tag-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.42rem 0.75rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.52);
    color: var(--ink-soft);
    font-size: 0.84rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.year-divider {
    margin: 0.75rem 0 0.15rem;
}

.year-divider .section-title {
    font-size: clamp(2rem, 3vw, 2.7rem);
}

.rotating-stats {
    margin-top: 6rem;
}

.rotating-stats-shell {
    padding: 1.4rem 1.2rem;
    border-radius: 28px;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.42);
    background: rgba(255, 255, 255, 0.34);
    box-shadow: var(--surface-shadow);
    backdrop-filter: blur(16px);
}

.rotating-stat {
    display: none;
    margin: 0;
    font-size: clamp(1.55rem, 2.2vw, 2.15rem);
    font-weight: 700;
    color: var(--ink);
}

.section-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 55%);
    pointer-events: none;
}

.section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.4rem;
}

.hero-eyebrow {
    margin-bottom: 0.45rem;
    color: var(--accent);
    font-size: 0.82rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.22em;
}

.page-title,
.section-title,
.auth-card h1 {
    display: inline-block;
    margin-bottom: 0.3rem;
    color: transparent;
    background: var(--title-gradient);
    -webkit-background-clip: text;
    background-clip: text;
}

.section-title {
    font-size: clamp(2.3rem, 3vw, 3rem);
}

.section-description {
    margin: 0;
    max-width: 520px;
    color: var(--ink-soft);
    font-size: 1.02rem;
}

.book-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.9fr);
    gap: 1.6rem;
    align-items: end;
    padding: 2rem;
    border: 1px solid rgba(255, 255, 255, 0.48);
    border-radius: 38px;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.6), rgba(255, 252, 247, 0.34));
    box-shadow: var(--surface-shadow-strong);
    backdrop-filter: blur(24px);
    overflow: hidden;
}

.book-hero > * {
    position: relative;
    z-index: 1;
}

.book-hero::after {
    content: "";
    position: absolute;
    width: 380px;
    height: 380px;
    right: -80px;
    bottom: -180px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(31, 122, 112, 0.16), transparent 70%);
    pointer-events: none;
    z-index: 0;
}

.book-hero h1 {
    max-width: 9ch;
    margin-bottom: 0.7rem;
    font-size: clamp(3.6rem, 5vw, 5.4rem);
    line-height: 0.92;
}

.book-hero p:last-child {
    max-width: 48rem;
    margin-bottom: 0;
    color: var(--ink-soft);
    font-size: 1.05rem;
}

.book-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    justify-content: flex-end;
}

.hero-library-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-top: 1.1rem;
    max-width: 60rem;
}

.hero-library-stats span {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 42px;
    padding: 0.55rem 0.78rem;
    border-radius: 999px;
    border: 1px solid rgba(18, 38, 58, 0.08);
    background: rgba(255, 255, 255, 0.58);
    color: var(--ink-soft);
    font-weight: 800;
    box-shadow: 0 10px 24px rgba(18, 38, 58, 0.08);
}

.hero-library-stats strong {
    color: var(--ink);
}

.library-panel-toggle {
    min-width: 240px;
}

.library-panel {
    margin-top: 1.5rem;
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.28s ease, transform 0.28s ease;
}

.library-panel[hidden] {
    display: none !important;
}

.library-panel.is-open {
    opacity: 1;
    transform: translateY(0);
}

.book-search-shell {
    display: grid;
    gap: 1rem;
}

.live-search-shell {
    position: relative;
    z-index: 1;
    isolation: isolate;
}

.live-search-shell.is-preview-open {
    z-index: 1802;
}

.book-search-form {
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
}

.search-input-wrap {
    position: relative;
    flex: 1 1 260px;
    z-index: 1803;
}

.search-input-wrap i {
    position: absolute;
    top: 50%;
    left: 1rem;
    transform: translateY(-50%);
    color: var(--ink-soft);
}

.search-input-wrap .form-control {
    padding-left: 2.9rem;
}

.search-results-grid {
    display: grid;
    gap: 1rem;
}

.sort-toolbar-panel {
    display: grid;
    gap: 1rem;
}

.sort-toolbar-form {
    display: grid;
    gap: 1rem;
    align-items: end;
}

.sort-control-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.sort-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.search-preview {
    position: absolute;
    top: calc(100% + 0.7rem);
    left: 0;
    right: 0;
    z-index: 1805;
    display: none;
    max-height: min(58vh, 340px);
    overflow: auto;
    padding: 0.45rem;
    border: 1px solid rgba(18, 38, 58, 0.1);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 18px 38px rgba(17, 36, 51, 0.16);
    backdrop-filter: blur(20px);
}

.search-preview.is-portaled {
    position: fixed;
    inset: auto auto auto auto;
    right: auto;
    z-index: 2147483000;
}

.search-preview.is-open {
    display: block;
}

.search-preview-list {
    display: grid;
    gap: 0.35rem;
}

.search-preview-item {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.6rem;
    width: 100%;
    padding: 0.5rem 0.55rem;
    border: 0;
    border-radius: 14px;
    color: var(--ink);
    text-align: left;
    text-decoration: none;
    background: rgba(245, 249, 252, 0.82);
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.search-preview-item:hover,
.search-preview-item:focus {
    color: var(--ink);
    text-decoration: none;
    background: rgba(31, 122, 112, 0.1);
    transform: translateY(-1px);
}

.search-preview-thumb {
    width: 42px;
    height: 58px;
    object-fit: cover;
    border-radius: 10px;
    box-shadow: 0 10px 18px rgba(18, 38, 58, 0.14);
}

.search-preview-meta {
    display: grid;
    gap: 0.08rem;
    min-width: 0;
}

.search-preview-title {
    display: -webkit-box;
    overflow: hidden;
    font-size: 0.96rem;
    font-weight: 800;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.search-preview-text {
    display: -webkit-box;
    overflow: hidden;
    color: var(--ink-soft);
    font-size: 0.8rem;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.search-preview-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 999px;
    background: rgba(31, 122, 112, 0.08);
    color: var(--primary);
    font-size: 0.82rem;
    font-weight: 800;
}

.search-preview-empty {
    padding: 1rem;
    text-align: center;
    color: var(--ink-soft);
}

.search-result-card .card-body {
    padding: 1.3rem 1.4rem;
}

.search-result-card h5,
.search-result-card .card-title {
    margin-bottom: 0.5rem;
    font-size: 2rem;
}

.reading-shell .segnalibro-container {
    width: 100% !important;
    padding-top: 0.25rem;
}

.reading-shell .segnalibro {
    border-radius: 26px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    box-shadow: 0 18px 40px rgba(17, 36, 51, 0.18);
}

.library-list {
    display: grid;
    gap: 1.25rem;
    margin-top: 1.5rem;
}

.library-entry {
    overflow: hidden;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.7), rgba(251, 248, 243, 0.42));
}

.library-entry .card-body {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    align-items: flex-start;
    padding: 1.55rem;
}

.book-cover-column {
    flex: 0 0 160px;
    display: flex;
    justify-content: center;
}

.cover-image {
    width: 100%;
    max-width: 160px;
    height: 228px;
    object-fit: cover;
    border-radius: 24px;
    box-shadow: 0 16px 32px rgba(18, 38, 58, 0.18);
}

.lazy-load {
    opacity: 0;
    transition: opacity 0.35s ease;
}

.lazy-load.loaded {
    opacity: 1;
}

.book-summary {
    flex: 1 1 440px;
}

.book-header-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.book-title {
    margin: 0;
    font-size: clamp(2.2rem, 2.4vw, 2.8rem);
    color: var(--ink);
}

.book-author {
    margin: 0.22rem 0 0;
    color: var(--ink-soft);
    font-weight: 700;
}

.book-meta-grid,
.book-detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(138px, 1fr));
    gap: 0.84rem;
}

.book-meta-grid {
    margin-top: 1.15rem;
}

.meta-pill {
    padding: 0.95rem 1rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.48);
    border: 1px solid rgba(18, 38, 58, 0.06);
    backdrop-filter: blur(16px);
}

.meta-label {
    display: block;
    margin-bottom: 0.22rem;
    color: var(--ink-soft);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.meta-value {
    display: block;
    font-weight: 700;
    word-break: break-word;
}

.book-link {
    word-break: break-all;
}

.btn-details {
    min-width: 150px;
}

.library-entry-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
    margin-top: 1rem;
}

.library-entry-actions .btn {
    min-width: 130px;
}

.library-entry-actions form {
    margin: 0;
}

.library-entry.is-emphasized {
    border-color: rgba(31, 122, 112, 0.4);
    box-shadow: 0 22px 56px rgba(31, 122, 112, 0.2), var(--surface-shadow-strong);
}

.library-collapse .card.card-body {
    padding: 1.25rem;
    background: linear-gradient(180deg, rgba(252, 249, 244, 0.88), rgba(255, 255, 255, 0.62));
    border-radius: 24px;
    border: 1px dashed rgba(18, 38, 58, 0.12);
}

.icon-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
    align-items: center;
    margin-top: 1rem;
    color: var(--ink-soft);
}

.icon-strip i {
    font-size: 1.15rem;
}

.empty-state {
    padding: 2.1rem 1.5rem;
    text-align: center;
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.58);
    color: var(--ink-soft);
    backdrop-filter: blur(16px);
}

.workspace-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
    align-items: start;
}

.collection-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem;
}

.collection-card {
    display: grid;
    gap: 0.95rem;
    padding: 1rem;
    border-radius: 26px;
    border: 1px solid rgba(18, 38, 58, 0.08);
    background: rgba(255, 255, 255, 0.48);
    box-shadow: 0 18px 36px rgba(18, 38, 58, 0.08);
}

.collection-book-list {
    display: grid;
    gap: 1rem;
}

.credentials-card {
    border: 1px solid rgba(31, 122, 112, 0.2);
    background: linear-gradient(180deg, rgba(238, 250, 247, 0.95), rgba(255, 255, 255, 0.88));
}

.student-stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 0.85rem;
}

.workspace-feature-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1rem;
}

.workspace-feature-card {
    display: grid;
    gap: 0.8rem;
    padding: 1rem;
    border-radius: 26px;
    border: 1px solid rgba(18, 38, 58, 0.08);
    background: rgba(255, 255, 255, 0.48);
    box-shadow: 0 18px 36px rgba(18, 38, 58, 0.08);
}

.workspace-feature-card p {
    margin: 0;
    color: var(--ink-soft);
}

.filters-collapsible {
    display: none;
    margin-bottom: 1.35rem;
}

.filters-collapsible.is-open {
    display: block;
}

.section-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.ordered-results-toolbar {
    margin: 0.35rem 0 1.25rem;
}

.filter-toolbar-heading {
    margin-top: 1.85rem;
}

.toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.trasloco-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.48fr) minmax(310px, 0.78fr);
    gap: 1.25rem;
    align-items: start;
}

.trasloco-layout > * {
    min-width: 0;
}

.sticky-summary {
    position: sticky;
    top: 6.8rem;
}

.position-list-scroll {
    max-height: 430px;
    overflow: auto;
    padding-right: 0.35rem;
}

.transfer-mode-card {
    display: grid;
    gap: 1rem;
}

.position-builder {
    display: grid;
    gap: 0.9rem;
}

.position-builder-preview {
    display: grid;
    gap: 0.3rem;
    padding: 0.95rem 1rem;
    border-radius: 22px;
    border: 1px solid rgba(18, 38, 58, 0.08);
    background: rgba(255, 255, 255, 0.52);
}

.position-builder-preview strong {
    font-size: 1rem;
    line-height: 1.45;
    color: var(--ink);
}

.position-option-content {
    display: grid;
    gap: 0.35rem;
}

.position-option-path {
    color: var(--ink-soft);
    font-size: 0.92rem;
    line-height: 1.5;
}

.selection-queue {
    display: grid;
    gap: 0.8rem;
}

.transfer-shortlist-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 0.9rem;
}

.transfer-shortlist-scroll {
    max-height: min(70vh, 980px);
    overflow: auto;
    padding-right: 0.35rem;
}

.transfer-shortlist-card {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.8rem;
    width: 100%;
    padding: 0.85rem;
    border: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.52);
    color: var(--ink);
    text-align: left;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.transfer-shortlist-card:hover {
    transform: translateY(-2px);
    border-color: rgba(31, 122, 112, 0.2);
    box-shadow: 0 18px 34px rgba(18, 38, 58, 0.12);
}

.transfer-shortlist-card img {
    width: 58px;
    height: 80px;
    object-fit: cover;
    border-radius: 14px;
    box-shadow: 0 12px 24px rgba(18, 38, 58, 0.16);
}

.transfer-shortlist-meta {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

.transfer-shortlist-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 800;
}

.transfer-shortlist-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--ink-soft);
    font-size: 0.88rem;
}

.transfer-shortlist-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: rgba(31, 122, 112, 0.08);
    color: var(--primary);
    font-size: 0.92rem;
    font-weight: 800;
}

.selection-queue-empty {
    padding: 1rem;
    border-radius: 18px;
    color: var(--ink-soft);
    background: rgba(255, 255, 255, 0.42);
    text-align: center;
}

.selected-book-item {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.5);
    border: 1px solid rgba(18, 38, 58, 0.08);
}

.selected-book-item img {
    width: 52px;
    height: 72px;
    object-fit: cover;
    border-radius: 12px;
}

.selected-book-meta {
    display: grid;
    gap: 0.1rem;
    min-width: 0;
}

.selected-book-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 800;
}

.selected-book-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--ink-soft);
    font-size: 0.9rem;
}

.stats-stack {
    display: grid;
    gap: 1rem;
}

.stats-note-list {
    display: grid;
    gap: 0.7rem;
}

.stats-note-list .detail-item {
    padding: 0.85rem 0.95rem;
}

.auth-page {
    padding-bottom: 0;
}

.auth-shell {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    overflow: hidden;
}

.auth-media {
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        linear-gradient(140deg, rgba(7, 19, 31, 0.72), rgba(7, 19, 31, 0.45)),
        url('../img/bookhye-wallpaper.jpg') center/cover no-repeat;
}

.auth-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 20% 18%, rgba(214, 120, 50, 0.28), transparent 28%),
        radial-gradient(circle at 80% 18%, rgba(31, 122, 112, 0.28), transparent 24%);
}

.auth-media video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.35;
}

.auth-card {
    width: min(100%, 560px);
    padding: 2.2rem;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 34px;
    color: #fff;
    background: rgba(8, 20, 31, 0.56);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(22px);
}

.auth-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.auth-brand {
    display: inline-block;
    width: min(100%, 280px);
    margin-bottom: 1rem;
}

.auth-topbar .auth-brand {
    margin-bottom: 0;
}

.auth-card p,
.auth-card label,
.auth-card .small {
    color: rgba(255, 255, 255, 0.84);
}

.auth-card .hero-eyebrow {
    color: rgba(255, 203, 163, 0.92);
}

.auth-card .form-control {
    color: var(--ink);
    background: rgba(255, 255, 255, 0.92);
}

.auth-alert {
    margin-bottom: 1rem;
    padding: 0.95rem 1rem;
    border-radius: 18px;
    background: rgba(186, 74, 74, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #fff;
}

.auth-success {
    background: rgba(43, 141, 103, 0.18);
}

.auth-actions {
    display: grid;
    gap: 0.75rem;
    margin-top: 1.25rem;
}

.auth-support {
    margin-top: 1.25rem;
    text-align: center;
    font-size: 0.95rem;
}

.auth-support a {
    color: #fff;
    font-weight: 700;
}

.auth-benefit-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin: 1rem 0 1.2rem;
}

.auth-benefit-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.55rem 0.8rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.92rem;
    line-height: 1.4;
}

.auth-social-stack {
    display: grid;
    gap: 0.8rem;
    margin: 1.2rem 0 1.35rem;
}

.auth-social-grid {
    display: grid;
    gap: 0.7rem;
}

.oauth-provider-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    min-height: 56px;
    font-weight: 800;
}

.oauth-provider-btn span {
    display: inline-flex;
    align-items: center;
}

.oauth-provider-btn i {
    font-size: 1rem;
}

.oauth-provider-btn.is-disabled {
    pointer-events: none;
    opacity: 0.68;
}

.oauth-provider-google {
    border-color: rgba(255, 255, 255, 0.18);
}

.oauth-provider-meta {
    border-color: rgba(77, 126, 246, 0.28);
}

.oauth-provider-apple {
    border-color: rgba(255, 255, 255, 0.22);
}

.auth-social-note {
    color: rgba(255, 255, 255, 0.78);
}

.auth-card .oauth-provider-btn {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow: none;
}

.auth-card .oauth-provider-btn:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
}

.public-language-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.24rem;
    border-radius: 999px;
    border: 1px solid rgba(18, 38, 58, 0.1);
    background: rgba(255, 255, 255, 0.78);
    box-shadow: 0 12px 24px rgba(18, 38, 58, 0.08);
    backdrop-filter: blur(18px);
}

.public-language-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 46px;
    padding: 0.46rem 0.72rem;
    border-radius: 999px;
    color: var(--ink-soft);
    font-size: 0.84rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    transition: background-color 0.22s ease, color 0.22s ease, transform 0.22s ease;
}

.public-language-link:hover {
    color: var(--ink);
    transform: translateY(-1px);
}

.public-language-link.is-active {
    color: #fff;
    background: linear-gradient(135deg, rgba(31, 122, 112, 0.92), rgba(17, 93, 113, 0.92));
    box-shadow: 0 10px 20px rgba(17, 93, 113, 0.18);
}

.auth-card .public-language-toggle {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.14);
    box-shadow: none;
}

.auth-card .public-language-link {
    color: rgba(255, 255, 255, 0.74);
}

.auth-card .public-language-link:hover {
    color: #fff;
}

.auth-card .public-language-link.is-active {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    box-shadow: none;
}

.footer-shell .fixed-bottom {
    z-index: 1030;
    padding: 0.9rem 1rem 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.4);
    background: rgba(247, 249, 252, 0.68);
    box-shadow: 0 -18px 30px rgba(18, 38, 58, 0.1);
    backdrop-filter: blur(18px);
}

.footer-shell p {
    margin-bottom: 0.5rem;
    color: var(--ink-soft);
    font-weight: 700;
}

.footer-progress-copy {
    font-size: 0.92rem;
    opacity: 0.92;
}

.modal-content {
    border: 1px solid rgba(255, 255, 255, 0.42);
    border-radius: 28px;
    background: rgba(248, 244, 238, 0.94);
    box-shadow: var(--surface-shadow-strong);
    backdrop-filter: blur(18px);
}

.modal-header,
.modal-footer {
    border-color: rgba(18, 38, 58, 0.08);
}

.progress {
    height: 10px !important;
    border-radius: 999px;
    background: rgba(18, 38, 58, 0.08);
}

.progress-bar {
    transition: width 0.5s ease-in-out;
    background-image: linear-gradient(90deg, var(--accent), var(--primary)) !important;
}

.table-hover tbody tr {
    transition: background-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out;
}

.table-hover tbody tr:hover {
    background-color: rgba(31, 122, 112, 0.08) !important;
}

#dark-overlay {
    position: fixed;
    inset: 0;
    z-index: 9998;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(6, 18, 30, 0.72);
    backdrop-filter: blur(10px);
    opacity: 0;
    transition: opacity 0.35s ease;
}

#loading-logo {
    display: none;
    align-items: center;
    gap: 0.85rem;
    padding: 1rem 1.25rem;
    border-radius: 999px;
    color: #fff;
    font-weight: 700;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(16px);
}

.loading-spinner {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #fff;
    animation: spinLoader 0.85s linear infinite;
}

html.js-ui.reveal-ready .reveal-on-scroll {
    opacity: 0;
    transform: translateY(34px) scale(0.985);
    filter: blur(8px);
    transition:
        opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        filter 0.65s cubic-bezier(0.22, 1, 0.36, 1);
}

html.js-ui.reveal-ready .reveal-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
}

body.is-scroll-active .ambient-background::before,
body.is-scroll-active .ambient-background::after {
    filter: blur(18px);
}

@media (max-width: 1400px) {
    .trasloco-layout {
        grid-template-columns: 1fr;
    }

    .sticky-summary {
        position: static;
    }

    .soul-layout,
    .soul-signal-grid,
    .soul-hero {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1279px) {
    .primary-menu {
        display: flex;
        grid-template-columns: none;
        padding-bottom: 0.8rem;
        gap: 0.8rem;
        flex-wrap: wrap;
    }

    .primary-menu.is-open {
        position: fixed;
        inset: 0;
        z-index: 10050;
        min-height: 100dvh;
        max-height: 100dvh;
        margin: 0 !important;
        padding:
            calc(env(safe-area-inset-top, 0px) + 0.9rem)
            0.8rem
            calc(env(safe-area-inset-bottom, 0px) + 1rem);
        align-content: flex-start;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        border-radius: 0;
        background: linear-gradient(135deg, rgba(7, 28, 47, 0.97), rgba(12, 72, 81, 0.92) 58%, rgba(24, 111, 91, 0.84));
    }

    .primary-menu.is-open .menu-top-row {
        position: sticky;
        top: 0;
        z-index: 2;
        padding-bottom: 0.6rem;
        background: inherit;
    }

    .menu-top-row {
        width: 100%;
        justify-content: space-between;
    }

    .menu-top-row .tag-row {
        display: none;
    }

    .menu-brand img {
        width: clamp(150px, 24vw, 220px);
    }

    .menu-brand img.menu-brand-mark {
        width: clamp(36px, 8vw, 46px);
        height: clamp(36px, 8vw, 46px);
    }

    .menu-brand img.menu-brand-wordmark {
        width: clamp(132px, 20vw, 184px);
    }

    .menu-mobile-toggle {
        display: inline-flex !important;
        flex: 0 0 52px;
        margin-left: auto;
    }

    .menu-actions {
        display: none !important;
        width: 100%;
        flex-direction: column;
        gap: 0.7rem;
        padding-top: 0.3rem;
        margin-left: 0;
    }

    .primary-menu.is-open .menu-actions {
        display: flex !important;
        align-content: flex-start;
        padding-bottom: 1rem;
    }

    .menu-actions .btn,
    .menu-actions .btn-group {
        width: 100%;
        margin: 0 !important;
    }

    .menu-actions .menu-dropdown-group {
        display: block;
    }

    .menu-actions .menu-dropdown-group:not(.menu-tools-group) {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 68px;
        gap: 0.55rem;
        align-items: stretch;
    }

    .menu-actions .btn-group > .btn {
        width: auto;
        min-width: 0;
        margin: 0 !important;
    }

    .menu-actions .menu-tools-group > .btn {
        width: 100%;
    }

    .menu-actions .menu-dropdown-group:not(.menu-tools-group) .drop-menu-custom {
        grid-column: 1 / -1;
    }

    .primary-menu .menu-actions .btn-group .btn-warning {
        color: #fff;
        background: linear-gradient(135deg, rgba(214, 120, 50, 0.36), rgba(214, 120, 50, 0.2));
        border-color: rgba(243, 177, 115, 0.3);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
    }

    .primary-menu .menu-actions .btn-group .btn-warning:hover {
        background: linear-gradient(135deg, rgba(214, 120, 50, 0.46), rgba(214, 120, 50, 0.28));
    }

    .menu-actions .btn-group .dropdown-toggle-split {
        justify-content: center;
        padding-left: 0;
        padding-right: 0;
    }

    .menu-actions .btn-group .dropdown-toggle-split::after {
        margin-left: 0;
    }

    .book-hero {
        grid-template-columns: 1fr;
    }

    .book-hero-actions {
        justify-content: flex-start;
    }

    .drop-menu-custom {
        position: static !important;
        left: 0 !important;
        right: auto !important;
        width: 100%;
        margin-top: 0.55rem;
        max-height: min(42dvh, 360px);
        overflow-y: auto;
        padding: 0.5rem;
        border-radius: 22px;
        background: rgba(11, 42, 58, 0.72);
        border-color: rgba(255, 255, 255, 0.1);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
    }

    .drop-menu-custom .dropdown-item {
        color: #fff;
        background: rgba(255, 255, 255, 0.04);
    }

    .drop-menu-custom .dropdown-item:hover {
        background: rgba(255, 255, 255, 0.12);
    }

    .split-grid,
    .dual-panel-grid,
    .profile-grid,
    .form-grid,
    .workspace-grid,
    .collection-grid {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 1280px) {
    .menu-mobile-toggle {
        display: none !important;
    }

    .menu-actions {
        display: flex !important;
    }
}

@media (max-width: 767px) {
    body {
        padding-bottom: 6.5rem;
    }

    .floating-stack {
        left: 0.7rem;
        bottom: calc(10.35rem + env(safe-area-inset-bottom, 0px));
    }

    .floating-action,
    .floating-toggle,
    .speed-launcher,
    .clean-view-toggle {
        width: 48px;
        height: 48px;
    }

    .clean-view-toggle {
        right: 0.7rem;
        bottom: calc(10.35rem + env(safe-area-inset-bottom, 0px));
    }

    .speed-launcher {
        right: 0.7rem;
        bottom: calc(14.05rem + env(safe-area-inset-bottom, 0px));
    }

    .soul-orb-launcher {
        right: 0.7rem;
        bottom: calc(17.75rem + env(safe-area-inset-bottom, 0px));
        width: 50px;
        height: 50px;
    }

    .bookyhe-clean-view .clean-view-toggle {
        bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
    }

    .primary-menu {
        gap: 0.5rem;
        padding: 0.9rem 0.8rem;
    }

    .menu-top-row {
        width: 100%;
        align-items: center;
        justify-content: space-between;
    }

    .menu-actions {
        width: 100%;
        gap: 0.4rem;
    }

    .hero-library-preview-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .menu-actions .btn,
    .menu-actions .btn-group {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .settings-row {
        align-items: flex-start;
    }

    .section-shell,
    .book-hero,
    .auth-card {
        padding: 1.25rem;
        border-radius: 28px;
    }

    .page-title,
    .section-title,
    .auth-card h1 {
        line-height: 0.96;
    }

    .section-title {
        font-size: clamp(2rem, 8vw, 2.55rem);
    }

    .book-hero h1 {
        max-width: none;
        font-size: clamp(3rem, 15vw, 4.2rem);
    }

    .scroll-arrows {
        display: flex;
        justify-content: center;
        position: relative;
        margin: 1rem 0;
        z-index: 10;
    }

    .scroll-arrow {
        margin: 0 10px;
        font-size: 1.85rem;
        color: var(--primary);
        animation: moveArrows 2s infinite alternate;
    }

    .book-cover-column {
        flex-basis: 100%;
    }

    .cover-image {
        max-width: 190px;
    }

    .btn-details,
    .library-panel-toggle {
        width: 100%;
    }

    .drop-menu-custom {
        min-width: min(88vw, 320px);
    }

    .app-page-actions,
    .library-entry-actions {
        width: 100%;
    }

    .scanner-toolbar {
        grid-template-columns: 1fr;
    }

    .scanner-actions {
        justify-content: stretch;
    }

    .scanner-actions .btn {
        width: 100%;
    }

    .scanner-preview-shell,
    .scanner-video {
        min-height: 220px;
    }

    .scanner-frame {
        width: calc(100% - 1.6rem);
        height: 40%;
    }

    .soul-hero {
        gap: 1rem;
    }

    .soul-hero .page-title {
        font-size: clamp(2.55rem, 11vw, 3.35rem);
        line-height: 0.92;
    }

    .soul-hero .page-summary {
        font-size: 1rem;
        line-height: 1.68;
    }

    .soul-hero .tag-row,
    .soul-goal-card .tag-row,
    .soul-chat-shell .form-actions {
        gap: 0.65rem;
    }

    .soul-hero-orbit,
    .soul-status-strip .soul-signal-grid,
    .soul-path-shell,
    .soul-chat-shell {
        gap: 0.85rem;
    }

    .soul-goal-card .section-toolbar,
    .soul-path-card .section-toolbar {
        gap: 0.75rem;
    }

    .soul-goal-card .form-actions,
    .soul-suggestion-card,
    .soul-chat-shell .form-actions {
        gap: 0.75rem;
    }

    .soul-goal-card .form-actions form,
    .soul-suggestion-card form {
        width: 100%;
    }

    .soul-status-strip,
    .soul-layout .section-shell {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .position-builder-preview {
        padding: 0.85rem 0.9rem;
        border-radius: 18px;
    }

    .soul-hero-card strong {
        font-size: clamp(1.8rem, 11vw, 2.45rem);
    }

    .soul-path-card {
        grid-template-columns: 1fr;
    }

    .soul-path-marker {
        width: 52px;
        height: 52px;
        border-radius: 16px;
    }

    .soul-chat-bubble {
        width: 100%;
        padding: 0.9rem 0.95rem;
        border-radius: 20px;
    }

    .soul-chat-log {
        max-height: 54vh;
    }

    .library-entry-actions .btn,
    .form-actions .btn {
        width: 100%;
    }

    .detail-item {
        flex-direction: column;
    }

    .detail-item span,
    .detail-item a {
        text-align: left;
    }

    .search-preview-item,
    .selected-book-item {
        grid-template-columns: 46px minmax(0, 1fr);
    }

    .search-preview-action,
    .selected-book-item .btn {
        grid-column: 2;
        justify-self: start;
    }

    .search-preview {
        max-height: min(52vh, 300px);
    }

    .position-list-scroll {
        max-height: 320px;
    }

    .transfer-shortlist-scroll {
        max-height: min(58vh, 560px);
    }

    .floating-panel {
        left: 0.7rem;
        bottom: calc(4.8rem + env(safe-area-inset-bottom, 0px));
        width: calc(100vw - 1.4rem);
        max-height: min(64vh, 560px);
    }

    .speed-widget {
        right: 0.7rem;
        bottom: calc(10.35rem + env(safe-area-inset-bottom, 0px));
        width: calc(100vw - 1.4rem);
    }
}

@keyframes moveArrows {
    from {
        transform: translateX(-24px);
    }

    to {
        transform: translateX(24px);
    }
}

@keyframes spinLoader {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.auth-media-admin {
    background:
        linear-gradient(180deg, rgba(11, 30, 48, 0.4), rgba(11, 30, 48, 0.72)),
        radial-gradient(circle at top right, rgba(255, 191, 40, 0.24), transparent 38%),
        url("../img/4bookyhe.jpg") center/cover no-repeat;
}

.plan-editor-grid,
.form-grid-compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.switch-grid,
.feature-checklist,
.feature-tag-grid,
.tag-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.feature-checklist {
    gap: 0.9rem;
}

.checkbox-pill {
    display: inline-flex;
    align-items: flex-start;
    gap: 0.8rem;
    width: 100%;
    padding: 0.95rem 1rem;
    border-radius: 20px;
    border: 1px solid rgba(18, 38, 58, 0.1);
    background: rgba(255, 255, 255, 0.56);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.checkbox-pill input {
    margin-top: 0.25rem;
    transform: scale(1.08);
}

.checkbox-pill span {
    display: grid;
    gap: 0.18rem;
    color: var(--ink);
    font-weight: 700;
}

.checkbox-pill span small {
    color: var(--ink-soft);
    font-weight: 600;
}

.checkbox-pill-feature {
    max-width: min(100%, 330px);
}

.tag-chip-strong {
    color: #fff;
    background: linear-gradient(135deg, #1c84ff, #0e72e8);
}

.brand-logo-2026 {
    display: block;
    height: auto;
    object-fit: contain;
}

.brand-logo-plate {
    box-sizing: border-box;
    padding: 0.42rem 0.68rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(255, 255, 255, 0.64);
    box-shadow: 0 16px 36px rgba(7, 28, 47, 0.16);
}

.brand-logo-on-dark {
    filter:
        brightness(0)
        invert(1)
        drop-shadow(0 10px 24px rgba(255, 255, 255, 0.18))
        drop-shadow(0 18px 36px rgba(0, 0, 0, 0.28));
    opacity: 0.98;
}

.auth-brand .brand-logo-on-dark {
    width: min(100%, 330px);
}

.marketing-footer-brand .brand-logo-on-dark {
    width: min(250px, 38vw);
}

.menu-brand img.menu-brand-full {
    width: clamp(190px, 13vw, 270px);
    max-height: 64px;
}

.menu-brand .menu-brand-logo-plate {
    width: clamp(190px, 13vw, 270px);
    max-height: 70px;
    padding: 0.5rem 0.78rem;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.82);
    box-shadow:
        0 16px 34px rgba(4, 18, 30, 0.28),
        0 0 0 1px rgba(16, 120, 112, 0.08);
    filter: drop-shadow(0 8px 16px rgba(4, 18, 30, 0.14));
}

.footer-shell {
    width: 100%;
    display: flex;
    justify-content: center;
    clear: both;
}

.app-logo-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(100%, calc(100vw - 2rem));
    margin: 2.25rem auto 1rem !important;
    padding: 0.75rem 0 1rem;
    text-align: center;
}

.app-logo-footer .app-footer-logo-small,
.footer-shell .app-logo-footer img.app-footer-logo-small {
    display: block;
    width: min(142px, 32vw) !important;
    max-width: min(142px, 32vw) !important;
    height: auto !important;
    max-height: 46px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    filter: drop-shadow(0 14px 28px rgba(7, 28, 47, 0.12));
}

.social-dashboard {
    display: grid;
    grid-template-columns: minmax(270px, 350px) minmax(0, 1fr);
    gap: 1.1rem;
    align-items: start;
}

.social-share-panel {
    position: sticky;
    top: 6.4rem;
    max-height: calc(100vh - 7.2rem);
    overflow: auto;
}

.social-compact-heading {
    gap: 0.65rem;
}

.social-compact-heading .section-title {
    font-size: clamp(1.7rem, 3vw, 2.2rem);
}

.social-share-list,
.social-feed-list {
    display: grid;
    gap: 0.72rem;
}

.social-feed-heading {
    align-items: flex-start;
}

.social-feed-filter {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.28rem;
    border: 1px solid rgba(18, 38, 58, 0.1);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.62);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78);
}

.social-filter-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0.42rem 0.85rem;
    border-radius: 999px;
    color: var(--ink-soft);
    font-size: 0.82rem;
    font-weight: 900;
    text-decoration: none;
}

.social-filter-chip:hover,
.social-filter-chip.is-active {
    color: #fff;
    background: var(--teal);
}

.social-network-panel {
    display: grid;
    grid-template-columns: minmax(180px, 240px) minmax(0, 1fr);
    gap: 0.75rem;
    margin: 0.1rem 0 1rem;
}

.social-network-stats,
.social-suggestions {
    border: 1px solid rgba(18, 38, 58, 0.1);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.7);
    box-shadow: 0 16px 34px rgba(18, 38, 58, 0.08);
}

.social-network-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
}

.social-network-stats div {
    min-width: 0;
    padding: 0.85rem;
}

.social-network-stats div + div {
    border-left: 1px solid rgba(18, 38, 58, 0.08);
}

.social-network-stats span,
.social-suggestions-title,
.social-user-row span,
.social-reader-count {
    color: var(--ink-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.social-network-stats strong {
    display: block;
    margin-top: 0.15rem;
    color: var(--ink);
    font-size: 1.35rem;
    line-height: 1;
}

.social-suggestions {
    padding: 0.75rem;
}

.social-user-list {
    display: grid;
    gap: 0.48rem;
    margin-top: 0.55rem;
}

.social-user-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.65rem;
    margin: 0;
    padding: 0.55rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.68);
}

.social-user-row strong {
    display: block;
    color: var(--ink);
    font-size: 0.95rem;
    line-height: 1.15;
}

.social-user-row span {
    display: block;
    margin-top: 0.18rem;
    text-transform: none;
    letter-spacing: 0;
}

.social-share-option,
.social-feed-card {
    border: 1px solid rgba(18, 38, 58, 0.1);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: 0 16px 34px rgba(18, 38, 58, 0.09);
    backdrop-filter: blur(14px);
}

.social-share-option {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 0.72rem;
    align-items: center;
    padding: 0.7rem;
}

.social-share-option img {
    width: 54px;
    height: 78px;
    object-fit: cover;
    border-radius: 6px;
    box-shadow: 0 10px 18px rgba(7, 28, 47, 0.14);
}

.social-share-option h3,
.social-feed-card h3 {
    margin: 0.38rem 0 0.18rem;
    color: var(--ink);
    font-size: 1rem;
    line-height: 1.2;
}

.social-share-option p,
.social-feed-card p {
    margin: 0;
    color: var(--ink-soft);
    font-size: 0.9rem;
    font-weight: 700;
}

.social-share-option form {
    grid-column: 1 / -1;
}

.social-feed-card {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr) auto;
    gap: 0.9rem;
    align-items: start;
    padding: 0.82rem;
}

.social-feed-cover img {
    width: 72px;
    height: 104px;
    object-fit: cover;
    border-radius: 8px;
    box-shadow: 0 14px 24px rgba(7, 28, 47, 0.15);
}

.social-feed-body {
    min-width: 0;
}

.social-feed-topline,
.social-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.social-reader {
    color: var(--ink-soft);
    font-size: 0.86rem;
    font-weight: 800;
}

.social-reader-count {
    padding: 0.18rem 0.48rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.7);
    text-transform: none;
    letter-spacing: 0;
}

.social-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
    margin-top: 0.78rem;
}

.social-stat-grid div {
    min-width: 0;
    padding: 0.54rem 0.62rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.72);
}

.social-stat-grid span {
    display: block;
    color: var(--ink-muted);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.social-stat-grid strong {
    display: block;
    margin-top: 0.18rem;
    color: var(--ink);
    font-size: 0.9rem;
    line-height: 1.15;
}

.social-progress {
    margin-top: 0.78rem;
}

.social-actions {
    align-self: stretch;
    justify-content: flex-start;
    flex-direction: column;
    min-width: 136px;
    margin-top: 0;
}

.social-actions form,
.social-actions .btn {
    width: 100%;
}

.social-empty-compact {
    padding: 1rem;
}

@media (max-width: 991px) {
    .social-dashboard {
        grid-template-columns: 1fr;
    }

    .social-network-panel {
        grid-template-columns: 1fr;
    }

    .social-share-panel {
        position: static;
        max-height: none;
        overflow: visible;
    }
}

.bulk-import-panel {
    gap: 1.1rem;
}

.bulk-import-locked {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.bulk-import-locked h3 {
    margin: 0 0 0.35rem;
    color: var(--ink);
    font-size: 1.25rem;
}

.appmanager-command-center,
.appmanager-section {
    scroll-margin-top: 7.5rem;
}

.appmanager-command-grid {
    display: grid;
    gap: 1.15rem;
}

.appmanager-tab-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.appmanager-tab-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0.75rem 1.05rem;
    border-radius: 999px;
    border: 1px solid rgba(18, 38, 58, 0.12);
    background: rgba(255, 255, 255, 0.7);
    color: var(--ink);
    font-weight: 700;
    text-decoration: none;
    transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease, color 180ms ease;
}

.appmanager-tab-chip:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(18, 38, 58, 0.1);
}

.appmanager-tab-chip.is-active {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(135deg, #1c84ff, #0e72e8);
    box-shadow: 0 18px 36px rgba(14, 114, 232, 0.2);
}

.appmanager-section[hidden],
.appmanager-searchable[hidden] {
    display: none !important;
}

.code-textarea {
    min-height: 140px;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    font-size: 0.88rem;
    line-height: 1.5;
}

.technical-log-filter {
    margin-bottom: 1.1rem;
}

.technical-log-table-list,
.technical-log-timeline {
    display: grid;
    gap: 0.75rem;
}

.technical-log-source-row,
.technical-log-entry {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.95rem 1rem;
    border: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.5);
}

.technical-log-source-row > div:first-child,
.technical-log-entry-main {
    min-width: 0;
}

.technical-log-source-row strong,
.technical-log-entry strong {
    display: block;
    color: var(--ink);
}

.technical-log-source-row span,
.technical-log-entry time {
    color: var(--ink-soft);
}

.technical-log-source-meta,
.technical-log-entry-main {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.technical-log-type {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 86px;
    min-height: 34px;
    padding: 0.25rem 0.6rem;
    border-radius: 999px;
    background: linear-gradient(135deg, rgba(31, 122, 112, 0.14), rgba(28, 132, 255, 0.12));
    color: var(--primary-dark);
    font-size: 0.78rem;
    font-weight: 900;
}

.technical-log-entry time {
    flex: 0 0 auto;
    font-size: 0.86rem;
    font-weight: 700;
}

.technical-log-pre {
    max-height: 360px;
    margin: 0;
    padding: 1rem;
    overflow: auto;
    border-radius: 18px;
    background: rgba(8, 24, 36, 0.94);
    color: rgba(255, 255, 255, 0.86);
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
    font-size: 0.78rem;
    line-height: 1.55;
}

.catalog-entry {
    padding: 1rem 1.1rem;
    border-radius: 22px;
    border: 1px solid rgba(18, 38, 58, 0.08);
    background: rgba(255, 255, 255, 0.48);
}

.catalog-entry-main {
    display: grid;
    gap: 1rem;
}

.grid-two-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.2rem;
}

.pricing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.2rem;
}

.pricing-card {
    display: grid;
    gap: 1.15rem;
    min-height: 100%;
}

.pricing-card-current {
    border: 1px solid rgba(28, 132, 255, 0.22);
    box-shadow: 0 22px 44px rgba(16, 81, 152, 0.12);
}

.homepage-offer-grid {
    margin-bottom: 1.2rem;
}

.homepage-offer-card {
    border-color: rgba(31, 122, 112, 0.24);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.94), rgba(244, 251, 249, 0.9));
}

.homepage-offer-html {
    overflow: hidden;
}

.pricing-card-top {
    display: grid;
    gap: 0.4rem;
}

.pricing-amount {
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
    font-family: 'Cormorant Garamond', serif;
    color: var(--ink);
}

.pricing-amount strong {
    font-size: clamp(2.2rem, 4vw, 3.1rem);
    line-height: 1;
}

.pricing-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
}

.pricing-form {
    margin-top: auto;
}

.pricing-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.35rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.62);
    box-shadow: 0 18px 42px rgba(18, 38, 58, 0.08);
}

.pricing-toolbar p {
    margin: 0;
    max-width: 660px;
    color: var(--ink-soft);
    line-height: 1.55;
}

.pricing-billing-toggle {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    padding: 0.34rem;
    border-radius: 999px;
    background: rgba(13, 44, 64, 0.08);
}

.pricing-billing-button {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 42px;
    padding: 0.55rem 0.95rem;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--ink-soft);
    font-weight: 800;
    cursor: pointer;
}

.pricing-billing-button.is-active {
    color: #fff;
    background: linear-gradient(135deg, var(--primary), #1c84ff);
    box-shadow: 0 12px 26px rgba(31, 122, 112, 0.22);
}

.pricing-billing-button span {
    padding: 0.2rem 0.46rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
    font-size: 0.72rem;
}

.pricing-grid-public {
    align-items: stretch;
}

.pricing-subnote {
    min-height: 1.45rem;
    margin: -0.65rem 0 0;
    color: rgba(43, 64, 86, 0.72);
    font-size: 0.88rem;
    font-weight: 700;
}

.pricing-lifetime {
    display: grid;
    gap: 0.2rem;
    padding: 0.82rem 0.95rem;
    border: 1px solid rgba(205, 126, 53, 0.18);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(255, 247, 229, 0.92), rgba(247, 255, 252, 0.82));
}

.pricing-lifetime strong {
    color: var(--ink);
}

.pricing-lifetime span {
    color: var(--ink-soft);
    line-height: 1.45;
}

.pricing-comparison-block {
    margin-top: 2.4rem;
}

.pricing-comparison-head {
    max-width: 920px;
}

.pricing-comparison-head .showcase-section-title {
    font-size: clamp(2.1rem, 4vw, 3.7rem);
}

.pricing-comparison-scroll {
    overflow-x: auto;
    border: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 22px 52px rgba(18, 38, 58, 0.09);
}

.pricing-comparison-table {
    width: 100%;
    min-width: 880px;
    border-collapse: collapse;
}

.pricing-comparison-table th,
.pricing-comparison-table td {
    padding: 1rem;
    border-bottom: 1px solid rgba(18, 38, 58, 0.08);
    text-align: center;
    vertical-align: middle;
}

.pricing-comparison-table th:first-child,
.pricing-comparison-table td:first-child {
    text-align: left;
}

.pricing-comparison-table thead th {
    position: sticky;
    top: 0;
    background: rgba(249, 247, 241, 0.96);
    color: var(--ink);
    font-weight: 900;
}

.pricing-comparison-table tbody tr:last-child th,
.pricing-comparison-table tbody tr:last-child td {
    border-bottom: 0;
}

.comparison-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0.34rem 0.68rem;
    border-radius: 999px;
    color: var(--ink-soft);
    background: rgba(18, 38, 58, 0.06);
    font-size: 0.82rem;
    font-weight: 900;
}

.comparison-mark-yes {
    color: #fff;
    background: linear-gradient(135deg, var(--primary), #1f8c7c);
}

.comparison-mark-quote,
.comparison-mark-addon {
    color: #2f4259;
    background: rgba(244, 178, 77, 0.24);
}

.comparison-mark-no {
    color: rgba(43, 64, 86, 0.55);
}

.pricing-form form {
    margin: 0;
}

.soul-hero {
    position: relative;
    grid-template-columns: minmax(0, 1.18fr) minmax(320px, 0.82fr);
    overflow: hidden;
    background:
        radial-gradient(circle at 16% 18%, rgba(214, 120, 50, 0.18), transparent 28%),
        radial-gradient(circle at 84% 22%, rgba(28, 132, 255, 0.12), transparent 24%),
        linear-gradient(140deg, rgba(255, 250, 245, 0.92), rgba(245, 250, 248, 0.92));
}

.soul-hero::after {
    content: "";
    position: absolute;
    inset: auto -6% -28% auto;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(31, 122, 112, 0.16), transparent 72%);
    pointer-events: none;
}

.soul-hero-orbit {
    display: grid;
    gap: 1rem;
    align-content: center;
}

.soul-hero-card {
    position: relative;
    display: grid;
    gap: 0.5rem;
    padding: 1.15rem 1.2rem;
    border-radius: 26px;
    border: 1px solid rgba(18, 38, 58, 0.08);
    background: rgba(255, 255, 255, 0.62);
    box-shadow: 0 22px 42px rgba(18, 38, 58, 0.1);
    backdrop-filter: blur(16px);
}

.soul-hero-kicker {
    color: var(--accent);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.soul-hero-card strong {
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 0.98;
    font-family: 'Cormorant Garamond', serif;
}

.soul-hero-card p,
.soul-signal-card p,
.soul-path-summary p,
.soul-empty-state p,
.soul-suggestion-card p {
    margin: 0;
}

.soul-signal-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.soul-signal-card {
    min-height: 100%;
}

.soul-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.96fr) minmax(0, 1.04fr);
    gap: 1.25rem;
    align-items: start;
}

.soul-layout > * {
    min-width: 0;
}

.soul-goal-list {
    display: grid;
    gap: 0.95rem;
}

.soul-goal-card {
    display: grid;
    gap: 0.65rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.soul-goal-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 20px 36px rgba(18, 38, 58, 0.12);
}

.soul-goal-card.is-active {
    border-color: rgba(28, 132, 255, 0.24);
    box-shadow: 0 20px 40px rgba(14, 114, 232, 0.14);
}

.soul-goal-card .form-actions form,
.soul-suggestion-card form {
    margin: 0;
}

.soul-path-shell {
    display: grid;
    gap: 1rem;
}

.soul-path-summary {
    padding: 1rem 1.05rem;
    border-radius: 22px;
    border: 1px solid rgba(214, 120, 50, 0.16);
    background: linear-gradient(140deg, rgba(255, 249, 242, 0.94), rgba(255, 255, 255, 0.82));
}

.soul-path-card {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 0.95rem;
    align-items: start;
    padding: 1rem;
    border-radius: 24px;
    border: 1px solid rgba(18, 38, 58, 0.08);
    background: rgba(255, 255, 255, 0.58);
}

.soul-path-marker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 20px;
    background: linear-gradient(135deg, rgba(28, 132, 255, 0.94), rgba(12, 103, 214, 0.92));
    color: #fff;
    font-size: 1.05rem;
    font-weight: 800;
    box-shadow: 0 16px 28px rgba(14, 114, 232, 0.22);
}

.soul-path-content {
    display: grid;
    gap: 0.3rem;
    min-width: 0;
}

.soul-suggestion-card {
    display: grid;
    gap: 1rem;
}

.soul-chat-shell {
    display: grid;
    gap: 1rem;
}

.soul-chat-log {
    display: grid;
    gap: 0.85rem;
    max-height: min(70vh, 640px);
    overflow: auto;
    padding-right: 0.35rem;
}

.soul-chat-bubble {
    display: grid;
    gap: 0.45rem;
    width: min(100%, 92%);
    padding: 1rem 1.05rem;
    border-radius: 24px;
    border: 1px solid rgba(18, 38, 58, 0.08);
    background: rgba(255, 255, 255, 0.54);
    box-shadow: 0 18px 32px rgba(18, 38, 58, 0.08);
}

.soul-chat-bubble.is-user {
    justify-self: end;
    background: linear-gradient(140deg, rgba(29, 121, 111, 0.92), rgba(17, 93, 113, 0.92));
    color: #fff;
    border-color: transparent;
}

.soul-chat-bubble.is-assistant {
    justify-self: start;
}

.soul-chat-bubble.is-error {
    justify-self: start;
    background: linear-gradient(135deg, rgba(255, 248, 231, 0.94), rgba(255, 237, 213, 0.9));
    border-color: rgba(198, 113, 47, 0.22);
    color: #6d4219;
}

.soul-chat-role {
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--accent);
}

.soul-chat-bubble.is-user .soul-chat-role {
    color: rgba(255, 255, 255, 0.72);
}

.soul-chat-bubble.is-error .soul-chat-role {
    color: #c6712f;
}

.soul-chat-text {
    line-height: 1.72;
}

.soul-empty-state {
    display: grid;
    gap: 0.6rem;
    padding: 1rem 1.05rem;
    border-radius: 24px;
    border: 1px dashed rgba(18, 38, 58, 0.16);
    background: rgba(255, 255, 255, 0.44);
}

.footer-ad-slot {
    max-width: 1080px;
    margin: 0 auto 0.75rem;
    padding: 0 1rem;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.24s ease, transform 0.24s ease;
}

.footer-ad-slot.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.footer-ad-inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 0.9rem;
    align-items: center;
    padding: 0.95rem 1rem;
    border-radius: 22px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background: linear-gradient(135deg, rgba(12, 36, 55, 0.88), rgba(18, 77, 98, 0.78));
    color: #fff;
    box-shadow: 0 22px 40px rgba(7, 19, 31, 0.22);
    backdrop-filter: blur(18px);
}

.footer-ad-eyebrow {
    margin: 0;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.footer-ad-copy {
    display: grid;
    gap: 0.18rem;
    text-align: left;
}

.footer-ad-title {
    font-size: 1rem;
}

.footer-ad-text {
    color: rgba(255, 255, 255, 0.78);
    font-size: 0.92rem;
}

.footer-ad-custom {
    grid-column: 1 / -1;
    min-width: 0;
}

.footer-ad-custom > * {
    max-width: 100%;
}

.timed-ad-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.2rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.24s ease;
}

.timed-ad-modal.is-visible {
    opacity: 1;
    pointer-events: auto;
}

.timed-ad-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(7, 18, 29, 0.62);
    backdrop-filter: blur(8px);
}

.timed-ad-card {
    position: relative;
    z-index: 1;
    width: min(100%, 560px);
    padding: 2rem;
    border-radius: 28px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(248, 242, 232, 0.92));
    box-shadow: 0 26px 60px rgba(7, 18, 29, 0.24);
}

.timed-ad-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 999px;
    background: rgba(18, 38, 58, 0.08);
    color: var(--ink);
}

.timed-ad-title {
    font-size: clamp(2rem, 4vw, 2.7rem);
}

.timed-ad-text {
    color: var(--ink-soft);
    font-size: 1rem;
    line-height: 1.65;
}

.timed-ad-custom {
    min-width: 0;
}

.timed-ad-custom > * {
    max-width: 100%;
}

.marketing-page {
    padding-bottom: 0;
    background:
        radial-gradient(circle at 12% 12%, rgba(31, 122, 112, 0.18), transparent 24%),
        radial-gradient(circle at 88% 14%, rgba(214, 120, 50, 0.16), transparent 24%),
        linear-gradient(180deg, #f4efe7 0%, #f9f5ef 36%, #f1f6f3 100%);
}

.marketing-nav-wrap {
    position: sticky;
    top: 0;
    z-index: 1600;
    padding: 0;
}

.marketing-nav {
    width: 100%;
    padding: 0;
    border: 0;
    border-bottom: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 0;
    background: rgba(255, 255, 255, 0.76);
    box-shadow: 0 12px 34px rgba(18, 38, 58, 0.08);
    backdrop-filter: blur(20px);
}

.marketing-nav-inner {
    width: min(1240px, calc(100vw - 2.5rem));
    margin: 0 auto;
    min-height: 92px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.2rem;
    padding: 1rem 0;
}

.marketing-brand {
    display: inline-flex;
    align-items: center;
}

.marketing-brand img {
    width: min(250px, 40vw);
    height: auto;
}

.marketing-nav-actions {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem;
}

.marketing-nav-links {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.marketing-nav-links > a:not(.btn) {
    color: var(--ink);
    font-weight: 700;
    padding: 0.35rem 0.2rem;
}

.marketing-main {
    padding: 2rem 0 4rem;
}

.marketing-hero {
    padding: 2rem 0 1rem;
}

.marketing-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
    gap: 1.5rem;
    align-items: stretch;
}

.marketing-copy,
.marketing-visual,
.marketing-section,
.marketing-cta-band {
    position: relative;
    z-index: 2;
}

.marketing-copy {
    padding: 2rem 0;
}

.marketing-title {
    font-size: clamp(3.2rem, 6vw, 6.6rem);
    line-height: 0.92;
    margin-bottom: 1rem;
    color: var(--ink);
}

.marketing-lead {
    max-width: 760px;
    font-size: clamp(1.05rem, 2.2vw, 1.32rem);
    line-height: 1.72;
    color: var(--ink-soft);
}

.marketing-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.85rem;
    margin-top: 1.4rem;
}

.marketing-kpi-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.8rem;
}

.marketing-kpi-card {
    display: grid;
    gap: 0.45rem;
    padding: 1.1rem 1.15rem;
    border: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.56);
    box-shadow: 0 16px 32px rgba(18, 38, 58, 0.08);
}

.marketing-kpi-card strong {
    font-size: clamp(1.55rem, 3vw, 2.3rem);
    color: var(--ink);
}

.marketing-kpi-card span {
    color: var(--ink-soft);
    line-height: 1.55;
}

.marketing-hero-card,
.marketing-info-card,
.marketing-cta-band,
.marketing-image-card,
.marketing-story-copy {
    border: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 34px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.54));
    box-shadow: 0 24px 52px rgba(18, 38, 58, 0.12);
    backdrop-filter: blur(20px);
}

.marketing-hero-card {
    height: 100%;
    padding: 1.7rem;
    background:
        linear-gradient(150deg, rgba(10, 36, 56, 0.9), rgba(21, 90, 105, 0.88)),
        radial-gradient(circle at top right, rgba(255, 195, 99, 0.3), transparent 36%);
    color: #fff;
}

.marketing-hero-card h2 {
    font-size: clamp(2.2rem, 4vw, 3.5rem);
    margin-bottom: 0.85rem;
}

.marketing-hero-card p,
.marketing-check-list {
    color: rgba(255, 255, 255, 0.86);
}

.marketing-hero-card-top {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-bottom: 1.1rem;
}

.marketing-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: 0.88rem;
    font-weight: 700;
}

.marketing-badge-soft {
    background: rgba(255, 195, 99, 0.18);
}

.marketing-check-list {
    display: grid;
    gap: 0.75rem;
    margin: 1.2rem 0 0;
    padding-left: 1.1rem;
}

.marketing-check-list-light {
    color: var(--ink-soft);
}

.marketing-section {
    margin-top: 2rem;
}

.marketing-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.4rem;
}

.marketing-module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.4rem;
}

.marketing-info-card {
    padding: 1.4rem;
}

.marketing-info-card h3 {
    font-size: 2rem;
    margin-bottom: 0.7rem;
}

.marketing-info-card p {
    margin-bottom: 0;
    color: var(--ink-soft);
    line-height: 1.7;
}

.marketing-module-card {
    display: grid;
    gap: 0.9rem;
    padding: 1.45rem;
    border: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 30px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.84), rgba(255, 255, 255, 0.58));
    box-shadow: 0 22px 46px rgba(18, 38, 58, 0.11);
    backdrop-filter: blur(20px);
}

.marketing-module-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.marketing-module-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(31, 122, 112, 0.12), rgba(214, 120, 50, 0.16));
    color: var(--ink);
    font-size: 1.25rem;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.marketing-badge-plain {
    color: var(--ink);
    background: rgba(18, 38, 58, 0.06);
}

.marketing-module-card h3 {
    margin: 0;
    font-size: clamp(1.5rem, 2vw, 2rem);
}

.marketing-module-card p {
    margin: 0;
    color: var(--ink-soft);
    line-height: 1.72;
}

.marketing-mini-list {
    display: grid;
    gap: 0.6rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.marketing-mini-list li {
    position: relative;
    padding-left: 1.2rem;
    color: var(--ink-soft);
    line-height: 1.55;
}

.marketing-mini-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.65rem;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    box-shadow: 0 0 0 4px rgba(31, 122, 112, 0.08);
}

.marketing-story-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    gap: 1.2rem;
    align-items: center;
}

.marketing-story-grid-reverse {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
}

.marketing-image-card {
    overflow: hidden;
}

.marketing-image-card img {
    width: 100%;
    height: 100%;
    min-height: 420px;
    object-fit: cover;
    display: block;
}

.marketing-story-copy {
    padding: 1.7rem;
}

.marketing-cta-band {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.4rem;
    align-items: center;
    margin: 2rem auto 4rem;
    padding: 1.8rem;
    background:
        linear-gradient(135deg, rgba(13, 44, 64, 0.92), rgba(24, 108, 100, 0.88)),
        radial-gradient(circle at top right, rgba(243, 177, 115, 0.3), transparent 35%);
    color: #fff;
}

.marketing-cta-band .section-title,
.marketing-cta-band .section-description,
.marketing-cta-band .hero-eyebrow {
    color: #fff;
}

.marketing-footer {
    padding: 0;
    margin-top: 4rem;
}

.marketing-footer-band {
    width: 100%;
    padding: 1.6rem 0 1.9rem;
    background:
        linear-gradient(135deg, rgba(10, 36, 56, 0.96), rgba(21, 90, 105, 0.9)),
        radial-gradient(circle at top right, rgba(255, 195, 99, 0.22), transparent 32%);
    border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.marketing-footer-inner {
    width: min(1240px, calc(100vw - 2.5rem));
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    color: rgba(255, 255, 255, 0.76);
}

.marketing-footer-brand {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.marketing-footer-brand p {
    margin: 0;
    max-width: 560px;
    line-height: 1.6;
}

.marketing-footer-links {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 0.45rem 0.85rem;
    text-align: right;
}

.marketing-footer-links span {
    color: rgba(255, 255, 255, 0.62);
}

.marketing-footer-links a {
    color: #fff;
    font-weight: 700;
}

.marketing-footer-brand img {
    width: min(200px, 34vw);
    height: auto;
}

.marketing-page {
    --landing-scroll: 0;
    --landing-shift-y: 0px;
    --landing-shift-x: 0px;
    position: relative;
    overflow-x: clip;
    background:
        radial-gradient(circle at calc(14% + var(--landing-shift-x)) calc(12% + var(--landing-shift-y)), rgba(30, 129, 119, 0.16), transparent 24%),
        radial-gradient(circle at calc(86% - var(--landing-shift-x)) calc(16% + var(--landing-shift-y)), rgba(217, 131, 58, 0.16), transparent 28%),
        radial-gradient(circle at calc(72% + var(--landing-shift-x)) calc(82% - var(--landing-shift-y)), rgba(33, 93, 111, 0.14), transparent 24%),
        linear-gradient(180deg, #f7f2e8 0%, #f8f5ef 28%, #eef5f3 100%);
}

.marketing-page::before,
.marketing-page::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.marketing-page::before {
    background:
        radial-gradient(circle at 18% 24%, rgba(255, 255, 255, 0.42), transparent 16%),
        radial-gradient(circle at 82% 18%, rgba(255, 255, 255, 0.4), transparent 18%),
        radial-gradient(circle at 70% 74%, rgba(255, 255, 255, 0.28), transparent 18%);
    transform: translate3d(calc(var(--landing-shift-x) * 0.35), calc(var(--landing-shift-y) * -0.18), 0);
}

.marketing-page::after {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0)),
        repeating-linear-gradient(120deg, rgba(255, 255, 255, 0.06) 0, rgba(255, 255, 255, 0.06) 1px, transparent 1px, transparent 16px);
    opacity: 0.45;
}

.landing-shell {
    width: min(1400px, calc(100vw - 3rem));
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.landing-hero {
    padding: clamp(2rem, 5vw, 4.5rem) 0 3rem;
}

.landing-hero-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    gap: 1.35rem;
    align-items: stretch;
}

.landing-hero-copy {
    padding: clamp(1rem, 2vw, 1.8rem) 0;
}

.landing-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
    margin-bottom: 1.2rem;
}

.landing-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.62rem 1rem;
    border-radius: 999px;
    border: 1px solid rgba(18, 38, 58, 0.08);
    background: rgba(255, 255, 255, 0.72);
    color: var(--ink);
    font-size: 0.92rem;
    font-weight: 800;
    box-shadow: 0 14px 28px rgba(18, 38, 58, 0.08);
    backdrop-filter: blur(18px);
}

.landing-title {
    margin: 0;
    font-size: clamp(3.5rem, 8vw, 7.8rem);
    line-height: 0.9;
    letter-spacing: 0;
    color: var(--ink);
    text-wrap: balance;
}

.landing-lead {
    max-width: 880px;
    margin-top: 1.3rem;
    font-size: clamp(1.08rem, 2.2vw, 1.34rem);
    line-height: 1.75;
    color: var(--ink-soft);
}

.landing-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
    margin-top: 1.5rem;
}

.landing-proof-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.8rem;
}

.landing-proof-card {
    display: grid;
    gap: 0.45rem;
    padding: 1.2rem 1.1rem;
    border: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: 0 18px 34px rgba(18, 38, 58, 0.08);
    backdrop-filter: blur(16px);
}

.landing-proof-card strong {
    font-size: clamp(1.8rem, 3vw, 2.6rem);
    color: var(--ink);
}

.landing-proof-card span {
    color: var(--ink-soft);
    line-height: 1.52;
}

.landing-scene {
    display: flex;
    align-items: stretch;
}

.landing-scene-card {
    width: 100%;
    padding: 1.9rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 38px;
    background:
        linear-gradient(145deg, rgba(9, 35, 55, 0.94), rgba(18, 95, 106, 0.88)),
        radial-gradient(circle at top right, rgba(255, 192, 104, 0.28), transparent 34%);
    color: #fff;
    box-shadow: 0 28px 60px rgba(18, 38, 58, 0.22);
    transform: translateY(calc(var(--landing-scroll) * -18px));
}

.landing-scene-card h2 {
    margin: 0;
    font-size: clamp(2.2rem, 4vw, 4rem);
    line-height: 1;
}

.landing-scene-card p {
    margin: 1rem 0 0;
    color: rgba(255, 255, 255, 0.84);
    line-height: 1.72;
}

.landing-scene-list {
    display: grid;
    gap: 0.7rem;
    margin: 1.25rem 0 0;
    padding-left: 1.2rem;
    color: rgba(255, 255, 255, 0.9);
}

.landing-scene-mini-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
    margin-top: 1.4rem;
}

.landing-scene-mini-card {
    display: grid;
    gap: 0.18rem;
    padding: 0.9rem 1rem;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.landing-scene-mini-card span {
    color: rgba(255, 255, 255, 0.66);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.landing-scene-mini-card strong {
    font-size: 1.15rem;
    color: #fff;
}

.landing-band {
    padding: 1.4rem 0;
    position: relative;
}

.landing-band-soft {
    padding-top: 2rem;
}

.landing-band-dark {
    margin: 2rem 0;
    padding: 2.4rem 0;
    background:
        linear-gradient(135deg, rgba(11, 40, 61, 0.96), rgba(20, 101, 96, 0.9)),
        radial-gradient(circle at top right, rgba(255, 191, 97, 0.22), transparent 35%);
}

.landing-band-tint {
    padding: 2.4rem 0;
}

.landing-section-head {
    display: grid;
    gap: 0.8rem;
    max-width: 980px;
    margin-bottom: 1.5rem;
}

.landing-section-head h2 {
    margin: 0;
    font-size: clamp(2.6rem, 5vw, 4.8rem);
    line-height: 0.97;
    letter-spacing: 0;
    text-wrap: balance;
}

.landing-section-head p {
    margin: 0;
    font-size: clamp(1rem, 2vw, 1.18rem);
    line-height: 1.72;
    color: var(--ink-soft);
}

.landing-benefit-grid,
.landing-module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.landing-benefit-card,
.landing-module-card,
.landing-parallel-card {
    border: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 34px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.84), rgba(255, 255, 255, 0.58));
    box-shadow: 0 24px 52px rgba(18, 38, 58, 0.12);
    backdrop-filter: blur(18px);
}

.landing-benefit-card {
    padding: 1.5rem;
}

.landing-benefit-card h3,
.landing-module-card h3,
.landing-parallel-card h3 {
    margin: 0;
    font-size: clamp(1.65rem, 2vw, 2.25rem);
}

.landing-benefit-card p,
.landing-module-card p,
.landing-parallel-card p {
    margin: 0.9rem 0 0;
    color: var(--ink-soft);
    line-height: 1.72;
}

.landing-module-card {
    display: grid;
    gap: 0.9rem;
    padding: 1.5rem;
    min-height: 100%;
}

.landing-module-top {
    display: flex;
    align-items: center;
}

.landing-module-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(31, 122, 112, 0.12), rgba(214, 120, 50, 0.18));
    color: var(--ink);
    font-size: 1.3rem;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.46);
}

.landing-mini-list {
    display: grid;
    gap: 0.65rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.landing-mini-list li {
    position: relative;
    padding-left: 1.2rem;
    color: var(--ink-soft);
    line-height: 1.56;
}

.landing-mini-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.68rem;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    box-shadow: 0 0 0 4px rgba(31, 122, 112, 0.08);
}

.landing-split-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.94fr) minmax(0, 1.06fr);
    gap: 1.2rem;
    align-items: stretch;
}

.landing-split-media,
.landing-split-copy {
    border-radius: 36px;
    overflow: hidden;
}

.landing-split-media {
    min-height: 520px;
    box-shadow: 0 28px 58px rgba(18, 38, 58, 0.18);
}

.landing-split-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: translateY(calc(var(--landing-scroll) * -24px)) scale(1.06);
}

.landing-split-copy {
    padding: 2rem;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: #fff;
    backdrop-filter: blur(14px);
}

.landing-split-copy h2,
.landing-cta-ribbon-inner h2 {
    margin: 0;
    font-size: clamp(2.4rem, 4vw, 4.2rem);
    line-height: 0.98;
    text-wrap: balance;
}

.landing-split-copy p,
.landing-cta-ribbon-inner p {
    margin: 1rem 0 0;
    color: rgba(255, 255, 255, 0.84);
    line-height: 1.76;
    font-size: 1.05rem;
}

.landing-tag-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1.35rem;
}

.landing-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.65rem 0.95rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: #fff;
    font-weight: 700;
}

.landing-parallel-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1.3rem;
}

.landing-parallel-card {
    padding: 1.65rem;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.landing-parallel-card:nth-child(1) {
    transform: translateY(18px);
}

.landing-parallel-card:nth-child(2) {
    transform: translateY(64px);
}

.landing-parallel-card:nth-child(3) {
    transform: translateY(32px);
}

.landing-parallel-card:hover {
    transform: translateY(0);
    box-shadow: 0 30px 58px rgba(18, 38, 58, 0.16);
}

.landing-cta-ribbon {
    padding: 2rem 0 4rem;
}

.landing-cta-ribbon-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.4rem;
    align-items: center;
    padding: 2rem;
    border-radius: 40px;
    background:
        linear-gradient(135deg, rgba(11, 40, 61, 0.96), rgba(20, 101, 96, 0.9)),
        radial-gradient(circle at top right, rgba(255, 191, 97, 0.22), transparent 35%);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 30px 64px rgba(18, 38, 58, 0.18);
}

.marketing-page-showcase .marketing-nav {
    background: rgba(252, 249, 243, 0.74);
    border-bottom-color: rgba(18, 38, 58, 0.1);
}

.marketing-page-showcase .marketing-main {
    padding: 0 0 4.5rem;
}

.marketing-mobile-toggle,
.marketing-nav-overlay {
    display: none;
}

.marketing-mobile-toggle {
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.28rem;
    width: 56px;
    height: 56px;
    border: 1px solid rgba(18, 38, 58, 0.1);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.72);
    box-shadow: 0 18px 30px rgba(18, 38, 58, 0.08);
}

.marketing-mobile-toggle span {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 999px;
    background: var(--ink);
    transition: transform 0.22s ease, opacity 0.22s ease;
}

.marketing-menu-open .marketing-mobile-toggle span:nth-child(1) {
    transform: translateY(6px) rotate(45deg);
}

.marketing-menu-open .marketing-mobile-toggle span:nth-child(2) {
    opacity: 0;
}

.marketing-menu-open .marketing-mobile-toggle span:nth-child(3) {
    transform: translateY(-6px) rotate(-45deg);
}

.showcase-shell {
    width: min(1560px, calc(100vw - 2rem));
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.showcase-hero {
    position: relative;
    min-height: min(980px, calc(100vh - 40px));
    display: flex;
    align-items: flex-end;
    padding: clamp(5rem, 10vw, 8rem) 0 3.2rem;
    overflow: clip;
}

.showcase-hero-bg,
.showcase-hero-overlay {
    position: absolute;
    inset: 0;
}

.showcase-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.08) translate3d(calc(var(--landing-shift-x) * -0.18), calc(var(--landing-scroll) * -70px), 0);
    filter: saturate(1.08) contrast(1.04);
}

.showcase-hero-overlay {
    background:
        linear-gradient(115deg, rgba(8, 27, 42, 0.9) 8%, rgba(8, 27, 42, 0.52) 48%, rgba(8, 27, 42, 0.18) 100%),
        radial-gradient(circle at 78% 18%, rgba(255, 191, 97, 0.28), transparent 26%),
        linear-gradient(180deg, rgba(8, 27, 42, 0.1) 0%, rgba(8, 27, 42, 0.5) 100%);
}

.showcase-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    gap: 1.3rem;
    align-items: end;
}

.showcase-hero-copy,
.showcase-hero-side {
    position: relative;
    z-index: 2;
}

.marketing-menu-open {
    overflow: hidden;
}

.showcase-title {
    background: linear-gradient(135deg, #ffe8c3 0%, #ffb168 22%, #ffffff 52%, #82d7cf 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.showcase-section-title,
.showcase-image-panel-copy h3,
.showcase-rail-card h3 {
    background: linear-gradient(135deg, #18344d 0%, #cb6b33 46%, #1f7873 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.showcase-section-dark .showcase-section-title,
.showcase-feature-copy h3,
.showcase-cta-band .showcase-section-title {
    background: linear-gradient(135deg, #ffe9c8 0%, #ffb06f 26%, #ffffff 56%, #84d9cf 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.showcase-title {
    margin: 0;
    max-width: 960px;
    font-size: clamp(4rem, 9vw, 8.8rem);
    line-height: 0.86;
    letter-spacing: 0;
    text-wrap: balance;
}

.showcase-lead {
    max-width: 760px;
    margin-top: 1.4rem;
    font-size: clamp(1.08rem, 2.2vw, 1.34rem);
    line-height: 1.76;
    color: rgba(255, 255, 255, 0.9);
    text-shadow: 0 14px 36px rgba(0, 0, 0, 0.18);
}

.showcase-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.9rem;
    margin-top: 1.6rem;
}

.showcase-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 2rem;
}

.showcase-metric-card,
.showcase-glass-card,
.showcase-mini-tile,
.showcase-image-panel,
.showcase-feature-card,
.showcase-rail-card,
.showcase-cta-band {
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 34px;
    backdrop-filter: blur(18px);
    box-shadow: 0 24px 60px rgba(18, 38, 58, 0.16);
}

.showcase-metric-card {
    display: grid;
    gap: 0.38rem;
    padding: 1.15rem 1.2rem;
    background: rgba(255, 255, 255, 0.18);
}

.showcase-metric-card strong {
    font-size: clamp(1.8rem, 3vw, 2.8rem);
    color: #fff;
}

.showcase-metric-card span {
    color: rgba(255, 255, 255, 0.78);
    line-height: 1.48;
}

.showcase-hero-side {
    display: grid;
    gap: 1rem;
}

.showcase-glass-card {
    padding: 1.7rem;
    background: linear-gradient(150deg, rgba(7, 32, 50, 0.84), rgba(19, 98, 106, 0.7));
    color: #fff;
}

.showcase-glass-card h2 {
    margin: 0;
    font-size: clamp(2.1rem, 3.8vw, 3.8rem);
    line-height: 0.96;
}

.showcase-glass-card p {
    margin: 0.95rem 0 0;
    color: rgba(255, 255, 255, 0.82);
    line-height: 1.72;
}

.showcase-check-list {
    display: grid;
    gap: 0.72rem;
    margin: 1.3rem 0 0;
    padding-left: 1.2rem;
    color: rgba(255, 255, 255, 0.88);
}

.showcase-mini-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.showcase-mini-tile {
    display: grid;
    gap: 0.16rem;
    padding: 1rem;
    background: rgba(255, 255, 255, 0.22);
    color: #fff;
}

.showcase-mini-tile span {
    color: rgba(255, 255, 255, 0.74);
    font-size: 0.9rem;
    font-weight: 700;
}

.showcase-mini-tile strong {
    font-size: 1.2rem;
}

.showcase-section {
    position: relative;
    z-index: 2;
    padding: clamp(3rem, 8vw, 6rem) 0;
}

.showcase-section-soft {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.14) 100%);
}

.showcase-section-dark {
    background:
        linear-gradient(135deg, rgba(10, 35, 54, 0.96), rgba(16, 91, 95, 0.88)),
        radial-gradient(circle at top right, rgba(255, 188, 95, 0.22), transparent 34%);
}

.showcase-section-soul {
    background:
        linear-gradient(135deg, rgba(245, 251, 248, 0.96), rgba(238, 246, 250, 0.82)),
        radial-gradient(circle at 8% 10%, rgba(255, 186, 94, 0.18), transparent 30%);
}

.showcase-section-faq {
    background: rgba(255, 255, 255, 0.18);
}

.showcase-section-rails {
    overflow: clip;
}

.showcase-section-cta {
    padding-top: 1rem;
}

.showcase-section-head {
    max-width: 1040px;
    display: grid;
    gap: 0.85rem;
    margin-bottom: 1.7rem;
}

.showcase-section-head-light .showcase-section-text {
    color: rgba(255, 255, 255, 0.84);
}

.showcase-section-title {
    margin: 0;
    font-size: clamp(2.8rem, 6vw, 5.4rem);
    line-height: 0.92;
    letter-spacing: 0;
    text-wrap: balance;
}

.showcase-section-text {
    margin: 0;
    font-size: clamp(1.05rem, 2vw, 1.2rem);
    line-height: 1.76;
    color: var(--ink-soft);
}

.showcase-soul-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr);
    gap: 1.4rem;
    align-items: center;
}

.soul-chat-panel {
    display: grid;
    gap: 1rem;
    padding: 1.35rem;
    border: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 32px;
    background:
        linear-gradient(145deg, rgba(9, 36, 54, 0.94), rgba(22, 103, 100, 0.88)),
        radial-gradient(circle at top right, rgba(244, 178, 77, 0.25), transparent 34%);
    box-shadow: 0 28px 70px rgba(18, 38, 58, 0.16);
}

.soul-chat-message {
    display: grid;
    gap: 0.35rem;
    max-width: 86%;
    padding: 1rem 1.1rem;
    border-radius: 24px;
    line-height: 1.58;
}

.soul-chat-message strong {
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

.soul-chat-message p {
    margin: 0;
}

.soul-chat-message-user {
    justify-self: end;
    background: #fff;
    color: var(--ink);
}

.soul-chat-message-ai {
    justify-self: start;
    color: #fff;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.18);
}

.soul-chat-panel .tag-chip {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
}

.soul-chat-panel .tag-chip-strong {
    background: #fff;
    color: var(--ink);
}

.faq-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 1rem;
}

.faq-card {
    display: grid;
    align-content: start;
    gap: 0.75rem;
    padding: 1.2rem;
    border: 1px solid rgba(18, 38, 58, 0.08);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.66);
    box-shadow: 0 18px 42px rgba(18, 38, 58, 0.08);
}

.faq-card h3 {
    margin: 0;
    color: var(--ink);
    font-size: 1.05rem;
    line-height: 1.25;
}

.faq-card p {
    margin: 0;
    color: var(--ink-soft);
    line-height: 1.62;
}

.public-legal-shell {
    padding-top: clamp(2rem, 5vw, 4rem);
    padding-bottom: clamp(2rem, 5vw, 4rem);
}

.public-legal-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.public-legal-grid .soft-panel {
    display: grid;
    gap: 0.7rem;
    align-content: start;
}

.public-legal-grid .section-title {
    font-size: clamp(1.8rem, 3vw, 2.6rem);
}

.showcase-media-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 1rem;
}

.showcase-image-panel {
    grid-column: span 4;
    overflow: hidden;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.64));
}

.showcase-image-panel-offset {
    transform: translateY(44px);
}

.showcase-image-panel-media {
    min-height: 300px;
    overflow: hidden;
}

.showcase-image-panel-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.08) translateY(calc(var(--landing-scroll) * -26px));
}

.showcase-image-panel-copy {
    padding: 1.5rem;
}

.showcase-image-panel-copy h3,
.showcase-feature-copy h3,
.showcase-rail-card h3 {
    margin: 0;
    font-size: clamp(1.9rem, 3vw, 3rem);
    line-height: 0.96;
}

.showcase-image-panel-copy p,
.showcase-feature-copy p,
.showcase-rail-card p {
    margin: 1rem 0 0;
    color: var(--ink-soft);
    line-height: 1.72;
}

.showcase-mini-list {
    display: grid;
    gap: 0.62rem;
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.showcase-mini-list li {
    position: relative;
    padding-left: 1.2rem;
    color: var(--ink-soft);
    line-height: 1.56;
}

.showcase-mini-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.68rem;
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    box-shadow: 0 0 0 4px rgba(31, 122, 112, 0.08);
}

.showcase-mini-list-light li {
    color: rgba(255, 255, 255, 0.82);
}

.showcase-premium-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.showcase-feature-card {
    overflow: hidden;
    background: rgba(255, 255, 255, 0.08);
}

.showcase-feature-media {
    min-height: 260px;
    overflow: hidden;
}

.showcase-feature-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.1) translateY(calc(var(--landing-scroll) * -18px));
    filter: saturate(1.05);
}

.showcase-feature-copy {
    padding: 1.5rem;
    color: #fff;
}

.showcase-feature-copy p {
    color: rgba(255, 255, 255, 0.82);
}

.showcase-rail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    align-items: start;
}

.showcase-rail-card {
    padding: 1.7rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(255, 255, 255, 0.7));
    transition: transform 0.24s ease, box-shadow 0.24s ease;
}

.showcase-rail-card:nth-child(1) {
    transform: translateY(16px);
}

.showcase-rail-card-middle {
    transform: translateY(58px);
}

.showcase-rail-card:nth-child(3) {
    transform: translateY(30px);
}

.showcase-rail-card:hover {
    transform: translateY(0);
    box-shadow: 0 30px 60px rgba(18, 38, 58, 0.18);
}

.showcase-cta-band {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1.3rem;
    align-items: center;
    padding: 2.2rem;
    background:
        linear-gradient(135deg, rgba(10, 36, 56, 0.96), rgba(19, 103, 106, 0.9)),
        radial-gradient(circle at top right, rgba(255, 191, 97, 0.24), transparent 34%);
}

.showcase-cta-band .showcase-section-text {
    color: rgba(255, 255, 255, 0.84);
}

@media (max-width: 991px) {
    .plan-editor-grid,
    .form-grid-compact,
    .grid-two-columns {
        grid-template-columns: 1fr;
    }

    .checkbox-pill-feature {
        max-width: 100%;
    }

    .footer-ad-inner {
        grid-template-columns: 1fr;
        text-align: left;
    }

    .footer-ad-cta {
        width: 100%;
    }

    .marketing-hero-grid,
    .marketing-card-grid,
    .marketing-module-grid,
    .marketing-story-grid,
    .marketing-story-grid-reverse,
    .marketing-kpi-grid,
    .marketing-cta-band {
        grid-template-columns: 1fr;
    }

    .marketing-nav-inner,
    .marketing-footer-inner {
        width: min(100%, calc(100vw - 2rem));
    }

    .marketing-nav-actions {
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
    }

    .marketing-nav-links {
        justify-content: flex-start;
    }

    .sort-control-grid {
        grid-template-columns: 1fr;
    }

    .marketing-footer-inner,
    .marketing-footer-brand {
        flex-direction: column;
        align-items: flex-start;
    }

    .marketing-footer-links {
        justify-content: flex-start;
        text-align: left;
    }

    .marketing-title {
        font-size: clamp(2.8rem, 12vw, 4.8rem);
    }

    .marketing-copy {
        padding-top: 0.8rem;
    }

    .marketing-image-card img {
        min-height: 300px;
    }

    .marketing-cta-band .marketing-actions .btn {
        width: 100%;
    }

    .appmanager-tab-chip {
        width: 100%;
    }

    .technical-log-source-row,
    .technical-log-entry {
        align-items: flex-start;
        flex-direction: column;
    }

    .landing-shell {
        width: min(100%, calc(100vw - 2rem));
    }

    .landing-hero-layout,
    .landing-split-layout,
    .landing-benefit-grid,
    .landing-module-grid,
    .landing-parallel-grid,
    .landing-proof-grid,
    .landing-scene-mini-grid,
    .landing-cta-ribbon-inner {
        grid-template-columns: 1fr;
    }

    .landing-title {
        font-size: clamp(3rem, 14vw, 5.2rem);
    }

    .landing-parallel-card:nth-child(1),
    .landing-parallel-card:nth-child(2),
    .landing-parallel-card:nth-child(3) {
        transform: none;
    }

    .marketing-mobile-toggle {
        display: inline-flex;
    }

    .marketing-nav-overlay {
        display: block;
    }

    .marketing-page-showcase .marketing-nav-inner {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        position: relative;
        width: min(100%, calc(100vw - 2rem));
        min-height: 88px;
        padding: 1rem 0;
    }

    .marketing-page-showcase .marketing-brand img {
        width: min(230px, 42vw);
    }

    .marketing-page-showcase .marketing-nav-actions {
        position: fixed;
        top: 88px;
        left: 1rem;
        right: 1rem;
        z-index: 1602;
        display: grid;
        gap: 1rem;
        padding: 1rem;
        border: 1px solid rgba(18, 38, 58, 0.1);
        border-radius: 28px;
        background: rgba(252, 249, 243, 0.92);
        box-shadow: 0 28px 60px rgba(18, 38, 58, 0.16);
        backdrop-filter: blur(20px);
        opacity: 0;
        transform: translateY(-12px) scale(0.98);
        pointer-events: none;
        transition: opacity 0.22s ease, transform 0.22s ease;
    }

    .marketing-page-showcase .marketing-nav-actions.is-open {
        opacity: 1;
        transform: translateY(0) scale(1);
        pointer-events: auto;
    }

    .marketing-page-showcase .marketing-nav-links {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .marketing-page-showcase .marketing-nav-links > a:not(.btn),
    .marketing-page-showcase .marketing-nav-links .btn {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .marketing-page-showcase .public-language-toggle {
        align-self: center;
    }

    .marketing-page-showcase .marketing-nav-overlay {
        position: fixed;
        inset: 0;
        z-index: 1601;
        border: 0;
        background: rgba(7, 21, 34, 0.42);
        opacity: 0;
        pointer-events: none;
        backdrop-filter: blur(6px);
        transition: opacity 0.2s ease;
    }

    .marketing-menu-open .marketing-nav-overlay {
        opacity: 1;
        pointer-events: auto;
    }

    .showcase-hero {
        min-height: auto;
        padding-top: 3.5rem;
    }

    .showcase-hero-grid,
    .showcase-soul-grid,
    .showcase-premium-grid,
    .showcase-rail-grid,
    .showcase-cta-band,
    .faq-grid,
    .public-legal-grid {
        grid-template-columns: 1fr;
    }

    .pricing-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .showcase-media-grid {
        grid-template-columns: 1fr;
    }

    .showcase-image-panel {
        grid-column: auto;
    }

    .showcase-image-panel-offset,
    .showcase-rail-card:nth-child(1),
    .showcase-rail-card-middle,
    .showcase-rail-card:nth-child(3) {
        transform: none;
    }

    .showcase-title {
        font-size: clamp(3.4rem, 12vw, 6rem);
    }

    .showcase-shell {
        width: min(100%, calc(100vw - 2rem));
    }
}

@media (max-width: 767px) {
    .auth-card {
        padding: 1.4rem;
    }

    .auth-topbar {
        flex-direction: column;
        align-items: flex-start;
    }

    .marketing-nav-wrap {
        position: sticky;
        top: 0;
    }

    .marketing-nav-inner {
        width: min(100%, calc(100vw - 1.5rem));
        flex-direction: column;
        align-items: stretch;
        padding: 0.9rem 0 1rem;
    }

    .marketing-brand {
        justify-content: center;
    }

    .marketing-brand img {
        width: min(220px, 62vw);
    }

    .marketing-nav-actions {
        width: 100%;
        align-items: stretch;
    }

    .marketing-nav-links {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .public-language-toggle {
        align-self: flex-start;
    }

    .marketing-nav-links .btn,
    .marketing-actions .btn {
        width: 100%;
    }

    .sort-toolbar-actions .btn {
        width: 100%;
    }

    .marketing-footer-band {
        padding: 1.25rem 0 1.5rem;
    }

    .marketing-footer-inner {
        width: min(100%, calc(100vw - 1.5rem));
    }

    .marketing-kpi-card,
    .marketing-info-card,
    .marketing-story-copy,
    .marketing-hero-card,
    .marketing-cta-band {
        border-radius: 26px;
    }

    .landing-shell {
        width: min(100%, calc(100vw - 1.5rem));
    }

    .landing-hero {
        padding-top: 1.2rem;
    }

    .landing-actions .btn,
    .landing-cta-ribbon-inner .btn {
        width: 100%;
    }

    .landing-split-media {
        min-height: 320px;
    }

    .landing-scene-card,
    .landing-benefit-card,
    .landing-module-card,
    .landing-parallel-card,
    .landing-cta-ribbon-inner,
    .landing-split-copy {
        padding: 1.35rem;
        border-radius: 28px;
    }

    .marketing-page-showcase .marketing-nav {
        border-radius: 0 0 24px 24px;
    }

    .marketing-page-showcase .marketing-nav-inner {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 0.9rem;
        align-items: center;
    }

    .marketing-page-showcase .marketing-brand {
        justify-content: flex-start;
    }

    .marketing-page-showcase .marketing-brand img {
        width: min(190px, 56vw);
    }

    .marketing-page-showcase .marketing-nav-actions {
        top: 82px;
        left: 0.75rem;
        right: 0.75rem;
        max-height: calc(100vh - 100px);
        overflow-y: auto;
    }

    .showcase-hero {
        padding-top: 2.9rem;
        padding-bottom: 2.4rem;
    }

    .showcase-title {
        font-size: clamp(3rem, 16vw, 4.8rem);
    }

    .showcase-lead,
    .showcase-section-text {
        font-size: 1rem;
    }

    .showcase-actions .btn {
        width: 100%;
    }

    .showcase-metrics,
    .showcase-mini-grid {
        grid-template-columns: 1fr;
    }

    .showcase-image-panel-media,
    .showcase-feature-media {
        min-height: 240px;
    }

    .showcase-hero-side,
    .soul-chat-panel,
    .showcase-feature-copy,
    .showcase-glass-card,
    .showcase-image-panel-copy,
    .showcase-rail-card,
    .faq-card,
    .showcase-cta-band {
        padding: 1.35rem;
        border-radius: 28px;
    }

    .pricing-billing-toggle,
    .pricing-billing-button {
        width: 100%;
        justify-content: center;
    }

    .soul-chat-message {
        max-width: 100%;
    }

    .showcase-shell {
        width: min(100%, calc(100vw - 1.2rem));
    }
}

body.share-sheet-open {
    overflow: hidden;
}

.share-sheet-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1400;
    background: rgba(9, 20, 31, 0.66);
    backdrop-filter: blur(10px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
}

.share-sheet-backdrop.is-visible {
    opacity: 1;
    pointer-events: auto;
}

.share-sheet {
    position: fixed;
    inset: 0;
    z-index: 1401;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.3rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease;
}

.share-sheet.is-visible {
    opacity: 1;
    pointer-events: auto;
}

.share-sheet-card {
    position: relative;
    width: min(980px, calc(100vw - 2rem));
    border-radius: 38px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    background:
        linear-gradient(140deg, rgba(10, 36, 56, 0.94), rgba(17, 84, 98, 0.9)),
        radial-gradient(circle at top right, rgba(255, 195, 99, 0.2), transparent 34%);
    box-shadow: 0 28px 70px rgba(7, 18, 29, 0.34);
    color: #fff;
    overflow: hidden;
    transform: translateY(22px) scale(0.98);
    transition: transform 0.26s ease, box-shadow 0.26s ease;
}

.share-sheet.is-visible .share-sheet-card {
    transform: translateY(0) scale(1);
    box-shadow: 0 36px 90px rgba(7, 18, 29, 0.4);
}

.share-sheet-card-centered::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 82% 18%, rgba(255, 198, 87, 0.22), transparent 28%),
        radial-gradient(circle at 16% 84%, rgba(255, 255, 255, 0.08), transparent 26%);
    pointer-events: none;
}

.share-sheet-card .section-title,
.share-sheet-card .section-description,
.share-sheet-card .hero-eyebrow,
.share-sheet-card .field-note,
.share-sheet-card label {
    color: #fff;
}

.share-sheet-card .section-description,
.share-sheet-card .field-note,
.share-sheet-card .copy-feedback {
    color: rgba(255, 255, 255, 0.76);
}

.share-sheet-close {
    position: absolute;
    top: 1.2rem;
    right: 1.2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    z-index: 2;
}

.share-sheet-banner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.18fr) minmax(300px, 0.82fr);
    align-items: stretch;
}

.share-sheet-copy,
.share-qr-column {
    display: flex;
    flex-direction: column;
}

.share-link-panel {
    padding: 1.25rem;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.1);
}

.share-link-input {
    font-size: 0.96rem;
}

.share-sheet-copy {
    padding: 2.2rem;
    gap: 1rem;
}

.share-sheet-pill {
    display: inline-flex;
    align-self: flex-start;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.9rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.92rem;
    font-weight: 800;
    letter-spacing: 0.04em;
}

.share-sheet-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1rem;
}

.share-sheet-actions .btn {
    flex: 1 1 220px;
}

.share-qr-stage {
    justify-content: center;
    align-items: center;
    gap: 1rem;
    padding: 2rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
    border-left: 1px solid rgba(255, 255, 255, 0.1);
}

.share-qr-title {
    font-size: 0.92rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-weight: 800;
    color: rgba(255, 255, 255, 0.76);
}

.share-qr-frame {
    display: grid;
    place-items: center;
    width: min(100%, 320px);
    padding: 1.1rem;
    border-radius: 34px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.share-qr-frame img {
    width: 100%;
    max-width: 260px;
    height: auto;
    display: block;
    border-radius: 22px;
}

.shared-public-page {
    padding-bottom: 0;
}

.shared-public-nav-wrap {
    position: sticky;
    top: 0;
    z-index: 120;
}

.shared-public-nav {
    background: rgba(255, 255, 255, 0.78);
}

.shared-public-nav-copy {
    flex: 1 1 auto;
    display: grid;
    gap: 0.2rem;
    max-width: 520px;
}

.shared-public-nav-copy p {
    margin: 0;
    color: var(--ink-soft);
    line-height: 1.6;
}

.shared-public-nav-actions {
    justify-content: flex-end;
}

.shared-public-shell {
    padding-top: 1.8rem;
    padding-bottom: 4rem;
}

.shared-public-hero .page-title {
    max-width: 14ch;
}

.shared-filter-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.shared-filter-card {
    display: grid;
    align-content: start;
}

.shared-results-meta {
    display: grid;
    gap: 0.85rem;
    justify-items: end;
}

.shared-count-chip {
    padding: 0.65rem 0.9rem;
    border-radius: 999px;
    background: rgba(31, 122, 112, 0.1);
    color: var(--primary-dark);
    font-weight: 800;
}

.shared-public-footer {
    margin-top: 0;
}

@media (max-width: 991px) {
    .share-sheet-banner,
    .shared-filter-grid {
        grid-template-columns: 1fr;
    }

    .share-qr-stage {
        border-left: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    .shared-results-meta {
        justify-items: start;
    }

    .shared-public-nav-copy {
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    .share-sheet {
        align-items: center;
        padding: 0.9rem;
    }

    .share-sheet-card {
        width: 100%;
        border-radius: 30px;
        max-height: calc(100vh - 1.8rem);
        overflow: auto;
    }

    .share-sheet-actions {
        flex-direction: column;
        gap: 0.6rem;
    }

    .share-sheet-copy,
    .share-qr-stage {
        padding: 1.2rem;
    }

    .share-sheet-copy {
        gap: 0.8rem;
    }

    .share-sheet-card .hero-eyebrow,
    .share-qr-title {
        font-size: 0.75rem;
        letter-spacing: 0.16em;
    }

    .share-sheet-card .section-title {
        margin-right: 2.8rem;
        font-size: clamp(1.72rem, 7vw, 2.2rem);
        line-height: 1.02;
    }

    .share-sheet-card .section-description,
    .share-sheet-card .field-note,
    .share-sheet-card .copy-feedback {
        font-size: 0.94rem;
        line-height: 1.55;
    }

    .share-sheet-pill {
        width: auto;
        max-width: 100%;
        justify-content: center;
        padding: 0.5rem 0.8rem;
        font-size: 0.78rem;
    }

    .share-link-panel {
        padding: 1rem;
        border-radius: 24px;
    }

    .share-link-input {
        font-size: 0.92rem;
    }

    .share-sheet-actions .btn {
        padding: 0.66rem 1rem;
        font-size: 0.95rem;
    }

    .share-qr-stage {
        gap: 0.85rem;
    }

    .share-qr-frame {
        width: min(100%, 240px);
        padding: 0.9rem;
        border-radius: 28px;
    }

    .share-qr-frame img {
        max-width: 190px;
        border-radius: 18px;
    }

    .share-sheet-close {
        top: 0.9rem;
        right: 0.9rem;
        width: 42px;
        height: 42px;
    }

    .share-sheet-actions .btn,
    .shared-public-nav-actions .btn {
        width: 100%;
    }

    .shared-public-nav-copy {
        text-align: center;
    }

    .menu-actions .btn,
    .menu-actions .btn-group > .btn,
    .library-entry-actions .btn,
    .form-actions .btn {
        padding: 0.66rem 1rem;
        font-size: 0.95rem;
    }

    .settings-row,
    .settings-row-form {
        grid-template-columns: 1fr;
        align-items: flex-start;
    }

    .settings-field {
        width: 100%;
    }

    .settings-field-avatar {
        grid-template-columns: 1fr;
        justify-items: start;
    }
}

@media (max-width: 575px) {
    .share-sheet {
        padding: 0.65rem;
    }

    .share-sheet-card {
        border-radius: 24px;
        max-height: calc(100vh - 1.3rem);
    }

    .share-sheet-copy,
    .share-qr-stage {
        padding: 1rem;
    }

    .share-sheet-card .section-title {
        margin-right: 2.5rem;
        font-size: clamp(1.56rem, 7.2vw, 1.95rem);
    }

    .share-sheet-card .section-description,
    .share-sheet-card .field-note,
    .share-sheet-card .copy-feedback {
        font-size: 0.9rem;
    }

    .share-link-panel {
        padding: 0.9rem;
        border-radius: 22px;
    }

    .share-qr-frame {
        width: min(100%, 210px);
        padding: 0.75rem;
        border-radius: 24px;
    }

    .share-qr-frame img {
        max-width: 168px;
        border-radius: 16px;
    }

    .share-sheet-actions .btn {
        font-size: 0.92rem;
    }
}

.page-shortcuts {
    display: none;
}

@media (min-width: 1440px) {
    .page-shortcuts {
        position: fixed;
        top: 9.35rem;
        left: max(0.75rem, calc((100vw - 1140px) / 2 - 154px));
        z-index: 760;
        display: grid;
        width: 138px;
        max-height: calc(100vh - 10rem);
        gap: 0.34rem;
        padding: 0.55rem;
        overflow: auto;
        border-left: 2px solid rgba(214, 120, 50, 0.46);
        border-radius: 0 20px 20px 0;
        background:
            linear-gradient(180deg, rgba(255, 255, 255, 0.42), rgba(255, 255, 255, 0.18)),
            rgba(16, 63, 70, 0.1);
        box-shadow: 0 18px 36px rgba(17, 36, 51, 0.08);
        backdrop-filter: blur(14px);
    }

    .page-shortcuts-title {
        color: var(--accent);
        font-size: 0.72rem;
        font-weight: 800;
        letter-spacing: 0.18em;
        text-transform: uppercase;
    }

    .page-shortcuts-link {
        display: block;
        width: 100%;
        padding: 0.52rem 0.58rem;
        border-radius: 14px;
        border: 1px solid rgba(255, 255, 255, 0.16);
        color: var(--ink);
        font-size: 0.78rem;
        font-weight: 800;
        line-height: 1.25;
        text-align: left;
        cursor: pointer;
        background: rgba(255, 255, 255, 0.34);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.36);
        transition: color 0.18s ease, background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
    }

    .page-shortcuts-link:hover,
    .page-shortcuts-link.is-active {
        transform: translateX(2px);
        color: #fff;
        border-color: rgba(255, 255, 255, 0.14);
        background: linear-gradient(135deg, rgba(31, 122, 112, 0.96), rgba(17, 93, 113, 0.92));
        box-shadow: 0 14px 26px rgba(18, 38, 58, 0.12);
    }
}

@media (max-width: 767px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    img,
    video,
    canvas {
        max-width: 100%;
    }

    .container.app-shell,
    .container.app-shell-wide,
    .app-shell,
    .app-shell-wide {
        width: 100%;
        max-width: 100%;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    .app-page-hero {
        margin-top: 0.9rem;
    }

    .section-shell,
    .book-hero,
    .auth-card {
        padding: 1rem;
        border-radius: 24px;
    }

    .soft-panel {
        padding: 1rem;
        border-radius: 22px;
    }

    .social-dashboard {
        grid-template-columns: 1fr;
    }

    .social-share-panel {
        position: static;
        max-height: none;
        overflow: visible;
    }

    .social-feed-card {
        grid-template-columns: 58px minmax(0, 1fr);
        padding: 0.85rem;
    }

    .social-feed-cover img {
        width: 58px;
        height: 84px;
    }

    .social-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .social-actions {
        grid-column: 1 / -1;
        flex-direction: row;
        min-width: 0;
    }

    .social-actions form,
    .social-actions .btn {
        width: auto;
    }

    .bulk-import-locked {
        align-items: flex-start;
        flex-direction: column;
    }

    .app-page-hero .page-title,
    .book-hero h1,
    .soul-hero .page-title {
        max-width: 100%;
        font-size: clamp(2.25rem, 11vw, 3rem);
        line-height: 1;
        overflow-wrap: anywhere;
    }

    .section-title {
        max-width: 100%;
        font-size: clamp(1.85rem, 8vw, 2.35rem);
        line-height: 1.02;
        overflow-wrap: anywhere;
    }

    .page-summary,
    .section-description,
    .field-note,
    .helper-note {
        font-size: 0.94rem;
        line-height: 1.58;
    }

    .section-heading,
    .section-toolbar {
        display: grid;
        grid-template-columns: 1fr;
        align-items: start;
        justify-items: stretch;
        gap: 0.75rem;
    }

    .form-grid,
    .form-grid-compact,
    .plan-editor-grid,
    .soul-layout,
    .soul-signal-grid,
    .soul-hero,
    .soul-hero-orbit,
    .workspace-feature-grid,
    .trasloco-layout,
    .kpi-grid,
    .dual-panel-grid,
    .split-grid {
        grid-template-columns: 1fr !important;
    }

    .tag-row {
        gap: 0.5rem;
    }

    .tag-chip {
        max-width: 100%;
        white-space: normal;
        overflow-wrap: anywhere;
        line-height: 1.35;
    }

    .soul-path-card {
        grid-template-columns: 1fr;
    }

    .soul-path-marker {
        width: 48px;
        height: 48px;
        border-radius: 16px;
    }

    .soul-chat-log {
        max-height: none;
        overflow: visible;
        padding-right: 0;
    }

    .soul-chat-bubble {
        width: 100%;
    }

    .detail-item {
        display: grid;
        grid-template-columns: 1fr;
        gap: 0.35rem;
    }

    .detail-item span,
    .detail-item a {
        text-align: left;
        overflow-wrap: anywhere;
    }

    .checklist-option,
    .position-checklist-option,
    .selected-book-item,
    .search-preview-item {
        min-width: 0;
    }

    .position-list-scroll,
    .transfer-shortlist-scroll {
        max-height: none;
        overflow: visible;
        padding-right: 0;
    }
}

@media (max-width: 575px) {
    .container.app-shell,
    .container.app-shell-wide,
    .app-shell,
    .app-shell-wide {
        padding-left: 0.55rem;
        padding-right: 0.55rem;
    }

    .section-shell,
    .book-hero,
    .auth-card,
    .soft-panel {
        border-radius: 20px;
    }

    .app-page-hero .page-title,
    .book-hero h1,
    .soul-hero .page-title {
        font-size: clamp(2rem, 10.5vw, 2.65rem);
    }
}