:root{ --bg:#0b0f14; --panel:#121922; --line:#1f2b38; --txt:#e6edf3; --dim:#8aa0b4; --cyan:#00DDEE; --good:#3fd17a; }
*{ box-sizing:border-box; margin:0; padding:0; }
body{ background:var(--bg); color:var(--txt); font-family:-apple-system,"Segoe UI",Roboto,"Noto Sans JP",sans-serif; line-height:1.5; padding:18px 14px 48px; max-width:760px; margin:0 auto; }
header{ display:flex; align-items:center; gap:13px; padding-bottom:14px; border-bottom:1px solid var(--line); }
.logo{ width:48px; height:48px; border-radius:13px; background:linear-gradient(135deg,var(--cyan),#0a6); display:flex; align-items:center; justify-content:center; font-size:26px; color:#04222a; flex:0 0 auto; }
h1{ font-size:21px; letter-spacing:.5px; }
.sub{ color:var(--dim); font-size:12.5px; }
.back{ display:inline-block; color:var(--cyan); text-decoration:none; font-size:13px; border:1px solid var(--line); border-radius:8px; padding:5px 12px; margin-bottom:12px; }
.back:active{ transform:scale(.98); }
.bar{ display:flex; align-items:center; gap:11px; margin-top:14px; flex-wrap:wrap; }
.btn{ background:var(--cyan); color:#04222a; border:none; border-radius:9px; padding:9px 16px; font-weight:700; font-size:13px; cursor:pointer; }
.btn:active{ transform:scale(.98); }
.st{ font-size:12px; color:var(--dim); }
section{ margin-top:20px; }
.card .mt{ font-size:11px; color:var(--good); margin-top:4px; font-variant-numeric:tabular-nums; }
.card .badge{ display:inline-block; font-size:10px; color:var(--cyan); border:1px solid var(--line); border-radius:6px; padding:1px 8px; margin-top:8px; }
h2{ font-size:12px; color:var(--cyan); text-transform:uppercase; letter-spacing:1.2px; margin-bottom:11px; }
.overview{ display:grid; grid-template-columns:repeat(auto-fill,minmax(96px,1fr)); gap:9px; }
.ov{ background:var(--panel); border:1px solid var(--line); border-radius:11px; padding:12px 10px; text-align:center; }
.ov .ovv{ font-size:21px; font-weight:800; color:var(--cyan); font-variant-numeric:tabular-nums; line-height:1.1; }
.ov .ovl{ font-size:11px; color:var(--dim); margin-top:4px; }
.qsend{ background:var(--panel); border:1px solid var(--line); border-radius:13px; padding:13px; }
.qsend textarea{ width:100%; min-height:58px; resize:vertical; background:var(--bg); color:var(--txt); border:1px solid var(--line); border-radius:9px; padding:9px 10px; font:inherit; font-size:14px; }
.qrow{ display:flex; flex-wrap:wrap; gap:9px; align-items:center; margin-top:9px; }
.qrow select{ background:var(--bg); color:var(--txt); border:1px solid var(--line); border-radius:9px; padding:8px 9px; font:inherit; font-size:13px; }
.feed{ list-style:none; }
.feed li{ display:flex; gap:9px; padding:8px 0; border-bottom:1px solid var(--line); font-size:12.5px; align-items:baseline; }
.feed .fd{ flex:0 0 auto; color:var(--cyan); font-size:11px; font-variant-numeric:tabular-nums; width:40px; }
.feed .fl{ flex:0 0 auto; color:var(--dim); font-size:10px; border:1px solid var(--line); border-radius:6px; padding:1px 6px; }
.feed .fx{ flex:1; min-width:0; }
.qreply{ margin-top:12px; }
.qrh{ font-size:11px; color:var(--cyan); text-transform:uppercase; letter-spacing:1px; margin-bottom:5px; }
.qri{ display:flex; gap:9px; align-items:baseline; padding:6px 0; border-top:1px solid var(--line); font-size:12.5px; }
.qrt{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.qrd{ flex:0 0 auto; color:var(--dim); font-size:11px; font-variant-numeric:tabular-nums; }
.grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:11px; }
a.card, div.card{ display:block; text-decoration:none; background:var(--panel); border:1px solid var(--line); border-radius:13px; padding:15px 14px; color:var(--txt); transition:border-color .15s, transform .05s; }
a.card:active{ transform:scale(.98); }
a.card{ border-left:3px solid var(--cyan); }
a.card:hover{ border-color:var(--cyan); }
.card .ico{ font-size:26px; }
.card .nm{ font-size:15px; font-weight:700; margin-top:8px; }
.card .ds{ font-size:12px; color:var(--dim); margin-top:3px; }
.card.soon{ opacity:.55; border-left:3px solid var(--line); }
.card.soon .tag{ display:inline-block; font-size:10px; color:var(--dim); border:1px solid var(--line); border-radius:6px; padding:1px 7px; margin-top:8px; }
footer{ margin-top:28px; text-align:center; color:var(--dim); font-size:11px; line-height:1.7; }

/* ===== オフィス型フロア(層2/層3) 共有スタイル — lab_office.js 用。is/tech はインラインで上書き ===== */
#viewTabs{ display:flex; flex-wrap:wrap; gap:7px; margin:10px 0 2px; }
#viewTabs .chip2{ background:var(--panel); border:1px solid var(--line); border-radius:999px; padding:7px 15px; font-size:13px; color:var(--dim); cursor:pointer; }
#viewTabs .chip2.on{ background:#10243a; color:var(--cyan); border-color:var(--cyan); }
/* オフィスフロア(層2) */
.ohead{ margin:8px 0 4px; }
.ohtitle{ font-size:14px; font-weight:800; color:var(--txt); }
.ohsub{ font-size:11.5px; color:var(--dim); margin-top:2px; line-height:1.5; }
.olegend{ display:flex; flex-wrap:wrap; gap:12px; margin:6px 0 10px; }
.olg{ display:flex; align-items:center; gap:5px; font-size:11px; color:var(--dim); }
.olg .ld{ width:11px; height:11px; border-radius:50%; display:inline-block; border:2px solid #33414d; background:#0e1c28; }
.ld.t9{ background:#0d3320; border-color:#36e08a; }
.ld.t7{ background:#0e1c28; border-color:#00DDEE; }
.ld.t6{ background:#2b2b14; border-color:#d8c45a; }
.ld.t1{ background:#2a1414; border-color:#cc7766; }
.osec{ margin:12px 0; }
.oseclabel{ font-size:11px; color:var(--dim); letter-spacing:.04em; margin:0 0 7px; }
.ogrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(92px,1fr)); gap:10px; }
.otile{ display:flex; flex-direction:column; align-items:center; gap:5px; background:var(--panel); border:1px solid var(--line); border-radius:13px; padding:11px 6px 9px; cursor:pointer; font:inherit; color:var(--txt); text-align:center; }
.otile:active{ transform:scale(.97); }
.otile.locked{ opacity:.6; cursor:default; }
.oface{ width:54px; height:54px; border-radius:50%; overflow:hidden; display:block; position:relative; }
.oface .odisc{ width:54px; height:54px; display:block; }
.oname{ font-size:11.5px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.orole{ font-size:10px; color:var(--dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.olvbadge{ font-size:9px; font-weight:800; border-radius:999px; padding:1px 7px; margin-top:2px; border:1px solid #33414d; color:var(--dim); }
.olvbadge.t9{ color:#36e08a; background:#0d2218; border-color:#1f7a4d; }
.olvbadge.t7{ color:#00DDEE; background:#0e1c28; border-color:#1f6a8c; }
.olvbadge.t6{ color:#d8c45a; background:#211c0a; border-color:#6a5f1f; }
.olvbadge.t1{ color:#cc7766; background:#211010; border-color:#6a3030; }
.ostat{ display:flex; flex-wrap:wrap; gap:7px; align-items:center; margin-top:8px; }
.ostat-grow{ font-size:11px; font-weight:700; color:#cfe6ee; background:#10243a; border:1px solid #1f4a63; border-radius:999px; padding:2px 10px; }
.ostat-full{ font-size:11px; font-weight:700; color:#36e08a; background:#0d2218; border:1px solid #1f7a4d; border-radius:999px; padding:2px 10px; }
/* 個別ドリル(層3) */
.drill{ position:fixed; inset:0; background:rgba(4,8,12,.94); display:none; align-items:center; justify-content:center; z-index:42; padding:18px; }
.drill.show{ display:flex; }
.drillcard{ background:var(--panel); border:1px solid var(--cyan); border-radius:16px; padding:20px 18px; max-width:360px; width:100%; position:relative; max-height:86vh; overflow:auto; }
.adClose{ position:absolute; top:9px; right:11px; background:transparent; border:none; color:var(--dim); font-size:20px; cursor:pointer; }
#adBody{ text-align:center; }
.adface{ width:88px; height:88px; margin:4px auto 12px; }
.adface .oface{ width:88px; height:88px; } .adface .odisc{ width:88px; height:88px; }
.adname{ font-size:18px; font-weight:800; color:var(--txt); word-break:break-all; }
.adrole{ display:flex; align-items:center; justify-content:center; gap:8px; margin:9px 0; flex-wrap:wrap; }
.adbadge{ font-size:10.5px; padding:2px 9px; border-radius:999px; border:1px solid var(--line); color:var(--dim); }
.adbadge.t9{ border-color:#36e08a; color:#36e08a; } .adbadge.t7{ border-color:#00DDEE; color:#00DDEE; }
.adbadge.t6{ border-color:#d8c45a; color:#d8c45a; } .adbadge.t1{ border-color:#cc7766; color:#cc7766; }
.adessence{ font-size:12.5px; color:var(--txt); line-height:1.65; margin:6px 2px 4px; }
.adlv{ margin:12px 2px 8px; text-align:left; }
.adlvrow{ display:flex; justify-content:space-between; font-size:11.5px; color:var(--dim); margin-bottom:4px; }
.adlvrow b{ color:var(--txt); }
.adlvbar{ position:relative; height:8px; background:var(--bg); border-radius:999px; overflow:hidden; }
.adlvfill{ position:absolute; left:0; top:0; bottom:0; border-radius:999px; background:#00DDEE; }
.adlvfill.t9{ background:#36e08a; } .adlvfill.t7{ background:#00DDEE; } .adlvfill.t6{ background:#d8c45a; } .adlvfill.t1{ background:#cc7766; }
.adcrit{ display:flex; flex-wrap:wrap; gap:6px; margin:10px 0 4px; text-align:left; }
.adck{ font-size:11px; padding:3px 9px; border-radius:7px; border:1px solid var(--line); color:#7d8893; display:flex; align-items:center; gap:5px; }
.adck.y{ color:#36e08a; border-color:#1f7a4d; background:#0d2218; }
.adck .mk{ font-weight:800; } .adck .pt{ opacity:.6; }
.adkv{ display:flex; gap:8px; font-size:11.5px; color:var(--dim); line-height:1.55; margin:7px 2px; text-align:left; }
.adkv b{ flex:0 0 auto; width:58px; color:var(--txt); font-weight:700; }
.adlist{ list-style:none; margin:9px 2px 4px; text-align:left; }
.adlist li{ font-size:12px; color:#cfe6ee; padding:3px 0 3px 14px; position:relative; line-height:1.5; }
.adlist li:before{ content:"·"; position:absolute; left:3px; color:var(--cyan); }
.adnext{ font-size:12.5px; background:#10243a; border:1px solid #1f4a63; border-radius:8px; padding:7px 11px; color:#cfe6ee; margin:9px 0 2px; text-align:left; }
.adnext b{ color:var(--cyan); }
.adnote{ font-size:10px; color:var(--dim); margin-top:12px; opacity:.8; text-align:left; line-height:1.5; }