:root{font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:#183b3a;background:#f4f7f5;font-synthesis:none}
.mobile-route-link{display:none}
[hidden]{display:none!important}
.demo-notice{max-width:710px;font-size:13px;line-height:1.8;margin:15px 0 0;padding:12px 14px;border:1px solid #ffffff55;border-radius:10px;color:#fff}
.input-notice{padding:17px 20px;border:1px solid #cbdfe2;border-radius:15px;background:#edf6f7;font-size:13px;line-height:1.7}
.input-notice p{margin:6px 0 12px}
.maps-disclosure{margin:0;font-size:12px;line-height:1.7;color:#425c62;flex-basis:100%}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit}.skip{position:absolute;left:1rem;top:-4rem;background:#fff;padding:.7rem;z-index:10}.skip:focus{top:1rem}.topbar{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1380px)/2));background:#fff;border-bottom:1px solid #dfe9e5}.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:19px;letter-spacing:-.03em}.brand small{font-size:14px;color:#617b77;font-weight:700;margin-left:10px}.brand-mark{display:grid;place-items:center;width:35px;height:35px;background:#087c74;color:#fff;border-radius:10px}.demo-tag{font-size:12px;font-weight:700;color:#4f716d;background:#e7f2ef;padding:7px 11px;border-radius:100px}.shell{max-width:1380px;margin:0 auto;padding:30px 24px 70px}.intro{display:flex;justify-content:space-between;align-items:end;gap:30px;background:linear-gradient(115deg,#083f42,#0c7d73);color:#fff;border-radius:24px;padding:34px 42px;box-shadow:0 14px 34px #0e666529}.eyebrow{font-size:11px;letter-spacing:.18em;font-weight:800;margin:0 0 9px;color:#70d5c6}.intro h1{font-size:clamp(29px,3.4vw,46px);line-height:1.32;letter-spacing:-.05em;margin:0 0 13px}.intro-copy{max-width:660px;line-height:1.8;margin:0;font-size:15px;color:#e4f5f1}.intro-stat{text-align:center;background:#ffffff16;border:1px solid #ffffff38;padding:18px 25px;border-radius:20px;flex:none}.intro-stat strong{display:block;font-size:45px;line-height:1}.intro-stat span{font-size:12px;font-weight:700}.workspace{display:grid;grid-template-columns:340px minmax(0,1fr);gap:23px;margin-top:23px}.sidebar{display:flex;flex-direction:column;gap:18px}.panel,.results{background:#fff;border:1px solid #e1e9e6;border-radius:20px;box-shadow:0 5px 20px #23463f09}.panel{padding:22px}.results{padding:26px;min-width:0}.panel-heading{display:flex;align-items:center;gap:10px;margin-bottom:18px}.step{display:grid;place-items:center;background:#e4f4ef;color:#07786f;width:30px;height:30px;border-radius:10px;font-size:12px;font-weight:800}.panel h2{font-size:17px;margin:0}.panel label{display:block;font-size:12px;font-weight:800;margin:14px 0 6px}.panel input,.panel select{height:42px;width:100%;border:1px solid #cbdad5;border-radius:9px;background:#fff;color:#163e3d;padding:0 11px;min-width:0}.panel input:focus,.panel select:focus{outline:3px solid #a5e3d5;border-color:#087c74}.inline-add{display:flex;gap:7px;margin-top:10px}.inline-add input{flex:1}.button{border-radius:9px;min-height:42px;padding:0 13px;font-size:13px;font-weight:800;border:1px solid transparent;white-space:nowrap}.button-primary{background:#087c74;color:#fff}.button-primary:hover{background:#06665f}.button-muted{background:#e9f3f0;color:#0d6660}.button-muted:hover{background:#dbece6}.button-quiet{background:#fff;color:#506966;border-color:#cbdad5}.button-quiet:hover{background:#f1f6f3}.button:focus-visible,a:focus-visible{outline:3px solid #f7a650;outline-offset:2px}.fields{margin-top:14px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}.input-unit{display:flex;align-items:center;position:relative}.input-unit input{padding-right:43px}.input-unit span{position:absolute;right:10px;color:#637a76;font-size:11px;pointer-events:none}.helper{font-size:11px;line-height:1.65;color:#667c78;margin:12px 0 0}.required{font-size:10px;color:#b34f1a}.optional{font-size:10px;color:#758783}.pin-editor{display:flex;align-items:center;justify-content:space-between;gap:7px;padding:11px;background:#f5f9f7;border-radius:10px;margin-top:15px;font-size:11px;color:#5c7470}.pin-editor strong{display:block;color:#14554e;margin-top:4px}.pin-editor .button{min-height:36px}.form-actions{display:flex;gap:7px;margin-top:18px;flex-wrap:wrap}.result-head,.timeline-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.result-head .eyebrow{color:#0a8a7c}.result-head h2{font-size:25px;letter-spacing:-.04em;margin:0}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:20px}.metric{padding:15px 17px;border:1px solid #dce9e5;background:#f7faf8;border-radius:12px}.metric span{display:block;color:#647c77;font-weight:700;font-size:11px}.metric strong{display:block;font-size:24px;line-height:1.4;margin-top:3px}.alerts{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0 0;min-height:1px}.alert{padding:8px 11px;background:#fff6e7;border:1px solid #f0d7ad;color:#835018;border-radius:8px;font-size:12px;font-weight:700}.alert.ok{background:#e9f6f0;border-color:#c7e8d7;color:#326f56}.map-card{border:1px solid #dce7e2;border-radius:15px;overflow:hidden;margin-top:16px}.map-heading{padding:13px 17px;display:flex;justify-content:space-between;align-items:center;gap:10px}.map-heading h3,.timeline-heading h3{font-size:16px;margin:0}.map-heading span{font-size:11px;color:#5d7570}.map-heading span.active{color:#a64f15;font-weight:800}.map-card svg{display:block;width:100%;height:auto;max-height:350px;touch-action:manipulation}.map-card svg.picking{cursor:crosshair}.map-caption{font-size:11px;color:#6d827d;margin:0;padding:8px 16px 12px;background:#fafcfb}.timeline-heading{margin:22px 0 14px;align-items:start}.timeline-heading p{font-size:11px;color:#70827e;line-height:1.55;margin:4px 0 0}.status-pill{font-size:11px;color:#11786d;background:#e2f4ef;padding:6px 9px;border-radius:100px;white-space:nowrap}.route-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}.route-item{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:12px;align-items:center;border:1px solid #dce8e3;border-radius:12px;padding:11px 12px;background:#fff}.route-item.endpoint{background:#f2f8f5}.route-time{font-weight:800;color:#0a756d;font-size:16px}.route-info{min-width:0}.route-info strong{display:block;font-size:14px;overflow-wrap:anywhere}.route-info small{display:block;color:#6b807a;font-size:11px;margin-top:3px;overflow-wrap:anywhere}.route-info em{display:inline-block;font-style:normal;color:#995717;background:#fff2dd;border-radius:6px;margin:5px 0 0;padding:3px 6px;font-size:11px}.route-controls{display:flex;gap:5px;align-items:center}.icon-button{width:31px;height:31px;border-radius:7px;border:1px solid #cfdfd8;background:#fff;color:#166d65;font-weight:800}.icon-button:disabled{opacity:.3;cursor:default}.mini-link{display:inline-flex;align-items:center;text-decoration:none;color:#067368;background:#e9f4ef;padding:6px 8px;font-size:11px;font-weight:800;border-radius:7px;white-space:nowrap}.text-button{background:none;border:0;color:#57716c;text-decoration:underline;font-size:11px;padding:4px}.foot-note{margin-top:19px;padding:14px 16px;border-radius:10px;background:#f6f7f5;font-size:11px;line-height:1.75;color:#5d716c}
@media(max-width:980px){.workspace{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:1fr 1fr;align-items:start}.intro{padding:27px}.intro-stat{display:none}}
@media(max-width:690px){.topbar{height:58px;padding:0 16px}.brand{font-size:16px}.brand small{font-size:11px;margin-left:5px}.demo-tag{font-size:10px}.shell{padding:14px 12px 50px}.intro{padding:23px 20px;border-radius:17px}.intro h1{font-size:28px}.intro-copy{font-size:13px}.mobile-route-link{display:inline-block;margin-top:15px;padding:9px 12px;border:1px solid #a7e0d4;border-radius:9px;text-decoration:none;font-size:12px;font-weight:800}.desktop-only{display:none}.workspace{gap:13px;margin-top:13px}.sidebar{display:flex;gap:12px}.panel,.results{border-radius:15px}.panel{padding:18px}.results{padding:17px}.result-head{align-items:start}.result-head h2{font-size:21px}.result-head .button{font-size:11px;padding:0 9px}.metrics{gap:6px;margin-top:16px}.metric{padding:10px 9px}.metric span{font-size:10px;line-height:1.35}.metric strong{font-size:17px}.map-heading{align-items:start;flex-direction:column;gap:4px}.map-scroll{overflow-x:auto}.map-card svg{width:620px;max-width:none;max-height:none;height:auto}.route-item{grid-template-columns:47px minmax(0,1fr);gap:7px 9px}.route-controls{grid-column:2;justify-content:flex-start;flex-wrap:wrap}.route-info strong{font-size:13px}.route-time{font-size:14px}}
@media print{body{background:#fff}.topbar,.sidebar,.result-head button,.route-controls,.foot-note{display:none!important}.shell{padding:0}.intro{color:#183b3a;background:#fff;box-shadow:none;padding:0;margin-bottom:20px}.intro-copy{color:#183b3a}.workspace{display:block}.results{border:0;box-shadow:none;padding:0}.route-item{break-inside:avoid}}

/* Unitee公式サイトの青緑・濃紺・朱色に合わせたデモ用配色 */
@media print{.demo-notice{color:#183b3a;border-color:#879b98}.foot-note{display:block!important}.road-route-actions,.mobile-route-link{display:none!important}.intro .eyebrow{color:#183b3a}.intro{break-inside:avoid}}
@media screen{
  body{background:#f4f8f8;color:#20343a}
  .brand-mark,.button-primary{background:#147e8c}
  .button-primary:hover{background:#0f6470}
  .intro{background:linear-gradient(115deg,#17343b 0%,#147e8c 100%);box-shadow:0 14px 34px #147e8c26}
  .intro .eyebrow{color:#bfe9ed}
  .intro-copy{color:#e8f6f7}
  .demo-tag,.step,.button-muted,.status-pill,.mini-link{background:#e6f4f5;color:#0f6470}
  .button-muted:hover{background:#d5ecef}
  .result-head .eyebrow,.route-time{color:#147e8c}
  .metric,.route-item.endpoint{background:#f3f9fa}
  .metric,.route-item,.map-card{border-color:#d8e3e5}
  .alert:not(.ok),.route-info em{background:#fff4ec;border-color:#edc9b7;color:#8d3d20}
  .alerts .ok{background:#e6f4f5;border-color:#cbe5e9;color:#0f6470}
  .panel input:focus,.panel select:focus{outline-color:#a4d7de;border-color:#147e8c}
  .road-route-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid #d8e3e5;background:#fff}
  .button-road{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;background:#147e8c;color:#fff;white-space:normal;text-align:center}
  .button-road:hover{background:#0f6470}
  .road-route-actions span{font-size:12px;line-height:1.55;color:#8d3d20}
  .drag-handle{width:34px;height:34px;display:grid;place-items:center;border:1px solid #b8d6da;background:#e6f4f5;color:#0f6470;border-radius:8px;font-size:21px;line-height:1;cursor:grab;touch-action:none;user-select:none}
  .drag-handle:active{cursor:grabbing}
  .dragging{opacity:.55;background:#e6f4f5}
  .drop-before{box-shadow:inset 0 4px #b94824}
  .drop-after{box-shadow:inset 0 -4px #b94824}
  .is-dragging{user-select:none}
}