/*
 * DW Electronics presentation v0.7.4 / graphite-and-silver color study GS-1.
 * Site-local only. Shared arcade/admin styles and the scrolling fixture stay unchanged.
 */
@font-face
{
	font-family: "dwIcons";
	src: url("/develwaregames/game/shared/assets/fonts/dwIcons.ttf") format("truetype");
	font-display: block;
}
:root
{
	--dwE-surface: rgba(28, 28, 30, .96);
	--dwE-raised: #28282b;
	--dwE-line: #49494e;
	--dwE-text: #f1f1f2;
	--dwE-muted: #bdbdc3;
	--dwE-accent: #d9d9de;
	--dwE-gold: #d9d9de;
	--dwE-header: 72px;
	--dwE-gap: 24px;
	--dwE-small: .875rem;
	--dwE-body: 1rem;
	--dwE-heading: clamp(1.5rem, 1.2rem + 1vw, 2.25rem);
	--dwE-space: clamp(20px, 4vw, 56px);
}
.dwElectronics-shell *, .dwE-page *
{
	box-sizing: border-box;
}
.dwE-header, .dwE-viewerTools, .dwE-motion, .dwE-status, .dwE-skip, .dwE-page
{
	font: var(--dwE-body)/1.5 Arial, sans-serif;
	color: var(--dwE-text);
}
.dwE-header *, .dwE-viewerTools *, .dwE-page *
{
	color: inherit;
	font-family: inherit;
	font-size: inherit;
}
.dwIconFont, .dwE-header .dwIconFont
{
	font-family: "dwIcons";
	font-weight: normal;
	font-style: normal;
}
.dwE-header
{
	position: fixed;
	inset: 0 0 auto;
	z-index: 20;
	height: var(--dwE-header);
	padding: 12px var(--dwE-space);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	background: #121214;
	border-bottom: 1px solid var(--dwE-line);
}
.dwE-header a { text-decoration: none; }
.dwE-brand
{
	font-size: 24px;
	font-weight: 700;
	letter-spacing: -.04em;
	white-space: nowrap;
	color: var(--dwE-gold);
}
.dwE-brand span { font-size: inherit; color: var(--dwE-text); }
.dwE-header nav { display: flex; align-items: center; gap: 8px; }
.dwE-header nav a, .dwE-header button, .dwE-page button, .dwE-button,
.dwE-viewerTools button, .dwE-motion
{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	padding: 10px 16px;
	border: 1px solid var(--dwE-line);
	border-radius: 6px;
	background: var(--dwE-surface);
	color: var(--dwE-text);
	font: inherit;
	font-size: var(--dwE-small);
	text-decoration: none;
	cursor: pointer;
}
.dwE-header nav a, .dwE-header button, .dwE-viewerTools button,
.dwE-motion, .dwElectronics-shell .dwE-button { touch-action: manipulation; }
.dwE-header nav a { border-color: transparent; background: transparent; }
.dwE-header nav a[aria-current="page"] { color: var(--dwE-accent); border-bottom-color: var(--dwE-accent); border-radius: 0; }
.dwE-header button:hover, .dwE-page button:hover, .dwE-button:hover,
.dwE-viewerTools button:hover, .dwE-motion:hover { background: #36363b; }
.dwE-page .dwE-primary, .dwE-viewerTools .dwE-primary
{
	background: var(--dwE-accent);
	border-color: var(--dwE-accent);
	color: #171719;
	font-weight: 700;
}
.dwE-page .dwE-primary:hover, .dwE-viewerTools .dwE-primary:hover { background: #f4f4f5; }
.dwE-header :focus-visible, .dwE-page :focus-visible, .dwE-viewerTools :focus-visible,
.dwE-motion:focus-visible, .dwE-skip:focus
{
	outline: 3px solid var(--dwE-accent);
	outline-offset: 3px;
}
.dwElectronics-shell .dwSiteOrb { display: none !important; }
.dwElectronics-shell #TheMainFrame1
{
	display: block !important;
	position: fixed !important;
	top: var(--dwE-header) !important;
	height: calc(100dvh - var(--dwE-header)) !important;
	background: transparent;
	opacity: 1;
	visibility: visible;
	transition: opacity 300ms ease, visibility 0s;
}
.dwElectronics-shell.dwE-showroom #TheMainFrame1,
.dwElectronics-shell.dwE-intro #TheMainFrame1
{
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 300ms ease, visibility 0s 300ms;
}
.dwElectronics-shell.dwE-intro #TheMainFrame1 { transition: none; }
.dwElectronics-shell.dwE-introFinished:not(.dwE-showroom) #TheMainFrame1 { transition-duration: 600ms, 0s; }
.dwElectronics-shell.dwE-sceneFailed #TheMainFrame1 { z-index: 101 !important; }
.dwElectronics-shell.dwE-sceneFailed .dwE-header { z-index: 110; }
.dwElectronics-shell.dwE-sceneFailed .dwE-status { z-index: 120; }
.dwElectronics-shell.dwE-sceneFailed #TheMainFrame { z-index: 130 !important; }
.dwElectronics-shell #TheMainFrame { z-index: 40 !important; }
.dwE-header [hidden], .dwE-page [hidden], .dwE-viewerTools[hidden], .dwE-status[hidden] { display: none !important; }
.dwE-skip
{
	position: fixed;
	top: -80px;
	left: 16px;
	z-index: 80;
	padding: 12px;
	background: #1c1c1e;
}
.dwE-skip:focus { top: 12px; }
.dwE-viewerTools
{
	position: fixed;
	bottom: calc(80px + env(safe-area-inset-bottom, 0px));
	left: 50%;
	transform: translateX(-50%);
	width: max-content;
	max-width: calc(100% - 32px);
	padding: 16px;
	z-index: 20;
	border: 1px solid var(--dwE-line);
	border-radius: 10px;
	background: var(--dwE-surface);
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
}
.dwE-viewerTools p { font-size: var(--dwE-small); margin: 0; }
.dwE-motion { position: fixed; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); right: 16px; z-index: 20; }
.dwE-status
{
	position: fixed;
	top: calc(var(--dwE-header) + 12px);
	left: 50%;
	transform: translateX(-50%);
	max-width: calc(100% - 32px);
	padding: 12px 20px;
	z-index: 25;
	border: 1px solid var(--dwE-line);
	border-radius: 6px;
	background: #1c1c1e;
}
html:has(> body.dwE-page), body.dwE-page
{
	margin: 0;
	min-height: 100%;
	background: transparent;
}
.dwE-page { margin: 0; }
html:has(> body.dwE-page), body.dwE-page,
html:has(> body.dwE-adminPage), body.dwE-adminPage
{
	height: 100%;
}
.dwE-page #dwBody > main, .dwE-adminPage #dwBody > main
{
	width: 100%;
	flex: 0 0 100%;
	margin-top: 0;
	margin-bottom: 0;
}
.dwE-page main { padding: var(--dwE-space); padding-bottom: 100px; max-width: 1440px; margin: auto; }
.dwE-page h1, .dwE-page h2, .dwE-page p { margin: 0; }
.dwE-page h1 { font-size: var(--dwE-heading); line-height: 1.12; letter-spacing: -.025em; }
.dwE-page h2 { font-size: 20px; line-height: 1.25; }
.dwE-panel
{
	background: var(--dwE-surface);
	border: 1px solid var(--dwE-line);
	border-radius: 10px;
	padding: 28px;
}
.dwE-eyebrow { font-size: .75rem !important; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--dwE-accent); }
.dwE-muted { color: var(--dwE-muted); }
.dwE-intro { max-width: 440px; display: grid; gap: 20px; }
.dwE-intro .dwE-actions { margin-top: 4px; }
.dwE-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.dwE-showcaseGap { height: clamp(80px, 24vh, 240px); pointer-events: none; }
.dwE-productTile
{
	width: min(100%, 540px);
	margin-left: auto;
	display: grid;
	grid-template-columns: 160px minmax(0, 1fr);
	gap: 20px;
	text-align: left;
}
.dwE-productTile img { width: 100%; height: 220px; object-fit: contain; align-self: center; }
.dwE-productTile > div { display: grid; align-content: center; gap: 16px; }
.dwE-tileLink { cursor: pointer; transition: border-color 180ms ease; }
.dwE-tileLink:hover { border-color: var(--dwE-accent); }
.dwE-productGrid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--dwE-gap); align-items: start; }
.dwE-productLead { display: grid; gap: 20px; }
.dwE-productLead img { width: 100%; height: 300px; object-fit: contain; }
.dwE-specs { margin: 20px 0 0; }
.dwE-specs div { padding: 12px 0; border-top: 1px solid var(--dwE-line); display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 16px; }
.dwE-specs dt { color: var(--dwE-muted); font-size: var(--dwE-small); }
.dwE-specs dd { margin: 0; font-size: var(--dwE-small); }
.dwE-note { margin-top: 24px !important; font-size: var(--dwE-small); color: var(--dwE-muted); }
.dwE-footer { margin-top: 48px; width: fit-content; padding: 16px 24px; }
.dwE-footer p { font-size: var(--dwE-small); }
/* The admin page does NOT load the storefront reset or recolor shared admin controls. */
.dwE-adminPage { margin: 0; background: transparent; font: 15px/1.4 system-ui, sans-serif; color: #111; }
.dwE-adminWrap { max-width: 1320px; padding: 24px 24px 100px; margin: auto; }
.dwE-adminTitle, .dwE-adminMount .dwAdmin-nav, .dwE-adminMount .dwAdmin-main
{
	padding: 20px;
	border: 1px solid #bbb;
	border-radius: 8px;
	background: rgba(245, 246, 248, .98);
	margin: 0 0 20px;
}
.dwE-adminTitle h1 { font-size: 22px; margin: 0 0 6px; }
.dwE-adminTitle p { margin: 0; color: #555; }
.dwE-adminMount { min-width: 0; }
.dwE-adminMount .dwAdmin-main { overflow-wrap: anywhere; min-width: 0; }
.dwE-adminError { padding: 20px; background: #fff; color: #a0001c; border-radius: 8px; }
@media (max-width: 760px)
{
	:root { --dwE-header: 120px; --dwE-space: 20px; --dwE-gap: 16px; }
	.dwE-header { flex-direction: column; align-items: stretch; justify-content: center; gap: 4px; padding: 8px 12px; }
	.dwE-header nav { gap: 0; overflow-x: auto; flex-shrink: 0; }
	.dwE-header nav a, .dwE-header button { padding: 8px; white-space: nowrap; flex-shrink: 0; }
	.dwE-brand { font-size: 24px; }
	.dwE-panel { padding: 20px; }
	.dwE-productGrid { grid-template-columns: minmax(0, 1fr); }
	.dwE-productTile { grid-template-columns: 100px minmax(0, 1fr); gap: 16px; }
	.dwE-productTile img { height: 180px; }
	.dwE-productLead img { height: 240px; }
	.dwE-specs div { grid-template-columns: 84px minmax(0, 1fr); gap: 12px; }
	.dwE-viewerTools p { flex-basis: 100%; text-align: center; }
	.dwE-motion { top: 8px; bottom: auto; right: 12px; padding: 8px 10px; }
	.dwE-adminWrap { padding: 16px 12px 100px; }
	.dwE-adminTitle, .dwE-adminMount .dwAdmin-nav, .dwE-adminMount .dwAdmin-main { padding: 16px; }
}
@media (prefers-reduced-motion: reduce)
{
	.dwElectronics-shell #TheMainFrame1, .dwElectronics-shell.dwE-showroom #TheMainFrame1,
	.dwElectronics-shell.dwE-introFinished #TheMainFrame1,
	.dwE-tileLink { transition: none; }
}
/* Presentation pass 0.4.1: host-owned navigation and bounded viewer controls. */
.dwE-header nav { min-width: 0; overflow-x: auto; white-space: nowrap; scrollbar-width: thin; }
.dwE-header nav a { flex: 0 0 auto; }
#dwMenuButton { flex-shrink: 0; }
.dwE-menu
{
	position: fixed;
	inset: var(--dwE-header) 0 0;
	z-index: 30;
	padding: var(--dwE-space);
	overflow-y: auto;
	overscroll-behavior-y: none;
	background: rgba(12, 12, 14, .35);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(-12px);
	transition: opacity 220ms ease, transform 220ms ease, visibility 0s 220ms;
	font: var(--dwE-body)/1.5 Arial, sans-serif;
	color: var(--dwE-text);
}
.dwE-menuOpen .dwE-menu { opacity: 1; visibility: visible; pointer-events: auto; transform: none; transition-delay: 0s; }
.dwE-menu * { color: inherit; }
.dwElectronics-shell.dwE-menuOpen #TheMainFrame1 { opacity: 0; visibility: hidden; pointer-events: none; }
.dwE-menuOpen #dwViewerTools { visibility: hidden; }
.dwE-menuGrid { max-width: 1200px; margin: auto; display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--dwE-gap); align-items: start; }
.dwE-menu h2 { font: bold 20px/1.3 Arial, sans-serif; margin: 0 0 20px; color: inherit; }
.dwE-menu p, .dwE-menu label, .dwE-menu a { font: inherit; color: inherit; }
.dwE-menu form, .dwE-menuLinks { display: grid; gap: 12px; }
.dwE-menu input, .dwE-menu select, .dwE-menu button
{
	box-sizing: border-box; width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px;
	font: inherit; color: var(--dwE-text); background: var(--dwE-raised);
	border: 1px solid var(--dwE-line); border-radius: 6px;
}
.dwE-menu button { cursor: pointer; }
.dwE-menuLinks a { padding: 10px 0; }
.dwE-menu [hidden] { display: none !important; }
.dwE-menu :focus-visible { outline: 3px solid var(--dwE-accent); outline-offset: 3px; }
.dwElectronics-shell.dwE-transition #TheMainFrame1
{
	opacity: 0; visibility: hidden; pointer-events: none;
	transition: opacity 250ms ease, visibility 0s 250ms;
}
.dwE-viewerTools { bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
.dwE-viewerTools strong { font-size: 18px; }
@media (max-width: 760px)
{
	:root { --dwE-header: 112px; }
	.dwE-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: 44px 44px; gap: 4px 8px; }
	.dwE-header nav { grid-column: 1 / -1; grid-row: 2; }
	#dwMenuButton { grid-column: 2; grid-row: 1; }
	.dwE-menuGrid { grid-template-columns: minmax(0, 1fr); }
	.dwE-viewerTools { padding: 12px; gap: 8px; }
	.dwE-viewerTools > div { flex-basis: 100%; text-align: center; }
	.dwE-viewerTools p { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce)
{
	.dwE-menu, .dwElectronics-shell.dwE-transition #TheMainFrame1 { transition: none; transform: none; }
}
/* v0.7.4: iPhone-first presentation. Document and iframe scroll ownership is unchanged. */
:root { --dwE-header: 104px; --dwE-space: 12px; --dwE-gap: 12px; --dwE-heading: 1.35rem; --dwE-body: .9375rem; }
.dwE-header { display: grid; grid-template-columns: 44px minmax(0,1fr) auto 44px; grid-template-rows: 44px 40px; gap: 4px; padding: 6px 8px 9px; }
.dwE-header #dwMenuButton { grid-column: 1; grid-row: 1; }
.dwE-header .dwE-brand { grid-column: 2; grid-row: 1; font-size: clamp(17px,4.8vw,24px); letter-spacing: -.04em; }
.dwE-header #dwAccountButton { grid-column: 4; grid-row: 1; }
.dwE-header button { padding: 6px; width: 44px; min-height: 40px; background: transparent; border-color: transparent; }
.dwE-header .dwIconFont { font-size: 27px; line-height: 1; }
.dwE-cartIcon { grid-column: 3; grid-row: 1; min-width: 65px; min-height: 44px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--dwE-text); }
.dwE-cartGlyph { display: block; position: relative; height: 29px; }
.dwE-cartGlyph .dwIconFont { font-size: 34px; }
.dwE-cartGlyph [data-cart-count] { position: absolute; top: -3px; left: 11px; min-width: 18px; text-align: center; font: bold 11px/14px Arial,sans-serif; background: #121214; border-radius: 6px; }
.dwE-cartIcon small { font: 11px/13px Arial,sans-serif; font-variant-numeric: tabular-nums; }
.dwE-headerSearch { grid-column: 1/-1; grid-row: 2; display: grid; grid-template-columns: 40px 40px minmax(0,1fr); align-items: center; border: 1px solid var(--dwE-line); border-radius: 7px; background: #28282b; }
.dwE-headerSearch button { width: 40px; }
.dwE-headerSearch input { width: 100%; min-width: 0; border: 0; background: transparent; color: var(--dwE-text); padding: 7px 8px; font: 16px/24px Arial,sans-serif; }
.dwE-headerSearch input::placeholder { color: var(--dwE-muted); }
.dwE-header button[aria-expanded="true"], .dwE-header .dwE-filterActive { background: #49494e; }
.dwE-page main { padding: 12px; padding-bottom: 28px; }
.dwE-panel { padding: 14px; border-radius: 8px; }
.dwE-page p { line-height: 1.4; }
.dwE-page h2 { font-size: 1.1rem; }
.dwE-note { margin-top: 10px !important; }
.dwE-footer { margin-top: 16px; padding: 9px 12px; }
.dwE-actions { flex-wrap: nowrap; overflow-x: auto; max-width: 100%; gap: 8px; }
.dwE-actions > * { flex: 0 0 auto; white-space: nowrap; }
.dwE-dialog { font: 15px/1.4 Arial,sans-serif; color: #f1f1f2; background: #1c1c1e; padding: 12px; border-radius: 8px; }
.dwE-dialog p { margin: 0 0 10px; }
.dwE-dialogLinks { display: grid; gap: 7px; }
.dwE-dialog a, .dwE-dialog button, .dwE-dialog select { box-sizing: border-box; font: inherit; color: inherit; background: #28282b; border: 1px solid #49494e; border-radius: 6px; min-height: 44px; padding: 10px 12px; text-decoration: none; }
.dwE-dialogLinks > * { display: block; width: 100%; text-align: left; }
.dwE-dialog [aria-current="page"] { border-color: #d9d9de; background: #3b3b40; }
.dwE-dialog label { display: grid; gap: 4px; margin-bottom: 10px; }
.dwE-dialogActions, .dwE-dialog .dwMenu-buttons { display: flex; flex-wrap: nowrap; gap: 8px; overflow-x: auto; max-width: 100%; margin-top: 10px; }
.dwE-dialogActions > * { flex: 0 0 auto; white-space: nowrap; }
.dwE-dialogActions button, #dwElectronicsPayNow { min-height: 44px; padding: 10px 12px; font: 15px/1.3 Arial,sans-serif; border: 1px solid #49494e; border-radius: 6px; background: #28282b; color: #f1f1f2; cursor: pointer; }
#dwElectronicsPayNow { width: 100%; }
#dwElectronicsPayment #dwFormError { min-height: 28px; padding: 8px; margin: 6px 0; border-radius: 6px; background: #f2f2f2; overflow-wrap: anywhere; }
#dwElectronicsPayment button:disabled { opacity: .55; cursor: wait; }
#dwElectronicsPayment[aria-busy="true"] #dwElectronicsPayNow { background: #555; color: white; }
.dwE-paymentResult { padding: 18px; border-radius: 8px; }
.dwE-paymentResult h2 { font-size: 24px; margin: 0 0 12px; }
.dwE-paid { background: #d7f5e3; color: #134c2b; border: 2px solid #2b8a50; }
.dwE-paymentPending { background: #fff1cc; color: #614400; border: 2px solid #ba8a22; }
.dwE-paidAmount { display: block; font-size: 26px; margin: 10px 0; }
/* Only this parent-owned viewer panel receives the tiny scroll allowance. */
.dwE-viewerTools { display: block; width: min(540px,calc(100% - 24px)); height: 126px; padding: 0; overflow-y: auto; }
.dwE-viewerContent { min-height: calc(100% + 2px); padding: 10px; text-align: center; }
.dwE-viewerContent .dwE-actions { margin-top: 7px; }
.dwE-viewerContent .dwE-actions > * { padding: 7px 10px; min-height: 40px; }
@media(min-width:900px) {
	:root { --dwE-space: 20px; }
	.dwE-header { padding-inline: 20px; }
	.dwE-page main { padding: 20px; padding-bottom: 28px; }
}
