.solar-page{--accent:#536c7b}.solar-page .facade-heading h1 span,.solar-page .quiet-button,.solar-page .facade-controls output{color:var(--accent)}.solar-page input[type=range],.solar-page input[type=checkbox]{accent-color:var(--accent)}.solar-page .facade-workbench{background:#f2f3ef}.solar-page .material-label i{background:linear-gradient(130deg,#123c8f,#a6d5ff 42%,#2155e9 50%,#122b66);border-color:#536c7b}.solar-page .facade-notes .button{background:var(--accent);border-color:var(--accent)}#solar-stage{position:relative;min-height:530px;flex:1;overflow:hidden}#solar-canvas{display:block;position:absolute;inset:0;width:100%;height:100%;touch-action:none}.finish-options{display:flex;gap:12px}.finish-options button{width:38px;height:38px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px #ccd1da;background:var(--swatch);cursor:pointer}.finish-options button[aria-pressed=true]{box-shadow:0 0 0 2px var(--accent)}#finish-name{font-size:.75rem;margin:.6rem 0 .3rem}.solar-page input:focus-visible,.solar-page button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}@media(max-width:680px){#solar-stage{min-height:370px}.finish-options{gap:8px}.finish-options button{width:30px;height:30px}.solar-page .model-options{gap:.6rem}}

.solar-intro{font-size:.8rem;line-height:1.6;margin:1rem 0}.solar-legend{position:absolute;bottom:16px;left:20px;width:220px;padding:12px;background:#ffffffe0;border:1px solid #fff;border-radius:12px;font-size:10px;pointer-events:none}.solar-legend>div{height:8px;margin-top:8px;border-radius:5px;background:linear-gradient(90deg,#2448a0,#25bdca,#f0d646,#ed7735,#af2739)}.solar-legend p{display:flex;justify-content:space-between;margin:5px 0 0}.solar-page .material-label{font-size:11px}
.pad-title{display:flex;justify-content:space-between;gap:8px;font-size:.78rem;margin:0 0 .7rem}.pad-title span{font-size:.68rem;color:#6c7974}.shade-pad{position:relative;width:100%;aspect-ratio:5/3;touch-action:none;user-select:none;border:1px solid #bdcbc4;border-radius:10px;background-color:#eef3ef;background-image:linear-gradient(#a5b7ab40 1px,transparent 1px),linear-gradient(90deg,#a5b7ab40 1px,transparent 1px);background-size:10% 16.666%;margin:12px 0;cursor:crosshair}.pad-facade{position:absolute;left:25%;bottom:0;width:50%;height:83.333%;background:#c5d0c530;border:1px dashed #9aaa9c;pointer-events:none}#shade-footprint{position:absolute;transform:translate(-50%,-50%);background:#67877930;border:1px solid #678779;pointer-events:none}#shade-point{position:absolute;width:36px;height:36px;padding:0;border:0;background:transparent;border-radius:50%;transform:translate(-50%,-50%);cursor:grab;touch-action:none}#shade-point span{display:block;width:14px;height:14px;margin:auto;border:2px solid white;border-radius:50%;background:#48695b;box-shadow:0 2px 8px #263b4660}.pad-up,.pad-right{position:absolute;pointer-events:none;font-size:9px;color:#597064}.pad-up{left:6px;top:5px}.pad-right{bottom:5px;right:6px}.position-values{display:flex;gap:12px}.solar-page .position-values label{display:flex;gap:8px;align-items:center;margin:0;flex:1}.position-values input{width:100%;min-width:0;padding:5px;border:1px solid #c8d3cd;border-radius:5px;font:inherit;font-size:12px}.bearing-control{position:relative;width:190px;height:190px;margin:12px auto}.bearing-control>span{position:absolute;font-size:11px;color:#5d7065}.compass-n{top:0;left:50%;transform:translateX(-50%)}.compass-s{bottom:0;left:50%;transform:translateX(-50%)}.compass-w{left:0;top:50%;transform:translateY(-50%)}.compass-e{right:0;top:50%;transform:translateY(-50%)}#bearing-ball{position:absolute;inset:22px;border-radius:50%;border:1px solid #cad6cf;box-shadow:inset -12px -15px 25px #58706235,inset 3px 4px 10px #fff,0 8px 18px #49604f1a;background:radial-gradient(circle at 32% 24%,#fff 0,#e1ebe4 40%,#9bb1a1 100%);touch-action:none;cursor:grab;user-select:none;overflow:hidden}.sphere-latitude{position:absolute;inset:31% 0;border:1px solid #6f8e7740;border-radius:50%}.sphere-longitude{position:absolute;inset:0 31%;border:1px solid #6f8e7740;border-radius:50%}.bearing-arrow{position:absolute;inset:12px;transform:rotate(var(--bearing));pointer-events:none}.bearing-arrow:before{content:'';position:absolute;left:calc(50% - 1px);top:8px;width:2px;height:calc(50% - 8px);background:#355c48}.bearing-arrow i{position:absolute;left:calc(50% - 7px);top:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:12px solid #355c48}.bearing-centre{position:absolute;left:calc(50% - 4px);top:calc(50% - 4px);width:8px;height:8px;border-radius:50%;background:#355c48}#bearing-ball:focus-visible,#shade-point:focus-visible{outline:3px solid #547c65;outline-offset:3px}.solar-page fieldset>small{display:block;margin:8px 0 14px}
.shade-pad{overflow:hidden}
@media(max-width:680px){.solar-page .facade-controls{display:block}.solar-page .facade-controls fieldset{width:100%;margin-top:24px}.solar-page .shade-pad{max-width:320px;margin:12px auto}.solar-page .position-values{max-width:320px;margin:auto}}