:root {
  color-scheme: light;
  --p: #6550e8;
  --pd: #503bca;
  --t: #20202c;
  --m: #686876;
  --b: #e6e5eb;
  --soft: #f8f8fa;
  --green: #176c54;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: #fff; color: var(--t); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-size: 15px; line-height: 1.6; letter-spacing: 0; }
a { color: var(--p); text-underline-offset: 4px; overflow-wrap: anywhere; }
a:hover { color: var(--pd); }
button, input, textarea { font: inherit; letter-spacing: 0; }
button, a, input, textarea { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 3px solid var(--p); outline-offset: 3px; }
img { max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: 36px; line-height: 1.2; font-weight: 750; margin-bottom: 16px; overflow-wrap: anywhere; }
h2 { font-size: 23px; line-height: 1.35; font-weight: 700; margin-bottom: 14px; }
h3 { font-size: 17px; line-height: 1.4; margin-bottom: 8px; }
p { margin-bottom: 16px; }
.wrap { width: min(100%, 1160px); margin-inline: auto; padding-inline: 24px; }
.skip-link { position: absolute; top: -100px; left: 16px; z-index: 5; padding: 10px 16px; background: #fff; }
.skip-link:focus { top: 10px; }
.site-header { border-bottom: 1px solid var(--b); }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 78px; padding-block: 14px; }
.brand { display: inline-flex; align-items: center; gap: 10px; flex: none; color: var(--t); text-decoration: none; font-size: 21px; font-weight: 750; line-height: 1.2; }
.brand img { width: 38px; height: 38px; border-radius: 8px; }
.brand span span { color: var(--p); }
.site-nav { display: flex; flex-wrap: wrap; gap: 6px 20px; align-items: center; }
.site-nav a { color: var(--m); font-size: 13px; text-decoration: none; padding-block: 6px; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color: var(--p); }
.site-nav a[aria-current="page"] { box-shadow: 0 2px var(--p); }
.page-intro { padding-block: 34px 26px; border-bottom: 1px solid var(--b); }
.breadcrumbs { display: flex; align-items: center; gap: 9px; color: var(--m); font-size: 12px; margin-bottom: 22px; }
.breadcrumbs a { color: inherit; text-decoration: none; }
.breadcrumbs img { opacity: .55; }
.lead { font-size: 17px; line-height: 1.6; max-width: 760px; color: var(--m); margin-bottom: 0; }
.application-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 64px; padding-block: 34px 48px; align-items: start; }
.application-context { max-width: 400px; }
.product-art { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.product-art img { width: 120px; height: 120px; object-fit: contain; }
.context-list { padding: 0; margin: 24px 0; list-style: none; }
.context-list li { padding: 16px 0; border-top: 1px solid var(--b); }
.context-list strong { display: block; font-size: 15px; margin-bottom: 5px; }
.context-list p { color: var(--m); font-size: 14px; margin: 0; }
.text-link { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; }
.icon { display: block; width: 18px; height: 18px; flex: 0 0 18px; }
.application-panel { min-width: 0; border-left: 1px solid var(--b); padding-left: 32px; }
fieldset { padding: 0; margin: 0; border: 0; min-width: 0; }
.fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.field { display: flex; flex-direction: column; gap: 7px; min-width: 0; font-size: 13px; font-weight: 600; }
.field-wide { grid-column: 1 / -1; }
.optional { color: var(--m); font-weight: 400; }
input:not([type="checkbox"]), textarea { width: 100%; min-width: 0; border: 1px solid #cbcbd4; border-radius: 6px; background: #fff; color: var(--t); padding: 10px 12px; font-size: 16px; line-height: 1.5; font-weight: 400; }
input:not([type="checkbox"]) { min-height: 46px; }
textarea { resize: vertical; min-height: 94px; }
input::placeholder, textarea::placeholder { color: #7a7986; opacity: 1; }
input:focus, textarea:focus { border-color: var(--p); }
input[readonly] { background: var(--soft); }
.consent { display: flex; gap: 10px; align-items: flex-start; font-size: 12px; color: var(--m); margin: 18px 0; }
.consent input { flex: none; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--p); }
.honeypot { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 18px; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: 10px; min-height: 44px; max-width: 100%; padding: 10px 16px; background: var(--p); border: 1px solid var(--p); border-radius: 6px; color: #fff; font-size: 14px; line-height: 1.4; font-weight: 650; text-decoration: none; text-align: center; cursor: pointer; overflow-wrap: anywhere; }
.button:hover { background: var(--pd); border-color: var(--pd); color: #fff; }
.button .icon { filter: brightness(0) invert(1); }
.button-secondary { background: #fff; border-color: #cbcbd4; color: var(--t); }
.button-secondary:hover { background: var(--soft); border-color: var(--p); color: var(--pd); }
.button-secondary .icon { filter: none; }
.icon-button { width: 44px; height: 44px; min-width: 44px; padding: 12px; flex: none; }
.button:disabled { cursor: not-allowed; opacity: .6; }
.quiet-button { padding: 8px 0; background: none; border: 0; color: var(--p); text-decoration: underline; text-underline-offset: 4px; font-size: 13px; cursor: pointer; }
.quiet-button:disabled { color: var(--m); cursor: not-allowed; }
.note { font-size: 12px; color: var(--m); line-height: 1.6; margin: 14px 0 0; }
.message { margin: 16px 0; padding: 12px 14px; border-left: 3px solid var(--green); background: #f0f8f4; font-size: 14px; color: #18543f; overflow-wrap: anywhere; }
.message-error { border-color: #b02f41; color: #982239; background: #fff5f5; }
.loading { margin: 0 0 16px; color: var(--m); font-size: 13px; }
.success-heading { display: flex; align-items: center; gap: 12px; }
.success-heading img { flex: none; width: 28px; height: 28px; }
.success-heading h2 { margin: 0; }
.success-copy { margin: 20px 0; }
.copy-fallback { margin-top: 18px; max-width: 700px; }
.clipboard-buffer { position: fixed; top: 0; left: -10000px; }
.content-section { padding-block: 32px; border-bottom: 1px solid var(--b); }
.content-section:last-child { border-bottom: 0; }
.press-description { max-width: 780px; }
.brand-download { display: flex; flex-wrap: wrap; align-items: center; gap: 30px; margin: 22px 0 0; }
.brand-preview { width: 152px; height: 152px; object-fit: contain; }
.brand-download figcaption { max-width: 420px; }
.press-assets { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: 28px; margin-top: 24px; }
.press-asset { border: 1px solid var(--b); border-radius: 8px; margin: 0; min-width: 0; overflow: hidden; }
.screenshot-preview { display: flex; align-items: center; justify-content: center; height: 280px; background: var(--soft); border-bottom: 1px solid var(--b); padding: 16px; }
.screenshot-preview img { display: block; width: 100%; height: 100%; object-fit: contain; }
.press-asset figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; padding: 18px; font-size: 14px; font-weight: 600; }
.press-contact { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; }
.press-contact p { max-width: 650px; margin-bottom: 0; color: var(--m); }
.portal-main { min-height: 65vh; padding-bottom: 40px; }
.portal-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 18px; align-items: center; padding-block: 22px; border-bottom: 1px solid var(--b); }
.portal-toolbar .actions { margin: 0; }
.portal-restore { max-width: 660px; padding-block: 30px; }
.portal-summary { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; padding-block: 30px; }
.application-meta { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 20px 0; }
.application-meta div { min-width: 0; }
dt { color: var(--m); font-size: 12px; }
dd { margin: 4px 0 0; font-size: 14px; overflow-wrap: anywhere; }
.status { display: inline-block; border-radius: 4px; padding: 3px 10px; background: #f0edfc; color: #503bca; font-size: 13px; font-weight: 650; }
.status[data-status="approved"] { background: #e3f3eb; color: #176c54; }
.status[data-status="rejected"] { background: #fff0f0; color: #a12b3e; }
.status[data-status="closed"] { background: #eeeef1; color: #565661; }
.history { list-style: none; margin: 0; padding: 0; }
.history li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px; border-bottom: 1px solid var(--b); padding: 10px 0; font-size: 14px; }
.history time { color: var(--m); font-size: 12px; }
.history p { flex-basis: 100%; margin: 3px 0 0; color: var(--m); font-size: 13px; white-space: pre-line; overflow-wrap: anywhere; }
.totals { display: flex; flex-wrap: wrap; gap: 30px 60px; padding-block: 24px; margin: 0; border-top: 1px solid var(--b); }
.totals dd { font-size: 30px; font-weight: 700; line-height: 1.3; }
.placements { padding-top: 28px; border-top: 1px solid var(--b); }
.placement-list { margin-block: 22px; }
.placement { display: grid; grid-template-columns: minmax(0, 1fr) 130px 140px; gap: 20px; padding: 18px 0; border-top: 1px solid var(--b); align-items: start; }
.placement h3 { overflow-wrap: anywhere; }
.placement-url { display: block; font-size: 13px; color: var(--m); }
.placement dl { margin: 0; }
.placement .tracking-link { margin-top: 12px; }
.tracking-link a { display: block; font-size: 13px; word-break: break-word; }
.tracking-link { display: flex; align-items: center; gap: 12px; }
.tracking-link a, .tracking-link > span { min-width: 0; }
.empty-state { color: var(--m); font-size: 14px; margin: 18px 0; }
.placement-form { max-width: 760px; padding-top: 22px; border-top: 1px solid var(--b); }
.placement-form .fields { grid-template-columns: minmax(0, .7fr) minmax(0, 1fr); }
.site-footer { border-top: 1px solid var(--b); background: var(--soft); padding-block: 24px; }
.footer-inner { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; }
.footer-brand { color: var(--m); font-size: 13px; flex: none; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 20px; }
.footer-links a { color: var(--m); font-size: 12px; text-decoration: none; }
.footer-links a:hover { color: var(--p); text-decoration: underline; }
@media (max-width: 850px) {
  .header-inner { align-items: flex-start; flex-direction: column; gap: 12px; }
  .site-nav { gap: 6px 18px; }
  .application-layout { gap: 30px; grid-template-columns: minmax(0, .7fr) minmax(0, 1fr); }
  .application-panel { padding-left: 24px; }
  .fields { grid-template-columns: 1fr; }
  .product-art { gap: 8px; }
  .product-art img { width: 92px; height: 92px; }
  .placement { grid-template-columns: minmax(0, 1fr) 100px 105px; gap: 12px; }
}
@media (max-width: 620px) {
  .wrap { padding-inline: 18px; }
  h1 { font-size: 28px; }
  h2 { font-size: 21px; }
  .page-intro { padding-block: 24px; }
  .lead { font-size: 15px; }
  .breadcrumbs { margin-bottom: 16px; }
  .application-layout { display: flex; flex-direction: column; padding-block: 26px 34px; gap: 30px; }
  .application-panel { order: -1; width: 100%; padding-left: 0; border-left: 0; }
  .application-context { max-width: none; width: 100%; border-top: 1px solid var(--b); padding-top: 26px; }
  .product-art img { width: 100px; height: 100px; }
  .fields, .placement-form .fields { grid-template-columns: 1fr; }
  .press-assets { grid-template-columns: 1fr; }
  .brand-download { gap: 18px; }
  .brand-preview { width: 108px; height: 108px; }
  .screenshot-preview { height: 260px; }
  .portal-summary { grid-template-columns: 1fr; gap: 24px; }
  .placement { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .placement-info { grid-column: 1 / -1; }
  .footer-inner { flex-direction: column; gap: 14px; }
  .footer-links { justify-content: flex-start; }
}
