
:root{--ia-ink:#103338;--ia-deep:#092b32;--ia-mute:#647775;--ia-sand:#f3eddf;--ia-card:#fffaf0;--ia-line:#ddd6c6;--ia-gold:#c78f42;--ia-sea:#137c8a;--ia-acid:#d9e8af}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 12% 12%,rgba(201,168,102,.16),transparent 28%),#f3efe5;color:var(--ia-ink);font-family:Arial,Helvetica,sans-serif}
button,select,input{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.5}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #d9a44b;outline-offset:3px}
[hidden]{display:none!important}
.isle-page{max-width:1660px;margin:auto;padding:0 clamp(16px,3vw,52px) 90px}
.isle-prelude{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:23px 0 25px}
.isle-prelude a{font-size:.79rem;text-decoration:none;font-weight:750;color:#5c736f}
.isle-prelude a:hover{color:#126d71}
.isle-preview{border:1px solid #d8c99f;border-radius:100px;padding:8px 12px;background:#f9f2e2;font-size:.62rem;letter-spacing:.12em;font-weight:900;color:#96703b}
.isle-hero{display:grid!important;grid-template-columns:1.2fr .55fr!important;align-items:end!important;gap:30px!important;margin:0 0 32px!important;padding:16px 0 0!important;min-height:0!important;border:0!important;box-shadow:none!important;background:transparent!important;border-radius:0!important}
.isle-eyebrow,.isle-overline{font-size:.67rem;font-weight:900;letter-spacing:.17em;text-transform:uppercase}
.isle-eyebrow{display:flex;align-items:center;gap:12px;color:#98712e}
.isle-eyebrow-line{display:block;width:29px;height:2px;background:#b98c45}
.isle-hero h1{margin:17px 0 0;color:var(--ia-deep);font-size:clamp(4.1rem,8.35vw,9rem);font-weight:900;letter-spacing:-.083em;line-height:.86}
.isle-hero h1 em{font-weight:700;font-family:Georgia,'Times New Roman',serif;letter-spacing:-.075em;color:#2c7e79}
.isle-hero-side{padding-bottom:6px;max-width:370px;justify-self:end}
.isle-hero-side p{font-size:1.01rem;line-height:1.72;margin:10px 0 0;color:#627470}
.isle-hero-side strong{color:#213d3d}
.isle-orbit{font-size:2rem;color:#bb995c;line-height:1;display:flex;gap:8px;align-items:center}
.isle-orbit span{font-size:.66rem;font-weight:850;letter-spacing:.12em;color:#758580}
.isle-app{display:grid;grid-template-columns:310px minmax(0,1fr);gap:15px;align-items:start}
.isle-panel{border-radius:20px;border:1px solid var(--ia-line);background:var(--ia-card);box-shadow:0 13px 36px rgba(23,58,53,.055)}
.isle-controls{padding:22px 23px 24px}
.isle-panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.isle-overline{color:#a37b3e}
.isle-panel-head h2,.isle-journal h2,.isle-compare h2{font-size:1.52rem;letter-spacing:-.05em;line-height:1.07;margin:10px 0}
.isle-icon{font-size:2rem;color:#a7b9a5}
.isle-muted{font-size:.79rem;line-height:1.65;color:#687a76}
.isle-control-intro{margin:2px 0 20px}
.isle-presets{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:24px}
.isle-presets button{background:#eee9dc;border:1px solid #e3dbcb;border-radius:8px;padding:10px 6px;color:#566865;font-size:.71rem;font-weight:800;transition:background .2s,transform .2s}
.isle-presets button:hover{transform:translateY(-1px)}
.isle-presets button.is-active{color:#fffdf3;border-color:#1a5355;background:#164f53}
.isle-range{margin-bottom:21px}
.isle-range-title{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:11px}
.isle-range-title label{font-size:.81rem;font-weight:800;color:#274341}
.isle-range-title output{font-size:.75rem;color:#277e7b;font-weight:900}
.isle-range input[type=range]{display:block;width:100%;height:5px;appearance:none;-webkit-appearance:none;border:0;border-radius:99px;background:linear-gradient(90deg,#297979 var(--pct,50%),#dfdacd var(--pct,50%));cursor:pointer}
.isle-range input::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;background:#fff9eb;border:4px solid #206b6d;border-radius:50%;box-shadow:0 1px 5px #0b454544}
.isle-range input::-moz-range-thumb{width:10px;height:10px;background:#fff9eb;border:4px solid #206b6d;border-radius:50%}
.isle-range input:disabled{opacity:.5;cursor:not-allowed}
.isle-range-foot{display:flex;justify-content:space-between;margin-top:9px;color:#8b9890;font-size:.63rem}
.isle-parameter-note{font-size:.69rem;line-height:1.5;color:#978051;margin:2px 0 14px;min-height:28px}
.isle-new-run{width:100%;border:1px solid #9eb2ac;background:#ecf1e9;border-radius:10px;padding:13px 9px;color:#24595a;font-weight:850;font-size:.79rem;transition:.2s}
.isle-new-run:hover{background:#dcebe1}
.isle-science-small{font-size:.66rem;line-height:1.65;color:#89928a;margin:17px 1px 0}
.isle-experience{display:flex;min-width:0;flex-direction:column;gap:13px}
.isle-viewport{position:relative;isolation:isolate;overflow:hidden;border-radius:21px;height:clamp(420px,48vw,655px);background:radial-gradient(ellipse at 50% 46%,#196c82 0%,#0a3448 70%,#071c2e 100%);box-shadow:0 18px 48px rgba(12,48,56,.17)}
#island-canvas{display:block;width:100%;height:100%;position:absolute;inset:0;cursor:crosshair}
.isle-viewport::after{pointer-events:none;content:'';position:absolute;inset:0;border-radius:21px;border:1px solid rgba(232,247,231,.15);box-shadow:inset 0 0 110px rgba(2,12,25,.42),inset 0 0 2px rgba(255,255,255,.12);z-index:1}
.isle-topbar,.isle-stage-left,.isle-stage-right,.isle-stage-bottom,.isle-split-label{position:absolute;z-index:2;pointer-events:none}
.isle-topbar{top:24px;left:26px;right:25px;display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.isle-live{display:flex;align-items:center;gap:9px;color:#e5f6e6;font-size:.68rem;font-weight:900;letter-spacing:.14em;text-shadow:0 1px 6px #061b32}
.isle-live-dot{width:7px;height:7px;border-radius:100%;background:#c4e3ac;box-shadow:0 0 0 5px #b4e4a526}
.isle-view-switch{pointer-events:auto;display:flex;gap:2px;background:#08242fc9;border:1px solid #7a9b9b55;border-radius:100px;padding:4px;backdrop-filter:blur(12px)}
.isle-view-switch button{border:0;background:transparent;color:#bed8d3;border-radius:100px;padding:9px 13px;font-size:.68rem;letter-spacing:.015em;font-weight:850}
.isle-view-switch button.is-active{background:#e4eee5;color:#173f43}
.isle-stage-left{top:89px;left:26px;display:flex;flex-direction:column;gap:18px}
.isle-map-label{font-size:.57rem;letter-spacing:.13em;color:#b3d3d3;writing-mode:vertical-rl;transform:rotate(180deg)}
.isle-compass{display:flex;flex-direction:column;align-items:center;gap:1px;color:#d7efdf;font-family:Georgia,serif;text-shadow:0 2px 7px #021b29}
.isle-compass span:first-child{font-family:Arial,sans-serif;font-weight:900;font-size:.67rem}
.isle-compass span:last-child{font-size:1.9rem}
.isle-stage-right{bottom:70px;right:27px;display:flex;flex-direction:column;align-items:flex-end;gap:17px}
.isle-stage-pill{padding:9px 11px;border-radius:6px;border:1px solid #beded35b;background:#082e39a8;backdrop-filter:blur(8px);color:#c4e7d4;font-size:.6rem;letter-spacing:.12em;font-weight:900}
.isle-scale{color:#e4eae1;font-weight:700;font-size:.62rem;letter-spacing:.04em;text-shadow:0 1px 8px #051d26}
.isle-stage-bottom{bottom:20px;left:28px;right:28px;display:flex;justify-content:space-between;gap:12px;color:#a3c3c6;font-size:.54rem;font-weight:800;letter-spacing:.11em}
.isle-split-label{bottom:112px;left:20%;right:20%;display:flex;justify-content:space-between;color:#ebf5da;font-size:.66rem;font-weight:850;text-shadow:0 2px 8px #09202a}
.isle-console{background:#0d333c;border-radius:18px;color:#f2f4eb;padding:24px 27px 23px;box-shadow:0 10px 28px #123e431a}
.isle-time-head{display:flex;justify-content:space-between;align-items:end;gap:10px}
.isle-console .isle-overline{color:#a4c8be}
.isle-time-number{display:flex;gap:13px;align-items:baseline;margin-top:6px}
.isle-time-number strong{font-size:clamp(2.2rem,4.1vw,3.6rem);line-height:1;font-weight:900;letter-spacing:-.065em;font-variant-numeric:tabular-nums}
.isle-time-number span{font-size:.74rem;color:#b1c8c2}
.isle-time-finish{display:flex;flex-direction:column;align-items:end;font-size:.6rem;letter-spacing:.12em;line-height:1.8;color:#789d9d;font-weight:900}
.isle-time-finish strong{color:#d3e4da;letter-spacing:.055em;font-size:.78rem}
.isle-timeline{height:8px;position:relative;background:#31515a;border-radius:50px;margin:25px 1px 23px}
#timeline-fill{height:100%;width:0;background:linear-gradient(90deg,#49b6ad,#d5dda5);border-radius:30px;transition:width .2s}
.isle-markers{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center}
.isle-markers i{width:3px;height:14px;background:#c1d2c7a8;border-radius:2px}
.isle-play-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.isle-play{background:#d9e7ac;border:0;border-radius:9px;padding:14px 19px;color:#133c39;font-size:.83rem;font-weight:900;min-width:174px}
.isle-play:not(:disabled):hover{background:#f1f4c5}
.isle-aux{border:1px solid #72929673;border-radius:9px;background:#1c4750;color:#d3e6dc;font-weight:800;font-size:.75rem;padding:13px 12px}
.isle-aux:not(:disabled):hover{background:#2b5a61}
.isle-speed{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:.62rem;font-weight:900;letter-spacing:.1em;color:#a0b9b3}
.isle-speed select{color:#eaf4e5;background:#1c4750;border:1px solid #72929673;border-radius:8px;padding:12px 6px}
.isle-readouts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--ia-line);border-radius:17px;overflow:hidden;background:#fffaf1}
.isle-readouts>div{padding:21px 17px;border-right:1px solid #e4dfd1;min-width:0}
.isle-readouts>div:last-child{border-right:0}
.isle-readouts span{display:block;color:#86968e;font-size:.6rem;letter-spacing:.095em;font-weight:900}
.isle-readouts strong{display:block;font-variant-numeric:tabular-nums;color:#173c40;letter-spacing:-.05em;font-size:clamp(1.25rem,2.3vw,2.1rem);margin:7px 0 4px}
.isle-readouts small{font-size:.62rem;color:#89988d;line-height:1.4;display:block}
.isle-underlay{display:grid;grid-template-columns:1.05fr .95fr;gap:13px;align-items:stretch}
.isle-journal,.isle-compare{padding:22px 24px}
.isle-subhead{display:flex;justify-content:space-between;gap:10px;align-items:center}
.isle-journal-count{font-size:.58rem;letter-spacing:.11em;color:#8d9890;font-weight:900}
.isle-journal h2,.isle-compare h2{font-size:1.5rem}
.isle-journal p,.isle-compare p{margin:3px 0 16px}
#event-list{list-style:none;margin:0;padding:0;max-height:210px;overflow-y:auto;scrollbar-color:#b9c7bd transparent}
#event-list li{border-bottom:1px solid #ebe5d8;padding:10px 0;font-size:.76rem;line-height:1.5;color:#3c5f5c}
#event-list li:last-child{border-bottom:0}
#event-list li strong{color:#906a32;font-size:.67rem;display:inline-block;min-width:80px;font-variant-numeric:tabular-nums}
#event-list .isle-empty-event{color:#9ba69d;font-style:italic}
.isle-compare-actions{display:flex;flex-wrap:wrap;gap:7px}
.isle-save{border:0;border-radius:8px;background:#194d50;color:#fff9e7;padding:12px 14px;font-size:.73rem;font-weight:850}
.isle-save:hover{background:#296968}
.isle-compare-button{color:#22585a;background:#e8eee7;border-color:#c9d6cc}
.isle-compare-button:not(:disabled):hover{background:#d9e7de}
.isle-compare-message{font-size:.68rem!important;color:#798c7f;margin:11px 0 20px!important;line-height:1.45}
.isle-note{display:flex;flex-direction:column;gap:6px;border-left:3px solid #c9a064;padding:10px 0 10px 14px;background:linear-gradient(90deg,#f7efdd 0%,transparent 100%)}
.isle-note b{font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:#9c783d}
.isle-note span{font-size:.73rem;line-height:1.56;color:#596d63}
.isle-outro{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;padding:88px 12px 50px}
.isle-outro h2{font-size:clamp(2.3rem,4vw,4.5rem);line-height:1;letter-spacing:-.07em;color:#173b3f;margin:14px 0}
.isle-outro h2 em{font-family:Georgia,serif;color:#42837d;font-weight:400}
.isle-outro p{color:#617571;font-size:.91rem;line-height:1.8;margin:0 0 17px}
.isle-outro p strong{color:#243f3e}
.isle-outro .isle-disclaimer{border-top:1px solid #d9d4c8;padding-top:15px;font-size:.75rem;color:#88968c}
@media(max-width:1150px){.isle-app{grid-template-columns:274px minmax(0,1fr)}.isle-controls{padding:18px}.isle-viewport{height:510px}.isle-readouts>div{padding:15px 12px}.isle-underlay{grid-template-columns:1fr}.isle-hero h1{font-size:clamp(4.2rem,8vw,7rem)}}
@media(max-width:800px){.isle-app{grid-template-columns:1fr}.isle-controls{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 21px}.isle-controls .isle-panel-head,.isle-control-intro,.isle-presets,.isle-parameter-note,.isle-new-run,.isle-science-small{grid-column:1/-1}.isle-viewport{height:550px}.isle-hero{grid-template-columns:1fr!important;gap:13px!important}.isle-hero-side{justify-self:start;max-width:640px}.isle-hero h1{font-size:clamp(4rem,12vw,7rem)}.isle-orbit{display:none}.isle-hero-side p{margin:0}.isle-outro{grid-template-columns:1fr;gap:18px;padding-top:58px}}
@media(max-width:540px){.isle-page{padding:0 12px 48px}.isle-prelude{margin:18px 3px}.isle-preview{font-size:.54rem;padding:7px}.isle-eyebrow{font-size:.56rem}.isle-hero{padding:6px 6px 0!important;margin-bottom:23px!important}.isle-hero h1{font-size:clamp(3.7rem,13vw,5.6rem)}.isle-hero-side p{font-size:.88rem}.isle-controls{display:block;padding:20px}.isle-range{margin-bottom:19px}.isle-viewport{height:430px;border-radius:14px}.isle-topbar{left:13px;right:13px;top:16px}.isle-live{font-size:.54rem}.isle-view-switch button{font-size:.62rem;padding:8px 9px}.isle-stage-left{left:14px;top:75px}.isle-map-label{font-size:.48rem}.isle-stage-right{right:14px;bottom:65px}.isle-stage-pill{font-size:.49rem}.isle-stage-bottom{left:13px;right:13px;font-size:.45rem}.isle-console{padding:19px 15px}.isle-time-number strong{font-size:2.5rem}.isle-time-number span{font-size:.61rem}.isle-time-finish{font-size:.49rem}.isle-time-finish strong{font-size:.59rem}.isle-play-row{gap:6px}.isle-play{flex:1;min-width:190px;padding:14px 12px}.isle-aux{padding:13px 10px}.isle-speed{margin-left:0;flex:1;justify-content:flex-end}.isle-readouts{grid-template-columns:repeat(2,1fr)}.isle-readouts>div:nth-child(2){border-right:0}.isle-readouts>div:nth-child(-n+2){border-bottom:1px solid #e4dfd1}.isle-underlay{gap:12px}.isle-journal,.isle-compare{padding:20px}.isle-outro{padding:45px 8px}.isle-scale{font-size:.53rem}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}


/* V2 · Deliberately visible geomorphic change */
.isle-change-legend,.isle-visual-guide,.isle-impact{z-index:3;position:absolute;pointer-events:auto}
.isle-change-legend{right:23px;top:84px;display:flex;flex-wrap:wrap;gap:9px;max-width:276px;background:rgba(7,31,44,.83);border:1px solid #bed4bc4b;border-radius:11px;padding:11px 13px;backdrop-filter:blur(12px);color:#e8f1e3;font-size:.64rem;font-weight:750}
.isle-change-legend span{display:flex;gap:6px;align-items:center}
.isle-change-legend i{display:block;width:9px;height:9px;border-radius:2px}
.isle-legend-erode{background:#e56e4d}
.isle-legend-built{background:#80ccb0}
.isle-legend-lost{background:#f26956}
.isle-legend-gain{background:#b6ea75}
.isle-visual-guide{left:23px;bottom:73px;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.isle-visual-guide label,.isle-visual-guide button{background:rgba(7,29,41,.83);border:1px solid #bddec35c;border-radius:8px;color:#e7f0dc;backdrop-filter:blur(10px);padding:9px 11px;font-size:.7rem;font-weight:850}
.isle-visual-guide label{display:flex;gap:8px;align-items:center;cursor:pointer}
.isle-visual-guide input{accent-color:#f2d187;width:15px;height:15px;cursor:pointer}
.isle-visual-guide button:hover,.isle-visual-guide button[aria-pressed="true"]{background:#dbeecb;color:#1a4d4c}
.isle-impact{left:23px;bottom:119px;pointer-events:none;text-shadow:0 1px 8px #032332;color:#ffe1a2;font-size:.66rem;letter-spacing:.08em;font-weight:900}
.isle-view-switch button{white-space:nowrap}
@media(max-width:730px){
  .isle-change-legend{top:83px;right:13px;max-width:155px;gap:5px;font-size:.56rem;padding:8px}
  .isle-visual-guide{left:13px;bottom:63px;gap:5px}
  .isle-visual-guide label,.isle-visual-guide button{font-size:.59rem;padding:7px 8px}
  .isle-impact{left:13px;bottom:110px;font-size:.55rem;letter-spacing:.025em;max-width:92%}
  .isle-view-switch button{padding:8px 7px;font-size:.59rem}
  .isle-stage-right{bottom:151px;right:13px}
}
@media(max-width:405px){
  .isle-impact{bottom:126px}
  .isle-visual-guide{bottom:65px;max-width:76%}
  .isle-visual-guide label,.isle-visual-guide button{font-size:.55rem;padding:6px}
  .isle-stage-right{right:12px;bottom:73px}
  .isle-topbar{gap:7px}
  .isle-live{letter-spacing:.035em;max-width:100px}
}
