.legal-backdrop {
		display: none;
		position: fixed;
		inset: 0;
		background: rgba(0,0,0,.55);
		z-index: 1040;
	}
	.legal-backdrop.active { display: block; }

	
	.legal-panel {
		display: none;
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: min(860px, 94vw);
		max-height: 82vh;
		overflow-y: auto;
		background: #fff;
		border-radius: .5rem;
		box-shadow: 0 8px 40px rgba(0,0,0,.25);
		z-index: 1050;
		padding: 2.25rem 2.5rem 2.5rem;
	}
	.legal-panel.active { display: block; }

	.legal-panel h1, .legal-panel h2 { color:#000; }
	.legal-panel h1 { font-size: 1.55rem; font-weight: 700; margin-bottom: .15rem; }
	.legal-panel h2 { font-size: 1.05rem; font-weight: 700; margin-top: 1.6rem; margin-bottom: .5rem; border-left: 3px solid #198754; padding-left: .65rem; }
	.legal-panel p, .legal-panel li { font-size: .92rem; color: #333; line-height: 1.7; }
	.legal-panel ul { padding-left: 1.3rem; }
	.legal-panel code { background: #eaeaea; padding: .1em .35em; border-radius: 3px; font-size: .88rem; }
	.legal-panel .update-date { font-size: .78rem; color: #6c757d; }
	.legal-panel a { color: #164e87; }

	
	.legal-close {
		position: sticky;
		top: 0;
		float: right;
		background: #6F0416;
		color: #fff;
		border: none;
		border-radius: 50%;
		width: 2rem;
		height: 2rem;
		font-size: 1rem;
		line-height: 1;
		cursor: pointer;
		z-index: 10;
	}
	
	.legal-close:hover { background: #AF1E25; }

	
	footer-demo { background: #1a1a1a; color: #ccc; padding: 1.5rem; text-align: center; }
	footer-demo a { color: #6ec48a; text-decoration: none; margin: 0 .75rem; font-size: .85rem; }
	footer-demo a:hover { text-decoration: underline; }