@import url('./flow.css?v=home3');
#home{position:fixed;inset:65px 28px 14px;display:flex;flex-direction:column}#stageBoard{flex:1;min-height:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:8px 22px}.stage-card{position:relative;min-width:0;min-height:0;border:0;background:none}.stage-preview{position:absolute;inset:0;padding:0;width:100%;height:100%;touch-action:none;cursor:grab}.stage-preview[data-turning=true]{cursor:grabbing}.stage-preview img{position:absolute;left:0;top:0;bottom:26px;width:100%;height:calc(100% - 26px);object-fit:contain;pointer-events:none;filter:drop-shadow(0 5px 9px #7d8c660c)}.stage-preview:hover img{filter:drop-shadow(0 5px 12px #7d8c6624)}.stage-age{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-size:11px;color:#7c8c70}.stage-age small,.card-note,.card-parts{display:none}.stage-title{position:absolute;bottom:-4px;left:0;right:0;opacity:0;font-size:9px;color:#a0ad93;transition:opacity .15s}.stage-title>span{display:none}.stage-preview:hover .stage-title,.stage-preview:focus-visible .stage-title{opacity:1}.stage-preview:focus-visible{border-radius:20px;outline:1px solid #a9bc97;outline-offset:0}#boardStatus{font-size:10px;color:#98a68b;text-align:center;min-height:14px;margin:20px 0 10px}.home-note{font-size:7px;line-height:1.5;color:#b1bba6;text-align:center;margin:0}
@media(min-width:1500px){#home{left:calc((100vw - 1400px)/2);right:calc((100vw - 1400px)/2)}}
@media(max-width:700px){#home{inset:64px 10px 12px}#stageBoard{gap:9px 0}.stage-age{font-size:9px}.stage-title{font-size:7px}#boardStatus{font-size:9px;margin-top:18px}.home-note{font-size:6px}}
@media(max-width:420px){#home{left:5px;right:5px}.stage-title{display:none}.stage-age{font-size:8px}}
@media(max-height:600px){#home{top:57px;bottom:8px}#stageBoard{gap:3px 12px}.stage-age{font-size:9px;bottom:5px}.stage-title{display:none}.stage-preview img{height:calc(100% - 19px)}#boardStatus{margin:9px 0 6px;font-size:8px}}
#home{bottom:155px}#homeScene{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}#stageBoard{position:relative;z-index:1}.stage-preview img{display:none}.home-note{position:fixed;bottom:12px;left:15px;right:15px;pointer-events:none}#homeExploration{position:fixed;z-index:6;bottom:35px;left:50%;transform:translateX(-50%);width:min(490px,calc(100vw - 36px));background:#fffffff0;border:1px solid #e7ece2;border-radius:13px;padding:13px 20px 10px;box-shadow:0 5px 25px #4e633108}.home-progress,.home-milestones{display:flex;justify-content:space-between;color:#819273;font-size:10px}.home-progress output{font-size:9px;color:#a0ad94}.home-milestones{font-size:8px;color:#a0ad94}#boardStatus{margin:9px 0 0;font-size:9px;min-height:12px}.home-parts{position:absolute;inset:0;pointer-events:none}.home-parts button{position:absolute;transform:translate(-50%,-50%);border-radius:50%;pointer-events:auto}.home-parts button:hover,.home-parts button:focus-visible,.home-parts button[data-selected=true]{outline:1px solid #9db78a55;outline-offset:-2px;background:#9db78a0c}.stage-card[data-active=true] .stage-age{color:#426139;font-weight:600}#homeInfo{position:fixed;top:100px;right:24px;width:246px;background:#fffffff5;border:1px solid #e7ece1;border-radius:13px;padding:22px;z-index:5;box-shadow:0 10px 35px #40512b08;max-height:calc(100dvh - 265px);overflow:auto}#closeHomeInfo{position:absolute;right:9px;top:8px;font-size:20px;color:#94a087;width:26px;height:26px}#homeInfoAge{font-size:9px;color:#9ca890;margin:0 18px 14px 0}#homeInfoName{font-size:19px;font-weight:500;line-height:1.2;letter-spacing:-.4px;margin:0 0 14px;outline:none}#homeInfoDescription{font-size:11px;line-height:1.7;color:#839076;margin:0 0 15px}#enterStage{font-size:11px;color:white;background:#71836c;border-radius:7px;padding:10px 12px;display:block}body[data-home-info=true] #home{right:290px}body[data-home-info=true] #homeExploration{left:calc((100vw - 268px)/2)}
@media(max-width:900px){body[data-home-info=true] #home{right:10px;bottom:312px}body[data-home-info=true] #homeExploration{left:50%}#homeInfo{top:auto;bottom:155px;left:16px;right:16px;width:auto;max-height:145px;padding:15px 18px}#homeInfoAge{margin-bottom:6px;font-size:8px}#homeInfoName{font-size:16px;margin-bottom:7px}#homeInfoDescription{font-size:10px;line-height:1.5;margin:0 125px 0 0}#enterStage{position:absolute;right:15px;bottom:15px;font-size:10px}#home{bottom:151px}}
@media(max-height:600px){#home{bottom:135px}#homeExploration{bottom:28px;padding:9px 15px}body[data-home-info=true] #home{bottom:280px}}
/* The overview and close-up share one canvas and one exploration control. */
#home{left:218px}#homeExploration{left:calc(50% + 96px);width:min(560px,calc(100vw - 260px))}.home-milestones{position:relative;height:13px}.home-milestones span{position:absolute;transform:translateX(-50%)}.home-milestones span:nth-child(1){left:0;transform:none}.home-milestones span:nth-child(2){left:31.25%}.home-milestones span:nth-child(3){left:62.5%}.home-milestones span:nth-child(4){left:81.25%}.home-milestones span:nth-child(5){right:0;transform:none}body[data-home-info=true] #homeExploration{left:calc((100vw - 70px)/2);width:min(490px,calc(100vw - 530px))}#systemsPanel{position:fixed;z-index:7;left:24px;top:95px;width:175px;padding:14px 10px;background:#ffffffed;border:1px solid #e8ece4;border-radius:12px;max-height:calc(100dvh - 200px);overflow:auto}.systems-heading{display:flex;align-items:center;justify-content:space-between}.systems-heading h2{font-size:12px;margin:0;font-weight:500}.systems-heading button{font-size:9px;color:#85927b;padding:0}#systemsContext{font-size:9px;color:#9aa58e;margin:9px 0 12px}.system-row{display:flex;align-items:center;gap:5px;padding:6px 0}.system-name{padding:0;text-align:left;font-size:9px;flex:1;display:flex;align-items:center;gap:5px;line-height:1.4}.system-name i{width:5px;height:5px;border-radius:50%;flex:none}.system-row small{font-size:8px;color:#b1b9a7}.system-row input{width:21px;height:12px;appearance:none;background:#dfe5da;border-radius:10px;position:relative;cursor:pointer;margin:0}.system-row input:checked{background:#8b9e80}.system-row input:before{content:'';position:absolute;width:8px;height:8px;top:2px;left:2px;border-radius:50%;background:white;transition:transform .15s}.system-row input:checked:before{transform:translateX(9px)}.system-row[data-selected=true] .system-name{color:#334e2c;font-weight:600}#systemsCount{font-size:7px;line-height:1.5;color:#a8b19e;margin:10px 0 0}#systemsToggle{display:none}#focusLayer{position:absolute;inset:0;z-index:3}#focusSurface{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:grab}#focusSurface:active{cursor:grabbing}#focusParts{position:absolute;inset:0;pointer-events:none}#focusParts button{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;border-radius:50%;padding:0;touch-action:none}#focusParts button span{position:absolute;top:95%;left:50%;transform:translateX(-50%);font-size:9px;white-space:nowrap;color:#819176;background:#ffffffcf;padding:3px 6px;border-radius:4px}#focusParts button:hover,#focusParts button:focus-visible{outline:1px solid #b6c6a966;background:#b6c6a908}#focusHeader{position:absolute;z-index:4;top:0;left:10px;right:10px;display:flex;gap:14px;align-items:center}#backOverview{font-size:10px;color:#829177;padding:7px 0}#focusStage{background:white;border:0;color:#5b6f52;font-size:14px;max-width:150px}#hoverName{font-size:10px;color:#8a9b7b}#enterStage{width:100%;text-align:left}#homeScene{z-index:0}#stageBoard{z-index:1}
@media(max-width:1100px){#home{left:190px}#systemsPanel{left:12px;width:162px}body[data-home-info=true] #homeExploration{width:min(440px,calc(100vw - 40px));left:50%}}
@media(max-width:900px){#home{left:10px;top:90px}#systemsToggle{display:block;position:fixed;left:17px;top:61px;font-size:10px;z-index:9;padding:5px 9px;border:1px solid #e3e9dd;border-radius:7px;background:white}#systemsPanel{display:none;top:94px;width:185px;max-height:calc(100dvh - 250px);box-shadow:0 10px 35px #40512b15}body[data-systems-open=true] #systemsPanel{display:block}#homeExploration{left:50%;width:calc(100vw - 36px)}body[data-home-info=true] #home{bottom:312px}#focusHeader{gap:8px}#focusParts button span{font-size:8px}#hoverName{display:none}}

@media(max-width:900px){#enterStage{width:auto;max-width:140px}#homeInfoDescription{margin-right:145px}#homeInfo:has(#enterStage[hidden]) #homeInfoDescription{margin-right:0}}