/**
 * Grammar Checker — grammarcheck.net-style 3-column editor.
 */

/* Align gray tool stage with white header card — same inset on all sides */
.sn-page-card--tool-stage:has( #sn-tool-grammar-checker ) .sn-page-card__inner--flush {
	background: #eceff3;
}

#sn-tool-grammar-checker.sn-wrt {
	padding: 0;
}

/* ── Grid ── */
.sn-gc-app {
	display: grid;
	gap: 0.5rem;
	position: relative;
	align-items: start;
	background: #eceff3;
	border-radius: 0;
	padding: 1.25rem;
	--sn-gc-sidebar-w: 14rem;
}

@media (min-width: 640px) {
	.sn-gc-app {
		padding: 1.5rem;
	}
}

@media (min-width: 1024px) {
	.sn-gc-app {
		padding: 2rem;
	}
}

@media (min-width: 1100px) {
	.sn-gc-app {
		grid-template-columns: var(--sn-gc-sidebar-w) minmax(0, 1fr) var(--sn-gc-sidebar-w);
		grid-template-areas: 'tools center stats';
		gap: 0.5rem;
	}

	.sn-gc-panel--tools {
		grid-area: tools;
	}

	.sn-gc-center {
		grid-area: center;
		width: 100%;
	}

	.sn-gc-panel--stats {
		grid-area: stats;
	}

	.sn-gc-editor-box {
		width: 100%;
	}
}

@media (min-width: 1100px) {
	#sn-tool-grammar-checker.sn-gc-tools-collapsed .sn-gc-app {
		grid-template-columns: minmax(0, 1fr) var(--sn-gc-sidebar-w);
		grid-template-areas: 'center stats';
	}

	#sn-tool-grammar-checker.sn-gc-stats-collapsed .sn-gc-app {
		grid-template-columns: var(--sn-gc-sidebar-w) minmax(0, 1fr);
		grid-template-areas: 'tools center';
	}

	#sn-tool-grammar-checker.sn-gc-tools-collapsed.sn-gc-stats-collapsed .sn-gc-app {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas: 'center';
	}

	#sn-tool-grammar-checker.sn-gc-tools-collapsed .sn-gc-panel--tools,
	#sn-tool-grammar-checker.sn-gc-stats-collapsed .sn-gc-panel--stats {
		display: none;
	}
}

.sn-gc-center {
	position: relative;
	min-width: 0;
}

/* ── Side panels (compact) ── */
.sn-gc-panel {
	background: #fff;
	border: 1px solid #d8dee6;
	font-size: 0.6875rem;
	line-height: 1.35;
	color: #334155;
}

@media (min-width: 1100px) {
	.sn-gc-panel--tools {
		border-radius: 0.25rem;
		border-right: 1px solid #d8dee6;
		max-height: none;
		overflow-y: auto;
	}
	.sn-gc-panel--stats {
		border-radius: 0.25rem;
		border-left: 1px solid #d8dee6;
		max-height: none;
		overflow-y: auto;
	}
}

.sn-gc-panel__close {
	display: none;
	position: absolute;
	top: 0.35rem;
	right: 0.35rem;
	z-index: 2;
	border: none;
	background: #fff;
	font-size: 1rem;
	line-height: 1;
	cursor: pointer;
	color: #64748b;
	padding: 0.15rem 0.35rem;
}

@media (max-width: 1099px) {
	.sn-gc-panel--tools,
	.sn-gc-panel--stats {
		position: fixed;
		top: 0;
		bottom: 0;
		width: min(19rem, 92vw);
		z-index: 60;
		overflow-y: auto;
		box-shadow: 0 8px 30px rgba(15, 23, 42, 0.2);
		transition: transform 0.25s ease;
	}
	.sn-gc-panel--tools { left: 0; transform: translateX(-110%); }
	.sn-gc-panel--stats { right: 0; left: auto; transform: translateX(110%); }
	#sn-tool-grammar-checker.sn-gc-tools-open .sn-gc-panel--tools { transform: translateX(0); }
	#sn-tool-grammar-checker.sn-gc-stats-open .sn-gc-panel--stats { transform: translateX(0); }
	.sn-gc-panel__close { display: block; }

	body.sn-gc-sidebar-open {
		overflow: hidden;
	}

	body.sn-gc-sidebar-open::before {
		content: '';
		position: fixed;
		inset: 0;
		background: rgba(15, 23, 42, 0.45);
		z-index: 55;
	}
}

/* Tool sections (left) */
.sn-gc-tool-section {
	padding: 0.45rem 0.5rem;
	border-bottom: 1px solid #e8ecf0;
}

.sn-gc-tool-section--dark {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #f8fafc;
}

