:root {
  --fu-navy: #12264a;
  --fu-blue: #315fea;
  --fu-violet: #7756e8;
  --fu-bg: #f4f7fc;
  --fu-text: #172033;
  --fu-muted: #667085;
  --fu-border: #e4e9f2;
  --fu-white: #fff;
  --fu-success: #17875b;
  --fu-warning: #c27a13;
  --fu-error: #c84040;
  --fu-radius: 18px;
  --fu-shadow: 0 18px 45px rgba(18, 38, 74, .10);
}
.fu-shell, .fu-directory, .fu-tool-workspace, .fu-dashboard { width: min(calc(100% - 32px), 1240px); margin-inline: auto; }
.fu-section { padding: clamp(58px, 8vw, 104px) 0; }
.fu-section-soft { background: linear-gradient(180deg, rgba(244,247,252,.2), rgba(238,242,255,.95)); border-block: 1px solid var(--fu-border); }
.fu-eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--fu-blue); font-weight: 800; font-size: 12px; letter-spacing: .09em; text-transform: uppercase; }
.fu-eyebrow::before { content: ''; width: 18px; height: 2px; background: linear-gradient(90deg, var(--fu-blue), var(--fu-violet)); border-radius: 3px; }
.fu-btn { appearance: none; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 22px; border: 1px solid transparent; border-radius: 12px; font: inherit; font-size: 14px; font-weight: 800; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease; }
.fu-btn:hover { transform: translateY(-1px); text-decoration: none; }
.fu-btn:disabled { opacity: .55; cursor: wait; transform: none; }
.fu-btn-primary { color: #fff; background: linear-gradient(135deg, var(--fu-blue), var(--fu-violet)); box-shadow: 0 12px 24px rgba(49,95,234,.22); }
.fu-btn-primary:hover { color: #fff; box-shadow: 0 16px 30px rgba(49,95,234,.28); }
.fu-btn-secondary { color: var(--fu-navy); background: #fff; border-color: var(--fu-border); }
.fu-btn-light { color: var(--fu-blue); background: #fff; }
.fu-btn-block { width: 100%; }
.fu-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.fu-hero { position: relative; overflow: hidden; background: radial-gradient(circle at 75% 15%, rgba(119,86,232,.17), transparent 32%), linear-gradient(180deg, #fff, #f5f7ff); border-bottom: 1px solid var(--fu-border); }
.fu-hero-grid { min-height: 660px; display: grid; grid-template-columns: minmax(0, .95fr) minmax(480px, 1.05fr); align-items: center; gap: clamp(40px, 7vw, 90px); padding-block: 76px; }
.fu-hero-copy { position: relative; z-index: 2; }
.fu-hero h1 { margin: 16px 0 20px; max-width: 720px; color: var(--fu-navy); font-family: Manrope, Inter, sans-serif; font-size: clamp(44px, 5.8vw, 76px); line-height: 1.04; letter-spacing: -.045em; }
.fu-hero h1::after { content: ''; display: inline-block; width: .22em; height: .22em; margin-left: .06em; border-radius: 50%; background: var(--fu-violet); }
.fu-hero-copy > p { max-width: 630px; margin: 0 0 30px; color: var(--fu-muted); font-size: clamp(17px, 2vw, 20px); }
.fu-trust-row { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 26px; color: var(--fu-muted); font-size: 13px; font-weight: 650; }
.fu-trust-row span::first-letter { color: var(--fu-success); }
.fu-hero-visual { position: relative; min-height: 470px; }
.fu-visual-window { position: absolute; z-index: 2; left: 4%; top: 10%; width: 88%; aspect-ratio: 1.35; overflow: hidden; border: 8px solid rgba(255,255,255,.72); border-radius: 28px; background: #fff; box-shadow: 0 40px 80px rgba(39,50,110,.22); transform: perspective(900px) rotateY(-7deg) rotateX(2deg); }
.fu-window-top { height: 42px; display: flex; align-items: center; gap: 7px; padding: 0 16px; color: var(--fu-muted); background: #fbfcff; border-bottom: 1px solid var(--fu-border); font-size: 11px; font-weight: 800; }
.fu-window-top i { width: 8px; height: 8px; border-radius: 50%; background: #dce2f1; }
.fu-window-top span { margin-left: auto; }
.fu-window-body { height: calc(100% - 42px); display: grid; grid-template-columns: 24% 1fr; }
.fu-mini-sidebar { padding: 26px 18px; background: var(--fu-navy); }
.fu-mini-sidebar b { display: block; width: 80%; height: 10px; margin: 0 0 16px; border-radius: 6px; background: rgba(255,255,255,.16); }
.fu-mini-sidebar b:first-child { width: 100%; height: 30px; background: linear-gradient(135deg, var(--fu-blue), var(--fu-violet)); }
.fu-mini-main { padding: 28px; background: #f8faff; }
.fu-mini-title { width: 55%; height: 20px; border-radius: 8px; background: #dfe5f4; }
.fu-mini-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 24px 0; }
.fu-mini-stats i { height: 62px; border-radius: 12px; background: #fff; box-shadow: 0 7px 18px rgba(20,38,74,.07); }
.fu-mini-chart { height: 120px; padding: 18px; border-radius: 14px; background: #fff; }
.fu-mini-chart span { display: block; height: 100%; background: linear-gradient(180deg, rgba(49,95,234,.22), transparent), linear-gradient(145deg, transparent 45%, var(--fu-blue) 46%, var(--fu-blue) 49%, transparent 50%); border-radius: 10px; }
.fu-floating-card { position: absolute; z-index: 4; display: flex; align-items: center; gap: 10px; padding: 13px 16px; color: var(--fu-navy); background: rgba(255,255,255,.94); border: 1px solid rgba(255,255,255,.8); border-radius: 14px; box-shadow: 0 16px 32px rgba(34,49,105,.17); font-weight: 800; font-size: 13px; backdrop-filter: blur(10px); }
.fu-floating-card:first-letter { color: var(--fu-violet); font-size: 20px; }
.fu-floating-one { left: -2%; top: 4%; }
.fu-floating-two { right: -1%; bottom: 17%; }
.fu-church-illustration { position: absolute; right: 6%; bottom: -5px; width: 150px; height: 155px; filter: drop-shadow(0 20px 30px rgba(55,70,140,.15)); opacity: .96; }
.fu-building { position: absolute; left: 18px; bottom: 0; width: 115px; height: 80px; border-radius: 10px 10px 4px 4px; background: linear-gradient(135deg, #e9edff, #cdd8ff); }
.fu-roof { position: absolute; left: 11px; bottom: 68px; width: 128px; height: 75px; clip-path: polygon(50% 0, 100% 100%, 0 100%); background: linear-gradient(135deg, #9fb4ff, #657ee8); }
.fu-cross { position: absolute; z-index: 2; left: 65px; top: -11px; color: var(--fu-blue); font-size: 40px; }
.fu-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 32px; }
.fu-section-heading h2 { margin: 8px 0 0; color: var(--fu-navy); font-family: Manrope, sans-serif; font-size: clamp(30px, 4vw, 44px); letter-spacing: -.03em; }
.fu-heading-centered { justify-content: center; text-align: center; }
.fu-tool-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; }
.fu-tool-card { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 16px; min-width: 0; padding: 22px; background: #fff; border: 1px solid var(--fu-border); border-radius: var(--fu-radius); box-shadow: 0 10px 30px rgba(18,38,74,.055); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.fu-tool-card:hover { transform: translateY(-4px); border-color: rgba(49,95,234,.26); box-shadow: var(--fu-shadow); }
.fu-tool-card[hidden] { display: none; }
.fu-tool-icon { flex: 0 0 auto; display: grid; place-items: center; width: 50px; height: 50px; border-radius: 15px; color: var(--fu-blue); background: linear-gradient(135deg, #eff3ff, #eee9ff); font-size: 22px; }
.fu-tool-card h2, .fu-tool-card h3 { margin: 8px 0; color: var(--fu-navy); font-size: 17px; line-height: 1.3; }
.fu-tool-card p { margin: 0 0 16px; color: var(--fu-muted); font-size: 13px; line-height: 1.55; }
.fu-card-link, .fu-tool-card a { color: var(--fu-blue); font-size: 13px; font-weight: 800; }
.fu-card-link.is-muted { color: var(--fu-muted); }
.fu-status-badge { display: inline-flex; width: max-content; padding: 4px 8px; border-radius: 999px; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.fu-status-active { color: #086a46; background: #e6f8ef; }
.fu-status-planned { color: #936000; background: #fff4d9; }
.fu-category-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 16px; }
.fu-category-card { text-align: center; padding: 26px 18px; background: rgba(255,255,255,.74); border: 1px solid rgba(228,233,242,.9); border-radius: var(--fu-radius); }
.fu-category-card > span { display: grid; place-items: center; width: 54px; height: 54px; margin: 0 auto 14px; border-radius: 16px; color: var(--fu-blue); background: linear-gradient(135deg, #eaf0ff, #f2eaff); font-size: 22px; }
.fu-category-card h3 { margin: 0 0 7px; color: var(--fu-navy); }
.fu-category-card p { margin: 0; color: var(--fu-muted); font-size: 13px; }
.fu-mission-banner { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: clamp(32px, 5vw, 56px); color: #fff; border-radius: 28px; background: radial-gradient(circle at 80% 0, rgba(255,255,255,.22), transparent 30%), linear-gradient(135deg, var(--fu-navy), var(--fu-blue) 60%, var(--fu-violet)); box-shadow: 0 30px 70px rgba(49,95,234,.24); }
.fu-mission-banner .fu-eyebrow { color: #dce4ff; }
.fu-mission-banner .fu-eyebrow::before { background: #fff; }
.fu-mission-banner h2 { margin: 10px 0; font-size: clamp(30px, 4vw, 46px); }
.fu-mission-banner p { max-width: 720px; margin: 0; color: rgba(255,255,255,.8); }
.fu-directory { padding-block: clamp(48px, 7vw, 84px); }
.fu-directory-head { padding: clamp(28px, 5vw, 54px); margin-bottom: 28px; color: #fff; border-radius: 26px; background: radial-gradient(circle at 85% 10%, rgba(255,255,255,.2), transparent 32%), linear-gradient(135deg, var(--fu-navy), var(--fu-blue), var(--fu-violet)); }
.fu-directory-head .fu-eyebrow { color: rgba(255,255,255,.8); }
.fu-directory-head .fu-eyebrow::before { background: #fff; }
.fu-directory-head h1 { margin: 10px 0; font-size: clamp(36px, 5vw, 58px); letter-spacing: -.04em; }
.fu-directory-head > p { max-width: 700px; margin: 0 0 28px; color: rgba(255,255,255,.8); }
.fu-directory-controls { display: grid; grid-template-columns: 1fr 230px; gap: 12px; }
.fu-search-field { display: flex; align-items: center; gap: 10px; min-height: 50px; padding: 0 16px; color: var(--fu-muted); background: #fff; border-radius: 12px; }
.fu-search-field input { flex: 1; border: 0; outline: 0; background: transparent; font: inherit; }
.fu-directory-controls select { border: 0; border-radius: 12px; padding: 0 14px; background: #fff; }
.fu-empty-filter { text-align: center; padding: 60px 20px; color: var(--fu-muted); }
.fu-tool-workspace { padding-block: clamp(36px, 6vw, 72px); }
.fu-tool-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.fu-tool-header h1 { margin: 8px 0; color: var(--fu-navy); font-size: clamp(32px, 4vw, 50px); letter-spacing: -.035em; }
.fu-tool-header p { max-width: 760px; margin: 0; color: var(--fu-muted); }
.fu-tool-header-actions { display: flex; gap: 10px; flex: 0 0 auto; }
.fu-tool-layout { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(330px,.75fr); align-items: start; gap: 22px; }
.fu-tool-panel, .fu-panel { min-width: 0; padding: clamp(22px, 3vw, 32px); background: #fff; border: 1px solid var(--fu-border); border-radius: var(--fu-radius); box-shadow: 0 12px 35px rgba(18,38,74,.065); }
.fu-result-panel { position: sticky; top: 96px; }
.fu-field { display: grid; gap: 8px; margin-bottom: 18px; color: var(--fu-navy); font-size: 13px; font-weight: 750; }
.fu-field input, .fu-field textarea, .fu-field select { width: 100%; min-height: 46px; padding: 11px 13px; color: var(--fu-text); background: #fbfcff; border: 1px solid var(--fu-border); border-radius: 11px; font: inherit; font-weight: 500; outline: none; transition: border-color .15s, box-shadow .15s; }
.fu-field textarea { resize: vertical; line-height: 1.65; }
.fu-field input:focus, .fu-field textarea:focus, .fu-field select:focus { border-color: var(--fu-blue); box-shadow: 0 0 0 3px rgba(49,95,234,.10); }
.fu-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 14px; }
.fu-field-grid-three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.fu-result-hero { padding: 24px; margin-bottom: 18px; text-align: center; border-radius: 16px; background: linear-gradient(145deg, #eef3ff, #f1eaff); }
.fu-result-hero span { display: block; color: var(--fu-muted); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.fu-result-hero strong { display: block; margin: 8px 0; color: var(--fu-navy); font-size: clamp(28px, 4vw, 42px); line-height: 1.1; }
.fu-result-hero small { color: var(--fu-muted); }
.fu-result-metric { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--fu-border); color: var(--fu-muted); font-size: 13px; }
.fu-result-metric strong { color: var(--fu-navy); }
.fu-result-tip { padding: 14px; margin-top: 18px; color: #7c5704; background: #fff8df; border: 1px solid #f4e5a4; border-radius: 12px; font-size: 12px; line-height: 1.55; }
.fu-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 16px; }
.fu-panel-head h2 { margin: 0; color: var(--fu-navy); font-size: 18px; }
.fu-icon-button { display: inline-grid; place-items: center; width: 34px; height: 34px; padding: 0; color: var(--fu-muted); background: #f4f7fc; border: 1px solid var(--fu-border); border-radius: 9px; cursor: pointer; }
.fu-chord-output { min-height: 480px; max-height: 720px; overflow: auto; padding: 22px; margin: 0; white-space: pre-wrap; color: var(--fu-navy); background: #f8faff; border: 1px solid var(--fu-border); border-radius: 14px; font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace; font-size: 14px; line-height: 1.75; }
.fu-weekday-fieldset { padding: 0; margin: 0 0 20px; border: 0; }
.fu-weekday-fieldset legend { margin-bottom: 10px; color: var(--fu-navy); font-size: 13px; font-weight: 750; }
.fu-weekday-fieldset label { display: inline-block; margin: 0 5px 7px 0; }
.fu-weekday-fieldset input { position: absolute; opacity: 0; }
.fu-weekday-fieldset span { display: inline-grid; place-items: center; min-width: 45px; height: 38px; padding: 0 9px; color: var(--fu-muted); background: #f6f8fc; border: 1px solid var(--fu-border); border-radius: 10px; font-size: 12px; font-weight: 750; cursor: pointer; }
.fu-weekday-fieldset input:checked + span { color: #fff; background: var(--fu-blue); border-color: var(--fu-blue); }
.fu-reading-plan-table-wrap { max-height: 560px; overflow: auto; border: 1px solid var(--fu-border); border-radius: 13px; }
.fu-reading-plan-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.fu-reading-plan-table th { position: sticky; top: 0; z-index: 1; text-align: left; padding: 12px; color: var(--fu-navy); background: #eef3ff; }
.fu-reading-plan-table td { padding: 11px 12px; border-top: 1px solid var(--fu-border); vertical-align: top; }
.fu-toast { position: fixed; z-index: 99999; right: 24px; bottom: 24px; max-width: 360px; padding: 14px 18px; color: #fff; background: var(--fu-success); border-radius: 12px; box-shadow: 0 18px 40px rgba(0,0,0,.18); font-weight: 700; }
.fu-toast[data-type="error"] { background: var(--fu-error); }
.fu-toast[data-type="warning"] { background: var(--fu-warning); }
.fu-login-required { max-width: 600px; margin: 70px auto; padding: 48px; text-align: center; background: #fff; border: 1px solid var(--fu-border); border-radius: 24px; box-shadow: var(--fu-shadow); }
.fu-login-required .fu-tool-icon { margin: auto; }
.fu-login-required h2 { color: var(--fu-navy); }
.fu-login-required .fu-actions { justify-content: center; }
.fu-auth-card { max-width: 480px; margin: 70px auto; padding: 36px; background: #fff; border: 1px solid var(--fu-border); border-radius: 22px; box-shadow: var(--fu-shadow); }
.fu-auth-card label { color: var(--fu-navy); font-weight: 700; }
.fu-auth-card input[type="text"], .fu-auth-card input[type="password"] { width: 100%; min-height: 46px; border: 1px solid var(--fu-border); border-radius: 10px; }
.fu-auth-card input[type="submit"] { width: 100%; min-height: 46px; color: #fff; background: var(--fu-blue); border: 0; border-radius: 10px; font-weight: 800; }
.fu-dashboard { display: grid; grid-template-columns: 250px minmax(0,1fr); min-height: 720px; margin-block: 32px; overflow: hidden; background: #f5f7fc; border: 1px solid var(--fu-border); border-radius: 24px; box-shadow: var(--fu-shadow); }
.fu-dashboard-sidebar { display: flex; flex-direction: column; color: #fff; background: linear-gradient(180deg, #102445, #0b1b38); }
.fu-dashboard-brand { display: flex; align-items: center; gap: 10px; padding: 26px 24px; border-bottom: 1px solid rgba(255,255,255,.1); font-size: 19px; font-weight: 850; }
.fu-dashboard-brand span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg, var(--fu-blue), var(--fu-violet)); }
.fu-dashboard-sidebar nav { display: grid; gap: 5px; padding: 20px 14px; }
.fu-dashboard-sidebar nav a { display: flex; align-items: center; gap: 12px; padding: 12px 13px; color: rgba(255,255,255,.72); border-radius: 10px; font-size: 13px; font-weight: 700; }
.fu-dashboard-sidebar nav a:hover, .fu-dashboard-sidebar nav a.is-current { color: #fff; text-decoration: none; background: linear-gradient(135deg, rgba(49,95,234,.78), rgba(119,86,232,.72)); }
.fu-sidebar-user { display: flex; align-items: center; gap: 10px; margin-top: auto; padding: 18px; border-top: 1px solid rgba(255,255,255,.1); }
.fu-sidebar-user img { border-radius: 50%; }
.fu-sidebar-user strong, .fu-sidebar-user small { display: block; }
.fu-sidebar-user small { color: rgba(255,255,255,.56); font-size: 10px; }
.fu-dashboard-main { min-width: 0; padding: clamp(22px, 4vw, 38px); }
.fu-dashboard-top { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.fu-dashboard-top h1 { margin: 5px 0 0; color: var(--fu-navy); font-size: clamp(27px, 4vw, 38px); }
.fu-stat-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin: 26px 0; }
.fu-stat-card { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; padding: 19px; background: #fff; border: 1px solid var(--fu-border); border-radius: 15px; }
.fu-stat-card > span { grid-row: 1 / span 2; display: grid; place-items: center; width: 40px; height: 40px; color: var(--fu-blue); background: #eef3ff; border-radius: 12px; }
.fu-stat-card strong { color: var(--fu-navy); font-size: 22px; line-height: 1; }
.fu-stat-card small { color: var(--fu-muted); font-size: 10px; }
.fu-dashboard-grid { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(300px,.65fr); align-items: start; gap: 18px; }
.fu-project-list { display: grid; }
.fu-project-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 13px 0; border-top: 1px solid var(--fu-border); }
.fu-project-row:first-child { border-top: 0; }
.fu-project-icon { display: grid; place-items: center; width: 40px; height: 40px; color: var(--fu-blue); background: #eff3ff; border-radius: 11px; }
.fu-project-row strong, .fu-project-row small { display: block; }
.fu-project-row strong { color: var(--fu-navy); font-size: 13px; }
.fu-project-row small { color: var(--fu-muted); font-size: 10px; }
.fu-quick-tool-list { display: grid; gap: 8px; }
.fu-quick-tool-list a { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 11px; color: var(--fu-text); background: #f8faff; border: 1px solid var(--fu-border); border-radius: 11px; }
.fu-quick-tool-list a:hover { text-decoration: none; border-color: rgba(49,95,234,.3); }
.fu-quick-tool-list > a > span { display: grid; place-items: center; width: 34px; height: 34px; color: var(--fu-blue); background: #fff; border-radius: 9px; }
.fu-quick-tool-list strong, .fu-quick-tool-list small { display: block; }
.fu-quick-tool-list strong { font-size: 12px; }
.fu-quick-tool-list small { color: var(--fu-muted); font-size: 9px; }
.fu-empty-state { text-align: center; padding: 50px 20px; color: var(--fu-muted); }
.fu-empty-state > span { font-size: 32px; color: var(--fu-violet); }
@media (max-width: 980px) {
  .fu-hero-grid { grid-template-columns: 1fr; min-height: auto; }
  .fu-hero-copy { text-align: center; }
  .fu-hero-copy > p { margin-inline: auto; }
  .fu-actions, .fu-trust-row { justify-content: center; }
  .fu-hero-visual { min-height: 420px; max-width: 720px; width: 100%; margin-inline: auto; }
  .fu-tool-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .fu-category-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .fu-tool-layout { grid-template-columns: 1fr; }
  .fu-result-panel { position: static; }
  .fu-dashboard { grid-template-columns: 82px minmax(0,1fr); }
  .fu-dashboard-brand { justify-content: center; padding-inline: 10px; font-size: 0; }
  .fu-dashboard-sidebar nav a { justify-content: center; }
  .fu-dashboard-sidebar nav a span, .fu-sidebar-user div { display: none; }
  .fu-sidebar-user { justify-content: center; }
  .fu-stat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .fu-dashboard-grid { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .fu-shell, .fu-directory, .fu-tool-workspace, .fu-dashboard { width: min(calc(100% - 20px), 1240px); }
  .fu-hero-grid { padding-block: 54px; }
  .fu-hero h1 { font-size: 42px; }
  .fu-hero-visual { min-height: 310px; }
  .fu-visual-window { left: 2%; width: 96%; border-width: 5px; border-radius: 20px; transform: none; }
  .fu-floating-card { display: none; }
  .fu-church-illustration { width: 95px; height: 100px; opacity: .7; }
  .fu-tool-grid, .fu-category-grid { grid-template-columns: 1fr; }
  .fu-tool-card { padding: 17px; }
  .fu-section-heading, .fu-tool-header, .fu-mission-banner, .fu-dashboard-top { align-items: stretch; flex-direction: column; }
  .fu-directory-controls { grid-template-columns: 1fr; }
  .fu-directory-controls select { min-height: 50px; }
  .fu-field-grid, .fu-field-grid-three { grid-template-columns: 1fr; }
  .fu-tool-header-actions .fu-btn { flex: 1; }
  .fu-chord-output { min-height: 330px; }
  .fu-dashboard { display: block; margin-block: 10px; border-radius: 18px; }
  .fu-dashboard-sidebar { position: sticky; top: 0; z-index: 10; display: block; }
  .fu-dashboard-brand, .fu-sidebar-user { display: none; }
  .fu-dashboard-sidebar nav { display: flex; overflow-x: auto; padding: 8px; }
  .fu-dashboard-sidebar nav a { flex: 0 0 auto; padding: 10px 13px; }
  .fu-dashboard-sidebar nav a span { display: inline; }
  .fu-dashboard-main { padding: 18px 14px; }
  .fu-stat-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .fu-stat-card { padding: 13px; }
  .fu-stat-card > span { width: 34px; height: 34px; }
  .fu-stat-card strong { font-size: 17px; }
  .fu-toast { left: 12px; right: 12px; bottom: 12px; max-width: none; }
}
@media print {
  .fu-site-header, .fu-site-footer, .fu-tool-header-actions, .fu-dashboard-sidebar, .fu-btn, .fu-toast { display: none !important; }
  body { background: #fff !important; }
  .fu-tool-workspace, .fu-dashboard { width: 100%; padding: 0; margin: 0; box-shadow: none; border: 0; }
  .fu-tool-layout { display: block; }
  .fu-tool-panel, .fu-panel { box-shadow: none; border-color: #bbb; break-inside: avoid; margin-bottom: 18px; }
  .fu-result-panel { position: static; }
  .fu-reading-plan-table-wrap, .fu-chord-output { max-height: none; overflow: visible; }
}

/* v0.2.0 — Service planner and slide generator */
.fu-field-grid-four{grid-template-columns:repeat(4,minmax(0,1fr))}
.fu-btn-small{min-height:38px;padding:0 14px;font-size:13px}
.fu-service-meta{margin-bottom:20px}
.fu-service-template-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:18px;padding-top:16px;border-top:1px solid var(--fu-border,#e4e9f2)}
.fu-service-template-bar>span{font-size:13px;font-weight:700;color:var(--fu-muted,#667085);margin-right:4px}
.fu-chip{border:1px solid var(--fu-border,#e4e9f2);background:#fff;color:var(--fu-text,#172033);min-height:34px;padding:0 12px;border-radius:999px;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.fu-chip:hover,.fu-chip.is-active{border-color:var(--fu-blue,#315fea);color:var(--fu-blue,#315fea);background:#eef3ff}
.fu-service-layout{grid-template-columns:minmax(0,1.6fr) minmax(320px,.75fr)}
.fu-service-builder .fu-panel-head{align-items:flex-start}
.fu-service-builder .fu-panel-head p,.fu-slide-preview-panel .fu-panel-head p{margin:4px 0 0;color:var(--fu-muted,#667085);font-size:13px}
.fu-service-column-head,.fu-service-item{display:grid;grid-template-columns:34px minmax(150px,1.15fr) minmax(130px,.9fr) 74px minmax(150px,1fr) 88px;gap:10px;align-items:center}
.fu-service-column-head{padding:0 6px 8px;color:var(--fu-muted,#667085);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.fu-service-items{display:grid;gap:9px}
.fu-service-item{padding:10px;border:1px solid var(--fu-border,#e4e9f2);border-radius:14px;background:#fbfcff;transition:box-shadow .2s,border-color .2s,opacity .2s}
.fu-service-item:focus-within{border-color:#9aaefa;box-shadow:0 0 0 3px rgba(49,95,234,.08)}
.fu-service-item.is-dragging{opacity:.55;border-color:var(--fu-blue,#315fea);box-shadow:0 14px 30px rgba(18,38,74,.16)}
.fu-service-item input,.fu-service-item textarea{width:100%;min-height:40px;border:1px solid #dfe5ef;border-radius:9px;background:#fff;padding:8px 10px;font:inherit;font-size:13px;color:var(--fu-text,#172033)}
.fu-service-item textarea{resize:vertical;min-height:40px}
.fu-drag-handle{border:0;background:transparent;color:#98a2b3;font-size:20px;cursor:grab;padding:6px}
.fu-drag-handle:active{cursor:grabbing}
.fu-service-row-actions{display:flex;gap:3px;justify-content:flex-end}
.fu-service-row-actions button{width:25px;height:28px;border:0;border-radius:7px;background:#edf1f7;color:#596579;cursor:pointer;font-weight:800}
.fu-service-row-actions button:hover{background:#dfe7f4;color:var(--fu-navy,#12264a)}
.fu-service-row-actions button:last-child:hover{background:#fff0f0;color:#b42318}
.fu-service-add-wide{width:100%;margin-top:10px;min-height:42px;border:1px dashed #b8c4d8;background:#f8faff;color:var(--fu-blue,#315fea);border-radius:12px;font:inherit;font-weight:800;cursor:pointer}
.fu-service-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0 20px}
.fu-service-kpis>div{padding:12px 8px;border:1px solid var(--fu-border,#e4e9f2);border-radius:12px;background:#fafbfe;text-align:center}
.fu-service-kpis strong{display:block;color:var(--fu-navy,#12264a);font-size:15px}
.fu-service-kpis span{display:block;margin-top:3px;color:var(--fu-muted,#667085);font-size:11px}
.fu-service-preview{list-style:none;margin:0;padding:0;display:grid;gap:2px;max-height:560px;overflow:auto}
.fu-service-preview li{display:grid;grid-template-columns:70px minmax(0,1fr) 52px;gap:10px;align-items:start;padding:11px 4px;border-bottom:1px solid #edf0f5}
.fu-service-preview time{font-size:12px;font-weight:800;color:var(--fu-blue,#315fea)}
.fu-service-preview strong{display:block;font-size:13px;line-height:1.35}
.fu-service-preview small{display:block;color:var(--fu-muted,#667085);font-size:11px;line-height:1.4;margin-top:2px}
.fu-service-preview>li>span{font-size:11px;font-weight:700;text-align:right;color:#697586}
.fu-service-preview-empty{display:block!important;color:var(--fu-muted,#667085);text-align:center;padding:30px 10px!important}

.fu-slide-layout{grid-template-columns:minmax(340px,.82fr) minmax(0,1.35fr)}
.fu-segmented{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin-bottom:16px;border-radius:12px;background:#eef2f8}
.fu-segmented button{min-height:38px;border:0;border-radius:9px;background:transparent;color:#586579;font:inherit;font-size:13px;font-weight:800;cursor:pointer}
.fu-segmented button.is-active{background:#fff;color:var(--fu-blue,#315fea);box-shadow:0 4px 12px rgba(18,38,74,.08)}
.fu-inline-note{margin:14px 0 0;padding:10px 12px;border-radius:10px;background:#fff9e8;color:#806000;font-size:12px;line-height:1.5}
.fu-slide-preview-panel{min-width:0}
.fu-preview-actions{display:flex;gap:6px}
.fu-slide-stage-wrap{padding:12px;border:1px solid var(--fu-border,#e4e9f2);border-radius:16px;background:#eef2f8}
.fu-slide-stage{width:100%;display:flex;flex-direction:column;overflow:hidden;padding:8%;border-radius:11px;box-shadow:0 18px 45px rgba(18,38,74,.16);transition:aspect-ratio .2s;background:#12264a;color:#fff}
.fu-slide-stage.is-empty{aspect-ratio:16/9;align-items:center;justify-content:center;text-align:center;background:linear-gradient(135deg,#f5f7fb,#e9eef8);color:#667085;box-shadow:none}
.fu-slide-empty{display:grid;place-items:center;gap:5px}
.fu-slide-empty>span{display:grid;place-items:center;width:50px;height:50px;border-radius:15px;background:#fff;color:var(--fu-blue,#315fea);font-size:24px;box-shadow:0 8px 22px rgba(18,38,74,.08)}
.fu-slide-empty strong{font-size:15px;color:var(--fu-navy,#12264a)}
.fu-slide-empty small{font-size:12px}
.fu-slide-content{width:100%}
.fu-slide-lines{font-size:clamp(22px,4vw,var(--fu-slide-font-size,52px));font-weight:750;line-height:1.28;letter-spacing:-.015em;text-wrap:balance}
.fu-slide-lines>div+div{margin-top:.16em}
.fu-slide-content>small{display:block;margin-top:1.5em;color:var(--fu-slide-accent,#b8b7ff);font-size:clamp(13px,1.8vw,22px);font-weight:700}
.fu-slide-title-content span{display:block;color:var(--fu-slide-accent,#b8b7ff);font-size:clamp(11px,1.4vw,18px);font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.fu-slide-title-content h3{margin:.35em 0 .16em;color:inherit;font-size:clamp(30px,6vw,78px);line-height:1.05;letter-spacing:-.04em}
.fu-slide-title-content p{margin:0;color:var(--fu-slide-accent,#b8b7ff);font-size:clamp(13px,2vw,24px)}
.fu-slide-thumbnails{display:flex;gap:8px;margin-top:12px;padding:2px 2px 8px;overflow-x:auto;scroll-snap-type:x proximity}
.fu-slide-thumb{position:relative;flex:0 0 142px;min-height:74px;padding:12px 10px;border:2px solid transparent;border-radius:11px;background:#f3f6fb;color:#596579;text-align:left;font:inherit;font-size:10px;line-height:1.35;cursor:pointer;scroll-snap-align:start}
.fu-slide-thumb:hover,.fu-slide-thumb.is-current{border-color:var(--fu-blue,#315fea);background:#eef3ff;color:var(--fu-navy,#12264a)}
.fu-slide-thumb>span{position:absolute;right:6px;top:5px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#fff;color:var(--fu-blue,#315fea);font-size:9px;font-weight:800}
.fu-slide-thumb>div{padding-right:18px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.fu-slide-export-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:12px}
.fu-slide-export-actions .fu-btn{flex:1;min-width:190px}
.fu-slide-export-actions .fu-btn:disabled{opacity:.45;cursor:not-allowed}

@media(max-width:1100px){
  .fu-field-grid-four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fu-service-layout,.fu-slide-layout{grid-template-columns:1fr}
  .fu-service-summary{order:2}
}
@media(max-width:800px){
  .fu-service-column-head{display:none}
  .fu-service-item{grid-template-columns:28px minmax(0,1fr) 70px 82px;grid-template-areas:"drag title duration actions" "drag person person person" "drag notes notes notes";align-items:start}
  .fu-service-item .fu-drag-handle{grid-area:drag;align-self:center}
  .fu-service-item [data-fu-service-item-title]{grid-area:title}
  .fu-service-item [data-fu-service-item-person]{grid-area:person}
  .fu-service-item [data-fu-service-item-duration]{grid-area:duration}
  .fu-service-item [data-fu-service-item-notes]{grid-area:notes}
  .fu-service-row-actions{grid-area:actions}
}
@media(max-width:620px){
  .fu-field-grid-four{grid-template-columns:1fr}
  .fu-service-template-bar{align-items:stretch}
  .fu-service-template-bar>span{width:100%}
  .fu-chip{flex:1}
  .fu-service-item{grid-template-columns:24px minmax(0,1fr) 68px;grid-template-areas:"drag title duration" "drag person person" "drag notes notes" "drag actions actions"}
  .fu-service-row-actions{justify-content:flex-start}
  .fu-service-kpis{grid-template-columns:1fr 1fr}
  .fu-service-kpis>div:first-child{grid-column:1/-1}
  .fu-service-preview li{grid-template-columns:58px minmax(0,1fr) 44px}
  .fu-slide-stage-wrap{padding:6px}
  .fu-slide-controls .fu-field-grid-three{grid-template-columns:1fr 1fr}
  .fu-slide-export-actions{display:grid;grid-template-columns:1fr}
  .fu-slide-export-actions .fu-btn{min-width:0}
}
@media print{
  .fu-service-meta,.fu-service-builder .fu-panel-head .fu-btn,.fu-service-add-wide,.fu-service-column-head,.fu-service-row-actions,.fu-drag-handle,.fu-slide-controls,.fu-slide-thumbnails,.fu-slide-export-actions,.fu-preview-actions{display:none!important}
  .fu-service-layout,.fu-slide-layout{display:block!important}
  .fu-service-builder{display:none!important}
  .fu-service-summary,.fu-slide-preview-panel{border:0!important;box-shadow:none!important;padding:0!important}
  .fu-slide-stage-wrap{border:0!important;background:#fff!important;padding:0!important}
  .fu-slide-stage{box-shadow:none!important;break-inside:avoid}
}

.fu-tool-workspace [hidden]{display:none!important}