/**
 * SG Group LCD — public styles (modern SaaS dashboard). Self-contained, no deps.
 * Brand navy #1f3a5f, white background, light cards, restrained accents.
 */

.sglcd {
	--sglcd-navy: #1f3a5f;
	--sglcd-navy-dark: #16314f;
	--sglcd-accent: #1f6fb2;
	--sglcd-border: #d9dee6;
	--sglcd-bg: #f6f8fb;
	--sglcd-card: #ffffff;
	--sglcd-text: #1f2733;
	--sglcd-muted: #5b6573;
	--sglcd-disabled: #9aa8bb;
	--sglcd-warn-bg: #fff7e6;
	--sglcd-warn-border: #f0c36d;
	max-width: 1100px;
	margin: 0 auto;
	color: var(--sglcd-text);
	font-size: 15px;
	line-height: 1.6;
	box-sizing: border-box;
}
.sglcd *, .sglcd *::before, .sglcd *::after { box-sizing: border-box; }

.sglcd h2 { font-size: 1.5rem; margin: 0 0 .6rem; }
.sglcd h3 { font-size: 1.15rem; margin: 0 0 .6rem; }

/* ---------------- Buttons (visibility-fixed) ---------------- */
.sglcd-btn,
a.sglcd-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .4rem;
	padding: .58rem 1.05rem;
	border: 1px solid var(--sglcd-border);
	border-radius: 10px;
	background: #fff;
	color: var(--sglcd-text);
	text-decoration: none;
	cursor: pointer;
	font-size: .95rem;
	font-weight: 600;
	line-height: 1.2;
	transition: background .15s, border-color .15s, box-shadow .15s, color .15s;
}
.sglcd-btn:hover { background: var(--sglcd-bg); }
.sglcd-btn:focus-visible { outline: 3px solid rgba(31, 111, 178, .45); outline-offset: 2px; }

.sglcd-btn--primary,
.sglcd-btn-primary,
a.sglcd-btn--primary,
a.sglcd-btn-primary {
	background: var(--sglcd-navy);
	color: #fff !important;
	border-color: var(--sglcd-navy);
}
.sglcd-btn--primary:hover,
.sglcd-btn-primary:hover,
a.sglcd-btn--primary:hover,
a.sglcd-btn-primary:hover {
	background: var(--sglcd-navy-dark);
	color: #fff !important;
}
.sglcd-btn--primary:disabled,
.sglcd-btn-primary:disabled,
.sglcd-btn--primary.is-disabled,
.sglcd-btn-primary.is-disabled {
	background: var(--sglcd-disabled);
	border-color: var(--sglcd-disabled);
	color: #fff !important;
	opacity: 1;
	cursor: not-allowed;
}
.sglcd-btn:disabled,
.sglcd-btn.is-disabled {
	background: #eef1f5;
	color: #6b7480;
	border-color: var(--sglcd-border);
	cursor: not-allowed;
	opacity: 1;
}
.sglcd-btn--ghost,
a.sglcd-btn--ghost {
	background: transparent;
	border-color: var(--sglcd-border);
	color: var(--sglcd-navy);
}
.sglcd-btn--ghost:hover { background: var(--sglcd-bg); color: var(--sglcd-navy); }
.sglcd-btn--small { padding: .34rem .7rem; font-size: .85rem; border-radius: 8px; }
.sglcd-btn.is-loading { opacity: .65; pointer-events: none; }

.sglcd-btn-row { display: flex; flex-wrap: wrap; gap: .5rem; margin: .7rem 0; }

/* ---------------- Forms ---------------- */
.sglcd-form { display: flex; flex-direction: column; gap: .55rem; max-width: 420px; }
.sglcd-form label { font-weight: 600; }
.sglcd input[type="text"],
.sglcd input[type="password"],
.sglcd input[type="number"],
.sglcd input[type="url"],
.sglcd input[type="email"],
.sglcd input[type="file"],
.sglcd select,
.sglcd textarea {
	width: 100%;
	padding: .55rem .7rem;
	border: 1px solid var(--sglcd-border);
	border-radius: 9px;
	font-size: 1rem;
	background: #fff;
	color: var(--sglcd-text);
}
.sglcd input:focus, .sglcd select:focus, .sglcd textarea:focus {
	outline: none;
	border-color: var(--sglcd-accent);
	box-shadow: 0 0 0 3px rgba(31, 111, 178, .15);
}
.sglcd-checkbox { font-weight: 400 !important; display: flex; gap: .45rem; align-items: flex-start; margin: .35rem 0; }
.sglcd-checkbox input { width: auto; }
.sglcd-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .7rem; margin: .6rem 0; }
.sglcd-form-grid label { display: flex; flex-direction: column; gap: .25rem; font-weight: 600; font-size: .9rem; }
.sglcd-fieldset { border: 1px solid var(--sglcd-border); border-radius: 10px; padding: .7rem 1rem; margin: .7rem 0; }
.sglcd-fieldset legend { font-weight: 700; padding: 0 .4rem; }

