/* Quill product illustrations. Shared site tokens live in styles.css. */
.native-ui { --ui-bg:#fffefa; --ui-text:#282c27; --ui-muted:#7b8078; width:100%; min-width:0; background:var(--ui-bg); color:var(--ui-text); border:1px solid #dddfd4; border-radius:16px; box-shadow:0 18px 50px #2737260c; overflow:hidden; text-align:left; }
.ui-body { padding:26px; }
.native-ui .ui-title { font:400 34px/1.1 Georgia,serif; letter-spacing:-1px; margin:22px 0 8px; }
.native-ui .ui-subtitle { font:14px/1.5 Arial,sans-serif; color:var(--ui-muted); margin:0 0 22px; }
.ui-kicker { font:10px/1.5 Arial,sans-serif; letter-spacing:1.1px; color:#7d8d6e; }
.native-ui h4 { font:400 25px/1.15 Georgia,serif; letter-spacing:-.5px; margin:10px 0; }
.native-ui p { font:14px/1.65 Arial,sans-serif; color:var(--ui-muted); max-width:none; margin:10px 0; }
.native-ui button { cursor:pointer; }
.native-ui .ui-track-title { font:400 23px/1.2 Georgia,serif; margin:18px 0 8px; letter-spacing:-.4px; }
.ui-wave { display:flex; align-items:center; justify-content:center; gap:4px; height:65px; margin:20px 0 8px; overflow:hidden; }
.ui-wave i { display:block; flex:1; max-width:5px; height:var(--bar); border-radius:4px; background:#b9cbb2; }
.ui-wave i:nth-child(-n+14) { background:#486d55; }
.ui-audio-note { font-size:10px; text-align:center; color:var(--ui-muted); }
.ui-player { display:flex; align-items:center; gap:17px; margin-top:22px; }
.ui-speed { border:1px solid #dfe3d8; border-radius:999px; padding:9px 11px; background:transparent; color:var(--ui-text); font-size:12px; min-width:43px; }
.ui-play-symbol { display:grid; place-items:center; width:43px; height:43px; border-radius:50%; background:#365f4d; color:white; font-size:13px; padding-left:3px; }
.ui-player-label { font-size:11px; color:var(--ui-muted); }
.native-listen .ui-body { padding: 38px 32px; }
.native-listen .ui-track-title { margin-top: 0; font-size: 30px; }
.native-listen .ui-wave { height: 100px; margin-top: 28px; }
.native-listen .ui-player { margin-top: 30px; }
.native-ui .story-quote { display:block; min-height:0; margin:22px 0; padding:20px; background:#edf2e8; border:0; border-left:3px solid #749177; border-radius:0 10px 10px 0; }
.native-ui .story-quote p { font:400 20px/1.35 Georgia,serif; color:#344e3d; margin:0; }
.story-quote cite { font:12px/1.5 Arial,sans-serif; color:#66745f; margin-top:13px; }
.story-quote cite small { font-size:10px; }
.story-map { position:relative; height:170px; margin-top:12px; border-radius:10px; overflow:hidden; background:repeating-linear-gradient(10deg,transparent 0 36px,#f8f6ed 37px 44px),repeating-linear-gradient(100deg,#e6eadc 0 52px,#f8f6ed 53px 61px); }
.map-river { position:absolute; width:58px; height:270px; background:#b6d8dc; top:-45px; left:48%; transform:rotate(25deg); border-radius:45%; }
.map-road { position:absolute; height:9px; background:#fffdf5; width:120%; left:-10%; transform:rotate(-12deg); }
.road-one { top:45px; }.road-two { top:115px; }
.map-trail { position:absolute; height:240px; border-left:3px dashed #517858; left:43%; top:-25px; transform:rotate(25deg); }
.map-label { position:absolute; font-size:11px; color:#556350; background:#fffdf5d9; padding:3px 6px; border-radius:3px; }
.label-north { top:25px; left:15px; }.label-south { bottom:38px; right:15px; }
.map-pin { position:absolute; top:72px; left:42%; color:#3e6948; font-size:23px; text-shadow:0 0 2px white; }
.map-key { position:absolute; left:10px; bottom:8px; padding:2px 6px; background:#fffdf5df; font-size:10px; color:#43634a; border-radius:4px; }
.native-ui .map-caption { font-size:10px; margin:6px 0 0; }
.native-read { background:transparent; border:0; box-shadow:none; overflow:visible; }
.native-read .ui-body { padding:12px 8px; }
.simplify-input { text-align:center; }
.report-stack { position:relative; height:150px; margin:25px 18px 0; }
.report-sheet { position:absolute; top:0; width:68%; height:135px; padding:18px; border:1px solid #deded3; border-radius:9px; background:#fffefa; text-align:left; box-shadow:0 9px 20px #343e2910; }
.report-sheet:nth-child(1) { left:0; transform:rotate(-9deg); opacity:.55; }
.report-sheet:nth-child(2) { right:0; transform:rotate(9deg); opacity:.7; }
.report-sheet:nth-child(3) { left:16%; top:12px; }
.report-sheet span { font:8px/1.3 Arial,sans-serif; letter-spacing:1px; color:#858a7e; }
.report-sheet i { display:block; height:5px; background:#dfe3d8; margin-top:12px; border-radius:3px; }
.report-sheet i:nth-child(3) { width:83%; }.report-sheet i:last-child { width:63%; }
.simplify-connector { display:grid; place-items:center; height:62px; color:#688269; font-size:29px; }
.simplify-result { padding:26px; background:#fffefa; border:1px solid #cfdacb; border-radius:14px; box-shadow:0 15px 35px #334f2d10; }
.summary-label { display:flex; justify-content:space-between; gap:12px; align-items:center; }
.summary-label > span:last-child { font:19px/1 Georgia,serif; color:#41654a; }
.summary-points { display:grid; gap:14px; padding:0; margin:22px 0; list-style:none; }
.summary-points li { position:relative; padding-left:18px; font:14px/1.55 Arial,sans-serif; color:#566051; }
.summary-points li::before { content:'•'; position:absolute; left:0; color:#66856a; }
.native-ui .simplify-caption { text-align:center; font-size:10px; color:#7d8378; margin:15px 0 0; }
.native-context .story-summary { margin-top:14px; }
.native-context .story-quote { margin:20px 0; padding:17px 20px; }
.native-context .story-map { height:135px; }
.native-context .ui-title { margin-top:18px; }

/* Shared materials, legible captions, and consistent illustration spacing. */
.native-ui { --ui-bg:var(--paper); --ui-text:var(--ink); --ui-muted:var(--muted); border-color:var(--line); border-radius:var(--radius-small); box-shadow:none; }
.ui-body { padding:28px; }
.native-ui .ui-title { font-size:32px; letter-spacing:-.02em; }
.ui-kicker { color:#52674c; font-size:10px; }
.native-read { background:transparent; border:0; overflow:visible; }
.native-ui .simplify-caption { font-size:11px; color:var(--muted); }
.simplify-result { border-color:var(--line); border-radius:var(--radius-small); box-shadow:0 12px 28px #243d2410; }
.summary-points { margin-bottom:0; }
.report-sheet { border-radius:8px; }
.native-context .story-quote { border-left:0; border-radius:8px; padding:20px; }
.story-quote cite { display:block; font-style:normal; margin-top:12px; }
.native-listen .ui-body { padding:36px 28px; }
.native-listen .ui-track-title { font-size:30px; }
.ui-speed, .ui-play-symbol { min-width:44px; min-height:44px; }
.ui-speed:hover { background:var(--sage); }
.ui-audio-note, .ui-player-label { font-size:12px; }
@media(max-width:700px) {
 .ui-body { padding:22px; }
 .native-ui .ui-title { font-size:28px; }
 .native-read .ui-body { padding:8px 0; }
 .report-stack { margin-inline:6px; }
 .report-sheet { padding:14px; }
 .simplify-result { padding:22px; }
 .native-listen .ui-body { padding:28px 22px; }
 .native-listen .ui-track-title { font-size:26px; }
 .ui-player { flex-wrap:wrap; gap:12px; }
 .ui-player-label { flex-basis:100%; }
}