/* 昭明算界 · 软件与 AI 作品展厅 (直观分类与作品优先布局) */
body.portfolio-active{background:#f4f8fc!important;color:#1b344b}
body.portfolio-active #siteShell{display:none}
.portfolio-shell{position:fixed;inset:0;z-index:300;overflow:auto;overscroll-behavior:contain;background:radial-gradient(ellipse at 50% 0%,rgba(223,238,248,.75) 0%,rgba(244,248,252,.95) 55%,rgba(238,245,252,.98) 100%);color:#1b344b;font-family:Inter,"Microsoft YaHei","PingFang SC",system-ui,sans-serif;line-height:1.5;scrollbar-color:#9ebbd3 #f3f7fb}
.portfolio-shell[hidden]{display:none}
.portfolio-shell *,.pf-detail *{box-sizing:border-box}
.portfolio-shell button,.portfolio-shell input,.portfolio-shell select,.pf-detail button{font:inherit}
.portfolio-shell button,.portfolio-shell a,.pf-detail button,.pf-detail a{-webkit-tap-highlight-color:transparent}
.portfolio-shell button{cursor:pointer}
.portfolio-shell svg,.pf-detail svg{stroke:none;stroke-width:0;fill:none}
.pf-detail-art svg{height:auto}
.pf-wrap{max-width:1540px;margin:0 auto;padding:14px 32px 28px}

/* 顶部紧凑导航栏 */
.pf-header{position:sticky;top:10px;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 18px;border-radius:14px;background:rgba(255,255,255,.94);border:1px solid #d2e0eb;box-shadow:0 8px 24px rgba(27,52,75,.07),inset 0 1px 0 #fff;backdrop-filter:blur(18px);margin-bottom:12px}
.pf-brand{display:flex;align-items:center;gap:11px;min-width:0}
.pf-mark{width:32px;height:32px;flex-shrink:0;display:grid;grid-template-columns:1fr 1fr;gap:3.5px;padding:5.5px;border-radius:9px;background:linear-gradient(135deg,#2570a4,#18847b);box-shadow:0 3px 10px rgba(23,108,163,.22)}
.pf-mark i{display:block;border-radius:2.5px;background:#fff}
.pf-mark i:nth-child(2),.pf-mark i:nth-child(3){background:#bfe8e4}
.pf-brand-text{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.pf-brand-title{font-size:15px;font-weight:700;color:#1b344b;letter-spacing:.2px;white-space:nowrap}
.pf-brand-sub{font-size:11.5px;font-weight:600;color:#4e6980;background:#eef5fb;border:1px solid #d5e3ed;padding:2px 9px;border-radius:99px;white-space:nowrap}

.pf-header-tools{display:flex;align-items:center;gap:8px;flex:1;max-width:460px;justify-content:center}
.pf-search{display:flex;gap:7px;align-items:center;flex:1;border:1px solid #cbdce8;background:#f6fafd;border-radius:9px;padding:6px 11px;color:#5c7286;transition:border-color .15s,box-shadow .15s,background .15s}
.pf-search:focus-within{border-color:#2570a4;background:#fff;box-shadow:0 0 0 3px rgba(37,112,164,.12)}
.pf-search input{width:100%;border:0;outline:0;background:transparent;font-size:12px;color:#1b344b}
.pf-search input::placeholder{color:#6d8499}
.pf-view-switch{display:inline-flex;padding:3px;border-radius:9px;background:#edf4fa;border:1px solid #cfe0ec;gap:2px;flex-shrink:0}
.pf-view-btn{padding:5px 10px;border-radius:6px;border:0;background:transparent;color:#49647b;font-size:11.5px;font-weight:600;white-space:nowrap;transition:background .15s,color .15s}
.pf-view-btn.active{background:#fff;color:#176ca3;box-shadow:0 2px 5px rgba(27,52,75,.08)}

.pf-header-actions{display:flex;align-items:center;gap:7px;flex-shrink:0}
.pf-button{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:7px 13px;border-radius:9px;border:1px solid #b8d0e2;background:#ffffffeb;color:#235175;text-decoration:none;font-size:12px;font-weight:600;white-space:nowrap;box-shadow:0 2px 6px rgba(35,77,107,.05);transition:background .16s,border-color .16s,color .16s,transform .16s}
.pf-button:hover{background:#eff6fc;border-color:#88b2cf;color:#12466e;transform:translateY(-1px)}
.pf-button.ghost{border-color:#d5e2ec;background:transparent;color:#49647b;box-shadow:none}
.pf-button.ghost:hover{background:#eef5fb;color:#155f96;border-color:#bdd3e4}
.pf-button.primary{background:linear-gradient(135deg,#2570a4,#1b5f8e);color:#fff;border-color:#1c6191;box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 4px 14px rgba(30,91,130,.2)}
.pf-button.primary:hover{background:linear-gradient(135deg,#1d6294,#154f78);border-color:#16527c;color:#fff}

/* 顶部直观分类导航栏：客户点进来第一眼看到有哪些分类 */
.pf-categories{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;margin-bottom:14px}
.pf-cat-card{display:flex;flex-direction:column;justify-content:space-between;gap:4px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.92);border:1px solid #d3e1ec;border-top:3px solid var(--cat-color,#176ca3);text-align:left;box-shadow:0 4px 14px rgba(27,52,75,.04);transition:transform .16s,border-color .16s,box-shadow .16s,background .16s;min-width:0}
.pf-cat-card:hover{transform:translateY(-2px);background:#fff;border-color:#94bcd8;border-top-color:var(--cat-color,#176ca3);box-shadow:0 8px 20px rgba(27,52,75,.08)}
.pf-cat-card.active,.pf-cat-card[aria-pressed=true]{background:linear-gradient(145deg,#1e6698,#164e78);border-color:#164e78;border-top-color:#38d2c3;color:#fff;box-shadow:0 8px 22px rgba(23,88,134,.24)}
.pf-cat-top{display:flex;align-items:center;justify-content:space-between;gap:6px}
.pf-cat-top strong{font-size:13px;font-weight:700;color:#1b344b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-cat-card.active .pf-cat-top strong{color:#fff}
.pf-cat-top em{font-style:normal;font:700 10.5px Consolas,monospace;padding:1px 6px;border-radius:99px;background:#e8f2f9;color:#245980;flex-shrink:0}
.pf-cat-card.active .pf-cat-top em{background:rgba(255,255,255,.22);color:#fff}
.pf-cat-card>span{font-size:11px;color:#5a7288;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.35}
.pf-cat-card.active>span{color:rgba(235,245,255,.9)}

/* 状态提示栏 */
.pf-result{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 2px 10px;color:#526c82;font-size:12px}
.pf-result-left{display:flex;align-items:center;gap:10px}
.pf-result strong{color:#1b344b;font-weight:700}
.pf-reset-inline{border:1px solid #bdd3e4;background:#fff;color:#176ca3;font-size:11px;font-weight:600;padding:2px 9px;border-radius:99px}
.pf-reset-inline:hover{background:#e7f2fa}
.pf-result-hint{color:#49647b;font-weight:500}

/* 模式 A：图文卡片网格 (.pf-grid-showroom) — 第一屏直接展示多套系统 */
.pf-grid-showroom{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:stretch}
.pf-booth-card{display:flex;flex-direction:column;border-radius:14px;background:rgba(255,255,255,.95);border:1px solid #d2e0eb;box-shadow:0 6px 20px rgba(27,52,75,.05),inset 0 1px 0 #fff;overflow:hidden;cursor:pointer;transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s,border-color .2s}
.pf-booth-card:hover{transform:translateY(-4px);border-color:#78a7c9;box-shadow:0 16px 36px rgba(27,52,75,.12),inset 0 1px 0 #fff}
.pf-booth-Thumb,.pf-booth-thumb{position:relative;aspect-ratio:1040/568;background:#e7f0f8;overflow:hidden;border-bottom:1px solid #dfeaf2}
.pf-booth-thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .32s ease}
.pf-booth-card:hover .pf-booth-thumb img{transform:scale(1.035)}
.pf-booth-cat-badge{position:absolute;top:9px;left:9px;padding:3px 9px;border-radius:6px;background:rgba(15,31,51,.82);color:#fff;font-size:10.5px;font-weight:600;backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.16)}
.pf-booth-live-tag{position:absolute;right:9px;bottom:9px;padding:4px 10px;border-radius:7px;background:linear-gradient(135deg,#2570a4,#18847b);color:#fff;font-size:11px;font-weight:600;box-shadow:0 4px 12px rgba(15,31,51,.22);opacity:.92;transition:transform .18s,opacity .18s}
.pf-booth-card:hover .pf-booth-live-tag{opacity:1;transform:translateY(-1px)}

.pf-booth-body{display:flex;flex-direction:column;flex:1;padding:12px 14px 13px}
.pf-booth-title-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:3px}
.pf-booth-body h3{margin:0;font-size:15.5px;font-weight:700;color:#1b344b;line-height:1.35;transition:color .15s}
.pf-booth-card:hover .pf-booth-body h3{color:#176ca3}
.pf-card-arrow{font-size:14px;color:#728ea6;font-weight:700;transition:transform .18s,color .18s}
.pf-booth-card:hover .pf-card-arrow{transform:translate(2px,-2px);color:#176ca3}
.pf-booth-sub{font-size:11.5px;color:#286491;margin:0 0 8px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-booth-features{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:3.5px;flex:1}
.pf-booth-features li{position:relative;padding-left:12px;font-size:11.5px;color:#465f75;line-height:1.45;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-booth-features li::before{content:"";position:absolute;left:1px;top:6.5px;width:4.5px;height:4.5px;border-radius:50%;background:var(--pf-color,#176ca3)}

/* 模式 B：分类目录视图 (.pf-grid-directory) — 一屏纵览所有分类与系统 */
.pf-grid-directory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.pf-group{border:1px solid #d2e0eb;background:rgba(255,255,255,.94);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;min-width:0;box-shadow:0 8px 24px rgba(27,52,75,.05),inset 0 1px 0 #fff}
.pf-group-top{padding:16px 18px 14px;position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;background:linear-gradient(115deg,color-mix(in srgb,var(--pf-color) 10%,#ffffff),#f5f9fd);border-bottom:1px solid #e3eef6}
.pf-group-head-row{display:flex;align-items:center;gap:8px}
.pf-group h2{margin:0;font-size:18px;font-weight:700;color:#1b344b}
.pf-group-count{padding:2px 8px;border-radius:99px;background:#fff;border:1px solid #d2e0eb;font-size:11px;font-weight:700;color:var(--pf-color,#176ca3)}
.pf-group-intro{font-size:11.5px;color:#4c677d;margin:4px 0 0}
.pf-group-art{width:56px;flex-shrink:0;opacity:.75}.pf-group-art svg{display:block;width:100%;height:auto}
.pf-list{padding:4px 12px 10px;flex:1}
.pf-project{width:100%;display:flex;align-items:center;gap:10px;text-align:left;background:transparent;border:0;border-top:1px solid #e8f0f7;padding:10px 8px;color:inherit;transition:background .15s}
.pf-project:first-child{border-top:0}
.pf-project:hover{background:#edf5fc;border-radius:8px}
.pf-number{font:700 10.5px Consolas,monospace;color:#6c859b;width:20px;flex-shrink:0}
.pf-project-copy{flex:1;min-width:0}
.pf-project-name{display:block;font-size:13.5px;font-weight:600;line-height:1.4;color:#1b344b}
.pf-project-subtitle{display:block;font-size:11px;color:#566c82;line-height:1.4;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pf-project-arrow{font-size:11px;font-weight:600;color:#176ca3;white-space:nowrap;opacity:.75;transition:opacity .15s,transform .15s}
.pf-project:hover .pf-project-arrow{opacity:1;transform:translateX(2px)}

.pf-empty{grid-column:1/-1;text-align:center;padding:56px 20px;border:1px dashed #b8d0e2;border-radius:16px;background:rgba(255,255,255,.85);color:#4c677d}
.pf-empty h2{font-size:19px;font-weight:700;color:#1b344b;margin:0}
.pf-empty p{font-size:13px;margin:8px 0 18px}

/* 简洁页脚 */
.pf-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;font-size:11.5px;color:#5c7286;padding:20px 4px 8px;margin-top:18px;border-top:1px solid #dce7f0}

/* 作品详情弹窗 (.pf-detail)：左右分栏，直观查看界面与功能 */
.pf-detail{border:1px solid #c5d8e7;border-radius:18px;padding:0;width:min(1160px,calc(100% - 32px));max-height:calc(100dvh - 32px);background:linear-gradient(165deg,#ffffff,#f4f8fc);color:#1b344b;box-shadow:0 28px 90px rgba(18,40,64,.26);font-family:Inter,"Microsoft YaHei",sans-serif;line-height:1.55;overscroll-behavior:contain}
.pf-detail::backdrop{background:rgba(15,31,51,.55);backdrop-filter:blur(7px)}
.pf-detail-inner{padding:22px 26px 22px;position:relative}
.pf-detail-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:14px;border-bottom:1px solid #dce7f0;margin-bottom:18px;flex-wrap:wrap}
.pf-detail-badges{display:flex;align-items:center;gap:8px;margin-bottom:5px;flex-wrap:wrap}
.pf-badge{display:inline-block;border-radius:6px;background:color-mix(in srgb,var(--pf-project-color,#176ca3) 14%,#fff);color:var(--pf-project-color,#176ca3);font-size:11.5px;font-weight:700;padding:3px 9px}
.pf-detail-sub-pill{font-size:12px;color:#4a657c;font-weight:600}
.pf-detail-heading h2{font-size:23px;font-weight:700;line-height:1.3;margin:0;color:#1b344b}
.pf-detail-top-actions{display:flex;align-items:center;gap:8px}
.pf-detail-close{width:34px;height:34px;border:1px solid #cbdce8;border-radius:50%;font-size:20px;color:#3c556b;background:#f4f8fc;cursor:pointer;line-height:1;flex-shrink:0}
.pf-detail-close:hover{background:#e4f0fa;color:#1b344b}

.pf-detail-grid{display:grid;grid-template-columns:1.32fr 1fr;gap:22px;align-items:start}
.pf-project-preview{margin:0}
.pf-project-preview>button{display:block;position:relative;width:100%;padding:0;border:1px solid #c7d9e8;background:#eaf2f9;border-radius:12px;overflow:hidden;cursor:zoom-in;box-shadow:0 10px 28px rgba(18,40,64,.08)}
.pf-project-preview img{display:block;width:100%;height:auto}
.pf-enlarge-hint{position:absolute;bottom:12px;right:12px;border:1px solid rgba(255,255,255,.25);background:rgba(15,31,51,.84);border-radius:8px;padding:6px 12px;font-size:11.5px;font-weight:600;color:#fff;backdrop-filter:blur(8px)}

.pf-detail-info{display:flex;flex-direction:column;gap:16px}
.pf-info-block h3{font-size:12px;font-weight:700;color:#224967;margin:0 0 8px;letter-spacing:.3px}
.pf-info-block>p{font-size:13px;line-height:1.78;margin:0;color:#385268;background:#f5f9fd;border:1px solid #dce8f2;padding:12px 14px;border-radius:10px}
.pf-flow{display:flex;flex-direction:column;gap:8px}
.pf-flow article{display:flex;align-items:center;gap:10px;background:#f5f9fd;padding:10px 13px;border:1px solid #dce8f2;border-radius:10px}
.pf-flow article>span{font:700 10.5px Consolas,monospace;color:#fff;background:linear-gradient(135deg,#2570a4,#18847b);padding:3px 7px;border-radius:6px;flex-shrink:0}
.pf-flow article p{font-size:12.5px;line-height:1.5;color:#1b344b;font-weight:600;margin:0}
.pf-tech{display:flex;flex-wrap:wrap;gap:6px}
.pf-tech span{font-size:11.5px;font-weight:600;border:1px solid #cbdce8;background:#f2f8fc;border-radius:6px;padding:4px 10px;color:#1d4e78}

.pf-detail-siblings{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:18px;padding:11px 14px;border-radius:10px;background:#eef5fb;border:1px solid #d5e3ed;font-size:11.5px;color:#3c556b;font-weight:600}
.pf-sibling-pills{display:flex;flex-wrap:wrap;gap:6px}
.pf-sibling-pill{padding:4px 10px;border-radius:99px;border:1px solid #c6d9e8;background:#fff;color:#25557a;font-size:11.5px;font-weight:600;transition:background .15s,color .15s}
.pf-sibling-pill:hover{background:#e1effa}
.pf-sibling-pill.active{background:linear-gradient(135deg,#2570a4,#1b5f8e);border-color:#1b5f8e;color:#fff}

.pf-detail-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:16px;border-top:1px solid #dce7f0;margin-top:16px;flex-wrap:wrap}
.pf-detail-nav{display:flex;gap:8px;flex-wrap:wrap}

/* 高清图纸查看器 (.pf-preview-viewer) */
.pf-preview-viewer{width:min(1280px,calc(100% - 40px));max-height:calc(100dvh - 40px);padding:0;border:1px solid #c5d8e7;border-radius:16px;background:#f2f7fc;color:#1b344b;font-family:Inter,"Microsoft YaHei",sans-serif;overflow:hidden;box-shadow:0 24px 90px rgba(12,28,48,.35)}
.pf-preview-viewer::backdrop{background:rgba(12,26,44,.75);backdrop-filter:blur(6px)}
.pf-viewer-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 20px;background:#fff;border-bottom:1px solid #d5e3ed}
.pf-viewer-head h2{font-size:16px;font-weight:700;margin:0;color:#1b344b}
.pf-viewer-head p{font-size:11.5px;color:#566c82;margin:2px 0 0}
.pf-viewer-tools{display:flex;align-items:center;gap:10px;flex-shrink:0}
.pf-viewer-close{width:32px;height:32px;border:1px solid #cbdce8;border-radius:50%;background:#f4f8fc;color:#3c556b;font-size:20px;line-height:1}
.pf-viewer-stage{overflow:auto;max-height:calc(100dvh - 120px);overscroll-behavior:contain;scrollbar-color:#9ebbd3 #f2f7fc}
.pf-viewer-stage img{display:block;width:100%;height:auto;max-width:none}
.pf-viewer-stage.zoomed img{width:max(100%,1120px)}
.pf-feedback{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:999;background:linear-gradient(135deg,#1b344b,#2570a4);color:#fff;padding:11px 18px;border-radius:10px;box-shadow:0 8px 28px rgba(23,52,78,.28);font:600 12px "Microsoft YaHei",sans-serif;max-width:calc(100% - 30px)}
.pf-feedback[hidden]{display:none}
#portfolioReturn{white-space:nowrap}
.portfolio-shell :focus-visible,.pf-detail :focus-visible,.pf-preview-viewer :focus-visible{outline:2px solid #197bad;outline-offset:3px}

@media(max-width:1320px){
  .pf-categories{grid-template-columns:repeat(4,minmax(0,1fr))}
  .pf-grid-showroom{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pf-grid-directory{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:980px){
  .pf-wrap{padding:12px 18px 24px}
  .pf-header{flex-wrap:wrap}
  .pf-header-tools{order:3;max-width:none;width:100%}
  .pf-grid-showroom{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pf-detail-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .pf-wrap{padding:10px 12px 20px}
  .pf-categories{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pf-grid-showroom,.pf-grid-directory{grid-template-columns:1fr}
  .pf-brand-sub,.pf-result-hint{display:none}
}
@media(prefers-reduced-motion:reduce){.portfolio-shell *,.pf-detail *{transition:none!important;scroll-behavior:auto!important}}

/* === 技术能力筛选条 (#pfTechBar) 与卡片级技术栈 / 3D 架构快切增强 === */
.pf-tech-bar{display:flex;align-items:center;gap:10px;padding:9px 14px;border-radius:12px;background:rgba(255,255,255,.92);border:1px solid #d3e1ec;box-shadow:0 4px 14px rgba(27,52,75,.04);margin-bottom:14px;flex-wrap:wrap}
.pf-tech-bar-label{font-size:11.5px;font-weight:700;color:#224967;white-space:nowrap}
.pf-tech-pills{display:flex;align-items:center;gap:6px;flex-wrap:wrap;flex:1}
.pf-tech-filter-btn{padding:5px 11px;border-radius:99px;border:1px solid #cddde9;background:#f4f8fc;color:#3c5870;font-size:11.5px;font-weight:600;white-space:nowrap;transition:background .15s,border-color .15s,color .15s,transform .15s}
.pf-tech-filter-btn:hover{background:#e7f2fa;border-color:#94bcd8;color:#175b8a;transform:translateY(-1px)}
.pf-tech-filter-btn.active,.pf-tech-filter-btn[aria-pressed="true"]{background:linear-gradient(135deg,#2570a4,#18847b);border-color:transparent;color:#fff;box-shadow:0 3px 10px rgba(23,108,163,.22)}
.pf-booth-port-badge{position:absolute;top:9px;right:9px;padding:2px 7px;border-radius:5px;background:rgba(255,255,255,.92);color:#1d5c87;font:700 10px Consolas,monospace;border:1px solid #c5d8e7;box-shadow:0 2px 6px rgba(15,31,51,.12)}
.pf-booth-stack{display:flex;flex-wrap:wrap;gap:4px;margin-top:9px;padding-top:8px;border-top:1px dashed #e1ebf3}
.pf-booth-stack span{font-size:10.5px;font-weight:600;padding:2px 7px;border-radius:5px;background:#f0f6fb;border:1px solid #d4e2ec;color:#245479}
.pf-booth-actions{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:9px;padding-top:8px;border-top:1px solid #e5eef5}
.pf-ba-detail{font-size:11px;font-weight:600;color:#256390;margin-right:auto}
.pf-ba-3d,.pf-ba-arch{padding:3.5px 8px;border-radius:6px;font-size:10.5px;font-weight:600;border:1px solid #c5daea;background:#f2f8fc;color:#1b5682;transition:background .15s,color .15s,border-color .15s}
.pf-ba-3d:hover{background:#2570a4;border-color:#2570a4;color:#fff}
.pf-ba-arch{background:linear-gradient(135deg,#eef8f6,#e8f4fa);border-color:#a8d5ce;color:#14635c}
.pf-ba-arch:hover{background:linear-gradient(135deg,#18847b,#176ca3);border-color:transparent;color:#fff}
.pf-dir-port{font:600 10.5px Consolas,monospace;color:#176ca3;font-style:normal;margin-left:4px;background:#eef5fb;padding:1px 5px;border-radius:4px}
.pf-detail-port{font:700 11px Consolas,monospace;color:#1d5c87;background:#eef5fb;border:1px solid #cfe0ec;padding:2px 8px;border-radius:6px}