/* FDE Readiness Checker.
   Platform tool chrome — no oriental theme here, this is not a culture surface.
   No opacity:0 entrance state anywhere: the tool must render visible even if
   its own script never runs. */

#fde { max-width: 780px; margin: 0 auto; color: #1a1814; }
#fde *, #fde *::before, #fde *::after { box-sizing: border-box; }

.fde-head { margin-bottom: 1.4rem; }
.fde-title { font-family: 'DM Serif Display', Georgia, serif; font-size: clamp(1.5rem, 4vw, 2rem); margin: 0 0 .4rem; color: #1a1814; }
.fde-sub { font-size: .98rem; line-height: 1.65; color: #5c584f; margin: 0; max-width: 62ch; }
.fde-verdict { font-family: 'DM Serif Display', Georgia, serif; font-size: 1.2rem; line-height: 1.5; color: #1a1814; margin: 0; }

/* ── form ───────────────────────────────────────────────────────────────── */
.fde-grid { display: grid; gap: 1rem; }
@media (min-width: 720px) { .fde-grid { grid-template-columns: 1fr 1fr; } .fde-set:last-child { grid-column: 1 / -1; } }

.fde-set { border: 1px solid #e7e3db; border-radius: 12px; background: #fff; padding: 1rem 1.1rem 1.1rem; margin: 0; }
.fde-set legend { font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #b45309; padding: 0 .4rem; }

.fde-f { display: block; margin-bottom: .85rem; }
.fde-f:last-child { margin-bottom: 0; }
.fde-f-l { display: block; font-size: .9rem; font-weight: 600; color: #33302b; margin-bottom: .3rem; }
.fde-f-h { display: block; font-size: .78rem; color: #8a857c; margin-top: .25rem; line-height: 1.45; }
.fde-f input, .fde-f select {
    width: 100%; min-height: 44px; padding: .5rem .7rem; font: inherit; font-size: .95rem;
    color: #1a1814; background: #fff; border: 1px solid #d9d4ca; border-radius: 8px;
}
.fde-f input:focus, .fde-f select:focus { outline: 2px solid #e8622a; outline-offset: 1px; border-color: #e8622a; }

.fde-c { display: flex; align-items: flex-start; gap: .55rem; margin: .6rem 0 0; font-size: .9rem; line-height: 1.5; color: #33302b; cursor: pointer; min-height: 44px; align-items: center; }
.fde-c input { width: 18px; height: 18px; flex: 0 0 auto; accent-color: #e8622a; }

.fde-actions { margin-top: 1.3rem; display: flex; gap: .6rem; flex-wrap: wrap; }
.fde-btn {
    min-height: 44px; padding: .65rem 1.3rem; font: inherit; font-size: .95rem; font-weight: 700;
    color: #fff; background: #e8622a; border: 1px solid #e8622a; border-radius: 999px; cursor: pointer;
    transition: filter .15s, transform .15s;
}
.fde-btn:hover { filter: brightness(1.06); transform: translateY(-1px); }
.fde-btn--ghost { color: #33302b; background: #fff; border-color: #d9d4ca; }
.fde-priv { font-size: .8rem; color: #8a857c; margin: .8rem 0 0; }

/* ── results ────────────────────────────────────────────────────────────── */
.fde-domain {
    margin: 1.1rem 0 0; padding: .9rem 1.1rem; font-size: .95rem; line-height: 1.65;
    color: #33302b; background: #fff8ef; border-left: 3px solid #b45309; border-radius: 0 8px 8px 0;
}

.fde-gates { display: grid; gap: .9rem; margin-top: 1.3rem; }
.fde-g { border: 1px solid #e7e3db; border-left: 4px solid #cfcabf; border-radius: 12px; background: #fff; padding: 1rem 1.15rem; }
.fde-g.is-ok { border-left-color: #2f7d54; }
.fde-g.is-no { border-left-color: #b4472e; }

.fde-g-h { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; }
.fde-g-v { width: 22px; height: 22px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; font-size: .8rem; font-weight: 800; color: #fff; }
.fde-g-v.is-ok { background: #2f7d54; }
.fde-g-v.is-no { background: #b4472e; }
.fde-g-n { font-weight: 700; font-size: 1rem; color: #1a1814; }
.fde-g-k { font-family: ui-monospace, monospace; font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; color: #8a857c; border: 1px solid #e7e3db; border-radius: 999px; padding: .1rem .5rem; }
.fde-g-m { font-size: .84rem; color: #6b6760; margin: .4rem 0 0; }

.fde-bars { list-style: none; margin: .75rem 0 0; padding: 0; display: grid; gap: .6rem; }
.fde-bar { padding: .6rem .75rem; border-radius: 8px; background: #fbfaf8; border: 1px solid #efece6; }
.fde-bar--clear { background: #f3faf5; border-color: #d8ecdf; }
.fde-bar--short { background: #fdf5f3; border-color: #f2ddd6; }
.fde-bar.is-pref { opacity: .92; }

.fde-bar-h { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: .35rem; }
.fde-bar-l { font-size: .88rem; font-weight: 600; color: #33302b; }
.fde-t { font-family: ui-monospace, monospace; font-size: .62rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; padding: .12rem .5rem; border-radius: 999px; }
.fde-t--ok { color: #1e6b43; background: #d8ecdf; }
.fde-t--no { color: #96341f; background: #f7ddd5; }
.fde-t--pref { color: #8a6d1f; background: #f6ecd2; }
.fde-t--open { color: #5b5750; background: #e9e6e0; }

/* The provider's own words. Always visually distinct from our prose, so a
   reader can see at a glance what is quoted and what is ours. */
.fde-q { margin: 0; padding-left: .7rem; border-left: 2px solid #cfcabf; font-size: .88rem; line-height: 1.6; color: #4a463f; font-style: italic; }

.fde-note { font-size: .82rem; line-height: 1.55; color: #6b6760; margin: .7rem 0 0; }
.fde-note--warn { color: #96341f; }
.fde-note--absent { color: #5b5750; font-weight: 600; }
.fde-src { font-size: .78rem; color: #8a857c; margin: .6rem 0 0; }
.fde-src a { color: #b45309; }

.fde-excl { font-size: .8rem; line-height: 1.6; color: #8a857c; margin: 1.1rem 0 0; padding-top: .9rem; border-top: 1px solid #efece6; }
