#dela-surface-atlas {width:100%;container-type:inline-size;color-scheme:light;--paper:#f8f4e9;--ink:#132e34;--ocean:#102c32;--deep:#0c242b;--light:#fbf4df;--gold:#ebbc69;--aqueous:#80dedf;--rule:#d9d2c1;color:var(--ink);font:400 14px/1.45 Inter,"Segoe UI",Arial,sans-serif;font-synthesis:none}
#dela-surface-atlas *,#dela-surface-atlas *::before,#dela-surface-atlas *::after{box-sizing:border-box}
#dela-surface-atlas [hidden]{display:none!important}
#dela-surface-atlas .atlas{background:var(--paper);border:1px solid #d9d1c0;border-radius:4px;overflow:hidden}
#dela-surface-atlas .mast{padding:23px clamp(17px,3.2cqw,34px) 18px}
#dela-surface-atlas .signature{display:flex;align-items:center;flex-wrap:wrap;gap:5px 11px;padding-right:56px;color:#405359}
#dela-surface-atlas .clinic{font-weight:650;letter-spacing:.155em;text-transform:uppercase;font-size:11px;color:#294044}
#dela-surface-atlas .practice{font-size:11px;letter-spacing:.012em;padding-left:12px;border-left:1px solid #b99e72}
#dela-surface-atlas .headline{display:flex;gap:12px 18px;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;margin-top:13px}
#dela-surface-atlas h2{color:var(--ink);font:400 clamp(37px,5.7cqw,60px)/1 "Bodoni Moda",Georgia,serif;letter-spacing:-.048em;margin:0;white-space:normal}
#dela-surface-atlas h2 em{font-weight:400;color:#785d32}
#dela-surface-atlas button{font-family:inherit;color:inherit;-webkit-tap-highlight-color:transparent}
#dela-surface-atlas .modes{display:inline-flex;align-items:stretch;border:1px solid #cfc4ae;padding:3px;gap:2px;border-radius:5px;background:#f3eddf;margin-bottom:3px;max-width:100%}
#dela-surface-atlas .modes button{white-space:nowrap;border:0;border-radius:3px;background:transparent;padding:8px 12px;font-size:12px;line-height:1.25;font-weight:560}
#dela-surface-atlas .modes button[aria-pressed="true"]{background:var(--ink);color:#fff7e5}
#dela-surface-atlas .modes button[aria-pressed="false"]:hover{background:#e8dfcd}
#dela-surface-atlas .plate{display:grid;grid-template-columns:minmax(0,1.61fr) minmax(0,1fr);background:var(--deep);color:var(--light);border-top:1px solid #173139}
#dela-surface-atlas figure{margin:0;min-width:0}
#dela-surface-atlas .front{background:#102a30}
#dela-surface-atlas .corneal-section{background:radial-gradient(ellipse at 52% 41%,#1c3a40 0%,#102c33 55%,#0b242a 100%);border-left:1px solid #496063;display:flex;flex-direction:column}
#dela-surface-atlas .plate-head{height:41px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 clamp(12px,2.1cqw,23px);border-bottom:1px solid #3b4e50}
#dela-surface-atlas .plate-head h3{font:550 11px/1.25 Inter,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#f8f1df;margin:0}
#dela-surface-atlas .plate-head .meta{font-size:11px;color:#b6c7c6;white-space:nowrap}
#dela-surface-atlas .gland-toggle{display:inline-flex;gap:7px;align-items:center;min-height:34px;color:#e7e7d9;font-size:11px;line-height:1.2;user-select:none}
#dela-surface-atlas .gland-toggle input{appearance:none;-webkit-appearance:none;width:25px;height:14px;position:relative;flex:0 0 auto;margin:0;border:1px solid #889b9c;background:#375159;border-radius:30px}
#dela-surface-atlas .gland-toggle input::after{content:"";position:absolute;left:2px;top:2px;width:8px;height:8px;border-radius:50%;background:#e1e8e1}
#dela-surface-atlas .gland-toggle input:checked{background:#88b7b1;border-color:#88b7b1}
#dela-surface-atlas .gland-toggle input:checked::after{left:13px;background:#092a30}
#dela-surface-atlas .photo{position:relative;aspect-ratio:624/350;width:100%;background:#78644e;overflow:hidden;isolation:isolate;touch-action:pan-y;user-select:none;cursor:grab}
#dela-surface-atlas .photo.dragging{cursor:grabbing}
#dela-surface-atlas .photo img,#dela-surface-atlas .photo canvas,#dela-surface-atlas .photo .photo-shade{display:block;position:absolute;inset:0;height:100%;width:100%;pointer-events:none}
#dela-surface-atlas .photo img{object-fit:cover}
#dela-surface-atlas .lid-handle{position:absolute;left:15%;right:17%;top:25%;bottom:19%;touch-action:none}
#dela-surface-atlas .photo .photo-shade{background:linear-gradient(180deg,rgba(8,22,23,.14),transparent 27%,transparent 78%,rgba(18,24,20,.15)),linear-gradient(90deg,rgba(27,32,22,.10),transparent 17%,transparent 89%,rgba(18,34,32,.12))}
#dela-surface-atlas .photo-label{position:absolute;pointer-events:none;font-size:clamp(11px,1.23cqw,13px);line-height:1.25;font-weight:560;letter-spacing:-.01em;background:#10292ded;color:#fff8e9;border:1px solid #87948a88;box-shadow:0 2px 8px #131d202d;border-radius:3px;padding:5px 8px;display:flex;align-items:center;gap:6px}
#dela-surface-atlas .label-tear{right:3%;top:4%}
#dela-surface-atlas .label-oil{left:3%;bottom:4%}
#dela-surface-atlas .label-tear::before,#dela-surface-atlas .label-oil::before{content:"";position:relative;display:block;width:6px;height:6px;flex:0 0 auto;background:#8fe3e3;border-radius:50%;box-shadow:0 0 0 1px #8fe3e34d}
#dela-surface-atlas .label-oil::before{background:#fac576;transform:rotate(45deg);border-radius:1px;box-shadow:none}
#dela-surface-atlas .recoat-tag{position:absolute;inset:auto 2.8% 6% auto;padding:4px 6px;border-radius:2px;background:#10292df5;color:#fff5dc;border:1px solid #b0bba666;font-size:11px;line-height:1.25;pointer-events:none}
#dela-surface-atlas .front-caption{padding:9px clamp(12px,2.1cqw,23px) 10px;font-size:11px;color:#c4d2d0;line-height:1.4;display:flex;align-items:center;gap:8px;border-top:1px solid #46605a}
#dela-surface-atlas .front-caption .drag-glyph{color:#f3c778;font-size:17px;line-height:.8}
#dela-surface-atlas .section-body{display:flex;flex:1;flex-direction:column;justify-content:center;padding:4px 0 10px}
#dela-surface-atlas .cutaway{margin:0 auto;display:block;width:100%;max-width:435px;aspect-ratio:350/194}
#dela-surface-atlas .cutout-wrap{min-width:0}
#dela-surface-atlas .section-notes{display:grid;grid-template-columns:1fr 1fr;gap:2px;margin:-7px 7% 8px;color:#c0d0ca;text-align:center;font-size:11px;line-height:1.3}
#dela-surface-atlas .key{margin:0 7%;padding:8px 0 1px;border-top:1px solid #445b5c;display:grid;grid-template-columns:1fr 1fr;gap:5px 10px;list-style:none}
#dela-surface-atlas .key li{display:flex;align-items:center;gap:7px;font-size:clamp(11px,1.23cqw,13px);line-height:1.35;color:#edf1e7}
#dela-surface-atlas .key button{font:inherit;background:transparent;border:0;border-radius:2px;padding:2px 1px;color:inherit;display:inline-flex;align-items:center;gap:7px;text-align:left;min-width:0}
#dela-surface-atlas .key button:hover,#dela-surface-atlas .key button[aria-pressed="true"]{text-decoration:underline;text-underline-offset:3px}
#dela-surface-atlas .layer-note{margin:7px 7% 0;color:#cbd9cf;font-size:11px;line-height:1.4}
#dela-surface-atlas .key i{width:15px;height:9px;display:inline-block;flex:none}
#dela-surface-atlas .k-oil{background:linear-gradient(transparent 33%,#f4c16d 35%,#f7d699 69%,transparent 71%)}
#dela-surface-atlas .k-water{background:linear-gradient(180deg,#89dae0,#55a7b5);border-radius:55% 38% 52% 35%}
#dela-surface-atlas .k-mucin{background:repeating-linear-gradient(105deg,transparent 0 3px,#bed9a5 3.5px 5px);border-bottom:2px solid #bed9a5}
#dela-surface-atlas .k-cornea{background:repeating-linear-gradient(0deg,#759b98 0 2px,#b6c6af 2.5px 3.5px);border-radius:2px}
#dela-surface-atlas .instrument{padding:17px clamp(16px,3.1cqw,33px) 13px;background:var(--paper)}
#dela-surface-atlas .transport{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:clamp(12px,2.5cqw,27px)}
#dela-surface-atlas .play{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--ink);color:#fff8e7;border:1px solid var(--ink);border-radius:4px;padding:10px 14px;min-height:40px;min-width:113px;font-size:13px;font-weight:570;white-space:nowrap}
#dela-surface-atlas .play:hover{background:#254a4d}
#dela-surface-atlas .play-symbol{font:400 17px/1 Arial,sans-serif;color:#f2c679;min-width:14px;text-align:center}
#dela-surface-atlas .play-symbol i,#dela-surface-atlas .play-symbol svg{width:16px;height:16px;display:block}
#dela-surface-atlas .time{min-width:0}
#dela-surface-atlas .track-head{display:flex;align-items:baseline;justify-content:space-between;gap:7px;line-height:1.2;margin-bottom:1px}
#dela-surface-atlas .track-head label{font-weight:580;font-size:12px}
#dela-surface-atlas .track-head span{font-size:11px;color:#566760}
#dela-surface-atlas .range{--played:0%;display:block;-webkit-appearance:none;appearance:none;width:100%;height:22px;margin:0;background:transparent;cursor:ew-resize;accent-color:#7e623b}
#dela-surface-atlas .range::-webkit-slider-runnable-track{height:4px;background:linear-gradient(90deg,#8a693e var(--played),#cfc7b5 var(--played));border-radius:3px}
#dela-surface-atlas .range::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-5px;background:#18373b;border:2px solid var(--paper);box-shadow:0 0 0 1px #6b796e;border-radius:50%}
#dela-surface-atlas .range::-moz-range-track{height:4px;background:#cfc7b5;border-radius:3px}
#dela-surface-atlas .range::-moz-range-progress{height:4px;background:#8a693e}
#dela-surface-atlas .range::-moz-range-thumb{width:11px;height:11px;background:#18373b;border:2px solid var(--paper);border-radius:50%}
#dela-surface-atlas .chapters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:2px;gap:3px}
#dela-surface-atlas .chapters button{border:0;border-radius:2px;padding:4px 2px;text-align:center;background:transparent;color:#5b6865;font-size:11px;line-height:1.25;font-weight:480}
#dela-surface-atlas .chapters button:first-child{text-align:left}
#dela-surface-atlas .chapters button:last-child{text-align:right}
#dela-surface-atlas .chapters button[aria-current="step"]{color:#694c23;font-weight:670}
#dela-surface-atlas .chapters button:hover{text-decoration:underline;text-underline-offset:3px}
#dela-surface-atlas .status{display:flex;align-items:baseline;gap:4px 13px;flex-wrap:wrap;border-top:1px solid var(--rule);padding-top:10px;margin:13px 0 0;color:#394f50}
#dela-surface-atlas .status strong{font:500 clamp(20px,2.4cqw,25px)/1.22 "Bodoni Moda",Georgia,serif;color:var(--ink);letter-spacing:-.018em}
#dela-surface-atlas .status span{font-size:13px;line-height:1.45}
#dela-surface-atlas .sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
@container(max-width:780px){#dela-surface-atlas .plate{grid-template-columns:minmax(0,1.42fr) minmax(0,1fr)}#dela-surface-atlas .key{margin:0 5%}#dela-surface-atlas .modes button{padding-inline:10px}}
@container(max-width:680px){#dela-surface-atlas .plate{display:block}#dela-surface-atlas .corneal-section{border-left:0;border-top:1px solid #475d5d}#dela-surface-atlas .section-body{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(125px,1fr);align-items:center;padding:4px 14px 4px 4px;gap:4px}#dela-surface-atlas .key{grid-template-columns:1fr;border:0;margin:0;padding:0;gap:10px}#dela-surface-atlas .corneal-section .plate-head{height:35px}#dela-surface-atlas .mast{padding-top:18px}#dela-surface-atlas .modes{margin-bottom:0}}
@container(max-width:470px){#dela-surface-atlas .headline{display:grid;justify-content:start;gap:12px}#dela-surface-atlas .signature{padding-right:26px}#dela-surface-atlas .mast{padding-bottom:14px}#dela-surface-atlas .section-body{grid-template-columns:minmax(0,1fr) 113px;padding-right:9px;gap:2px}#dela-surface-atlas .key{gap:8px}#dela-surface-atlas .key li{gap:6px}#dela-surface-atlas .photo-label{padding:3px 5px;gap:4px}#dela-surface-atlas .label-tear{right:2.4%;top:3.6%}#dela-surface-atlas .label-oil{left:2.4%;bottom:3.6%}#dela-surface-atlas .transport{grid-template-columns:1fr;gap:9px}#dela-surface-atlas .play{justify-self:start}#dela-surface-atlas .instrument{padding-top:12px}#dela-surface-atlas .status{display:block;margin-top:8px}#dela-surface-atlas .status strong{margin-right:7px}#dela-surface-atlas .practice{padding-left:8px}#dela-surface-atlas .signature{gap:4px 7px}}
@container(max-width:355px){#dela-surface-atlas .signature{display:block}#dela-surface-atlas .practice{display:block;padding:0;border:0;margin-top:2px}#dela-surface-atlas .photo-label{font-size:11px}#dela-surface-atlas .section-body{grid-template-columns:minmax(0,1fr) 101px;padding-right:5px}}
@media(pointer:coarse){#dela-surface-atlas .modes button,#dela-surface-atlas .play,#dela-surface-atlas .chapters button{min-height:44px}#dela-surface-atlas .plate-head{min-height:44px}#dela-surface-atlas .gland-toggle{min-height:44px}#dela-surface-atlas .range{height:37px}}
@container(max-width:470px){#dela-surface-atlas .section-body{display:flex;align-items:stretch;padding:2px 12px 11px}#dela-surface-atlas .cutout-wrap{width:100%;max-width:342px;margin:auto}#dela-surface-atlas .section-notes{margin:-6px 6% 7px}#dela-surface-atlas .key{width:100%;max-width:330px;margin:0 auto;grid-template-columns:1fr 1fr;border-top:1px solid #405557;padding-top:8px;gap:5px 9px}}
#dela-surface-atlas .modes{width:fit-content;justify-self:start}
@container(max-width:680px){#dela-surface-atlas .atlas{display:flex;flex-direction:column}#dela-surface-atlas .plate{display:contents}#dela-surface-atlas .mast{order:0}#dela-surface-atlas .front{order:1}#dela-surface-atlas .instrument{order:2}#dela-surface-atlas .corneal-section{order:3}}
@container (min-width:471px) and (max-width:680px){#dela-surface-atlas .layer-note{grid-column:1/-1;margin:0 5% 8px;text-align:center}}
@media(pointer:coarse){#dela-surface-atlas .key{gap:0 8px}#dela-surface-atlas .key button{min-height:44px}}

/* Homepage placement and typography shared with the clinic's editorial layout. */
.blink-lab {
  background: var(--deep);
  color: var(--ivory);
  padding-block: clamp(40px, 5.6vw, 80px) clamp(27px, 3.5vw, 50px);
  border-block: 1px solid #233d4b;
}
#dela-surface-atlas.blink-wrap {
  width: min(88%, 1190px);
  margin-inline: auto;
}
#dela-surface-atlas .atlas {
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#dela-surface-atlas .mast {
  padding: 0 0 clamp(17px, 2.4vw, 30px);
}
#dela-surface-atlas .mast .eyebrow { color: #dfc38b; }
#dela-surface-atlas .headline { display: block; margin: 12px 0 8px; }
#dela-surface-atlas .mast h2 {
  color: var(--ivory);
  font: 400 clamp(43px, 5.4cqw, 66px)/1.07 var(--serif);
  letter-spacing: -.05em;
  text-wrap: balance;
}
#dela-surface-atlas .mast h2 em { color: #dfc38b; }
#dela-surface-atlas .blink-choices {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 13px 25px;
}
#dela-surface-atlas .blink-intro { color: #d1dadd; font-size: 15px; line-height: 1.55; }
#dela-surface-atlas .modes { margin: 0; background: transparent; border-color: #647783; }
#dela-surface-atlas .modes button { color: #e4e9e9; }
#dela-surface-atlas .modes button[aria-pressed="true"] { background: #e7d4ac; color: #102a39; }
#dela-surface-atlas .modes button[aria-pressed="false"]:hover { background: #24414d; }
#dela-surface-atlas .plate {
  overflow: hidden;
  border: 1px solid #425866;
  border-bottom: 0;
  border-radius: 4px 4px 0 0;
}
#dela-surface-atlas .plate-head h3 { letter-spacing: .13em; }
#dela-surface-atlas .instrument { border-radius: 0 0 4px 4px; }
#dela-surface-atlas .status span { font-size: 14px; }
#dela-surface-atlas input:focus-visible { outline: 2px solid #956a2c; outline-offset: 3px; }
#dela-surface-atlas .blink-related {
  color: #ecede6;
  margin-top: 13px;
  border-block-end: 1px solid #3d515c;
}
#dela-surface-atlas .blink-related > summary {
  width: fit-content;
  max-width: 100%;
  padding: 13px 0;
  font: 500 14px/1.4 var(--sans);
  color: #f0e8d7;
}
#dela-surface-atlas .blink-related > summary::marker { color: #dfc38b; }
#dela-surface-atlas .blink-reading-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(22px, 3.8vw, 54px);
  padding: 13px 0 21px;
}
#dela-surface-atlas .blink-reading-grid h3 { font: 400 clamp(21px, 2.25cqw, 29px)/1.18 var(--serif); }
#dela-surface-atlas .blink-reading-grid p { color: #c4d3d8; font-size: 14px; margin-block: 9px 3px; }
#dela-surface-atlas .blink-reading-grid .text-link { color: #f0dfbe; }
#dela-surface-atlas .blink-reading-grid .text-link .icon { color: #dfc38b; }
@media (max-width: 700px) {
  #dela-surface-atlas.blink-wrap { width: calc(100% - 36px); }
}
@media (max-width: 385px) {
  #dela-surface-atlas.blink-wrap { width: calc(100% - 24px); }
}
@container (max-width: 680px) {
  #dela-surface-atlas .plate { border: 0; }
  #dela-surface-atlas .mast { padding-bottom: 16px; }
  #dela-surface-atlas .front { overflow: hidden; border: 1px solid #425866; border-bottom: 0; border-radius: 4px 4px 0 0; }
  #dela-surface-atlas .instrument { border-radius: 0; }
  #dela-surface-atlas .corneal-section { overflow: hidden; border: 1px solid #425866; border-radius: 0 0 4px 4px; }
  #dela-surface-atlas .blink-reading-grid { grid-template-columns: 1fr; gap: 16px; padding-top: 4px; }
  #dela-surface-atlas .blink-intro { font-size: 14px; max-width: 43ch; }
}
@container (max-width: 470px) {
  #dela-surface-atlas .mast h2 { font-size: clamp(38px, 10.8cqw, 46px); }
  #dela-surface-atlas .blink-choices { display: grid; justify-content: start; }
  #dela-surface-atlas .status strong { display: block; margin: 0 0 3px; }
}
