/* NORINGO / Planetary Power-Split Lab · independent v1.8 demonstration */
.pl-page {background:#182c25;color:#fff5e1;overflow:hidden}
.pl-hero {padding: 91px 0 38px; background:radial-gradient(ellipse 55% 90% at 75% 25%,rgba(148,79,42,.35),transparent 72%),linear-gradient(112deg,#16271e 0%,#25362a 55%,#4d322a 100%);position:relative}
.pl-hero .container{position:relative;z-index:1}
.pl-eyebrow{display:flex;align-items:center;gap:15px;color:#e7c99c;text-transform:uppercase;font-size:.69rem;letter-spacing:.20em;font-weight:800;margin:0 0 23px}
.pl-eyebrow::before{content:'';width:33px;height:4px;border-radius:5px;background:linear-gradient(90deg,#bb4938 0 32%,#e6a840 32% 65%,#81904b 65%)}
.pl-intro{display:grid;grid-template-columns:1.4fr .65fr;align-items:end;gap:50px}
.pl-intro h1{max-width:890px;font-family:Bahnschrift,'Arial Narrow',Arial,sans-serif;font-weight:750;font-size:clamp(3.1rem,5.4vw,6.5rem);letter-spacing:-.052em;line-height:.99;color:#fff5e6;margin:0}
.pl-intro h1 em{font-style:normal;color:#f2b45b}
.pl-intro p{font-size:clamp(1.05rem,1.45vw,1.26rem);color:#e5d9c4;line-height:1.72;margin:0 0 5px;max-width:410px}
.pl-shell{background:radial-gradient(ellipse 48% 61% at 36% 31%,rgba(179,109,48,.21),transparent 70%),linear-gradient(122deg,#142922 8%,#29352b 57%,#57362b 100%);padding-bottom:95px}
.pl-frame{display:grid;grid-template-columns:minmax(0,1.72fr) minmax(285px,.86fr);gap:0;border:1px solid rgba(242,196,123,.25);box-shadow:0 28px 84px rgba(6,12,10,.23);background:rgba(17,31,27,.50)}
.pl-stage{position:relative;min-width:0;min-height:660px;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse 68% 62% at 51% 55%,rgba(119,83,42,.23),transparent 82%),linear-gradient(rgba(237,196,131,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(237,196,131,.035) 1px,transparent 1px);background-size:auto,36px 36px,36px 36px}
.pl-stage:before{content:'';position:absolute;top:10%;left:12%;width:76%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(242,197,118,.18);box-shadow:0 0 0 43px rgba(242,197,118,.022),0 0 0 96px rgba(242,197,118,.017);pointer-events:none}
.pl-stage:after{content:'';position:absolute;left:50%;top:0%;height:100%;border-left:1px dashed rgba(245,208,136,.095);pointer-events:none}
.pl-head{position:absolute;z-index:2;left:27px;top:25px;display:flex;gap:12px;align-items:center;color:#e6d0ac;font-size:.69rem;letter-spacing:.12em;text-transform:uppercase;font-weight:750}
.pl-live{height:7px;width:7px;border-radius:100%;background:#e7b36c;box-shadow:0 0 0 4px rgba(231,179,108,.12)}
.pl-backing,.pl-stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.pl-backing{object-fit:contain;max-width:100%;padding:55px 14px 28px;opacity:1;transition:opacity .4s}
.pl-stage canvas{z-index:1;touch-action:pan-y;cursor:grab;opacity:0;transition:opacity .4s}
.pl-stage.pl-ready canvas{opacity:1}
.pl-stage.pl-ready .pl-backing{opacity:0;visibility:hidden}
.pl-stage.pl-fallback canvas{display:none}
.pl-guides{position:absolute;left:25px;bottom:23px;z-index:2;display:flex;flex-wrap:wrap;gap:12px;font-size:.67rem;font-weight:750;color:#e2c6a0;letter-spacing:.09em;text-transform:uppercase}
.pl-guides span{background:rgba(27,37,30,.86);border:1px solid rgba(251,208,139,.17);padding:8px 10px}
.pl-panel{padding:36px 31px 33px;border-left:1px solid rgba(242,196,123,.23);background:linear-gradient(165deg,rgba(71,56,39,.5),rgba(18,33,27,.83));min-width:0}
.pl-panel-kicker{font-size:.67rem;letter-spacing:.19em;font-weight:800;color:#eeb669;text-transform:uppercase;margin:0 0 17px}
.pl-panel h2{font-size:clamp(1.65rem,2.5vw,2.35rem);font-family:Bahnschrift,'Arial Narrow',Arial,sans-serif;line-height:1.13;letter-spacing:-.035em;margin:0 0 11px;color:#fff6e7}
.pl-help{font-size:.86rem;line-height:1.62;color:#d6c7b1;margin:0 0 27px}
.pl-presets{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px;margin-bottom:27px}
.pl-preset{font-family:inherit;background:rgba(255,248,229,.07);border:1px solid rgba(252,205,138,.3);color:#f6e5c9;min-height:44px;font-size:.72rem;font-weight:740;cursor:pointer}
.pl-preset:hover,.pl-preset[aria-pressed='true']{background:#f1b85f;color:#27271e;border-color:#f1b85f}
.pl-control{margin:0 0 27px}.pl-label{display:flex;flex-wrap:wrap;justify-content:space-between;gap:7px;color:#f6e9d4;font-size:.84rem;font-weight:750;margin-bottom:6px}.pl-label .pl-rpm{color:#f4bd73;font-variant-numeric:tabular-nums;font-size:.86rem}
.pl-note{display:block;color:#b6c0ac;font-size:.71rem;margin-bottom:11px;line-height:1.5}
.pl-range{width:100%;display:block;accent-color:#efb35b;cursor:pointer;min-height:29px}
.pl-readout{display:flex;justify-content:space-between;gap:10px;border-top:1px solid rgba(231,187,127,.22);border-bottom:1px solid rgba(231,187,127,.22);padding:18px 0;margin:9px 0 24px}
.pl-readout span{font-size:.77rem;color:#e0d2bb}.pl-readout strong{color:#ffd18a;font-size:1.1rem;font-variant-numeric:tabular-nums;display:block;margin-top:5px}.pl-readout i{font-size:.7rem;font-style:normal;color:#aab8a0}
.pl-commands{display:flex;flex-wrap:wrap;gap:9px}
.pl-command{font-family:inherit;cursor:pointer;border:1px solid rgba(241,199,132,.34);border-radius:2px;background:rgba(232,188,126,.11);color:#f2dfc1;font-weight:750;font-size:.76rem;min-height:43px;padding:10px 13px;transition:background .2s}
.pl-command:hover,.pl-command[aria-pressed='true']{background:#dea75f;color:#1d2921}
.pl-key{border-top:1px solid rgba(241,199,132,.2);margin-top:26px;padding-top:22px;display:grid;gap:12px}
.pl-key div{font-size:.76rem;color:#e7d9c2;display:flex;gap:12px;align-items:baseline;line-height:1.4}
.pl-key b{white-space:nowrap;font-size:.7rem;color:#ead0a9;letter-spacing:.07em;min-width:65px}
.pl-key b::before{content:'';width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:8px;background:#efbd64}
.pl-key div:nth-child(2) b:before{background:#a7b9a2}.pl-key div:nth-child(3) b:before{background:#bb7451}
.pl-endnote{font-size:.7rem;line-height:1.65;color:#c4b9a6;margin-top:23px}
.pl-equation{padding:71px 0 79px;background:#f7eddb;color:#2a352b}
.pl-info{display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:start}
.pl-info h2{font-size:clamp(2.1rem,3.6vw,3.8rem);line-height:1.04;letter-spacing:-.045em;font-family:Bahnschrift,'Arial Narrow',Arial,sans-serif;margin:0 0 24px;color:#2a352b}
.pl-info p{color:#4d5341;font-size:1.03rem;line-height:1.8;margin:0 0 18px}
.pl-formula{background:#fff9ed;border:1px solid #e1c6a1;padding:33px;box-shadow:0 20px 55px rgba(90,60,33,.07)}
.pl-formula .pl-tag{font-size:.68rem;text-transform:uppercase;letter-spacing:.17em;color:#89513c;font-weight:800}
.pl-formula .pl-eq{font-family:'Consolas','Courier New',monospace;font-size:clamp(1.25rem,2.3vw,2rem);font-weight:700;color:#8a4b33;letter-spacing:-.04em;line-height:1.7;margin:22px 0}
.pl-formula p{font-size:.86rem;line-height:1.6;margin:0 0 12px}
.pl-sources{background:#e9e0d1;color:#475040;padding:26px 0 30px;font-size:.8rem;line-height:1.7}
.pl-sources p{margin:0}.pl-sources a{color:#7f482f;text-decoration:underline;text-underline-offset:2px}
.pl-stage:focus-within{outline:2px solid rgba(240,197,131,.5);outline-offset:-3px}
.pl-page button:focus-visible,.pl-page input:focus-visible,.pl-page canvas:focus-visible{outline:3px solid #f7d47f;outline-offset:3px}
@media(max-width:1000px){.pl-frame{grid-template-columns:1fr}.pl-stage{min-height:560px}.pl-panel{border-left:none;border-top:1px solid rgba(242,196,123,.23)}.pl-intro{grid-template-columns:1fr}.pl-intro p{max-width:750px}.pl-presets{max-width:500px}}
@media(max-width:650px){.pl-hero{padding:65px 0 30px}.pl-intro h1{font-size:clamp(3.15rem,12vw,4.6rem)}.pl-stage{min-height:370px}.pl-head{left:18px;top:20px;font-size:.61rem}.pl-guides{left:17px;bottom:15px;gap:7px;font-size:.54rem}.pl-guides span{padding:6px}.pl-panel{padding:31px 23px}.pl-info{grid-template-columns:1fr;gap:26px}.pl-equation{padding:61px 0}.pl-formula{padding:27px}}
@media(prefers-reduced-motion:reduce){.pl-backing,.pl-stage canvas{transition:none}}

.pl-shell{position:relative}.pl-shell::after{content:"";display:block;position:absolute;bottom:0;left:0;right:0;height:5px;z-index:5;background-image:linear-gradient(90deg,#768b4b,#e9ad4a,#ef8640,#bb4d33,#803c36,#e2b15c,#768b4b);background-size:640px 100%;animation:autumn-light-flow 7s linear infinite;pointer-events:none}
@media(prefers-reduced-motion:reduce){.pl-shell::after{animation:none}}
.pl-stage.pl-fallback .pl-backing{z-index:1;touch-action:pan-y;cursor:grab;transform-origin:50% 50%}
.pl-stage.pl-fallback .pl-backing:focus-visible{outline:2px solid #f5c66e;outline-offset:-8px}
.pl-stage .pl-backing.pl-expanded{filter:drop-shadow(0 25px 15px rgba(0,0,0,.24)) saturate(1.15)}
