:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:#15171a;background:#f5f6f8;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:#f5f6f8;color:#15171a}a{color:inherit;text-decoration:none}.topbar{height:68px;background:#fff;border-bottom:1px solid #e6e8eb;display:flex;align-items:center;gap:32px;padding:0 28px;position:sticky;top:0;z-index:10}.brand{font-weight:800;letter-spacing:-.02em}.topbar nav{display:flex;gap:22px;font-size:14px;color:#4c5158}.account{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:13px}.role{background:#f0f2f5;border-radius:999px;padding:4px 8px;color:#555b63}.link-button{border:0;background:transparent;color:#626871;cursor:pointer;padding:6px}.container{max-width:1180px;margin:0 auto;padding:42px 28px 80px}.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.page-head h1{font-size:32px;margin:5px 0 5px;letter-spacing:-.035em}.page-head p{margin:0;color:#6a7078}.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.11em;color:#8b929a;font-weight:700}.card{background:#fff;border:1px solid #e6e8eb;border-radius:16px;padding:24px;box-shadow:0 1px 2px rgba(20,24,30,.03);margin-bottom:18px}.card h2{font-size:18px;margin:0 0 8px}.card p{color:#6b7178;line-height:1.65}.card-head{display:flex;justify-content:space-between;align-items:center;gap:20px}.button,.primary,.secondary{display:inline-flex;align-items:center;justify-content:center;border-radius:10px;border:1px solid #d9dde2;padding:10px 15px;font-weight:700;font-size:14px;cursor:pointer;background:#fff}.button.primary,.primary{background:#15171a;color:#fff;border-color:#15171a}.secondary{background:#fff}.full{width:100%}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:18px}.metric{background:#fff;border:1px solid #e6e8eb;border-radius:16px;padding:22px}.metric span{display:block;color:#727982;font-size:13px;margin-bottom:10px}.metric strong{font-size:34px;letter-spacing:-.04em}.metric strong.small{font-size:22px}.table-card{padding:0;overflow:hidden}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:16px 18px;border-bottom:1px solid #edf0f2;font-size:14px;vertical-align:top}th{font-size:12px;color:#767d86;background:#fafbfc;text-transform:none}tr:last-child td{border-bottom:0}.strong-link{font-weight:750}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.subtle{font-size:11px;color:#9298a0;margin-top:4px}.empty{text-align:center;color:#8a9199;padding:34px}.status{display:inline-flex;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:700;background:#eef0f2}.status.active{background:#eaf7ef;color:#1d6b3a}.status.suspended{background:#fff3de;color:#8b5a00}.status.closed,.status.disconnected{background:#f2f2f2;color:#686d73}.status.pending{background:#eaf1ff;color:#315d9d}.form-card{max-width:720px}.form-card form,.auth-card form{display:grid;gap:18px}label{display:grid;gap:8px;font-size:13px;font-weight:700}input,select{width:100%;border:1px solid #d7dbe0;background:#fff;border-radius:10px;padding:12px 13px;font:inherit;outline:none}input:focus,select:focus{border-color:#8b929b;box-shadow:0 0 0 3px rgba(80,90,100,.09)}.required{color:#b44343;font-size:11px;margin-left:7px}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.detail-grid .card{margin-bottom:0}dl{display:grid;grid-template-columns:110px 1fr;gap:12px 18px;margin:20px 0}dt{color:#7b8188;font-size:13px}dd{margin:0;font-size:14px}.inline-form{display:flex;align-items:center;gap:10px;margin-top:24px}.inline-form select{width:auto;min-width:160px}.flash{border-radius:12px;padding:12px 14px;margin:0 0 18px;font-size:14px}.flash.success{background:#edf8f1;color:#235f39}.flash.error{background:#fff0f0;color:#8a3535}.auth-shell{min-height:calc(100vh - 120px);display:grid;place-items:center}.auth-card{width:min(440px,100%);background:#fff;border:1px solid #e2e5e9;border-radius:18px;padding:34px;box-shadow:0 15px 45px rgba(30,35,40,.07)}.auth-card h1{font-size:27px;margin:7px 0 26px;letter-spacing:-.035em}.auth-card .muted{font-size:12px;color:#8a9097;line-height:1.6;margin:18px 0 0}@media(max-width:760px){.topbar{padding:0 16px;gap:15px}.topbar nav{display:none}.account>span{display:none}.container{padding:28px 16px 60px}.page-head{align-items:flex-start;flex-direction:column}.metrics,.detail-grid{grid-template-columns:1fr}.table-card{overflow-x:auto}table{min-width:650px}.auth-card{padding:26px}.inline-form{align-items:stretch;flex-direction:column}.inline-form select{width:100%}}