.sn-gc-tool-section__title {
	margin: 0 0 0.3rem;
	font-size: 0.7rem;
	font-weight: 700;
	font-family: var(--font-heading, 'Sora', sans-serif);
	color: #1e293b;
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

.sn-gc-tool-section__label {
	font-size: 0.7rem;
	font-weight: 600;
}

.sn-gc-tool-section__tagline {
	margin: 0 0 0.35rem;
	font-size: 0.625rem;
	color: #64748b;
}

.sn-gc-badge {
	display: inline-block;
	background: var(--sn-wrt-primary, #f5c518);
	color: #1e293b;
	font-size: 0.5rem;
	font-weight: 700;
	padding: 0.05rem 0.25rem;
	border-radius: 0.15rem;
	vertical-align: middle;
}

.sn-gc-mini-input {
	width: 100%;
	border: 1px solid #d8dee6;
	border-radius: 0.2rem;
	padding: 0.25rem 0.35rem;
	font-size: 0.625rem;
	font-family: inherit;
	line-height: 1.4;
	resize: vertical;
	margin-bottom: 0.3rem;
	box-sizing: border-box;
}

.sn-gc-mini-input--output {
	margin-bottom: 0;
	flex: 1;
}

.sn-gc-mini-btn-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.2rem;
	margin-bottom: 0.3rem;
}

.sn-gc-mini-btn {
	border: 1px solid #d8dee6;
	background: #fff;
	border-radius: 0.2rem;
	padding: 0.15rem 0.35rem;
	font-size: 0.6rem;
	font-weight: 600;
	cursor: pointer;
	color: #334155;
	font-family: inherit;
	line-height: 1.3;
}

.sn-gc-mini-btn:hover {
	border-color: var(--sn-wrt-secondary, #2b7ddb);
	color: var(--sn-wrt-secondary, #2b7ddb);
}

.sn-gc-mini-btn--primary,
.sn-gc-mini-btn--accent {
	background: var(--sn-wrt-secondary, #2b7ddb);
	border-color: var(--sn-wrt-secondary, #2b7ddb);
	color: #fff;
}

.sn-gc-mini-btn--accent {
	background: #f0f4f8;
	border-color: #c5d0dc;
	color: #1e293b;
}

.sn-gc-mini-btn--accent.is-selected {
	background: #e8ecf0;
	border-color: #94a3b8;
}

/* Title capitalizer — Title Case linked to style guides */
.sn-gc-tool-section--title .sn-gc-mini-input--output {
	margin-top: 0.35rem;
	margin-bottom: 0;
}

.sn-gc-title-cap {
	position: relative;
	margin-top: 0.25rem;
}

.sn-gc-style-lines {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	overflow: visible;
	z-index: 1;
}

.sn-gc-style-lines .sn-gc-guide-base,
.sn-gc-style-lines .sn-gc-guide-active {
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition: stroke 0.18s ease, stroke-width 0.18s ease, opacity 0.18s ease;
}

.sn-gc-style-lines .sn-gc-guide-base {
	stroke: rgba(15, 23, 42, 0.12);
	stroke-width: 1.1;
	opacity: 0.9;
}

.sn-gc-style-lines .sn-gc-guide-active {
	stroke: #94a3b8;
	stroke-width: 1.4;
	opacity: 1;
}

.sn-gc-title-actions {
	position: relative;
	z-index: 2;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.2rem;
	margin-bottom: 0;
}

.sn-gc-style-guides {
	position: relative;
	z-index: 2;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.1rem;
	margin-top: 1.35rem;
	width: 100%;
	box-sizing: border-box;
}

.sn-gc-style-btn {
	border: 1px solid #d8dee6;
	background: #f8fafc;
	border-radius: 0.15rem;
	padding: 0.12rem 0.25rem;
	font-size: 0.55rem;
	font-weight: 600;
	cursor: pointer;
	color: #475569;
	flex: 1 1 auto;
	min-width: 0;
	white-space: nowrap;
	line-height: 1.2;
}

.sn-gc-style-btn.is-active {
	background: var(--sn-wrt-primary, #f5c518);
	border-color: #e0b310;
	color: #1e293b;
}

.sn-gc-icon-btn--inline {
	margin-left: 0.05rem;
}

.sn-gc-icon-btn {
	border: 1px solid #d8dee6;
	background: #fff;
	border-radius: 0.2rem;
	padding: 0.15rem 0.3rem;
	font-size: 0.7rem;
	cursor: pointer;
	color: #64748b;
	flex-shrink: 0;
}

.sn-gc-ai-meter-wrap {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	margin: 0.25rem 0;
}

.sn-gc-ai-meter-track {
	flex: 1;
	height: 0.35rem;
	background: #e8ecf0;
	border-radius: 999px;
	overflow: hidden;
}

.sn-gc-ai-meter-fill {
	height: 100%;
	width: 0;
	background: #16a34a;
	transition: width 0.3s ease;
}

.sn-gc-ai-meter-fill.is-mid { background: #f5c518; }
.sn-gc-ai-meter-fill.is-high { background: #dc2626; }

.sn-gc-ai-score {
	font-size: 0.625rem;
	font-weight: 700;
	min-width: 2rem;
}

.sn-gc-ai-reasons {
	margin: 0.25rem 0 0;
	padding-left: 1rem;
	font-size: 0.6rem;
	color: #64748b;
}

.sn-gc-thes-results {
	font-size: 0.6rem;
	max-height: 5rem;
	overflow-y: auto;
}

.sn-gc-thes__section h4 {
	margin: 0.25rem 0 0.15rem;
	font-size: 0.6rem;
	font-weight: 700;
}

.sn-gc-thes__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.15rem;
	margin: 0 0 0.25rem;
}

.sn-gc-thes__chip {
	border: 1px solid #d8dee6;
	background: #f8fafc;
	border-radius: 0.15rem;
	padding: 0.05rem 0.25rem;
	font-size: 0.55rem;
	cursor: pointer;
}

.sn-gc-tools__empty,
.sn-gc-tools__loading {
	margin: 0;
	font-size: 0.6rem;
	color: #94a3b8;
}

/* ── Center editor box ── */
.sn-gc-editor-box {
	position: relative;
	background: #fff;
	border: 1px solid #d8dee6;
	border-radius: 0.25rem;
	overflow: visible;
}

.sn-gc-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.2rem 0.35rem;
	padding: 0.3rem 0.45rem;
	border-bottom: 1px solid #e8ecf0;
	background: #f8fafc;
	font-size: 0.7rem;
}

.sn-gc-toolbar__group {
	display: flex;
	align-items: center;
	gap: 0.15rem;
}

.sn-gc-toolbar__group--right {
	margin-left: auto;
}

.sn-gc-tb-btn {
	border: 1px solid transparent;
	background: transparent;
	border-radius: 0.15rem;
	padding: 0.15rem 0.3rem;
	font-size: 0.7rem;
	cursor: pointer;
	color: #334155;
	line-height: 1.2;
}

.sn-gc-tb-btn:hover {
	background: #e8ecf0;
}

.sn-gc-tb-btn--icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.55rem;
	height: 1.55rem;
	padding: 0;
	border-radius: 0.2rem;
}

.sn-gc-tb-btn--icon svg {
	display: block;
	width: 0.95rem;
	height: 0.95rem;
}

.sn-gc-tb-btn:disabled {
	opacity: 0.35;
	cursor: not-allowed;
	pointer-events: none;
}

.sn-gc-tb-btn--text {
	font-size: 0.65rem;
	font-weight: 600;
}

.sn-gc-toolbar__sep {
	display: inline-block;
	width: 1px;
	height: 1rem;
	background: #d8dee6;
	margin: 0 0.15rem;
	align-self: center;
}

.sn-gc-tb-btn--panel.is-active {
	color: var(--sn-wrt-secondary, #2b7ddb);
}

.sn-gc-tb-btn--panel:not(.is-active) {
	color: #94a3b8;
}

@media (max-width: 1099px) {
	.sn-gc-tb-btn--panel {
		display: none;
	}
}

/* Formatting toolbar (row 2) */
.sn-gc-format-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.15rem 0.25rem;
	padding: 0.25rem 0.45rem;
	border-bottom: 1px solid #e8ecf0;
	background: #f1f5f9;
	font-size: 0.7rem;
}

.sn-gc-format-bar__group {
	display: flex;
	align-items: center;
	gap: 0.1rem;
}

.sn-gc-format-select select {
	border: 1px solid #d8dee6;
	border-radius: 0.15rem;
	padding: 0.12rem 0.25rem;
	font-size: 0.625rem;
	background: #fff;
	color: #334155;
	max-width: 6.5rem;
	cursor: pointer;
}

.sn-gc-format-select--size select {
	max-width: 5.5rem;
}

.sn-gc-tb-btn--fmt {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.45rem;
	height: 1.45rem;
	padding: 0 0.2rem;
	font-size: 0.75rem;
	font-style: normal;
	font-weight: 600;
}

.sn-gc-tb-btn--fmt em {
	font-style: italic;
	font-weight: 600;
}

.sn-gc-tb-btn--fmt strong {
	font-weight: 800;
}

.sn-gc-fmt-u {
	text-decoration: underline;
}

.sn-gc-fmt-s {
	text-decoration: line-through;
}

.sn-gc-tb-btn--fmt-sub,
.sn-gc-tb-btn--fmt-sup {
	font-size: 0.65rem;
	font-weight: 500;
}

.sn-gc-tb-btn--fmt-sub sub,
.sn-gc-tb-btn--fmt-sup sup {
	font-size: 0.55rem;
}

.sn-gc-tb-btn.is-active,
.sn-gc-tb-btn--fmt.is-active {
	background: rgba(43, 125, 219, 0.12);
	color: var(--sn-wrt-secondary, #2b7ddb);
	border-color: rgba(43, 125, 219, 0.25);
}

.sn-gc-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.sn-gc-lang {
	display: flex;
	align-items: center;
	gap: 0.2rem;
	font-size: 0.625rem;
	color: #64748b;
}

.sn-gc-lang select {
	border: 1px solid #d8dee6;
	border-radius: 0.15rem;
	padding: 0.1rem 0.2rem;
	font-size: 0.625rem;
	background: #fff;
	max-width: 9.5rem;
}

.sn-gc-editor-wrap {
	position: relative;
	min-height: 16rem;
}

.sn-gc-editor-layers {
	position: absolute;
	inset: 0;
	bottom: 0.35rem;
	pointer-events: none;
	overflow: hidden;
	padding: 0.65rem 0.75rem;
	white-space: pre-wrap;
	word-break: break-word;
	font-size: 1rem;
	line-height: 1.55;
	z-index: 0;
}

.sn-gc-sl-overlay {
	position: absolute;
	inset: 0;
	bottom: 0.35rem;
	pointer-events: none;
	z-index: 0;
	overflow: hidden;
}

.sn-gc-sl-overlay-rect {
	position: absolute;
	display: block;
	border-radius: 3px;
	pointer-events: none;
}

.sn-gc-highlight-layer {
	color: #0f172a;
}

.sn-gc-highlight-layer mark {
	pointer-events: auto;
	cursor: pointer;
}

.sn-gc-editor-wrap.has-highlights .sn-gc-editor {
	color: transparent;
	caret-color: #0f172a;
}

.sn-gc-editor-wrap.has-highlights .sn-gc-editor:empty::before {
	color: transparent;
}

/* CSS Highlight API — sentence length buckets */
::highlight(sn-gc-slen-single) { background-color: rgb(223, 236, 248); }
::highlight(sn-gc-slen-short) { background-color: rgb(246, 231, 255); }
::highlight(sn-gc-slen-normal) { background-color: rgb(225, 241, 227); }
::highlight(sn-gc-slen-medium) { background-color: rgb(255, 248, 184); }
::highlight(sn-gc-slen-long) { background-color: rgb(255, 223, 180); }
::highlight(sn-gc-slen-very-long) { background-color: rgb(255, 222, 219); }

.sn-gc-editor {
	position: relative;
	z-index: 1;
	min-height: 16rem;
	max-height: 28rem;
	overflow-y: auto;
	padding: 0.65rem 0.75rem;
	font-size: 1rem;
	line-height: 1.55;
	outline: none;
	white-space: pre-wrap;
	word-break: break-word;
	color: #0f172a;
	background: transparent;
}

.sn-gc-editor:empty::before {
	content: attr(data-placeholder);
	color: #94a3b8;
	pointer-events: none;
}

.sn-gc-editor.sn-gc-editor--empty:not(:focus)::before {
	content: attr(data-placeholder);
	color: #94a3b8;
	pointer-events: none;
	display: block;
	position: absolute;
	left: 0.75rem;
	top: 0.65rem;
}

.sn-gc-editor h1 {
	font-size: 1.75rem;
	font-weight: 700;
	margin: 0.35rem 0;
	line-height: 1.3;
}

.sn-gc-editor h2 {
	font-size: 1.25rem;
	font-weight: 700;
	margin: 0.3rem 0;
	line-height: 1.35;
}

.sn-gc-editor h3 {
	font-size: 1.1rem;
	font-weight: 700;
	margin: 0.25rem 0;
	line-height: 1.4;
}

.sn-gc-editor pre {
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 0.9em;
	background: #f1f5f9;
	padding: 0.5rem;
	border-radius: 0.2rem;
	margin: 0.35rem 0;
	white-space: pre-wrap;
}

.sn-gc-editor ul,
.sn-gc-editor ol {
	margin: 0.35rem 0;
	padding-left: 1.5rem;
}

.sn-gc-editor li {
	margin: 0.15rem 0;
}

.sn-gc-editor font[size="2"] { font-size: 0.85em; }
.sn-gc-editor font[size="3"] { font-size: 1em; }
.sn-gc-editor font[size="4"] { font-size: 1.15em; }
.sn-gc-editor font[size="5"] { font-size: 1.35em; }

.sn-gc-editor strong,
.sn-gc-editor b {
	font-weight: 700;
}

.sn-gc-editor em,
.sn-gc-editor i {
	font-style: italic;
}

.sn-gc-editor u {
	text-decoration: underline;
}

.sn-gc-editor s,
.sn-gc-editor strike {
	text-decoration: line-through;
}

.sn-gc-editor sub {
	font-size: 0.75em;
	vertical-align: sub;
}

.sn-gc-editor sup {
	font-size: 0.75em;
	vertical-align: super;
}

.sn-gc-editor [style*="text-align: center"],
.sn-gc-editor [align="center"] {
	text-align: center;
}

.sn-gc-editor [style*="text-align: right"],
.sn-gc-editor [align="right"] {
	text-align: right;
}

.sn-gc-editor [style*="text-align: left"],
.sn-gc-editor [align="left"] {
	text-align: left;
}

.sn-gc-resize {
	height: 0.35rem;
	cursor: ns-resize;
	background: linear-gradient(180deg, transparent, #e8ecf0);
}

.sn-gc-count-bar {
	display: flex;
	justify-content: flex-end;
	gap: 1rem;
	padding: 0.25rem 0.6rem;
	font-size: 0.625rem;
	color: #64748b;
	border-top: 1px solid #e8ecf0;
}

.sn-gc-count-bar strong {
	color: #334155;
	font-weight: 700;
}

/* Vertical STATS / TOOLS tabs — removed; toggles live in toolbar */
.sn-gc-side-tabs {
	display: none !important;
}

/* Issue marks */
.sn-gc-mark { border-radius: 1px; padding: 0 1px; }
.sn-gc-mark--spelling { background: rgba(220,38,38,0.18); border-bottom: 2px solid #dc2626; }
.sn-gc-mark--grammar { background: rgba(22,163,74,0.18); border-bottom: 2px solid #16a34a; }
.sn-gc-mark--punctuation { background: rgba(202,138,4,0.18); border-bottom: 2px solid #ca8a04; }
.sn-gc-mark--style { background: rgba(43,125,219,0.18); border-bottom: 2px solid #2b7ddb; }

.sn-gc-sl--single { background: rgb(223, 236, 248); }
.sn-gc-sl--short { background: rgb(246, 231, 255); }
.sn-gc-sl--normal { background: rgb(225, 241, 227); }
.sn-gc-sl--medium { background: rgb(255, 248, 184); }
.sn-gc-sl--long { background: rgb(255, 223, 180); }
.sn-gc-sl--very-long { background: rgb(255, 222, 219); }

/* Action bar */
.sn-gc-enav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.5rem;
	margin-top: 0.5rem;
	padding: 0 0.15rem;
}

.sn-gc-enav__left {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem 0.5rem;
	flex: 1;
	min-width: 0;
}

.sn-gc-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	border-radius: 0.25rem;
	padding: 0.4rem 0.75rem;
	font-weight: 700;
	font-size: 0.75rem;
	cursor: pointer;
	border: 1px solid transparent;
	font-family: inherit;
	line-height: 1.2;
}

.sn-gc-btn__icon { font-size: 0.85rem; }

.sn-gc-btn--free {
	background: #fff;
	border-color: #d8dee6;
	color: #16a34a;
	box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

.sn-gc-btn--free:hover { border-color: #16a34a; }

.sn-gc-btn--fix {
	background: var(--sn-wrt-secondary, #2b7ddb);
	color: #fff;
	border-color: var(--sn-wrt-secondary, #2b7ddb);
	font-size: 0.7rem;
	padding: 0.35rem 0.6rem;
}

.sn-gc-btn--deep {
	background: linear-gradient(180deg, #f5a623 0%, #e8941a 100%);
	color: #fff;
	border-color: #d4820f;
	padding: 0.5rem 1.1rem;
	font-size: 0.8rem;
	box-shadow: 0 2px 4px rgba(232,148,26,0.35);
}

.sn-gc-btn--deep:hover {
	background: linear-gradient(180deg, #e8941a 0%, #d4820f 100%);
}

.sn-gc-btn:disabled {
	opacity: 0.55;
	cursor: not-allowed;
}

.sn-gc-status {
	margin: 0;
	font-size: 0.65rem;
	color: #64748b;
}

#sn-tool-grammar-checker.is-checking .sn-gc-status::after {
	content: '';
	display: inline-block;
	width: 0.65rem;
	height: 0.65rem;
	margin-left: 0.25rem;
	border: 2px solid #e8ecf0;
	border-top-color: #2b7ddb;
	border-radius: 50%;
	animation: sn-gc-spin 0.7s linear infinite;
	vertical-align: middle;
}

@keyframes sn-gc-spin { to { transform: rotate(360deg); } }

.sn-gc-how {
	margin-top: 0.5rem;
	font-size: 0.7rem;
	color: #64748b;
}

.sn-gc-how summary {
	cursor: pointer;
	font-weight: 600;
	color: #334155;
	font-size: 0.75rem;
}

.sn-gc-how__note {
	margin: 0.35rem 0;
	font-size: 0.65rem;
}

.sn-gc-mobile-tabs {
	display: flex;
	gap: 0.25rem;
	margin-top: 0.5rem;
}

@media (min-width: 1100px) {
	.sn-gc-mobile-tabs { display: none; }
}

.sn-gc-mobile-tab {
	flex: 1;
	border: 1px solid #d8dee6;
	background: #fff;
	padding: 0.35rem;
	font-size: 0.6rem;
	font-weight: 700;
	cursor: pointer;
	border-radius: 0.2rem;
	color: #64748b;
}

.sn-gc-mobile-tab.is-active {
	background: var(--sn-wrt-secondary, #2b7ddb);
	border-color: var(--sn-wrt-secondary, #2b7ddb);
	color: #fff;
}

/* Popover */
.sn-gc-popover {
	position: absolute;
	z-index: 30;
	background: #fff;
	border: 1px solid #d8dee6;
	border-radius: 0.35rem;
	padding: 0.5rem 0.65rem;
	max-width: 17rem;
	box-shadow: 0 8px 24px rgba(15,23,42,0.12);
	font-size: 0.7rem;
}

.sn-gc-popover__type {
	display: inline-block;
	font-size: 0.6rem;
	font-weight: 700;
	text-transform: uppercase;
	padding: 0.1rem 0.3rem;
	border-radius: 0.15rem;
	margin-bottom: 0.25rem;
}

.sn-gc-popover__type--spelling { background: #fee2e2; color: #dc2626; }
.sn-gc-popover__type--grammar { background: #dcfce7; color: #16a34a; }
.sn-gc-popover__type--punctuation { background: #fef9c3; color: #a16207; }
.sn-gc-popover__type--style { background: #dbeafe; color: #2b7ddb; }

.sn-gc-popover__msg { margin: 0 0 0.35rem; }
.sn-gc-popover__suggestions { display: flex; flex-wrap: wrap; gap: 0.2rem; margin-bottom: 0.35rem; }
.sn-gc-popover__sug {
	border: 1px solid #2b7ddb;
	background: #eff6ff;
	color: #2b7ddb;
	border-radius: 0.15rem;
	padding: 0.1rem 0.3rem;
	font-size: 0.6rem;
	cursor: pointer;
}

.sn-gc-popover__actions { display: flex; gap: 0.25rem; }

/* ── Stats panel (right, compact) ── */
.sn-gc-count-row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.2rem;
	padding: 0.45rem 0.5rem 0.35rem;
}

.sn-gc-chip {
	background: #f8fafc;
	border: 1px solid #e8ecf0;
	border-radius: 0.15rem;
	padding: 0.1rem 0.3rem;
	font-size: 0.6rem;
	white-space: nowrap;
}

.sn-gc-sl-toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.35rem;
	padding: 0.35rem 0.5rem;
	border-top: 1px solid #e8ecf0;
	border-bottom: 1px solid #e8ecf0;
	font-size: 0.6rem;
}

.sn-gc-sl-toggle__label {
	display: flex;
	align-items: center;
	gap: 0.2rem;
	font-weight: 600;
}

.sn-gc-sl-info {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 0.85rem;
	height: 0.85rem;
	font-size: 0.55rem;
	color: #94a3b8;
	cursor: help;
	line-height: 1;
	border: none;
	background: transparent;
	padding: 0;
	font-family: inherit;
}

.sn-gc-tip-wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
}

.sn-gc-tip {
	display: none;
	position: absolute;
	left: 50%;
	top: calc(100% + 0.35rem);
	transform: translateX(-50%);
	z-index: 30;
	width: max-content;
	max-width: 11rem;
	padding: 0.4rem 0.5rem;
	background: rgba(33, 33, 33, 0.98);
	color: #fff;
	font-size: 0.55rem;
	font-weight: 400;
	line-height: 1.35;
	border-radius: 0.25rem;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
	text-align: center;
	pointer-events: none;
}

.sn-gc-tip-wrap:hover .sn-gc-tip,
.sn-gc-tip-wrap:focus-within .sn-gc-tip {
	display: block;
}

.sn-gc-sl-legend {
	display: none;
	flex-wrap: wrap;
	justify-content: center;
	gap: 0.25rem;
	padding: 0.35rem 0.5rem 0.45rem;
}

#sn-tool-grammar-checker.sn-gc-sl-on .sn-gc-sl-legend {
	display: flex;
}

.sn-gc-sl-legend__item {
	display: inline-flex;
	align-items: center;
	padding: 0.08rem 0.35rem;
	border-radius: 0.2rem;
	border: 1px solid rgba(15, 23, 42, 0.12);
	font-size: 0.55rem;
	font-weight: 500;
	white-space: nowrap;
	cursor: help;
}

.sn-gc-sl-legend__item--single { background: rgb(223, 236, 248); }
.sn-gc-sl-legend__item--short { background: rgb(246, 231, 255); }
.sn-gc-sl-legend__item--normal { background: rgb(225, 241, 227); }
.sn-gc-sl-legend__item--medium { background: rgb(255, 248, 184); }
.sn-gc-sl-legend__item--long { background: rgb(255, 223, 180); }
.sn-gc-sl-legend__item--very-long { background: rgb(255, 222, 219); }

.sn-gc-flow-compact {
	display: none;
	align-items: center;
	gap: 0.3rem;
	padding: 0.35rem 0.5rem;
	font-size: 0.6rem;
	border-bottom: 1px solid #e8ecf0;
}

#sn-tool-grammar-checker.sn-gc-sl-on .sn-gc-flow-compact {
	display: flex;
}

#sn-tool-grammar-checker.sn-gc-sl-on .sn-gc-flow-compact[data-has-score="false"] .sn-gc-flow-compact__fill {
	width: 0 !important;
}

#sn-tool-grammar-checker.sn-gc-sl-on .sn-gc-flow-compact[data-has-score="false"] .sn-gc-flow-compact__val {
	color: #94a3b8;
	font-weight: 600;
}

.sn-gc-flow-compact__label {
	font-weight: 600;
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	gap: 0.15rem;
}
.sn-gc-flow-compact__bar {
	flex: 1;
	height: 0.45rem;
	background: #e0e0e0;
	border-radius: 999px;
	overflow: hidden;
}
.sn-gc-flow-compact__fill {
	height: 100%;
	background: linear-gradient(90deg, #ef4444, #f59e0b, #4caf50);
	transition: width 0.25s ease-out;
}
.sn-gc-flow-compact__val {
	font-weight: 700;
	white-space: nowrap;
	min-width: 2rem;
	text-align: right;
	font-variant-numeric: tabular-nums;
}

.sn-gc-flow-tips {
	display: none;
	margin: 0;
	padding: 0 0.5rem 0.4rem 1.1rem;
	font-size: 0.55rem;
	color: #64748b;
	list-style-type: disc;
}

#sn-tool-grammar-checker.sn-gc-sl-on .sn-gc-flow-tips:not([hidden]) {
	display: block;
}

.sn-gc-reading {
	padding: 0.35rem 0.5rem;
	font-size: 0.6rem;
	border-bottom: 1px solid #e8ecf0;
}

.sn-gc-reading p { margin: 0.1rem 0; }
.sn-gc-reading__level { color: #64748b; }

.sn-gc-stats-tabs,
.sn-gc-kw-tabs {
	display: flex;
	gap: 0;
	padding: 0.35rem 0.5rem 0;
}

.sn-gc-tab {
	border: 1px solid #d8dee6;
	background: #f8fafc;
	padding: 0.15rem 0.4rem;
	font-size: 0.6rem;
	font-weight: 600;
	cursor: pointer;
	color: #64748b;
	margin-right: -1px;
}

.sn-gc-tab:first-child { border-radius: 0.15rem 0 0 0.15rem; }
.sn-gc-tab:last-child { border-radius: 0 0.15rem 0.15rem 0; }

.sn-gc-tab.is-active {
	background: #fff;
	color: #1e293b;
	border-bottom-color: #fff;
	position: relative;
	z-index: 1;
}

.sn-gc-tab-panel {
	padding: 0.35rem 0.5rem 0.5rem;
}

.sn-gc-panel-subtitle {
	margin: 0 0 0.35rem;
	font-size: 0.6rem;
	font-weight: 700;
	color: #475569;
}

.sn-gc-limit { margin-bottom: 0.35rem; }

.sn-gc-limit__label {
	display: block;
	font-size: 0.55rem;
	color: #64748b;
	margin-bottom: 0.1rem;
	line-height: 1.3;
}

.sn-gc-progress {
	height: 0.3rem;
	background: #e8ecf0;
	border-radius: 999px;
	overflow: hidden;
}

.sn-gc-progress__bar {
	height: 100%;
	width: 0;
	background: #2b7ddb;
	transition: width 0.2s ease;
}

.sn-gc-progress__bar.is-over { background: #dc2626; }

.sn-gc-kw-list {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 0.55rem;
}

.sn-gc-kw__item {
	display: flex;
	justify-content: space-between;
	padding: 0.15rem 0;
	border-bottom: 1px solid #f1f5f9;
}

.sn-gc-kw__empty {
	font-size: 0.55rem;
	color: #94a3b8;
	padding: 0.25rem 0;
}

.sn-gc-issues-compact {
	padding: 0.35rem 0.5rem 0.5rem;
	border-top: 1px solid #e8ecf0;
}

.sn-gc-issues-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.15rem 0.5rem;
	margin: 0;
	font-size: 0.6rem;
}

.sn-gc-issues-grid div {
	display: flex;
	justify-content: space-between;
}

.sn-gc-issues-grid dt { font-weight: 600; margin: 0; }
.sn-gc-issues-grid dd { margin: 0; font-weight: 700; }
.sn-gc-iss--spelling { color: #dc2626; }
.sn-gc-iss--grammar { color: #16a34a; }
.sn-gc-iss--punct { color: #a16207; }
.sn-gc-iss--style { color: #2b7ddb; }

/* Toggle switch */
.sn-gc-switch {
	position: relative;
	display: inline-block;
	width: 2rem;
	height: 1.1rem;
	flex-shrink: 0;
}

.sn-gc-switch input { opacity: 0; width: 0; height: 0; }

.sn-gc-switch__slider {
	position: absolute;
	cursor: pointer;
	inset: 0;
	background: #cbd5e1;
	border-radius: 999px;
	transition: 0.2s;
}

.sn-gc-switch__slider::before {
	content: '';
	position: absolute;
	height: 0.8rem;
	width: 0.8rem;
	left: 0.15rem;
	bottom: 0.15rem;
	background: #fff;
	border-radius: 50%;
	transition: 0.2s;
}

.sn-gc-switch input:checked + .sn-gc-switch__slider { background: #2b7ddb; }
.sn-gc-switch input:checked + .sn-gc-switch__slider::before { transform: translateX(0.9rem); }

/* Deep check overlay */
.sn-gc-overlay[hidden],
.sn-gc-modal[hidden] { display: none !important; }

.sn-gc-overlay,
.sn-gc-modal {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
	background: rgba(15, 23, 42, 0.55);
}

.sn-gc-overlay__split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	max-width: 36rem;
	width: 100%;
	background: #fff;
	border-radius: 0.35rem;
	overflow: hidden;
	box-shadow: 0 20px 50px rgba(0,0,0,0.25);
}

@media (max-width: 540px) {
	.sn-gc-overlay__split { grid-template-columns: 1fr; }
}

.sn-gc-overlay__left {
	padding: 1.25rem;
	background: #f8fafc;
}

.sn-gc-overlay__steps {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sn-gc-overlay__steps li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.35rem 0;
	font-size: 0.75rem;
	border-bottom: 1px solid #e8ecf0;
	color: #64748b;
}

.sn-gc-overlay__steps li.is-active { color: #1e293b; font-weight: 600; }
.sn-gc-overlay__steps li.is-done { color: #16a34a; }

.sn-gc-step__status {
	font-size: 0.65rem;
	font-weight: 700;
	color: #16a34a;
}

.sn-gc-overlay__right {
	padding: 1.5rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	gap: 0.75rem;
}

.sn-gc-overlay__loading {
	margin: 0;
	font-size: 0.85rem;
	color: #64748b;
}

.sn-gc-spinner {
	width: 2.5rem;
	height: 2.5rem;
	border: 3px solid #e8ecf0;
	border-top-color: #2b7ddb;
	border-radius: 50%;
	animation: sn-gc-spin 0.7s linear infinite;
}

.sn-gc-modal__card {
	background: #fff;
	border-radius: 0.5rem;
	padding: 1.5rem;
	max-width: 20rem;
	width: 100%;
	text-align: center;
	box-shadow: 0 20px 50px rgba(0,0,0,0.25);
}

.sn-gc-modal__circle {
	width: 4.5rem;
	height: 4.5rem;
	border-radius: 50%;
	border: 3px solid var(--sn-wrt-primary, #f5c518);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.75rem;
	font-weight: 700;
	margin: 0 auto 0.75rem;
	font-family: var(--font-heading, 'Sora', sans-serif);
}

.sn-gc-modal__title {
	margin: 0 0 0.25rem;
	font-size: 1rem;
	font-family: var(--font-heading, 'Sora', sans-serif);
}

.sn-gc-modal__sub {
	margin: 0 0 1rem;
	font-size: 0.8rem;
	color: #64748b;
}

.sn-gc-modal__actions {
	display: flex;
	gap: 0.5rem;
	justify-content: center;
}

#sn-tool-grammar-checker.is-deep-checking .sn-gc-center { pointer-events: none; }

/* Full-screen expand mode */
body.sn-gc-expand-lock {
	overflow: hidden;
}

#sn-tool-grammar-checker.sn-gc-expanded {
	position: fixed;
	inset: 0;
	z-index: 99990;
	width: 100%;
	max-width: none;
	height: 100vh;
	height: 100dvh;
	overflow: hidden;
	margin: 0;
	border-radius: 0;
	background: #eceff3;
}

#sn-tool-grammar-checker.sn-gc-expanded .sn-gc-app {
	flex: 1;
	min-height: 0;
	height: 100%;
	max-height: 100vh;
	max-height: 100dvh;
	overflow: auto;
	border-radius: 0;
	padding: 0.75rem;
}

@media (min-width: 1100px) {
	#sn-tool-grammar-checker.sn-gc-expanded .sn-gc-app {
		padding: 1rem;
	}

	#sn-tool-grammar-checker.sn-gc-expanded .sn-gc-editor-wrap {
		min-height: 55vh;
	}
}

.sn-gc-expand-close {
	display: none;
	position: fixed;
	top: 0.65rem;
	right: 0.65rem;
	z-index: 100001;
	width: 2rem;
	height: 2rem;
	align-items: center;
	justify-content: center;
	border: 1px solid #d8dee6;
	border-radius: 0.25rem;
	background: #fff;
	color: #334155;
	cursor: pointer;
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
	padding: 0;
}

.sn-gc-expand-close svg {
	display: block;
	width: 1rem;
	height: 1rem;
}

#sn-tool-grammar-checker.sn-gc-expanded .sn-gc-expand-close {
	display: inline-flex;
}

/* Dark mode */
#sn-tool-grammar-checker.sn-gc-dark {
	color: #e2e8f0;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-app { background: #1e293b; }
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-panel,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-editor-box,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-overlay__split,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-modal__card {
	background: #1e293b;
	color: #e2e8f0;
	border-color: #334155;
}
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-editor { color: #f8fafc; }
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-toolbar,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-format-bar,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-chip,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-overlay__left {
	background: #0f172a;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-format-bar {
	border-color: #334155;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-format-select select {
	background: #1e293b;
	color: #f1f5f9;
	border-color: #475569;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-editor pre {
	background: #334155;
	color: #f1f5f9;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-tb-btn.is-active,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-tb-btn--fmt.is-active {
	background: rgba(43, 125, 219, 0.22);
	color: #93c5fd;
}
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-mini-input,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-lang select {
	background: #1e293b;
	color: #f1f5f9;
	border-color: #475569;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-tool-section__title,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-tool-section__label,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-count-bar strong,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-tb-btn,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-mini-btn,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-btn,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-lang > span,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-style-btn,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-mobile-tab,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-tab,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-issue-row strong,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-how summary {
	color: #f1f5f9;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-tool-section__tagline,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-tools__empty,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-tools__loading,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-status,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-count-bar,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-ai-reasons,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-lang > span,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-stat-label,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-read-item span,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-how,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-how__note,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-thes-results li {
	color: #cbd5e1;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-tb-btn--panel:not(.is-active) {
	color: #94a3b8;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-mini-btn {
	background: #334155;
	border-color: #475569;
	color: #f8fafc;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-mini-btn--primary {
	background: var(--sn-wrt-secondary, #2b7ddb);
	border-color: var(--sn-wrt-secondary, #2b7ddb);
	color: #fff;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-editor:empty::before,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-editor[data-placeholder]:empty::before,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-editor.sn-gc-editor--empty:not(:focus)::before {
	color: #94a3b8;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-mini-input::placeholder {
	color: #94a3b8;
	opacity: 1;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-expand-close {
	background: #334155;
	border-color: #475569;
	color: #f8fafc;
}

#sn-tool-grammar-checker.sn-gc-dark.sn-gc-expanded {
	background: #1e293b;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-tip {
	background: rgba(15, 23, 42, 0.98);
	color: #f1f5f9;
	border: 1px solid #475569;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-sl-info {
	color: #94a3b8;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-flow-tips {
	color: #cbd5e1;
}
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-flow-compact__label,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-reading__level,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-issues-grid dt,
#sn-tool-grammar-checker.sn-gc-dark .sn-gc-issues-grid dd {
	color: #e2e8f0;
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-style-lines .sn-gc-guide-base {
	stroke: rgba(226, 232, 240, 0.18);
}

#sn-tool-grammar-checker.sn-gc-dark .sn-gc-style-lines .sn-gc-guide-active {
	stroke: #cbd5e1;
}