:root { --bg:#f6f5f2; --panel:#fff; --ink:#1e1e1e; --muted:#6b6b6b; --line:#e2e0da; --accent:#b8562f; --accent-2:#f3e2d3; --ok:#2f7d4f; --warn:#b8862f; --err:#b23a3a; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin:0; background:var(--bg); color:var(--ink); font: 14px/1.5 -apple-system, "Hiragino Sans", "Noto Sans JP", sans-serif; }
a { color: var(--accent); text-decoration: none; }
.top { display:flex; align-items:center; gap:16px; padding:10px 24px; background:var(--panel); border-bottom:1px solid var(--line); position:sticky; top:0; z-index:5; }
.brand { font-size:20px; font-weight:600; letter-spacing:.04em; color:var(--ink); }
.brand span { color:var(--accent); }
.tag { color:var(--muted); font-size:12px; }
.grow { flex:1; }
.wrap { max-width: 1400px; margin: 0 auto; padding: 20px 24px 60px; }
.flash { background:#e3f1e8; color:var(--ok); padding:8px 24px; font-size:13px; }
.card { background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:16px 18px; margin-bottom:16px; }
.card h2 { margin:0 0 6px; font-size:16px; }
.two { display:grid; grid-template-columns: 420px 420px 1fr; gap:16px; align-items:start; }
.card.design { border-left:4px solid var(--accent); }
textarea { width:100%; padding:8px 9px; border:1px solid var(--line); border-radius:7px; font-size:13px; font-family:inherit; resize:vertical; }
.split { display:grid; grid-template-columns: 1fr 1fr; gap:16px; align-items:start; }
.between { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.wrapline { flex-wrap:wrap; }
.muted { color:var(--muted); } .small { font-size:12px; }
.error { background:#f6e1e1; color:var(--err); padding:8px 12px; border-radius:6px; margin:8px 0; font-size:13px; }
label { display:block; font-size:12px; color:var(--muted); margin:10px 0 4px; }
input[type=text], select { width:100%; padding:8px 9px; border:1px solid var(--line); border-radius:7px; font-size:13px; background:#fff; }
.row { display:grid; grid-template-columns: 1.4fr 1.2fr .9fr; gap:10px; }
button, .btn { background:var(--accent); color:#fff; border:0; border-radius:7px; padding:10px 14px; font-size:14px; cursor:pointer; width:100%; margin-top:14px; }
button:disabled { opacity:.5; cursor:default; }
.ghost { background:transparent; color:var(--muted); border:1px solid var(--line); width:auto; padding:5px 10px; margin:0; font-size:12px; border-radius:6px; cursor:pointer; display:inline-block; }
.ghost.danger:hover { color:var(--err); border-color:var(--err); }
.drop { display:block; border:2px dashed var(--line); border-radius:10px; padding:26px 12px; text-align:center; cursor:pointer; background:#fbfaf8; transition:.15s; margin-top:6px; }
.drop.over { border-color:var(--accent); background:var(--accent-2); }
.drop.has { border-style:solid; border-color:var(--ok); background:#f2f8f4; }
.drop-icon { font-size:26px; color:var(--accent); }
table.list { width:100%; border-collapse:collapse; font-size:13px; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th, td { text-align:left; padding:7px 8px; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--muted); font-weight:500; font-size:12px; }
td.num, th.num { text-align:right; font-variant-numeric: tabular-nums; white-space:nowrap; }
.badge { font-size:11px; padding:2px 8px; border-radius:10px; background:#eee; color:var(--muted); white-space:nowrap; }
.badge.done { background:#e3f1e8; color:var(--ok); } .badge.running, .badge.queued { background:#f7efdc; color:var(--warn); } .badge.error { background:#f6e1e1; color:var(--err); }
.progress { display:flex; align-items:center; gap:14px; margin-top:12px; }
.spinner { width:22px; height:22px; border:3px solid var(--line); border-top-color:var(--accent); border-radius:50%; animation:spin 1s linear infinite; flex:none; }
@keyframes spin { to { transform:rotate(360deg); } }
.tabs { display:flex; gap:2px; border-bottom:1px solid var(--line); margin-bottom:14px; }
.tabs div { padding:9px 16px; cursor:pointer; color:var(--muted); border-bottom:2px solid transparent; }
.tabs div.on { color:var(--ink); border-color:var(--accent); font-weight:500; }
.pane { display:none; } .pane.on { display:block; }
canvas#plan2d { width:100%; background:#fff; border:1px solid var(--line); border-radius:8px; display:block; }
#view3d { width:100%; height:72vh; background:#dfe8ee; border-radius:8px; overflow:hidden; }
pre { background:#1e1e1e; color:#e8e8e8; padding:12px; border-radius:8px; font-size:12px; overflow:auto; max-height:72vh; }
.notes { white-space:pre-wrap; font-size:13px; margin-top:6px; }
.kpis { display:grid; grid-template-columns: repeat(auto-fit, minmax(170px,1fr)); gap:10px; margin-bottom:14px; }
.kpi { background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:10px 12px; }
.kpi .v { font-size:22px; font-weight:600; } .kpi .k { font-size:11px; color:var(--muted); }
.diffbad { color:var(--err); } .diffok { color:var(--ok); }
iframe { width:100%; height:72vh; border:1px solid var(--line); border-radius:8px; background:#fff; }
@media (max-width: 1280px) { .two { grid-template-columns: 1fr 1fr; } .two > section:last-child { grid-column: 1 / -1; } }
@media (max-width: 960px) { .two, .split, .row { grid-template-columns: 1fr; } .wrap { padding: 14px 16px 40px; } .tag { display:none; } }
iframe.srcmini { height: 60vh; }
.roadmap { border-left: 4px solid var(--accent); font-size: 13px; }

.editbox { border-left: 4px solid var(--accent); }
.editrow { display:flex; gap:8px; margin-top:8px; }
.editrow input[type=text] { flex:1; font-size:14px; padding:10px 12px; }
.editrow button { width:auto; margin:0; padding:10px 18px; white-space:nowrap; }
.history { margin-top:10px; font-size:13px; }
.history summary { cursor:pointer; color:var(--muted); }
.history ol { margin:8px 0 0; padding-left:20px; }
.history li { margin:6px 0; }
.history .ins { font-weight:600; }
.history .sum { color:var(--muted); display:block; }
.history .warn { color:var(--warn); display:block; font-size:12px; }
.history .cur { background:#f7efdc; border-radius:4px; padding:0 4px; font-size:11px; color:var(--warn); }
.notice { background:#fbf7ec; border-color:#efe3c2; font-size:13px; }
table.prices input.inline { width:100%; padding:5px 7px; border:1px solid var(--line); border-radius:5px; font-size:13px; }
table.prices input.num { text-align:right; width:110px; }
table.schedule th, table.schedule td { padding:8px 10px; }
.est-total { font-size:26px; font-weight:700; }
@media print { header.top, .editbox, .tabs, #pane-plan, #pane-3d, #pane-est, #pane-qty, #pane-src, #pane-json, .ghost { display:none !important; } #pane-sched { display:block !important; } body { background:#fff; } }
.history .sum { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.history li:hover .sum { -webkit-line-clamp:unset; }

.ed-toolbar { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:10px; }
.ed-toolbar .grow { flex:1; }
.ed-toolbar button:not(.ghost) { width:auto; margin:0; padding:8px 14px; }
.inline-label { font-size:12px; color:var(--muted); display:flex; align-items:center; gap:4px; }
.ed-toolbar input.inline { padding:6px 8px; border:1px solid var(--line); border-radius:6px; font-size:13px; }
.ed-toolbar input.num { width:90px; text-align:right; }
.ed-body { display:grid; grid-template-columns: 1fr 280px; gap:14px; align-items:start; }
#ed-canvas { width:100%; background:#fff; border:1px solid var(--line); border-radius:8px; display:block; cursor:crosshair; touch-action:none; }
.ed-props { background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:12px; font-size:13px; position:sticky; top:60px; }
.ed-props label { margin:6px 0 2px; }
.ed-props input, .ed-props select { width:100%; padding:6px 8px; border:1px solid var(--line); border-radius:6px; font-size:13px; }
.ed-props input[type=checkbox] { width:auto; }
.ed-title { font-weight:600; margin-bottom:4px; }
.ed-grid { display:grid; grid-template-columns: 1fr 1fr; gap:6px; }
.issue { padding:8px 10px; border-radius:6px; margin:6px 0; font-size:13px; border-left:4px solid var(--line); background:var(--bg); }
.issue.error { border-color:var(--err); } .issue.warn { border-color:var(--warn); } .issue.info { border-color:#8aa; }
.issue .w { font-weight:600; } .issue .s { color:var(--muted); display:block; margin-top:2px; }
.spec-section { margin-bottom:14px; }
.spec-section h3 { font-size:14px; margin:0 0 6px; }
.src-tag { font-size:10px; padding:1px 6px; border-radius:8px; background:#eee; color:var(--muted); margin-left:6px; }
@media (max-width: 960px) { .ed-body { grid-template-columns: 1fr; } .ed-props { position:static; } }
@media print { #pane-spec { display:block !important; } }
.roadmap-list { margin:6px 0 0; padding-left:18px; } .roadmap-list li { margin:3px 0; }
.site-grid { display:grid; grid-template-columns: repeat(4, 1fr); gap:6px 8px; margin-top:4px; }
.site-grid label { margin:0; font-size:11px; }
.site-grid label.wide { grid-column: 1 / -1; }
.site-grid input, .site-grid select { width:100%; padding:6px 7px; font-size:13px; }