/* NOKORU_OPS_COMMERCIAL_UI_POLISH_V1 */
.contract-summary{padding:26px}
.contract-head{align-items:flex-start}
.contract-head .status{margin-top:2px}
.summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px}
.summary-item{border:1px solid #edf0f2;background:#fafbfc;border-radius:12px;padding:15px 16px;min-height:82px}
.summary-item span{display:block;color:#7a8189;font-size:12px;margin-bottom:8px}
.summary-item strong{display:block;font-size:15px;line-height:1.45}
.settings-source{margin:16px 0 0!important;font-size:12px;color:#8b9198!important}
.settings-card{padding:24px}
.operator-settings-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:20px}
.setting-block{border:1px solid #e9ecef;border-radius:13px;padding:18px;background:#fbfcfd}
.setting-block h3{margin:0 0 14px;font-size:15px}
.setting-block form{display:grid;gap:12px}
.setting-block label{font-size:12px}
.compact-copy{margin:0!important;font-size:13px}
.products-card .table-card-head{padding:22px 24px 14px}
.products-card .table-card-head h2{margin-bottom:5px}
.products-card .table-card-head p{margin:0}
.product-name{display:flex;align-items:center;gap:8px;min-height:32px}
.version-chip{display:inline-flex;background:#f4f5f7;border:1px solid #e5e7ea;border-radius:7px;padding:5px 8px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11px;color:#555c64}
.action-cell{width:110px}
.compact-button{padding:8px 13px}
.add-product-card{padding:24px}
.add-product-card .card-head p{margin:4px 0 0}
.add-product-form{display:grid;grid-template-columns:minmax(260px,1fr) auto;align-items:end;gap:12px;margin-top:18px}
.add-product-form label{margin:0}
.page-head .mono.subtle{font-size:10px;color:#a1a7ae;font-weight:400}
.card>dl{grid-template-columns:120px 1fr}
@media(max-width:900px){
  .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .operator-settings-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .summary-grid{grid-template-columns:1fr}
  .add-product-form{grid-template-columns:1fr}
  .action-cell{width:auto}
}


/* NOKORU_OPS_COMMERCIAL_UI_POLISH_V2 */

/* Keep the top customer area compact; the real LINE list lives below. */
.detail-grid{align-items:start}

/* Internal identifiers are support data, not normal operator UI. */
.page-head .mono.subtle,
.table-card td .mono.subtle{display:none}

/* Human-facing status labels. */
.detail-grid .status.active{
  font-size:0
}
.detail-grid .status.active::after{
  content:"利用中";
  font-size:12px
}
.table-card table td:last-child .status.active{
  font-size:0
}
.table-card table td:last-child .status.active::after{
  content:"接続中";
  font-size:12px
}

/* Plan Version is pinned automatically; hide the raw internal id from normal operators. */
.products-card th:nth-child(3),
.products-card td:nth-child(3){
  display:none
}

/* Make destructive-ish stop action visually secondary. */
.products-card .compact-button{
  font-weight:600;
  color:#5f656c;
  background:#fff
}

/* Slightly reduce vertical weight after V1 grouping. */
.contract-summary,
.settings-card,
.add-product-card{
  margin-bottom:16px
}

@media(max-width:760px){
  .detail-grid{grid-template-columns:1fr}
}


/* NOKORU_OPS_COMMERCIAL_UI_FINAL_TIDY_V3 */
/* Tenant ids are support/debug information, not normal operator information. */
.page-head .mono{display:none}

/* Keep support metadata available in source but visually out of the primary workflow. */
.settings-source{opacity:.72}


/* NOKORU_OPS_CUSTOMER_LIST_ONBOARDING_UI_V1 */
.customer-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}
.customer-metrics .metric strong{font-size:30px}
.customer-list-card .customer-name-link{font-size:14px}
.product-chip-list{display:flex;flex-wrap:wrap;gap:6px}
.product-chip{display:inline-flex;align-items:center;border:1px solid #e3e6e9;background:#f7f8f9;border-radius:999px;padding:5px 8px;font-size:11px;line-height:1.2;color:#525960}
.onboarding-card{max-width:900px;padding:0;overflow:hidden}
.onboarding-form{display:block}
.form-section{padding:26px 28px;border-bottom:1px solid #eceff2}
.form-section-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:20px}
.form-section-head h2{font-size:17px;margin:1px 0 5px}
.form-section-head p{margin:0;color:#747b83;font-size:13px}
.step-number{width:28px;height:28px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 28px;background:#15171a;color:#fff;font-size:12px;font-weight:800}
.form-grid{display:grid;gap:16px}
.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.info-box{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px;margin-top:18px;padding:16px 18px;border-radius:12px;background:#f7f9fb;border:1px solid #e8ecef;font-size:12px;color:#586069}
.info-box strong{grid-column:1/-1;color:#23272b;font-size:13px;margin-bottom:2px}
.onboarding-note{margin:10px 0 0!important;font-size:12px!important}
.onboarding-summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 28px;background:#fafbfc}
.onboarding-summary strong{font-size:14px}
.onboarding-summary p{margin:4px 0 0;color:#6f767e;font-size:12px}
.onboarding-summary .form-actions{margin:0;flex:0 0 auto}
@media(max-width:900px){
  .customer-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .customer-metrics{grid-template-columns:1fr 1fr}
  .form-grid.two{grid-template-columns:1fr}
  .info-box{grid-template-columns:1fr}
  .onboarding-summary{align-items:stretch;flex-direction:column}
  .onboarding-summary .form-actions{justify-content:stretch}
  .onboarding-summary .form-actions .button{flex:1}
  .form-section{padding:22px 18px}
  .onboarding-summary{padding:20px 18px}
}
