/* 実験データの加算・減算プログラム
   最終更新: 260824
   ベース: 耐力壁性能評価プログラム styles.css                     */

body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;margin:0;padding:20px;background:#f4f7f6;max-width:1400px;margin:0 auto}
h1{margin-top:0;color:#2c3e50}
.subtitle{color:#7f8c8d;font-size:0.9em;margin-top:-10px;margin-bottom:20px}

/* Header & Logo */
.header{padding:12px 16px}
.header-inner{max-width:1200px;margin:0 auto;display:flex;justify-content:flex-end;align-items:center}
.header-logo{height:48px;width:auto;display:block;transition:opacity .2s ease}
.header-logo:hover{opacity:.8}
#brandLogo a{text-decoration:none;display:inline-block}
#brandLogo a:focus img{outline:2px solid #8a2c40;outline-offset:2px}

.card{background:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 5px rgba(0,0,0,.1);margin-bottom:20px}
.card h2{font-size:1.2em;margin-top:0;border-bottom:2px solid #3498db;padding-bottom:5px;color:#2c3e50}

/* Guide section */
.card.guide{background:linear-gradient(135deg,#e3f2fd 0%,#f3e5f5 100%);border-left:4px solid #3498db}
.card.guide h2{border-bottom:none}
.guide-content{margin-top:15px;display:grid;gap:16px}
@media (min-width:992px){.guide-content{grid-template-columns:1fr 1fr}}
.guide-section{margin-bottom:5px}
.guide-section h3{color:#2c3e50;font-size:1.05em;margin:8px 0 6px 0;border:none;padding:0}
.guide-section p{margin:5px 0;color:#34495e;line-height:1.6}
.guide-section ul{margin:8px 0;padding-left:20px;color:#34495e}
.guide-section li{margin:4px 0;line-height:1.5}
.guide-section strong{color:#2c3e50}
.guide-section code{background:rgba(255,255,255,.7);padding:1px 5px;border-radius:3px;font-size:.92em}

/* Controls */
.control-group{margin-bottom:15px}
.control-group label{display:block;font-weight:700;margin-bottom:5px;color:#34495e}
.control-group small{display:block;color:#7f8c8d;font-size:0.85em;margin-top:3px}
select,input[type=file],input[type=number],input[type=text],button{width:100%;padding:8px;border:1px solid #ccc;border-radius:4px;box-sizing:border-box;font-size:14px}
input[type=number]{font-family:monospace}
textarea{width:100%;padding:8px;border:1px solid #ccc;border-radius:4px;font-family:'Courier New',monospace;font-size:0.9em;resize:vertical;box-sizing:border-box}
button{background:#3498db;color:#fff;font-weight:700;cursor:pointer;border:none;margin-top:10px;transition:background .3s}
button:hover{background:#2980b9}
button.download{background:#27ae60}
button.download:hover{background:#229954}
button.danger{background:#e74c3c}
button.danger:hover{background:#c0392b}
button.alt{background:#95a5a6}
button.alt:hover{background:#7f8c8d}
button:disabled{background:#bdc3c7;cursor:not-allowed}

.row{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px}
.row4{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}
@media (max-width:760px){.row,.row3,.row4{grid-template-columns:1fr}}
.center-button{display:flex;justify-content:center;margin-top:10px;gap:12px;flex-wrap:wrap}
.center-button button{width:auto;max-width:400px}
.paste-buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.paste-buttons button{flex:1 1 0;min-width:150px;margin-top:0}

/* データセットのブロック */
.dataset{border:1px solid #e1e6ea;border-radius:6px;padding:14px;background:#fbfdff}
.dataset.ds1{border-left:5px solid #2166d6}
.dataset.ds2{border-left:5px solid #e08c00}
.dataset h3{margin:0 0 10px 0;font-size:1.03em;color:#2c3e50;border-left:none;padding-left:0}
.dataset .badge{display:inline-block;font-size:.75em;font-weight:700;color:#fff;border-radius:10px;padding:2px 9px;margin-right:8px;vertical-align:2px}
.dataset.ds1 .badge{background:#2166d6}
.dataset.ds2 .badge{background:#e08c00}

/* 演算子の選択（強調） */
.op-box{background:#eef6ff;border:1px solid #cfe1f7;border-radius:6px;padding:12px 14px;margin-bottom:15px}
.op-row{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap}
.op-row + .op-row{margin-top:10px;padding-top:10px;border-top:1px dashed #cfe1f7}
.op-box .op-label{font-weight:700;color:#2c3e50;white-space:nowrap}
.op-box select{width:auto;min-width:190px;font-size:1.05em;font-weight:700;padding:9px 10px}
.op-formula{font-family:'Courier New',monospace;font-size:1.0em;color:#1a3c5e;background:#fff;border:1px dashed #9fc3ea;border-radius:4px;padding:6px 12px}

/* Plot */
#plot{min-height:560px;position:relative}
.resize-handle{position:absolute;right:6px;bottom:6px;width:18px;height:18px;
  background:linear-gradient(135deg,rgba(0,0,0,.25) 25%,transparent 25%),linear-gradient(225deg,rgba(0,0,0,.25) 25%,transparent 25%);
  background-size:6px 6px;background-position:center;border-radius:3px;cursor:ns-resize;z-index:9999;opacity:.9}

/* Tables */
table{width:100%;border-collapse:collapse;margin-top:10px;font-size:0.95em}
table th,table td{border:1px solid #ddd;padding:7px 9px;text-align:left}
table th{background:#ecf0f1;font-weight:700}
tr.highlight{background:#e8f5e9}
tr.highlight td{font-weight:700}
h3{color:#2c3e50;border-left:4px solid #3498db;padding-left:10px;margin-top:20px}

/* 集計テーブル */
.summary-grid{display:grid;gap:16px}
@media (min-width:992px){.summary-grid{grid-template-columns:1fr 1fr;align-items:start}}
#summaryTable td:first-child,#statTable td:first-child{font-weight:600;background:#f8f9fa;width:58%}
#summaryTable td:last-child,#statTable td:last-child{font-family:monospace;text-align:right}

/* 結果データ表 */
.table-wrap{max-height:460px;overflow:auto;border:1px solid #ddd;border-radius:4px;margin-top:10px}
.table-wrap table{margin-top:0;font-size:.88em}
.table-wrap thead th{position:sticky;top:0;z-index:2;background:#ecf0f1}
.table-wrap td{font-family:'Courier New',monospace;text-align:right;white-space:nowrap}
.table-wrap td.idx{text-align:right;color:#7f8c8d;background:#f8f9fa;font-family:inherit}
.table-wrap td.kind{text-align:center;font-family:inherit;white-space:nowrap}
.kind-exact{color:#1e7e20;font-weight:700}
.kind-interp{color:#2166d6}
.kind-extrap{color:#e0a800;font-weight:700}
.kind-out{color:#c22;font-weight:700}

/* メッセージ */
.msg{border-radius:6px;padding:10px 14px;margin-top:12px;font-size:.92em;line-height:1.55}
.msg.info{background:#eaf4fd;border-left:4px solid #3498db;color:#1a3c5e}
.msg.warn{background:#fff8e1;border-left:4px solid #e0a800;color:#7a5a00}
.msg.error{background:#fdecea;border-left:4px solid #e74c3c;color:#8b1a10}
.msg ul{margin:6px 0 0;padding-left:20px}
.msg li{margin:3px 0}

.hint{color:#7f8c8d;font-size:.85em;margin-top:4px;display:block}
.nowrap{white-space:nowrap}

/* ===== 包絡線の編集 ===== */
#envEditCard .paste-buttons button{min-width:170px}
#envEditCard input[type=range]{cursor:pointer}
#editTargetCount{font-weight:700;color:#2c3e50}

/* ツールチップ */
.tooltip{
  background:rgba(0,0,0,.75);color:#fff;padding:6px 9px;border-radius:4px;
  font-size:12px;pointer-events:none;z-index:2000;
  box-shadow:0 2px 4px rgba(0,0,0,.3);white-space:nowrap;font-family:'Courier New',monospace}

/* 点編集ダイアログ（右端に表示・ヘッダのドラッグで移動可） */
.modal{position:fixed;top:0;left:0;right:0;bottom:0;background:transparent;
  display:flex;align-items:flex-start;justify-content:flex-end;z-index:1500;pointer-events:none}
.modal-content{background:#fff;padding:14px 18px 16px;width:330px;border-radius:8px;
  box-shadow:0 4px 14px rgba(0,0,0,.28);font-size:14px;pointer-events:auto;
  margin:70px 12px 0 0;max-height:calc(100vh - 90px);overflow:auto;border:1px solid #cfe1f7}
.modal-content h3{margin-top:0;font-size:1.05em;border:none;padding:0;color:#2c3e50}
.modal-content label{display:block;margin-bottom:10px;font-weight:600}
.modal-content input{width:100%;margin-top:4px;font-family:monospace}
.drag-handle{padding:6px 8px;background:#ecf0f1;border-radius:4px;margin:-4px -4px 10px -4px}
.modal-actions{margin-top:10px}
.modal-actions button{width:auto;padding:7px 12px;margin-top:0;font-size:13px}
.modal-actions button.add{background:#27ae60}
.modal-actions button.add:hover{background:#229954}
.thin-row{display:flex;align-items:center;gap:8px;min-width:0}
.thin-row input[type=range]{flex:1 1 auto;width:auto;min-width:0;padding:0;border:none}
.thin-cap{font-size:.85em;color:#666;flex:0 0 auto}
#env_thin_rate_value{flex:0 0 auto;min-width:34px;text-align:right;font-weight:700;color:#2c3e50;font-size:.92em}
