/* export.css — shared style-export and snippet panel styles (Phase 060) */
 
 /* ── panel container ─────────────────────────────────────────── */
 .ism-export-mount,
 .effect-code-mount {
   margin-top: 1.5rem;
   border-top: 1px solid var(--atlas-rule, #d0cdc6);
   padding-top: 1.25rem;
 }
 
 .export-title {
   font-family: 'Outfit', sans-serif;
   font-size: 0.8125rem;
   font-weight: 600;
   letter-spacing: 0.06em;
   text-transform: uppercase;
   color: var(--atlas-ink, #1a1a1a);
   margin: 0 0 0.75rem;
 }
 
 /* ── tablist ─────────────────────────────────────────────────── */
 .export-tablist {
   display: flex;
   gap: 0;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
   border-bottom: 1px solid var(--atlas-rule, #d0cdc6);
   margin-bottom: 0;
   scrollbar-width: none;
 }
 .export-tablist::-webkit-scrollbar { display: none; }
 
 .export-tab {
   flex-shrink: 0;
   font-family: 'SF Mono', 'Menlo', 'Consolas', monospace;
   font-size: 0.75rem;
   line-height: 1;
   padding: 0.5rem 0.875rem;
   background: none;
   border: none;
   border-bottom: 2px solid transparent;
   color: var(--atlas-ink-muted, #7a7a7a);
   cursor: pointer;
   white-space: nowrap;
   transition: color 0.15s, border-color 0.15s;
 }
 .export-tab:hover {
   color: var(--atlas-ink, #1a1a1a);
 }
 .export-tab--active {
   color: var(--atlas-ink, #1a1a1a);
   border-bottom-color: var(--atlas-accent, #FF4D1F);
 }
 .export-tab:focus-visible {
   outline: 2px solid var(--atlas-accent, #FF4D1F);
   outline-offset: -2px;
 }
 
 /* ── code panel ──────────────────────────────────────────────── */
 .export-code {
   margin: 0;
   padding: 1rem;
   overflow: auto;
   max-height: 420px;
   background: var(--atlas-paper-alt, #f7f5f0);
   border-left: 1px solid var(--atlas-rule, #d0cdc6);
   border-right: 1px solid var(--atlas-rule, #d0cdc6);
   font-family: 'SF Mono', 'Menlo', 'Consolas', monospace;
   font-size: 0.8125rem;
   line-height: 1.55;
   color: var(--atlas-ink, #1a1a1a);
   white-space: pre;
   tab-size: 2;
 }
 .export-code code {
   font: inherit;
   color: inherit;
 }
 
 /* ── copy button ─────────────────────────────────────────────── */
 .export-copy {
   display: block;
   width: 100%;
   padding: 0.5rem;
   font-family: 'Outfit', sans-serif;
   font-size: 0.75rem;
   font-weight: 600;
   letter-spacing: 0.04em;
   text-transform: uppercase;
   text-align: center;
   background: var(--atlas-ink, #1a1a1a);
   color: var(--atlas-paper, #f3f0e8);
   border: 1px solid var(--atlas-rule, #d0cdc6);
   border-top: none;
   cursor: pointer;
   transition: background 0.15s;
 }
 .export-copy:hover {
   background: var(--atlas-accent, #FF4D1F);
 }
 .export-copy:focus-visible {
   outline: 2px solid var(--atlas-accent, #FF4D1F);
   outline-offset: -2px;
 }
 
 /* ── warnings / notes ────────────────────────────────────────── */
 .export-warnings {
   margin-top: 0.75rem;
   padding: 0.625rem 0.75rem;
   border: 1px solid var(--atlas-accent, #FF4D1F);
   background: rgba(255, 77, 31, 0.06);
 }
 .export-warning {
   margin: 0;
   font-size: 0.75rem;
   line-height: 1.45;
   color: var(--atlas-ink, #1a1a1a);
 }
 .export-warning + .export-warning {
   margin-top: 0.375rem;
 }
 
 .export-contrast-note {
   margin: 0.5rem 0 0;
   font-size: 0.6875rem;
   color: var(--atlas-ink-muted, #7a7a7a);
 }
 
 /* ── loading / retry / empty ─────────────────────────────────── */
 .export-loading {
   font-size: 0.8125rem;
   color: var(--atlas-ink-muted, #7a7a7a);
   padding: 1rem 0;
 }
 .export-retry {
   padding: 1rem 0;
   text-align: center;
 }
 .export-retry p {
   margin: 0 0 0.5rem;
   font-size: 0.8125rem;
   color: var(--atlas-ink-muted, #7a7a7a);
 }
 .export-retry-btn {
   font-family: 'Outfit', sans-serif;
   font-size: 0.75rem;
   font-weight: 600;
   padding: 0.375rem 1rem;
   background: var(--atlas-ink, #1a1a1a);
   color: var(--atlas-paper, #f3f0e8);
   border: none;
   cursor: pointer;
 }
 .export-retry-btn:hover {
   background: var(--atlas-accent, #FF4D1F);
 }
 .export-empty {
   font-size: 0.8125rem;
   color: var(--atlas-ink-muted, #7a7a7a);
   padding: 1rem 0;
 }
 
 /* ── forced-colors ──────────────────────────────────────────── */
 @media (forced-colors: active) {
   .export-tab--active {
     border-bottom-color: Highlight;
   }
   .export-copy {
     background: ButtonFace;
     color: ButtonText;
     border: 1px solid ButtonText;
   }
   .export-warnings {
     border-color: Mark;
   }
 }
 
 /* ── print ───────────────────────────────────────────────────── */
 @media print {
   .export-copy,
   .export-retry-btn {
     display: none;
   }
   .export-code {
     max-height: none;
     overflow: visible;
     border: 1px solid #999;
   }
 }
 
 /* ── reduced-motion ─────────────────────────────────────────── */
 @media (prefers-reduced-motion: reduce) {
   .export-tab,
   .export-copy {
     transition: none;
   }
 }