:root{font-family:Inter,"Segoe UI","Noto Sans JP","Yu Gothic UI",Meiryo,sans-serif;color:#223249;background:#eef3f8;font-size:13px;line-height:1.55;font-synthesis:none;--blue:#2563dc;--ink:#223249;--muted:#76859a;--line:#e3eaf3;--soft:#f5f8fc;--teal:#068579;--radius:14px;--glass:rgba(255,255,255,.92)}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;display:flex;flex-direction:column;height:100vh;overflow:hidden}#app{display:flex;flex-direction:column;height:100%}button,input,select{font:inherit}button,input,select,summary{touch-action:manipulation}button{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);background:#fff;border-radius:7px;color:var(--ink);padding:7px 11px;cursor:pointer;white-space:nowrap;transition:background .12s,border-color .12s,box-shadow .12s}button:hover{background:#edf4ff;border-color:#bdd0f2}button:disabled{opacity:.42;cursor:not-allowed}button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #7db1ff;outline-offset:2px}button.primary{background:var(--blue);color:#fff;border-color:var(--blue);box-shadow:0 3px 9px #2563dc18}button.primary:hover{background:#174fbe}button.quiet{background:transparent;border-color:transparent}button.small,.small{font-size:11px}button.danger{color:#b34646}button.text-button{border:0;background:none;padding:2px 4px;color:var(--blue);font-size:11px;text-decoration:underline}h1,h2,h3,p{margin:0}h2{font-size:16px;font-weight:650;letter-spacing:.01em}h3{font-size:13px;font-weight:650}h3 small,h2 small{font-size:11px;font-weight:400;color:var(--muted);margin-left:8px}input[type=number]{font-variant-numeric:tabular-nums;text-align:right;min-width:0;width:100%;padding:6px 7px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);height:34px}input[type=checkbox]{accent-color:var(--blue)}input[type=range]{accent-color:var(--blue)}input:disabled,select:disabled{background:#f2f4f7;color:#96a1b0}select{padding:8px 27px 8px 10px;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);max-width:100%;font-size:12px;width:100%}a{color:var(--blue)}code{font-size:11px;overflow-wrap:anywhere}svg{flex-shrink:0}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.micro{font-size:10px;color:var(--muted);line-height:1.6}.warn{color:#b0491f}.good{color:#0a7d64}.bad-input{border-color:#c2512b!important;background:#fff6f2!important}
/* ===== Header ===== */
.topbar{display:flex;align-items:center;gap:14px;padding:0 16px;height:52px;background:#fff;border-bottom:1px solid var(--line);flex-shrink:0;z-index:30}.brand{display:flex;align-items:center;gap:9px}.brand-mark{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;background:linear-gradient(140deg,#2f8f80,#2563dc);color:#fff;border-radius:9px}.brand strong{font-size:15px;letter-spacing:.02em}.version{font-size:10px;color:var(--muted);border:1px solid var(--line);border-radius:99px;padding:1px 7px}.segments{display:inline-flex;background:#e9eef5;border-radius:8px;padding:2px;gap:2px}.segments button{border:0;background:transparent;border-radius:6px;padding:5px 12px;font-size:12px;color:#4c5d75}.segments button.active{background:#fff;color:var(--ink);box-shadow:0 1px 4px #22334922;font-weight:650}.lock{font-size:9px;color:#8a6b2f}#weather-chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;border:1px solid var(--line);background:var(--soft);border-radius:99px;padding:5px 12px;color:#3c5068}#weather-chip b{font-variant-numeric:tabular-nums}#weather-chip small{color:var(--muted);font-size:10px}#status{font-size:10px;border-radius:99px;padding:3px 10px;background:#eef2f7;color:#5a6b82;white-space:nowrap}#status[data-state=ready]{background:#e4f3ee;color:#0a6b52}#status[data-state=calculating]{background:#fdf1de;color:#96660f}#status[data-state=error],#status[data-state=invalid]{background:#fbe7e2;color:#a03d20}#status[data-state=pending],#status[data-state=editing]{background:#e9edfb;color:#3d56a1}.header-actions{display:flex;gap:6px;margin-left:auto;align-items:center}.header-actions button{font-size:11px;padding:6px 10px}
/* ===== Error / toast ===== */
#error-banner{position:fixed;top:56px;left:50%;transform:translateX(-50%);z-index:60;display:flex;gap:12px;align-items:center;background:#fdf0ec;border:1px solid #e7b7a6;color:#8f3a1e;padding:8px 14px;border-radius:9px;font-size:12px;box-shadow:0 6px 22px #22334922}#toast{position:fixed;bottom:74px;left:50%;transform:translateX(-50%);z-index:60;background:#22334d;color:#fff;padding:8px 16px;border-radius:8px;font-size:12px;box-shadow:0 8px 26px #22334944}
/* ===== Summary strip ===== */
.summary-bar{display:flex;align-items:center;gap:10px;padding:7px 16px;background:#f8fafd;border-bottom:1px solid var(--line);flex-shrink:0;z-index:20;overflow-x:auto}.sum-chip{display:inline-flex;align-items:baseline;gap:8px;border:1px solid var(--line);background:#fff;border-radius:9px;padding:4px 12px;font-size:11px;white-space:nowrap}.sum-chip small{color:var(--muted);font-size:9px}.sum-chip b{font-size:14px;font-variant-numeric:tabular-nums}button.sum-chip{cursor:pointer}button.sum-chip:hover{background:#eef4ff}.summary-note{font-size:9px;color:var(--muted);margin-left:auto;white-space:nowrap}
/* ===== Stage ===== */
.stage{position:relative;flex:1;overflow:hidden;background:#dde6ee}#scene{position:absolute;inset:0}.scene-canvas,.scene-svg{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.scene-top-left{position:absolute;top:10px;left:12px;display:flex;flex-direction:column;gap:2px;pointer-events:none}.scene-label{font-size:9px;color:#5a6b82;background:var(--glass);border-radius:99px;padding:2px 9px;width:max-content}.scene-top-left strong{font-size:12px;background:var(--glass);border-radius:7px;padding:2px 9px;width:max-content}
.metric-tabs{position:absolute;top:66px;left:12px;display:flex;gap:4px}.metric-tabs button{font-size:10px;padding:4px 9px;border-radius:99px;background:var(--glass)}.metric-tabs button.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.rail-left{position:absolute;top:112px;left:10px;display:flex;flex-direction:column;gap:6px}.rail-toggle{display:flex;flex-direction:column;align-items:center;gap:2px;width:52px;padding:7px 0 5px;background:var(--glass);border:1px solid var(--line);border-radius:9px;cursor:pointer;color:#4c5d75;font-size:9px}.rail-toggle input{position:absolute;opacity:0;width:0;height:0}.rail-toggle:has(input:checked){background:#dfeafa;border-color:#a9c3ee;color:#1d4a9e}.rail-toggle:hover{background:#fff}
.view-controls{position:absolute;top:10px;right:12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end;row-gap:4px}
#legend{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:7px;background:var(--glass);border-radius:8px;padding:5px 10px;font-size:9px;color:#5a6b82}.legend-gradient{display:inline-block;width:92px;height:8px;border-radius:99px}.legend-gradient.deficit{background:linear-gradient(90deg,#e9eef1,#de6320)}.legend-gradient.delta{background:linear-gradient(90deg,#e86f44,#dde5ef,#0c998a)}.legend-gradient.speed{background:linear-gradient(90deg,#e2e7f0,#2773d8)}.legend-gradient.temperature{background:linear-gradient(90deg,#40a9e0,#ee6241)}
.camera-buttons{display:flex;gap:4px}.camera-buttons button{font-size:10px;padding:5px 10px;background:var(--glass)}
.scene-live{position:absolute;right:12px;bottom:12px;display:flex;flex-direction:column;background:var(--glass);border-radius:8px;padding:6px 10px;font-size:10px;min-width:110px}.scene-live:empty{display:none}.scene-live small{color:var(--muted)}.scene-live strong{font-size:13px;font-variant-numeric:tabular-nums}.stage:has(#selection-panel:not([hidden])) .scene-live{right:348px}.stage:has(#sheet:not([hidden])) .scene-live{bottom:calc(min(310px,46%) + 20px)}
.scene-busy{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#22334dd9;color:#fff;padding:9px 18px;border-radius:10px;font-size:12px}
/* ===== Ghost placement ===== */
#placement-ghost{position:fixed;z-index:25;transform:translate(-50%,-100%);pointer-events:none;display:flex;flex-direction:column;align-items:center;gap:2px}#placement-ghost::before{content:'';width:26px;height:26px;border-radius:50%;border:3px dashed #2f8f80;background:#2f8f8044}#placement-ghost[data-valid=false]::before{border-color:#c2512b;background:#c2512b33}#placement-ghost-label{font-size:9px;background:#22334d;color:#fff;border-radius:99px;padding:1px 8px}#placement-ghost[data-valid=false] #placement-ghost-label{background:#c2512b}
#placement-hint{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;background:#22334de8;color:#fff;padding:8px 14px;border-radius:11px;font-size:11px;z-index:26}#placement-hint button{font-size:10px;padding:4px 10px}#placement-hint button:not(.primary){background:transparent;border-color:#ffffff55;color:#fff}
/* ===== Selection panel ===== */
#selection-panel{position:absolute;top:52px;right:10px;bottom:14px;width:332px;background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 10px 32px #2233491f;display:flex;flex-direction:column;z-index:22;overflow:hidden}.panel-head{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--line)}.panel-head strong{font-size:13px}.panel-head button{border:0;background:#eef2f7;border-radius:6px;padding:2px 9px;font-size:13px}.panel-subhead{padding:10px 14px 0}.panel-page{overflow-y:auto;padding:12px 14px;flex:1}.panel-page h3{margin:8px 0 8px}.panel-page h3:first-child{margin-top:0}
/* ===== Bottom sheet ===== */
#sheet{position:absolute;left:12px;right:12px;bottom:12px;height:min(310px,46%);background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 12px 36px #2233492b;display:flex;flex-direction:column;z-index:22;overflow:hidden}.sheet-tabs{display:flex;gap:2px;padding:6px 10px;border-bottom:1px solid var(--line);align-items:center}.sheet-tabs button[data-sheet]{border:0;background:transparent;border-radius:7px;padding:6px 13px;font-size:12px;color:#4c5d75}.sheet-tabs button[data-sheet].active{background:#e9eef5;font-weight:650;color:var(--ink)}.sheet-actions{margin-left:auto;display:flex;gap:6px;align-items:center}.sheet-actions>button:last-child{border:0;background:#eef2f7;border-radius:6px;padding:2px 9px;font-size:13px}.sheet-body{flex:1;overflow-y:auto}.sheet-page{padding:10px 14px}
/* ===== Guide ===== */
#guide-card{position:absolute;left:12px;bottom:12px;width:290px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:12px;box-shadow:0 10px 30px #2233492b;padding:12px 14px;z-index:24}#sheet:not([hidden])~#guide-card{bottom:calc(min(310px,46%) + 26px)}#guide-card b{font-size:12px}#guide-card p{font-size:11px;margin:5px 0 8px;color:#43536b}.guide-actions{display:flex;gap:6px}
/* ===== Dock ===== */
.dock{display:flex;align-items:center;gap:10px;padding:8px 14px;background:#fff;border-top:1px solid var(--line);flex-shrink:0;z-index:30}.dock-group{display:flex;gap:6px;align-items:center}.dock-group>button{flex-direction:column;gap:2px;padding:6px 13px;font-size:10px;border-radius:10px}.dock-group>button>span{font-size:10px}.dock-group>button.on{background:#dfeafa;border-color:#a9c3ee}.dock-group>button[aria-pressed=true],.dock button.placing{background:var(--ink);color:#fff}.dock-spacer{flex:1}#baseline-notice{display:flex;align-items:center;gap:8px;font-size:11px;color:#8a6b2f;background:#fdf6e3;border:1px solid #ecd9a0;border-radius:9px;padding:5px 12px}#help-button{width:34px;height:34px;border-radius:50%;font-size:15px;font-weight:700}
/* ===== Shared content blocks ===== */
.number-field{display:flex;flex-direction:column;gap:3px;font-size:10px;color:#51617a}.number-field>span:first-child{font-size:10px}.input-unit{position:relative;display:block}.input-unit em{position:absolute;right:7px;top:50%;transform:translateY(-50%);font-size:9px;font-style:normal;color:var(--muted);pointer-events:none}.input-unit input{padding-right:34px}.field-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;margin:6px 0}.toggle-row{display:flex;align-items:center;gap:9px;padding:8px 0;position:relative;cursor:pointer}.device-icon{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;background:#e8f0f2;border-radius:8px;color:#2f6b5f}.toggle-copy{flex:1;display:flex;flex-direction:column}.toggle-copy strong{font-size:11px}.toggle-copy small{font-size:9px;color:var(--muted)}.toggle-row input{position:absolute;opacity:0}.switch{width:36px;height:20px;border-radius:99px;background:#ccd6e2;position:relative;transition:background .15s;flex-shrink:0}.switch::after{content:'';position:absolute;width:16px;height:16px;border-radius:50%;background:#fff;top:2px;left:2px;transition:left .15s;box-shadow:0 1px 3px #22334944}.toggle-row:has(input:checked) .switch{background:var(--teal)}.toggle-row:has(input:checked) .switch::after{left:18px}.toggle-row:has(input:disabled){opacity:.5}.section-label{font-size:10px;font-weight:650;color:#51617a;margin:10px 0 2px;border-top:1px solid var(--line);padding-top:10px}.thi-badge{display:inline-flex;flex-direction:column;align-items:center;background:#eef4fb;border-radius:9px;padding:6px 12px}.thi-badge small{font-size:9px;color:var(--muted)}.thi-badge strong{font-size:16px}.selected-device{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.selected-device label{font-size:11px;display:flex;gap:5px;align-items:center}.empty-inspector{text-align:center;color:var(--muted);padding:22px 0}.empty-inspector p{font-size:11px;margin:8px 0 12px}.device-actions{display:flex;gap:6px;margin-top:10px}.device-actions button{font-size:11px;flex:1}
/* ===== Result cards ===== */
.hero-result{background:linear-gradient(135deg,#123f38,#1d5b50);color:#fff;border-radius:12px;padding:13px 15px;margin:10px 0}.hero-result>span{font-size:10px;opacity:.85}.hero-value{font-size:32px;font-weight:700;font-variant-numeric:tabular-nums}.hero-value small{font-size:12px;font-weight:400;margin-left:4px}.hero-result p{font-size:9px;opacity:.8}.hero-result .range{margin-top:5px;font-size:9px;border-top:1px solid #ffffff33;padding-top:5px}.kpi{display:flex;gap:10px;background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:9px 11px;margin:7px 0}.kpi-icon{color:#2f6b5f}.kpi h3{font-size:10px;color:#51617a;font-weight:600}.kpi-value{font-size:19px;font-weight:700;font-variant-numeric:tabular-nums}.kpi-value small{font-size:10px;font-weight:400;margin-left:3px}.kpi p{font-size:9px;color:var(--muted)}.kpi>div:last-child{flex:1}
.reference-card{border:1px solid var(--line);border-radius:11px;padding:11px 13px;margin:8px 0;background:#fff}.reference-heading{display:flex;align-items:center;gap:8px}.reference-heading h3{flex:1}.tag{font-size:8px;border:1px solid #d9b26a;color:#8a6b2f;border-radius:99px;padding:1px 7px;white-space:nowrap}.reference-value{font-size:22px;font-variant-numeric:tabular-nums}.fertility-value{font-size:22px;font-weight:700;display:flex;align-items:center;gap:8px}.fertility-value small{font-size:11px}.out-of-scope{font-size:13px;color:#8a5a1e}.result-note{font-size:9px;color:var(--muted);border-top:1px solid var(--line);padding-top:8px;margin-top:8px}.resource-cards{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}.resource-cards>div{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:10px;padding:9px 12px;background:var(--soft)}.resource-cards strong{font-size:17px;font-variant-numeric:tabular-nums}.resource-cards span{font-size:10px;color:#51617a;display:flex;flex-direction:column}.resource-cards span small{font-size:8px;color:var(--muted)}.resource-cards svg{color:#2f6b5f}
.comparison-toolbar{display:flex;gap:8px;align-items:center;margin-bottom:10px}.comparison-toolbar button{font-size:11px}.comparison-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.comparison-card{display:block;text-align:left;border:1px solid var(--line);border-radius:11px;padding:11px 13px;background:#fff;white-space:normal}.comparison-card.active{border-color:var(--blue);box-shadow:0 0 0 2px #2563dc22}.comparison-card h3{font-size:11px}.comparison-card>div{margin:6px 0}.comparison-card strong{font-size:21px;font-variant-numeric:tabular-nums}.comparison-card p{font-size:10px;color:#43536b}
/* ===== Tables ===== */
.table-scroll{overflow-x:auto}.area-table{width:100%;border-collapse:collapse;font-size:11px}.area-table th,.area-table td{padding:6px 7px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}.area-table th{font-weight:600}.area-table tbody tr{cursor:pointer}.area-table tbody tr:hover{background:#f2f6fc}.area-table tbody tr.selected{background:#fdeeda}.area-table tbody tr.selected th{color:#a05a14}.area-table tr.subtotal{border-top:2px solid var(--line)}.area-table tr.subtotal th{font-weight:700}.micro-table{width:100%;border-collapse:collapse;font-size:11px}.micro-table th{text-align:left;padding:5px 8px 5px 0;vertical-align:top;white-space:nowrap;color:#5a6b82}.micro-table td{padding:5px 0}.probe-detail{border:1px solid var(--line);border-radius:9px;padding:8px 10px;background:var(--soft);margin:8px 0}.probe-detail summary{cursor:pointer;font-size:11px;font-weight:600;color:#46628a}.probe-detail table{margin-top:8px}details summary{cursor:pointer;font-size:11px;font-weight:600;color:#46628a}details{padding:6px 0}
/* ===== Timeline ===== */
.timeline-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.timeline-heading strong{font-size:12px}.chart-tabs{display:flex;gap:4px}.chart-tabs button{font-size:10px;padding:3px 10px;border-radius:99px}.chart-tabs button.active{background:var(--ink);color:#fff;border-color:var(--ink)}#timeline-chart{font-size:9px}.chart-legend{display:flex;gap:14px;font-size:10px;color:#51617a;margin-bottom:2px}.chart-legend i{display:inline-block;width:14px;height:3px;vertical-align:middle;margin-right:4px}.chart-legend .before{background:#9aa8ba}.chart-legend .after{background:#2563dc}.chart-legend b{margin-left:auto;font-weight:400;color:var(--muted)}.chart-grid{stroke:#e3eaf3}.line-before{fill:none;stroke:#9aa8ba;stroke-width:1.6;stroke-dasharray:4 3}.line-after{fill:none;stroke:#2563dc;stroke-width:2}.playhead{stroke:#da973f;stroke-width:1.4}.chart-placeholder{display:flex;align-items:center;justify-content:center;height:120px;color:var(--muted);font-size:11px}.transport{display:flex;align-items:center;gap:10px;margin-top:6px}.transport input[type=range]{flex:1}.transport output{font-variant-numeric:tabular-nums;font-size:12px;min-width:40px}.transport select{width:auto;padding:4px 8px;font-size:11px}#play-button{font-size:11px}
/* ===== Dialogs ===== */
dialog{border:1px solid var(--line);border-radius:14px;max-width:640px;width:min(92vw,640px);max-height:82vh;padding:0;box-shadow:0 20px 60px #2233493d}dialog::backdrop{background:#22334959}.dialog-head{display:flex;align-items:center;justify-content:space-between;padding:13px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;border-radius:14px 14px 0 0}.dialog-head button{border:0;background:#eef2f7;border-radius:6px;padding:3px 10px;font-size:14px}dialog>div:last-child{padding:14px 18px;overflow-y:auto;max-height:calc(82vh - 54px)}dialog h3{margin:14px 0 6px}dialog h3:first-child{margin-top:0}dialog p{font-size:11px;margin:6px 0}dialog table{width:100%;border-collapse:collapse;font-size:11px;margin:8px 0}dialog th,dialog td{text-align:left;padding:5px 8px;border-bottom:1px solid var(--line)}.assumption-box{background:#fdf6e3;border:1px solid #ecd9a0;border-radius:9px;padding:9px 12px;font-size:11px;margin:8px 0}.source-card{border:1px solid var(--line);border-radius:9px;padding:8px 11px;margin:6px 0}.source-card p{font-size:10px}
/* ===== Responsive ===== */
@media(max-width:1100px){.topbar{flex-wrap:wrap;height:auto;min-height:52px;padding-block:6px;row-gap:6px}.brand strong{display:none}.version{display:none}#weather-chip small{display:none}.summary-note{display:none}#selection-panel{width:296px}.stage:has(#selection-panel:not([hidden])) .scene-live{right:312px}}
@media(max-width:740px){.topbar{height:auto;min-height:52px;flex-wrap:wrap;padding:8px 10px;gap:8px}.header-actions{margin-left:0}.summary-bar{padding:5px 10px;gap:6px}.metric-tabs{top:66px}.rail-left{top:108px;gap:4px}.rail-toggle{width:46px;font-size:8px}.view-controls{top:8px;right:10px}.scene-live{display:none}#legend{bottom:52px;left:10px}#selection-panel{left:8px;right:8px;top:auto;bottom:12px;width:auto;max-height:52%;border-radius:14px 14px 0 0}.stage:has(#selection-panel:not([hidden])) .scene-live{right:12px}#sheet{left:8px;right:8px;bottom:12px;height:60%}.dock{flex-wrap:wrap;padding:6px 8px;gap:6px}.dock-group>button{padding:5px 9px}.dock-group>button>span{font-size:9px}#guide-card{position:fixed;left:8px;right:8px;width:auto;top:auto;bottom:116px;max-height:40%;overflow-y:auto}#sheet:not([hidden])~#guide-card{bottom:calc(60vh - 40px)}.summary-bar .sum-chip:nth-child(3){display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}