/* A frosted interface around the original printable artwork and workspaces. */
:root {
  --glass-ink: #202c3b;
  --glass-muted: #4e5763;
  --glass-edge: rgba(255, 255, 255, .86);
  --glass-line: rgba(75, 87, 103, .21);
  --glass-shadow: 0 12px 34px rgba(39, 52, 69, .085), inset 0 1px 0 rgba(255, 255, 255, .96);
  --ink: var(--glass-ink);
  --muted: var(--glass-muted);
  --line: var(--glass-line);
  --accent: #25374f;
  color: var(--glass-ink);
  background: #dee1e5;
}
body {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(ellipse at 9% 6%, rgba(241, 246, 252, .94), transparent 48%),
    radial-gradient(ellipse at 93% 20%, rgba(168, 184, 206, .61), transparent 46%),
    radial-gradient(ellipse at 24% 94%, rgba(171, 185, 203, .69), transparent 48%),
    linear-gradient(128deg, #e9ebed 8%, #dbdfe5 62%, #dee1e5 100%);
}
body::before, body::after {
  content: "";
  position: fixed;
  z-index: -1;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, .52);
  box-shadow: inset 0 2px 5px rgba(255, 255, 255, .45);
}
body::before {
  width: 69vw; height: 69vw; top: -47vw; left: 24vw;
  border-radius: 50%;
  background: linear-gradient(145deg, rgba(255, 255, 255, .4), rgba(220, 226, 233, .08));
}
body::after {
  width: 39vw; height: 56vw; right: -27vw; bottom: -22vw;
  border-radius: 48%; transform: rotate(-24deg);
  background: linear-gradient(132deg, rgba(255, 255, 255, .33), rgba(168, 181, 199, .13));
}
.home-brand { color: #1e2a39; text-shadow: 0 1px 0 rgba(255, 255, 255, .7); }
.session-summary, .session-note { color: #4b5561; }
.site-badge, .preview-badge {
  color: #445162; background: rgba(255, 255, 255, .55);
  border: 1px solid rgba(255, 255, 255, .82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .83);
}
.workspace-nav, .panel, .workspace-footer {
  background: linear-gradient(132deg, rgba(255, 255, 255, .78), rgba(255, 255, 255, .49));
  border: 1px solid var(--glass-edge);
  box-shadow: var(--glass-shadow);
  -webkit-backdrop-filter: blur(22px) saturate(125%);
  backdrop-filter: blur(22px) saturate(125%);
}
.workspace-nav { border-radius: 17px; }
.workspace-nav button { color: #475260; border-radius: 12px; }
.workspace-nav button[aria-current=page] {
  color: #233246;
  background: linear-gradient(150deg, rgba(255, 255, 255, .97), rgba(255, 255, 255, .71));
  box-shadow: 0 3px 9px rgba(45, 57, 72, .09), inset 0 1px 0 #ffffff;
}
.panel { border-radius: 20px; }
.workspace-footer {
  padding: 4px 6px; border-radius: 15px;
  box-shadow: 0 5px 18px rgba(42, 54, 69, .065), inset 0 1px 0 #ffffff;
}
.tool-tabs {
  background: rgba(255, 255, 255, .3);
  border-bottom-color: rgba(105, 118, 134, .17);
}
.tool-tabs button { color: #4c5765; border-radius: 10px; }
.tool-tabs button[aria-selected=true] {
  color: #263548; background: rgba(235, 239, 244, .92);
  box-shadow: inset 0 1px 0 #ffffff, 0 2px 7px rgba(44, 56, 72, .055);
}
.roster-tabs { background: rgba(255, 255, 255, .34); border-color: rgba(255, 255, 255, .92); }
.segmented {
  background: rgba(223, 228, 234, .62);
  border-color: rgba(255, 255, 255, .82);
  box-shadow: inset 0 1px 3px rgba(62, 75, 93, .055);
}
.segmented button { color: #505a68; }
.segmented button[aria-pressed=true] {
  color: #2b3a4d; background: rgba(255, 255, 255, .93);
  box-shadow: 0 3px 9px rgba(60, 73, 90, .10), inset 0 1px 0 #ffffff;
}
.primary-button, .scene-choices button[aria-pressed=true] {
  color: #ffffff;
  background: linear-gradient(155deg, #364860, #243347);
  border: 1px solid rgba(28, 42, 60, .18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .27), 0 4px 11px rgba(40, 53, 71, .13);
}
.primary-button:hover, .scene-choices button[aria-pressed=true]:hover { background: linear-gradient(155deg, #314258, #1d2a3c); }
.secondary-button, .batch-button {
  color: #314054; background: linear-gradient(140deg, rgba(248, 250, 252, .93), rgba(228, 232, 238, .85));
  border-color: rgba(128, 140, 156, .30); box-shadow: inset 0 1px 0 #ffffff;
}
.quiet-button { color: #33445a; }
.quiet-button:hover { background: rgba(255, 255, 255, .57); }
.name-input, .fields input, .fields select, .type-row input, .type-row select,
.scene-choice select, .excel-sheet-label select, .excel-mapping select, .roster-panel textarea {
  color: #263343; background: rgba(255, 255, 255, .83);
  border-color: rgba(116, 129, 146, .32);
  box-shadow: inset 0 1px 2px rgba(53, 65, 80, .045), 0 1px 0 rgba(255, 255, 255, .82);
}
select option, select optgroup { color: #263343; background: #f9fafb; }
.name-label, .fields label, .type-row label, .brand-control, .logo-controls,
.check-row, .help, .font-license-info, .scene-choice, .background-cycle span,
.excel-file-name, .excel-sheet-label, .excel-mapping label, .unit { color: #4d5764; }
.eyebrow, .preview-caption, .status-copy, .page-nav, .empty-state { color: #4e5866; }
.template-button {
  color: #404c5b; border-radius: 11px;
  background: linear-gradient(140deg, rgba(255, 255, 255, .84), rgba(235, 238, 242, .61));
  box-shadow: 0 3px 9px rgba(53, 65, 80, .035), inset 0 1px 0 rgba(255, 255, 255, .86);
}
.template-button[aria-pressed=true] {
  color: #2d3b4d; border-color: #3e526b;
  background: rgba(241, 244, 247, .96); box-shadow: inset 0 1px 0 #ffffff, 0 3px 10px rgba(56, 71, 90, .10);
}
.template-button:hover { border-color: #738397; }
.scene-choices button, .size-presets button {
  color: #3e4b5b; background: rgba(255, 255, 255, .68);
  border-color: rgba(136, 147, 162, .29); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85);
}
.size-presets button[aria-pressed=true] { color: #27374c; background: rgba(222, 229, 237, .93); border-color: #6a788a; }
.canvas-stage {
  background: linear-gradient(140deg, rgba(255, 255, 255, .50), rgba(220, 224, 229, .65));
  border-color: rgba(255, 255, 255, .75);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .80), inset 0 0 27px rgba(85, 97, 112, .045);
}
.sheet-wrap { background: rgba(217, 222, 229, .49); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72); }
.instruction-card, .size-summary, .excel-import {
  color: #445060; background: rgba(248, 249, 251, .55);
  border-color: rgba(255, 255, 255, .91); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .87);
}
.excel-preview-table { background: rgba(255, 255, 255, .89); border-color: rgba(112, 125, 143, .22); }
.excel-preview-table th { color: #3a485a; background: #e8ebee; }
.person-chip { color: #394759; background: rgba(255, 255, 255, .63); border-color: rgba(144, 154, 167, .34); }
.person-chip[aria-pressed=true] { border-color: #6b7a8e; background: rgba(235, 239, 245, .95); }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible,
summary:focus-visible, .excel-preview-table:focus-visible { outline-color: #3b526f; }
@media (max-width: 740px) {
  .workspace-nav { border-radius: 13px; }
  .workspace-nav button { border-radius: 9px; }
  .panel { border-radius: 16px; }
  .workspace-footer { padding: 2px 4px; border-radius: 12px; }
  .workspace-nav, .panel, .workspace-footer { -webkit-backdrop-filter: blur(14px) saturate(118%); backdrop-filter: blur(14px) saturate(118%); }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .workspace-nav, .panel, .workspace-footer { background: #f3f4f6; }
}
@media (prefers-reduced-transparency: reduce) {
  .workspace-nav, .panel, .workspace-footer { background: #f3f4f6; -webkit-backdrop-filter: none; backdrop-filter: none; }
  body::before, body::after { display: none; }
}

.language-input,.pronunciation-choice select{background:var(--glass-field,rgba(255,255,255,.52));border-color:#c5cfdb;box-shadow:inset 0 1px 3px #20344c0c}