.sglcd-hint { font-size: .82rem; color: var(--sglcd-muted); margin: .4rem 0; }
.sglcd-status-line { min-height: 1.2em; font-weight: 600; }
.sglcd-links { margin-top: 1rem; font-size: .9rem; }
.sglcd-error { background: #fdeaea; border: 1px solid #e0a0a0; color: #8a1f1f; padding: .6rem .8rem; border-radius: 9px; margin-bottom: 1rem; }

.sglcd-notice { background: var(--sglcd-card); border: 1px solid var(--sglcd-border); border-radius: 12px; padding: 1.4rem; text-align: center; box-shadow: 0 1px 3px rgba(20,40,70,.05); }

/* ---------------- Badges / status ---------------- */
.sglcd-badge { padding: .18rem .6rem; border-radius: 999px; font-size: .72rem; font-weight: 800; letter-spacing: .03em; background: #e9eef7; }
.sglcd-badge-premium { background: #efe3ff; color: #6a2bd9; }
.sglcd-badge-pro { background: #e3f0ff; color: var(--sglcd-navy); }
.sglcd-status { padding: .16rem .6rem; border-radius: 999px; font-size: .74rem; background: #eef1f5; }
.sglcd-status-active, .sglcd-status-trialing, .sglcd-status-manually_granted { background: #e3f7e8; color: #1b7a37; }
.sglcd-status-past_due, .sglcd-status-paused, .sglcd-status-incomplete { background: #fff3df; color: #9a6a12; }
.sglcd-status-canceled, .sglcd-status-unpaid, .sglcd-status-refunded, .sglcd-status-expired, .sglcd-status-incomplete_expired { background: #fdeaea; color: #8a1f1f; }
.sglcd-grace { font-size: .75rem; color: #9a6a12; }

/* ---------------- Panels ---------------- */
.sglcd-panel { background: var(--sglcd-card); border: 1px solid var(--sglcd-border); border-radius: 12px; padding: 1.15rem 1.25rem; margin-bottom: 1rem; box-shadow: 0 1px 3px rgba(20,40,70,.04); }
.sglcd-server-notice { background: #eef6ff; border: 1px solid #bcd9ff; border-radius: 10px; padding: .65rem .9rem; font-size: .9rem; }
.sglcd-note { font-size: .82rem; color: var(--sglcd-muted); }

/* ---------------- App header ---------------- */
.sglcd-app-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .5rem; padding-bottom: .8rem; border-bottom: 2px solid var(--sglcd-border); margin-bottom: 1rem; }
.sglcd-app-meta { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }

/* ---------------- Dashboard ---------------- */
.sglcd-dash { background: var(--sglcd-bg); padding: 1.2rem; border-radius: 16px; }
.sglcd-dash-header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .6rem 1rem; padding: .2rem .2rem 1rem; border-bottom: 2px solid var(--sglcd-border); margin-bottom: 1.1rem; }
.sglcd-dash-title { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; }
.sglcd-dash-title h2 { margin: 0; }
.sglcd-dash-actions { display: flex; gap: .5rem; align-items: center; }

.sglcd-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .8rem; margin-bottom: 1.1rem; }
.sglcd-kpi { background: var(--sglcd-card); border: 1px solid var(--sglcd-border); border-radius: 12px; padding: .85rem 1rem; display: flex; flex-direction: column; gap: .25rem; box-shadow: 0 1px 3px rgba(20,40,70,.04); }
.sglcd-kpi-label { font-size: .76rem; color: var(--sglcd-muted); }
.sglcd-kpi-value { font-size: 1.35rem; font-weight: 800; color: var(--sglcd-navy); }

.sglcd-dash-layout { display: grid; grid-template-columns: 232px 1fr; gap: 1.1rem; align-items: start; }
.sglcd-sidebar ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .3rem; }
.sglcd-sidebar .sglcd-tab {
	display: flex; justify-content: space-between; align-items: center; gap: .5rem; width: 100%;
	text-align: left; padding: .62rem .85rem; border: 1px solid var(--sglcd-border); border-radius: 12px;
	background: var(--sglcd-card); cursor: pointer; font-size: .92rem; font-weight: 600; color: var(--sglcd-text);
	transition: background .15s, border-color .15s, color .15s;
}
.sglcd-sidebar .sglcd-tab:hover { background: #eef3fb; }
.sglcd-sidebar .sglcd-tab.is-active { background: var(--sglcd-navy); border-color: var(--sglcd-navy); color: #fff; }
.sglcd-sidebar .sglcd-tab.is-locked { color: var(--sglcd-muted); }
.sglcd-sidebar .sglcd-tab--upgrade { background: #efe3ff; border-color: #d9c3ff; color: #6a2bd9; text-decoration: none; justify-content: center; }
.sglcd-lock-pill { font-size: .8rem; }

.sglcd-content { min-width: 0; background: var(--sglcd-card); border: 1px solid var(--sglcd-border); border-radius: 14px; padding: 1.2rem 1.35rem; box-shadow: 0 1px 3px rgba(20,40,70,.04); }
.sglcd-module { display: none; }
.sglcd-module.is-active { display: block; }

/* Lock card */
.sglcd-lock { text-align: center; padding: 2rem 1rem; }
.sglcd-lock-icon { font-size: 2.4rem; margin-bottom: .4rem; }
.sglcd-lock h3 { margin-bottom: .3rem; }
.sglcd-lock p { color: var(--sglcd-muted); margin-bottom: 1rem; }

/* Overview / summary */
.sglcd-overview-grid, .sglcd-summary-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .7rem; margin: .8rem 0; }
.sglcd-mini { background: var(--sglcd-bg); border: 1px solid var(--sglcd-border); border-radius: 10px; padding: .6rem .8rem; display: flex; flex-direction: column; gap: .2rem; }
.sglcd-mini span { font-size: .76rem; color: var(--sglcd-muted); }
.sglcd-mini strong { font-size: 1.1rem; color: var(--sglcd-navy); }

.sglcd-result-card { background: var(--sglcd-bg); border: 1px solid var(--sglcd-border); border-radius: 10px; padding: .8rem 1rem; margin-top: .6rem; font-weight: 700; min-height: 1.4em; }
.sglcd-warn-box { margin-top: .6rem; }
.sglcd-warn-box .sglcd-warn { background: var(--sglcd-warn-bg); border: 1px solid var(--sglcd-warn-border); color: #8a5a12; border-radius: 9px; padding: .5rem .8rem; margin: .35rem 0; font-size: .88rem; }

/* Tables */
.sglcd-table-wrap { overflow-x: auto; margin: .7rem 0; }
.sglcd-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.sglcd-table th, .sglcd-table td { text-align: left; padding: .5rem .6rem; border-bottom: 1px solid var(--sglcd-border); white-space: nowrap; }
.sglcd-table th { color: var(--sglcd-muted); font-weight: 700; background: var(--sglcd-bg); }
.sglcd-table .sglcd-btn--small { padding: .2rem .5rem; }

.sglcd-csv-map { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .6rem; margin: .7rem 0; }
.sglcd-report-preview { border: 1px solid var(--sglcd-border); border-radius: 10px; padding: 1rem; margin-top: .7rem; background: #fff; }
.sglcd-report-preview table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.sglcd-report-preview th, .sglcd-report-preview td { border: 1px solid var(--sglcd-border); padding: .4rem .6rem; text-align: left; }

/* Consent */
.sglcd-consent { background: var(--sglcd-warn-bg); border: 1px solid var(--sglcd-warn-border); border-radius: 12px; padding: 1.2rem; margin-bottom: 1rem; }
.sglcd-consent label { display: flex; margin: .5rem 0; }

/* ---------------- Legal links (flex, no overlapping bullets) ---------------- */
.sglcd-legal { margin-top: 1.4rem; font-size: .85rem; color: var(--sglcd-muted); border-top: 1px solid var(--sglcd-border); padding-top: 1rem; }
.sglcd-legal-summary { margin-bottom: .6rem; }
.sglcd-legal-links { display: flex; flex-wrap: wrap; gap: 10px 18px; margin: .8rem 0 0; padding: 0; list-style: none; }
.sglcd-legal-links a { display: inline-flex; align-items: center; text-decoration: none; color: var(--sglcd-accent); }
.sglcd-legal-links a:hover { text-decoration: underline; }
.sglcd-legal-links a::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: var(--sglcd-disabled); margin-right: 8px; flex: 0 0 auto; }

/* ---------------- Vault ---------------- */
.sglcd-vault-warning { background: var(--sglcd-warn-bg); border: 1px solid var(--sglcd-warn-border); border-radius: 10px; padding: .8rem 1rem; margin: .6rem 0; font-size: .88rem; }
.sglcd-vault-warning p { margin: .25rem 0; }
.sglcd-vault-row { display: flex; flex-direction: column; gap: .3rem; margin: .6rem 0; max-width: 480px; }
.sglcd-vault-dropzone { border: 2px dashed var(--sglcd-border); border-radius: 12px; padding: 1.4rem; text-align: center; cursor: pointer; background: var(--sglcd-bg); margin: .6rem 0; }
.sglcd-vault-dropzone.is-dragover { border-color: var(--sglcd-accent); background: #eef6ff; }

/* Lot helper (legacy class kept) */
.sglcd-lot-helper { display: flex; flex-direction: column; gap: .5rem; max-width: 420px; }
.sglcd-field { display: flex; flex-direction: column; gap: .2rem; }
.sglcd-result { font-weight: 700; min-height: 1.2em; }

/* Account */
.sglcd-kv { border-collapse: collapse; width: 100%; max-width: 560px; }
.sglcd-kv th, .sglcd-kv td { text-align: left; padding: .45rem .6rem; border-bottom: 1px solid var(--sglcd-border); }
.sglcd-kv th { width: 40%; color: var(--sglcd-muted); font-weight: 600; }

/* Checkout */
.sglcd-checkout-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.sglcd-plan-card { border: 1px solid var(--sglcd-border); border-radius: 12px; padding: 1.15rem; background: var(--sglcd-card); }
.sglcd-checkout-actions { display: flex; flex-direction: column; gap: .5rem; }
.sglcd-checkout-login { margin-top: 1rem; }

/* Soft / dark themes (Customize) */
.sglcd-dash[data-theme="soft"] { --sglcd-bg: #eef2f8; }
.sglcd-dash[data-theme="dark"] { --sglcd-bg: #1b2430; --sglcd-card: #243042; --sglcd-text: #e9eef5; --sglcd-muted: #aab6c6; --sglcd-border: #38465a; }
.sglcd-dash[data-theme="dark"] .sglcd-kpi-value, .sglcd-dash[data-theme="dark"] .sglcd-mini strong { color: #cfe0f5; }

/* ---------------- Subscription-period card ---------------- */
.sglcd-sub-card { border: 1px solid var(--sglcd-border); border-left-width: 4px; border-radius: 12px; background: var(--sglcd-card); padding: .9rem 1.1rem; margin: .2rem 0 1rem; box-shadow: 0 1px 3px rgba(20,40,70,.05); }
.sglcd-sub-head { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin-bottom: .5rem; }
.sglcd-sub-title { font-weight: 700; color: var(--sglcd-navy); }
.sglcd-sub-state { margin-left: auto; font-size: .8rem; font-weight: 600; padding: .1rem .55rem; border-radius: 999px; background: var(--sglcd-bg); border: 1px solid var(--sglcd-border); }
.sglcd-sub-grid { display: flex; flex-wrap: wrap; gap: 1.2rem; margin: .2rem 0 .6rem; }
.sglcd-sub-bar { height: 8px; border-radius: 999px; background: var(--sglcd-bg); border: 1px solid var(--sglcd-border); overflow: hidden; }
.sglcd-sub-bar > span { display: block; height: 100%; background: #2e8b57; }
.sglcd-sub--ok { border-left-color: #2e8b57; }
.sglcd-sub--ok .sglcd-sub-bar > span { background: #2e8b57; }
.sglcd-sub--warn { border-left-color: var(--sglcd-warn-border); }
.sglcd-sub--warn .sglcd-sub-bar > span { background: #d9a227; }
.sglcd-sub--danger { border-left-color: #c0392b; }
.sglcd-sub--danger .sglcd-sub-bar > span { background: #c0392b; }
.sglcd-sub--neutral { border-left-color: var(--sglcd-accent); }
.sglcd-sub--neutral .sglcd-sub-bar > span { background: var(--sglcd-accent); }
.sglcd-sub-state--ok { color: #1e7a46; }
.sglcd-sub-state--warn { color: #9a6b00; }
.sglcd-sub-state--danger { color: #a4271c; }

/* ---------------- Local Risk Guard verdict ---------------- */
.sglcd-rg-verdict { margin: .6rem 0; padding: .6rem .9rem; border-radius: 10px; font-weight: 700; border: 1px solid var(--sglcd-border); }
.sglcd-rg-verdict:empty { display: none; }
.sglcd-rg-verdict--ok { background: #eef8f1; border-color: #aedcc0; color: #1e7a46; }
.sglcd-rg-verdict--caution { background: var(--sglcd-warn-bg); border-color: var(--sglcd-warn-border); color: #9a6b00; }
.sglcd-rg-verdict--block { background: #fdecea; border-color: #e7a59d; color: #a4271c; }

/* ---------------- Premium lock card (single UNIFORM blurred background) ----------------
   One uniform, subtle blurred background for EVERY locked feature (no per-feature
   motif). The card foreground (name / catch / benefits / assurance / no-proration /
   CTA) is what matters. */
.sglcd-lock--themed { position: relative; overflow: hidden; border: 1px solid var(--sglcd-border); border-radius: 14px; background: var(--sglcd-card); padding: 1.6rem 1.4rem; text-align: center; min-height: 230px; display: flex; align-items: center; justify-content: center; }
.sglcd-lock-bg { position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .85; }
/* The single uniform background motif used by ALL locked features. */
.sglcd-lock-bg::before { content: ""; position: absolute; inset: -10%; background:
	linear-gradient( 135deg, rgba(31,58,95,.10), rgba(31,111,178,.06) 50%, rgba(31,58,95,.10) ),
	radial-gradient( 70% 60% at 50% 0%, rgba(31,111,178,.12), rgba(31,111,178,0) 70% );
	filter: blur(8px); }
.sglcd-lock-main { position: relative; z-index: 1; max-width: 560px; }
.sglcd-lock--themed .sglcd-lock-icon { font-size: 1.7rem; }
.sglcd-lock-catch { font-weight: 700; color: var(--sglcd-navy); margin: .3rem 0 .7rem; font-size: 1.1rem; }
.sglcd-lock-benefits { display: inline-block; text-align: left; margin: .2rem auto .8rem; padding-left: 1.1rem; }
.sglcd-lock-benefits li { margin: .25rem 0; color: var(--sglcd-text); }
.sglcd-lock-benefits li::marker { color: var(--sglcd-accent); }
.sglcd-lock-assure { font-size: .82rem; color: var(--sglcd-muted); background: rgba(255,255,255,.7); border: 1px solid var(--sglcd-border); border-radius: 8px; padding: .45rem .7rem; display: inline-block; }
.sglcd-dash[data-theme="dark"] .sglcd-lock-assure { background: rgba(36,48,66,.7); }
.sglcd-lock-noprorate { font-size: .78rem; color: var(--sglcd-muted); margin: .2rem 0 .6rem; }

/* Admin period source badge. */
.sglcd-period-source { font-size: .76rem; font-weight: 600; padding: .05rem .4rem; border-radius: 999px; background: #eef2f8; color: #1f3a5f; }
.sglcd-period-source--manual, .sglcd-period-source--manual_ext { background: #eef8f1; color: #1e7a46; }
.sglcd-period-source--none { background: #f3f4f6; color: #5b6573; }

/* ---------------- Risk Budget rows ---------------- */
.sglcd-rb-row { display: grid; grid-template-columns: 1fr auto; gap: .4rem .8rem; align-items: center; padding: .55rem .7rem; margin: .4rem 0; border: 1px solid var(--sglcd-border); border-left-width: 4px; border-radius: 10px; background: var(--sglcd-card); }
.sglcd-rb-label { grid-column: 1 / -1; font-size: .86rem; color: var(--sglcd-text); }
.sglcd-rb-row .sglcd-sub-bar { grid-column: 1; }
.sglcd-rb-badge { grid-column: 2; grid-row: 2; font-size: .78rem; font-weight: 700; padding: .1rem .55rem; border-radius: 999px; }
.sglcd-rb-row--ok { border-left-color: #2e8b57; }
.sglcd-rb-row--warn { border-left-color: var(--sglcd-warn-border); }
.sglcd-rb-row--over { border-left-color: #c0392b; }
.sglcd-rb-badge--ok { color: #1e7a46; background: #eef8f1; }
.sglcd-rb-badge--warn { color: #9a6b00; background: var(--sglcd-warn-bg); }
.sglcd-rb-badge--over { color: #a4271c; background: #fdecea; }

/* ---------------- Pattern Drift flags ---------------- */
.sglcd-pd-row--slightly td:last-child { color: #9a6b00; font-weight: 600; }
.sglcd-pd-row--deviated td:last-child { color: #a4271c; font-weight: 700; }

/* ---------------- No-proration notice ---------------- */
.sglcd-noprorate { border-left: 3px solid var(--sglcd-warn-border); padding-left: .55rem; }
.sglcd-lock-noprorate { font-size: .78rem; color: var(--sglcd-muted); margin: .2rem 0 .5rem; }

/* ---------------- Vault multi-file import log ---------------- */
.sglcd-vimp-log { margin: .3rem 0; max-height: 9rem; overflow-y: auto; font-size: .82rem; }
.sglcd-vimp { padding: .15rem .3rem; border-radius: 6px; margin: .12rem 0; }
.sglcd-vimp.is-ok { color: #1e7a46; }
.sglcd-vimp.is-bad { color: #a4271c; }

/* ---------------- In-dashboard Manual ---------------- */
.sglcd-manual { max-height: 70vh; overflow-y: auto; padding-right: .4rem; }
.sglcd-manual-sec { border: 1px solid var(--sglcd-border); border-radius: 12px; background: var(--sglcd-card); padding: .9rem 1.1rem; margin: .7rem 0; }
.sglcd-manual-sec h4 { margin: 0 0 .4rem; color: var(--sglcd-navy); }
.sglcd-manual-h { margin: 1.2rem 0 .2rem; color: var(--sglcd-navy); border-top: 2px solid var(--sglcd-border); padding-top: .8rem; }
.sglcd-manual-badge { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .02em; color: #fff; background: var(--sglcd-navy); border-radius: 999px; padding: .12rem .55rem; margin-right: .4rem; vertical-align: middle; }
.sglcd-manual-badge.premium { background: var(--sglcd-accent); }
.sglcd-manual-steps { margin: .3rem 0 .4rem 1.1rem; }
.sglcd-manual-steps li { margin: .25rem 0; }
.sglcd-manual-note { font-size: .84rem; background: var(--sglcd-bg); border: 1px solid var(--sglcd-border); border-left: 3px solid var(--sglcd-accent); border-radius: 8px; padding: .5rem .7rem; margin: .4rem 0; color: var(--sglcd-text); }
.sglcd-manual-tip { font-size: .82rem; color: #9a6b00; background: var(--sglcd-warn-bg); border: 1px solid var(--sglcd-warn-border); border-radius: 8px; padding: .4rem .65rem; margin: .35rem 0; }
.sglcd-manual-upsell { font-size: .9rem; background: linear-gradient( 135deg, rgba(31,111,178,.08), rgba(31,58,95,.05) ); border: 1px solid var(--sglcd-border); border-radius: 12px; padding: .8rem 1rem; margin: .7rem 0; }

/* ---- Expanded manual: plan note, start card, TOC, sections ---- */
.sglcd-manual-plannote { display: block; font-size: .78rem; color: var(--sglcd-muted, #5b6573); margin-top: .35rem; }
.sglcd-manual-start { background: linear-gradient( 135deg, rgba(31,111,178,.10), rgba(31,58,95,.06) ); border: 1px solid var(--sglcd-border); border-left: 4px solid var(--sglcd-navy); border-radius: 12px; padding: .8rem 1rem; margin: .7rem 0; }
.sglcd-manual-start-h { font-weight: 800; color: var(--sglcd-navy); margin-bottom: .25rem; }
.sglcd-manual-start p { margin: 0; }
.sglcd-manual-toc { border: 1px solid var(--sglcd-border); border-radius: 12px; background: var(--sglcd-card); padding: .8rem 1rem; margin: .7rem 0; }
.sglcd-manual-toc-h { font-weight: 800; color: var(--sglcd-navy); margin-bottom: .4rem; }
.sglcd-manual-toc-list { counter-reset: sgtoc; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: .12rem .8rem; }
.sglcd-manual-toc-list > li { counter-increment: sgtoc; margin: 0; }
.sglcd-manual-toc-list > li a { text-decoration: none; color: var(--sglcd-text); font-size: .9rem; }
.sglcd-manual-toc-list > li a::before { content: counter(sgtoc) ". "; font-weight: 700; color: var(--sglcd-navy); }
.sglcd-manual-toc-list > li a:hover { text-decoration: underline; }
.sglcd-manual-body { counter-reset: sgsec; }
.sglcd-manual-body > .sglcd-manual-sec { counter-increment: sgsec; scroll-margin-top: .6rem; }
.sglcd-manual-sec-h::before { content: counter(sgsec) ". "; color: var(--sglcd-accent); font-weight: 800; }
.sglcd-manual-backtop { margin: .5rem 0 0; text-align: right; }
.sglcd-manual-backtop a { font-size: .78rem; text-decoration: none; color: var(--sglcd-muted, #5b6573); }
.sglcd-manual-printnote { margin-top: 1rem; }
/* checklist */
.sglcd-manual-check { list-style: none; margin: .3rem 0 .4rem .2rem; padding: 0; }
.sglcd-manual-check li { margin: .22rem 0; padding-left: 1.5rem; position: relative; }
.sglcd-manual-check li::before { content: "\2610"; position: absolute; left: 0; top: -.05rem; color: var(--sglcd-navy); font-size: 1.05rem; }
/* explained steps */
.sglcd-manual-steps2 { list-style: decimal; }
.sglcd-manual-steps2 li { margin: .45rem 0; }
.sglcd-manual-steps2 .sglcd-step-l { display: block; font-weight: 700; }
.sglcd-manual-steps2 .sglcd-step-d { display: block; font-size: .84rem; color: var(--sglcd-muted, #5b6573); margin-top: .12rem; }
/* table */
.sglcd-manual-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: .4rem 0; }
.sglcd-manual-table { border-collapse: collapse; width: 100%; font-size: .85rem; min-width: 18rem; }
.sglcd-manual-table th { background: var(--sglcd-navy); color: #fff; text-align: left; padding: .4rem .55rem; font-weight: 700; }
.sglcd-manual-table td { border: 1px solid var(--sglcd-border); padding: .4rem .55rem; vertical-align: top; }
.sglcd-manual-table tbody tr:nth-child(even) { background: var(--sglcd-bg); }
/* FAQ */
.sglcd-manual-faq { margin: .3rem 0; }
.sglcd-faq-item { border: 1px solid var(--sglcd-border); border-radius: 8px; margin: .3rem 0; background: var(--sglcd-bg); }
.sglcd-faq-item > summary { cursor: pointer; padding: .5rem .7rem; font-weight: 700; color: var(--sglcd-navy); list-style: revert; }
.sglcd-faq-item[open] > summary { border-bottom: 1px solid var(--sglcd-border); }
.sglcd-faq-a { padding: .5rem .7rem; font-size: .88rem; }
/* glossary */
.sglcd-manual-gloss { margin: .3rem 0; display: grid; grid-template-columns: 1fr 1fr; gap: .35rem .8rem; }
.sglcd-gloss-item { border: 1px solid var(--sglcd-border); border-radius: 8px; padding: .45rem .6rem; background: var(--sglcd-bg); }
.sglcd-gloss-item dt { font-weight: 700; color: var(--sglcd-navy); }
.sglcd-gloss-item dd { margin: .15rem 0 0; font-size: .85rem; }
/* troubleshooting */
.sglcd-manual-ts { margin: .3rem 0; }
.sglcd-ts-item { border: 1px solid var(--sglcd-border); border-left: 3px solid var(--sglcd-accent); border-radius: 8px; padding: .45rem .65rem; margin: .3rem 0; background: var(--sglcd-bg); font-size: .88rem; }
.sglcd-ts-card { border-left-color: var(--sglcd-navy); }
.sglcd-ts-sym { font-weight: 700; color: var(--sglcd-navy); margin-bottom: .25rem; }
.sglcd-ts-row { font-size: .85rem; margin: .12rem 0; }
.sglcd-ts-row > span { display: inline-block; min-width: 3rem; font-weight: 700; color: var(--sglcd-muted, #5b6573); }

/* ---- Vault responsibility / refund-exclusion notice ---- */
.sglcd-vaultresp { font-size: .82rem; line-height: 1.5; color: var(--sglcd-text); background: var(--sglcd-bg); border: 1px solid var(--sglcd-border); border-left: 3px solid var(--sglcd-navy); border-radius: 8px; padding: .55rem .75rem; margin: .5rem 0; }
.sglcd-vaultresp--vault { border-left-color: var(--sglcd-accent); }
.sglcd-vaultresp-savehint { font-size: .8rem; color: var(--sglcd-muted, #5b6573); margin: .15rem 0 .5rem; }
.sglcd-lock-vaultresp { font-size: .78rem; line-height: 1.45; color: var(--sglcd-muted, #5b6573); margin: .35rem 0 0; opacity: .95; }

/* ---- Checkout button price label ---- */
.sglcd-checkout-btn .sglcd-price { display: block; font-size: .8rem; font-weight: 400; opacity: .9; margin-top: .15rem; }

/* ---- Free calculator: post-result paid-upgrade CTA ----
   Self-contained EXPLICIT colors: this CTA renders OUTSIDE the .sglcd wrapper on the
   free page, so it must not depend on the .sglcd CSS variables (which would be
   undefined here and previously made the primary button white-on-transparent). */
.sglcd-free-cta { margin: 1rem 0 0; border: 1px solid #d9dee6; border-left: 4px solid #1f6fb2; border-radius: 14px; padding: 1rem 1.2rem; background: linear-gradient( 135deg, rgba(31,111,178,.10), rgba(31,58,95,.06) ); color: #1f2733; }
.sglcd-free-cta[hidden] { display: none !important; }
.sglcd-free-cta-h { font-weight: 800; font-size: 1.05rem; color: #1f3a5f; margin-bottom: .35rem; }
.sglcd-free-cta-body { margin: 0 0 .8rem; font-size: .92rem; color: #1f2733; }
.sglcd-free-cta-btns { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.sglcd-free-cta-note { margin: .7rem 0 0; font-size: .78rem; color: #5b6573; }
/* Primary CTA: "プラン機能一覧比較" — high contrast, large, emphasized (most prominent). */
.sglcd-free-cta-go { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; background: #1f6fb2; color: #ffffff !important; text-decoration: none; font-weight: 800; font-size: 1.05rem; line-height: 1.2; padding: .85rem 1.6rem; border-radius: 12px; border: 2px solid #185a91; box-shadow: 0 4px 14px rgba(31,111,178,.40); transition: background .15s, box-shadow .15s, transform .12s; }
.sglcd-free-cta-go::before { content: "\01F4CA"; font-size: 1.05em; line-height: 1; }
.sglcd-free-cta-go:hover { background: #185a91; box-shadow: 0 6px 18px rgba(31,111,178,.50); transform: translateY(-1px); }
.sglcd-free-cta-go:focus-visible { outline: 3px solid rgba(31,111,178,.5); outline-offset: 2px; }
/* Secondary: "ダッシュボードログイン" — quieter outline button (less emphasis). */
.sglcd-free-cta-login { display: inline-flex; align-items: center; gap: .35rem; background: #ffffff; color: #1f3a5f !important; text-decoration: none; font-weight: 600; font-size: .85rem; line-height: 1.2; padding: .55rem .95rem; border-radius: 10px; border: 1px solid #c7d2e0; transition: background .15s, border-color .15s; }
.sglcd-free-cta-login:hover { background: #eef2f8; border-color: #aebccf; }
.sglcd-free-cta-login:focus-visible { outline: 3px solid rgba(31,111,178,.45); outline-offset: 2px; }

/* ---- Pro dashboard: Premium upgrade Stripe Pricing Table ---- */
.sglcd-upgrade-cta-bottom { text-align: center; margin: 1.2rem 0 .4rem; }
.sglcd-upgrade-section { border: 1px solid var(--sglcd-border); border-radius: 12px; background: var(--sglcd-card); padding: 1rem 1.1rem; margin: .6rem 0 1rem; }
.sglcd-upgrade-section[hidden] { display: none !important; }
.sglcd-upgrade-section h3 { margin: 0 0 .3rem; color: var(--sglcd-navy); }
.sglcd-pricing-table-wrap { margin-top: .6rem; }

/* ---------------- Responsive ---------------- */
@media ( max-width: 860px ) {
	.sglcd-dash-layout { grid-template-columns: 1fr; }
	.sglcd-sidebar ul { flex-direction: row; flex-wrap: wrap; }
	.sglcd-sidebar .sglcd-tab { width: auto; }
	.sglcd-checkout-grid { grid-template-columns: 1fr; }
	.sglcd-lock--themed { min-height: 200px; padding: 1.2rem 1rem; }
	.sglcd-manual-toc-list { grid-template-columns: 1fr; }
	.sglcd-manual-gloss { grid-template-columns: 1fr; }
}