1118 lines
33 KiB
CSS
1118 lines
33 KiB
CSS
.ps-root{
|
|
display:grid;
|
|
gap:20px;
|
|
}
|
|
.ps-head{
|
|
display:flex;
|
|
justify-content:space-between;
|
|
align-items:flex-start;
|
|
gap:16px;
|
|
}
|
|
.ps-head h1{
|
|
margin:4px 0 0;
|
|
font-size:clamp(24px,3vw,38px);
|
|
line-height:1.16;
|
|
letter-spacing:0;
|
|
color:var(--text-strong);
|
|
}
|
|
.ps-head__actions{
|
|
display:flex;
|
|
gap:8px;
|
|
flex-wrap:wrap;
|
|
justify-content:flex-end;
|
|
}
|
|
.ps-error{
|
|
display:flex;
|
|
align-items:center;
|
|
gap:8px;
|
|
padding:12px 14px;
|
|
border:1px solid var(--crit-solid);
|
|
border-radius:var(--radius);
|
|
color:var(--crit-text);
|
|
background:var(--crit-tint);
|
|
}
|
|
.ps-layout{
|
|
display:grid;
|
|
grid-template-columns:minmax(220px,300px) minmax(460px,1fr) minmax(240px,320px);
|
|
gap:16px;
|
|
align-items:start;
|
|
}
|
|
.ps-rail,
|
|
.ps-inspector{
|
|
position:sticky;
|
|
top:76px;
|
|
display:grid;
|
|
gap:14px;
|
|
min-width:0;
|
|
}
|
|
.ps-rail__head,
|
|
.ps-editor__top,
|
|
.ps-workflow,
|
|
.ps-inspector__block{
|
|
border:1px solid var(--border-subtle);
|
|
border-radius:var(--radius);
|
|
background:var(--bg-surface);
|
|
padding:16px;
|
|
box-shadow:var(--shadow-sm);
|
|
}
|
|
.ps-rail__head,
|
|
.ps-editor__top{
|
|
display:flex;
|
|
align-items:flex-start;
|
|
justify-content:space-between;
|
|
gap:12px;
|
|
}
|
|
.ps-rail__head b,
|
|
.ps-editor__top h2{
|
|
display:block;
|
|
margin:4px 0 0;
|
|
color:var(--text-strong);
|
|
}
|
|
.ps-editor__top h2{
|
|
font-size:22px;
|
|
line-height:1.25;
|
|
letter-spacing:0;
|
|
}
|
|
.ps-list,
|
|
.ps-approved,
|
|
.ps-review-cards,
|
|
.ps-check{
|
|
display:grid;
|
|
gap:8px;
|
|
}
|
|
.ps-list-row{
|
|
width:100%;
|
|
display:grid;
|
|
grid-template-columns:42px minmax(0,1fr);
|
|
gap:10px;
|
|
align-items:center;
|
|
padding:10px;
|
|
border:1px solid var(--border-subtle);
|
|
border-radius:var(--radius);
|
|
background:var(--bg-surface);
|
|
color:inherit;
|
|
text-align:left;
|
|
cursor:pointer;
|
|
}
|
|
.ps-list-row:hover,
|
|
.ps-list-row.is-active{
|
|
border-color:var(--accent);
|
|
background:var(--accent-tint);
|
|
}
|
|
.ps-list-row:disabled{
|
|
opacity:.55;
|
|
cursor:not-allowed;
|
|
}
|
|
.ps-list-row__code{
|
|
display:grid;
|
|
place-items:center;
|
|
min-width:38px;
|
|
min-height:34px;
|
|
border:1px solid var(--hair);
|
|
border-radius:var(--radius-sm);
|
|
color:var(--accent-deep);
|
|
background:var(--bg-surface-2);
|
|
font-weight:760;
|
|
font-family:var(--font-num);
|
|
}
|
|
.ps-list-row__body{
|
|
min-width:0;
|
|
}
|
|
.ps-list-row__body b,
|
|
.ps-list-row__body small{
|
|
display:block;
|
|
overflow:hidden;
|
|
text-overflow:ellipsis;
|
|
white-space:nowrap;
|
|
}
|
|
.ps-list-row__body small,
|
|
.ps-muted,
|
|
.ps-approved-row span,
|
|
.ps-review span{
|
|
color:var(--text-muted);
|
|
font-size:var(--fs-xs);
|
|
}
|
|
.ps-approved{
|
|
padding:14px;
|
|
border:1px solid var(--border-subtle);
|
|
border-radius:var(--radius);
|
|
background:var(--bg-surface);
|
|
}
|
|
.ps-workflow{
|
|
display:grid;
|
|
gap:10px;
|
|
}
|
|
.ps-workflow-step{
|
|
display:grid;
|
|
grid-template-columns:30px minmax(0,1fr);
|
|
align-items:center;
|
|
gap:10px;
|
|
padding:10px;
|
|
border:1px solid var(--hair);
|
|
border-radius:var(--radius-sm);
|
|
background:var(--bg-surface-2);
|
|
color:var(--text-muted);
|
|
}
|
|
.ps-workflow-step > span{
|
|
display:grid;
|
|
place-items:center;
|
|
width:30px;
|
|
height:30px;
|
|
border:1px solid var(--border-subtle);
|
|
border-radius:50%;
|
|
background:var(--bg-surface);
|
|
color:var(--text-muted);
|
|
font-family:var(--font-num);
|
|
font-weight:760;
|
|
}
|
|
.ps-workflow-step b,
|
|
.ps-workflow-step small{
|
|
display:block;
|
|
overflow:hidden;
|
|
text-overflow:ellipsis;
|
|
white-space:nowrap;
|
|
}
|
|
.ps-workflow-step b{
|
|
color:var(--text-strong);
|
|
font-size:var(--fs-sm);
|
|
}
|
|
.ps-workflow-step small{
|
|
margin-top:2px;
|
|
font-size:11px;
|
|
}
|
|
.ps-workflow-step.is-current{
|
|
border-color:var(--accent);
|
|
background:var(--accent-tint);
|
|
color:var(--accent-deep);
|
|
}
|
|
.ps-workflow-step.is-current > span,
|
|
.ps-workflow-step.is-done > span{
|
|
border-color:var(--accent);
|
|
background:var(--accent);
|
|
color:var(--text-on-accent);
|
|
}
|
|
.ps-approved-row{
|
|
display:grid;
|
|
grid-template-columns:38px minmax(0,1fr);
|
|
gap:8px 10px;
|
|
align-items:center;
|
|
padding:8px 0;
|
|
border-top:1px solid var(--hair);
|
|
}
|
|
.ps-approved-row:first-of-type{border-top:0;}
|
|
.ps-approved-row__code{
|
|
font-family:var(--font-num);
|
|
font-size:var(--fs-xs);
|
|
color:var(--text-muted);
|
|
}
|
|
.ps-approved-row__body{
|
|
min-width:0;
|
|
display:grid;
|
|
gap:2px;
|
|
}
|
|
.ps-approved-row b{
|
|
min-width:0;
|
|
overflow:hidden;
|
|
text-overflow:ellipsis;
|
|
white-space:nowrap;
|
|
font-size:var(--fs-xs);
|
|
}
|
|
.ps-approved-row small{
|
|
min-width:0;
|
|
overflow:hidden;
|
|
text-overflow:ellipsis;
|
|
white-space:nowrap;
|
|
color:var(--text-muted);
|
|
font-size:11px;
|
|
}
|
|
.ps-approved-row__actions{
|
|
grid-column:1 / -1;
|
|
display:grid;
|
|
grid-template-columns:repeat(2,minmax(0,1fr));
|
|
gap:6px;
|
|
}
|
|
.ps-approved-row__actions .vg-btn{
|
|
width:100%;
|
|
}
|
|
.ps-editor{
|
|
display:grid;
|
|
gap:14px;
|
|
min-width:0;
|
|
}
|
|
.ps-source-panel{
|
|
display:grid;
|
|
gap:12px;
|
|
padding:16px;
|
|
}
|
|
.ps-source-panel__head,
|
|
.ps-source-panel__actions{
|
|
display:flex;
|
|
align-items:flex-start;
|
|
justify-content:space-between;
|
|
gap:12px;
|
|
}
|
|
.ps-source-panel__head b{
|
|
display:block;
|
|
margin-top:4px;
|
|
color:var(--text-strong);
|
|
font-size:var(--fs-body);
|
|
}
|
|
.ps-source-grid{
|
|
display:grid;
|
|
grid-template-columns:minmax(220px,.42fr) minmax(280px,.58fr);
|
|
gap:12px;
|
|
}
|
|
.ps-source-grid .ps-field--wide{
|
|
grid-column:1 / -1;
|
|
}
|
|
.ps-upload-card{
|
|
display:grid;
|
|
grid-template-columns:minmax(0,1fr) auto;
|
|
align-items:center;
|
|
gap:14px;
|
|
padding:16px;
|
|
border:1px dashed var(--accent);
|
|
border-radius:var(--radius);
|
|
background:var(--accent-tint);
|
|
}
|
|
.ps-upload-card b,
|
|
.ps-upload-card span{
|
|
display:block;
|
|
}
|
|
.ps-upload-card b{
|
|
margin-top:5px;
|
|
color:var(--text-strong);
|
|
overflow:hidden;
|
|
text-overflow:ellipsis;
|
|
white-space:nowrap;
|
|
}
|
|
.ps-upload-card span{
|
|
margin-top:4px;
|
|
color:var(--text-muted);
|
|
font-size:var(--fs-xs);
|
|
line-height:1.45;
|
|
}
|
|
.ps-file-input{
|
|
display:none;
|
|
}
|
|
.ps-source-panel__actions span{
|
|
min-width:0;
|
|
color:var(--text-muted);
|
|
font-size:var(--fs-xs);
|
|
line-height:1.45;
|
|
}
|
|
.ps-tabs,
|
|
.ps-segments{
|
|
display:flex;
|
|
flex-wrap:wrap;
|
|
gap:6px;
|
|
}
|
|
.ps-tabs button,
|
|
.ps-segments button{
|
|
min-height:34px;
|
|
padding:0 12px;
|
|
border:1px solid var(--border-subtle);
|
|
border-radius:var(--radius-sm);
|
|
background:var(--bg-surface);
|
|
color:var(--text-body);
|
|
font-weight:700;
|
|
cursor:pointer;
|
|
}
|
|
.ps-tabs button.is-active,
|
|
.ps-segments button.is-active{
|
|
border-color:var(--accent);
|
|
color:var(--accent-deep);
|
|
background:var(--accent-tint);
|
|
}
|
|
.ps-edit-panel{
|
|
padding:0;
|
|
overflow:hidden;
|
|
}
|
|
.ps-guidance{
|
|
display:grid;
|
|
grid-template-columns:minmax(0,.95fr) minmax(260px,.75fr);
|
|
gap:16px;
|
|
padding:16px;
|
|
border-bottom:1px solid var(--hair);
|
|
background:var(--bg-surface-2);
|
|
}
|
|
.ps-guidance b{
|
|
display:block;
|
|
margin-top:5px;
|
|
color:var(--text-strong);
|
|
line-height:1.35;
|
|
}
|
|
.ps-guidance p{
|
|
margin:6px 0 0;
|
|
color:var(--text-muted);
|
|
font-size:var(--fs-xs);
|
|
line-height:1.5;
|
|
}
|
|
.ps-guidance ul{
|
|
display:grid;
|
|
gap:7px;
|
|
margin:0;
|
|
padding:0;
|
|
list-style:none;
|
|
}
|
|
.ps-guidance li{
|
|
display:grid;
|
|
grid-template-columns:8px minmax(0,1fr);
|
|
align-items:start;
|
|
gap:8px;
|
|
color:var(--text-body);
|
|
font-size:var(--fs-xs);
|
|
line-height:1.45;
|
|
}
|
|
.ps-guidance li::before{
|
|
content:"";
|
|
width:6px;
|
|
height:6px;
|
|
margin-top:.55em;
|
|
border-radius:50%;
|
|
background:var(--accent);
|
|
}
|
|
.ps-form-grid{
|
|
display:grid;
|
|
grid-template-columns:repeat(2,minmax(0,1fr));
|
|
gap:14px;
|
|
padding:16px;
|
|
}
|
|
.ps-number-grid{
|
|
display:grid;
|
|
grid-template-columns:repeat(4,minmax(0,1fr));
|
|
gap:10px;
|
|
padding:16px;
|
|
}
|
|
.ps-field,
|
|
.ps-numfield{
|
|
display:grid;
|
|
gap:7px;
|
|
min-width:0;
|
|
}
|
|
.ps-list-field{
|
|
display:grid;
|
|
gap:9px;
|
|
min-width:0;
|
|
}
|
|
.ps-field--wide{
|
|
grid-column:1 / -1;
|
|
}
|
|
.ps-field span,
|
|
.ps-numfield span,
|
|
.ps-list-field__head span{
|
|
color:var(--text-muted);
|
|
font-size:var(--fs-xs);
|
|
font-weight:760;
|
|
}
|
|
.ps-list-field__head{
|
|
display:flex;
|
|
align-items:center;
|
|
justify-content:space-between;
|
|
gap:10px;
|
|
min-width:0;
|
|
}
|
|
.ps-list-field__rows{
|
|
display:grid;
|
|
gap:8px;
|
|
}
|
|
.ps-list-item{
|
|
display:grid;
|
|
grid-template-columns:minmax(0,1fr) 34px;
|
|
align-items:start;
|
|
gap:8px;
|
|
}
|
|
.ps-field input,
|
|
.ps-field select,
|
|
.ps-field textarea,
|
|
.ps-list-item textarea,
|
|
.ps-numfield input{
|
|
width:100%;
|
|
border:1px solid var(--border-subtle);
|
|
border-radius:var(--radius-sm);
|
|
background:var(--bg-surface);
|
|
color:var(--text-body);
|
|
font:inherit;
|
|
}
|
|
.ps-field input,
|
|
.ps-field select,
|
|
.ps-numfield input{
|
|
min-height:38px;
|
|
padding:0 10px;
|
|
}
|
|
.ps-field textarea,
|
|
.ps-list-item textarea{
|
|
min-height:92px;
|
|
resize:vertical;
|
|
padding:10px;
|
|
line-height:1.55;
|
|
}
|
|
.ps-list-item textarea{
|
|
min-height:44px;
|
|
}
|
|
.ps-list-item__remove{
|
|
display:grid;
|
|
place-items:center;
|
|
width:34px;
|
|
height:34px;
|
|
border:1px solid var(--border-subtle);
|
|
border-radius:var(--radius-sm);
|
|
background:var(--bg-surface);
|
|
color:var(--text-muted);
|
|
cursor:pointer;
|
|
}
|
|
.ps-list-item__remove:hover{
|
|
color:var(--danger);
|
|
border-color:var(--danger);
|
|
}
|
|
.ps-field input:focus,
|
|
.ps-field select:focus,
|
|
.ps-field textarea:focus,
|
|
.ps-list-item textarea:focus,
|
|
.ps-numfield input:focus{
|
|
outline:2px solid var(--accent);
|
|
outline-offset:1px;
|
|
border-color:var(--accent);
|
|
}
|
|
.ps-prompt{
|
|
padding:16px;
|
|
display:grid;
|
|
gap:12px;
|
|
}
|
|
.ps-prompt-section{
|
|
display:grid;
|
|
gap:10px;
|
|
padding:14px;
|
|
border:1px solid var(--border-subtle);
|
|
border-radius:var(--radius-sm);
|
|
background:var(--bg-surface);
|
|
}
|
|
.ps-prompt-section__head{
|
|
display:grid;
|
|
gap:4px;
|
|
}
|
|
.ps-prompt-section__head h3{
|
|
margin:0;
|
|
color:var(--text-heading);
|
|
font-size:var(--fs-md);
|
|
line-height:1.25;
|
|
}
|
|
.ps-prompt-section__head p,
|
|
.ps-prompt-body,
|
|
.ps-prompt-empty{
|
|
margin:0;
|
|
color:var(--text-muted);
|
|
font-size:var(--fs-sm);
|
|
line-height:1.55;
|
|
}
|
|
.ps-prompt-rows{
|
|
display:grid;
|
|
gap:7px;
|
|
margin:0;
|
|
}
|
|
.ps-prompt-row{
|
|
display:grid;
|
|
grid-template-columns:minmax(110px,0.34fr) minmax(0,1fr);
|
|
gap:10px;
|
|
align-items:start;
|
|
padding:8px 0;
|
|
border-top:1px solid var(--border-faint);
|
|
}
|
|
.ps-prompt-row dt{
|
|
color:var(--text-muted);
|
|
font-size:var(--fs-xs);
|
|
font-weight:760;
|
|
}
|
|
.ps-prompt-row dd{
|
|
margin:0;
|
|
color:var(--text-body);
|
|
font-size:var(--fs-sm);
|
|
line-height:1.55;
|
|
white-space:pre-wrap;
|
|
overflow-wrap:anywhere;
|
|
}
|
|
.ps-prompt-list{
|
|
display:grid;
|
|
gap:6px;
|
|
margin:0;
|
|
padding-left:18px;
|
|
color:var(--text-body);
|
|
font-size:var(--fs-sm);
|
|
line-height:1.5;
|
|
}
|
|
.ps-prompt-list li{
|
|
overflow-wrap:anywhere;
|
|
}
|
|
.ps-actions{
|
|
display:flex;
|
|
justify-content:flex-end;
|
|
gap:8px;
|
|
}
|
|
.ps-status{
|
|
margin:0;
|
|
padding:10px 12px;
|
|
border:1px solid var(--accent);
|
|
border-radius:var(--radius-sm);
|
|
color:var(--accent-deep);
|
|
background:var(--accent-tint);
|
|
font-size:var(--fs-sm);
|
|
font-weight:700;
|
|
}
|
|
.ps-status.is-error{
|
|
border-color:var(--crit-solid);
|
|
color:var(--crit-text);
|
|
background:var(--crit-tint);
|
|
}
|
|
.ps-check-row{
|
|
display:grid;
|
|
grid-template-columns:12px minmax(0,1fr);
|
|
gap:8px;
|
|
align-items:center;
|
|
min-height:20px;
|
|
font-size:var(--fs-xs);
|
|
line-height:1.45;
|
|
color:var(--text-body);
|
|
}
|
|
.ps-check-row .vg-dot{
|
|
justify-self:center;
|
|
align-self:center;
|
|
}
|
|
.ps-check-row--stack{
|
|
align-items:start;
|
|
}
|
|
.ps-check-row--stack .vg-dot{
|
|
margin-top:5px;
|
|
}
|
|
.ps-check-row--stack span{
|
|
display:grid;
|
|
gap:2px;
|
|
}
|
|
.ps-check-row--stack b{
|
|
color:var(--text-strong);
|
|
font-size:var(--fs-xs);
|
|
}
|
|
.ps-check-row--stack small{
|
|
color:var(--text-muted);
|
|
font-size:11px;
|
|
overflow-wrap:anywhere;
|
|
}
|
|
.ps-evidence{
|
|
display:grid;
|
|
gap:5px;
|
|
padding:9px;
|
|
border:1px solid var(--hair);
|
|
border-radius:var(--radius-sm);
|
|
background:var(--bg-surface-2);
|
|
color:var(--text-muted);
|
|
font-size:11px;
|
|
line-height:1.45;
|
|
}
|
|
.ps-evidence b{
|
|
color:var(--accent-deep);
|
|
font-family:var(--font-num);
|
|
}
|
|
.ps-review{
|
|
display:grid;
|
|
gap:8px;
|
|
padding:10px;
|
|
border:1px solid var(--border-subtle);
|
|
border-radius:var(--radius);
|
|
background:var(--bg-surface);
|
|
}
|
|
.ps-review > div:first-child{
|
|
display:flex;
|
|
align-items:center;
|
|
justify-content:space-between;
|
|
gap:8px;
|
|
}
|
|
.ps-review__actions{
|
|
display:grid;
|
|
grid-template-columns:repeat(3,minmax(0,1fr));
|
|
gap:6px;
|
|
}
|
|
.ps-review__actions .vg-btn{
|
|
width:100%;
|
|
}
|
|
.ps-empty{
|
|
display:grid;
|
|
gap:4px;
|
|
padding:14px;
|
|
border:1px dashed var(--border-subtle);
|
|
border-radius:var(--radius);
|
|
color:var(--text-muted);
|
|
background:var(--bg-surface-2);
|
|
}
|
|
.ps-empty b{
|
|
color:var(--text-strong);
|
|
}
|
|
@media (max-width:1180px){
|
|
.ps-layout{
|
|
grid-template-columns:minmax(210px,260px) minmax(0,1fr);
|
|
}
|
|
.ps-inspector{
|
|
position:static;
|
|
grid-column:1 / -1;
|
|
grid-template-columns:repeat(2,minmax(0,1fr));
|
|
}
|
|
.ps-source-grid{
|
|
grid-template-columns:1fr;
|
|
}
|
|
.ps-source-panel__actions{
|
|
display:grid;
|
|
}
|
|
}
|
|
@media (max-width:860px){
|
|
.ps-head{
|
|
display:grid;
|
|
}
|
|
.ps-head__actions{
|
|
justify-content:start;
|
|
}
|
|
.ps-layout{
|
|
grid-template-columns:1fr;
|
|
}
|
|
.ps-rail{
|
|
position:static;
|
|
}
|
|
.ps-inspector{
|
|
grid-template-columns:1fr;
|
|
}
|
|
.ps-form-grid,
|
|
.ps-number-grid{
|
|
grid-template-columns:1fr;
|
|
}
|
|
.ps-guidance,
|
|
.ps-upload-card{
|
|
grid-template-columns:1fr;
|
|
}
|
|
}
|
|
|
|
/* 2026-07 persona workspace IA */
|
|
.ps-head > div:first-child{
|
|
min-width:0;
|
|
}
|
|
.ps-head > div:first-child > p{
|
|
margin:8px 0 0;
|
|
max-width:64ch;
|
|
color:var(--text-muted);
|
|
font-size:var(--fs-sm);
|
|
line-height:1.55;
|
|
text-wrap:pretty;
|
|
}
|
|
.ps-workspace-tabs{
|
|
display:grid;
|
|
grid-template-columns:repeat(3,minmax(0,1fr));
|
|
border-bottom:1px solid var(--border-subtle);
|
|
}
|
|
.ps-workspace-tabs button{
|
|
position:relative;
|
|
min-width:0;
|
|
min-height:66px;
|
|
display:grid;
|
|
align-content:center;
|
|
gap:4px;
|
|
padding:10px 18px 14px;
|
|
border:0;
|
|
background:transparent;
|
|
color:var(--text-muted);
|
|
text-align:left;
|
|
cursor:pointer;
|
|
transition:color .2s ease,background .2s ease;
|
|
}
|
|
.ps-workspace-tabs button::after{
|
|
content:"";
|
|
position:absolute;
|
|
right:18px;
|
|
bottom:-1px;
|
|
left:18px;
|
|
height:2px;
|
|
background:transparent;
|
|
transform:scaleX(.35);
|
|
transition:background .2s ease,transform .2s ease;
|
|
}
|
|
.ps-workspace-tabs button:hover{
|
|
color:var(--text-strong);
|
|
background:color-mix(in srgb,var(--bg-surface) 58%,transparent);
|
|
}
|
|
.ps-workspace-tabs button:focus-visible,
|
|
.ps-subtabs button:focus-visible,
|
|
.ps-stepper button:focus-visible,
|
|
.ps-usage-row:focus-visible,
|
|
.ps-persona-row__identity:focus-visible,
|
|
.ps-catalog-list button:focus-visible{
|
|
outline:2px solid var(--focus-ring);
|
|
outline-offset:2px;
|
|
}
|
|
.ps-workspace-tabs button.is-active{
|
|
color:var(--text-strong);
|
|
}
|
|
.ps-workspace-tabs button.is-active::after{
|
|
background:var(--accent);
|
|
transform:scaleX(1);
|
|
}
|
|
.ps-workspace-tabs span{
|
|
font-size:15px;
|
|
font-weight:780;
|
|
}
|
|
.ps-workspace-tabs small{
|
|
overflow:hidden;
|
|
color:var(--text-muted);
|
|
font-size:11px;
|
|
text-overflow:ellipsis;
|
|
white-space:nowrap;
|
|
}
|
|
.ps-overview,
|
|
.ps-catalog-page,
|
|
.ps-personas-page,
|
|
.ps-detail-page{
|
|
min-width:0;
|
|
display:grid;
|
|
gap:18px;
|
|
}
|
|
.ps-inline-note{
|
|
padding:11px 14px;
|
|
border-left:3px solid var(--warn-solid);
|
|
background:var(--warn-tint);
|
|
color:var(--warn-text);
|
|
font-size:var(--fs-sm);
|
|
}
|
|
.ps-kpi-grid{
|
|
display:grid;
|
|
grid-template-columns:repeat(4,minmax(0,1fr));
|
|
border-top:1px solid var(--border-subtle);
|
|
border-bottom:1px solid var(--border-subtle);
|
|
}
|
|
.ps-kpi{
|
|
min-width:0;
|
|
display:grid;
|
|
gap:7px;
|
|
padding:20px 22px 23px;
|
|
border-right:1px solid var(--border-subtle);
|
|
background:color-mix(in srgb,var(--bg-surface) 72%,transparent);
|
|
}
|
|
.ps-kpi:last-child{border-right:0;}
|
|
.ps-kpi > span{
|
|
color:var(--text-muted);
|
|
font-size:var(--fs-xs);
|
|
font-weight:740;
|
|
}
|
|
.ps-kpi > b{
|
|
color:var(--text-strong);
|
|
font-family:var(--font-num);
|
|
font-size:clamp(28px,3vw,42px);
|
|
font-variant-numeric:tabular-nums;
|
|
letter-spacing:-.045em;
|
|
line-height:1;
|
|
}
|
|
.ps-kpi > small{
|
|
overflow:hidden;
|
|
color:var(--text-muted);
|
|
font-size:11px;
|
|
text-overflow:ellipsis;
|
|
white-space:nowrap;
|
|
}
|
|
.ps-dashboard-grid{
|
|
display:grid;
|
|
grid-template-columns:minmax(0,1.2fr) minmax(340px,.8fr);
|
|
gap:14px;
|
|
}
|
|
.ps-performance,
|
|
.ps-review-summary,
|
|
.ps-active-table,
|
|
.ps-catalog-block,
|
|
.ps-detail-primary,
|
|
.ps-detail-facts,
|
|
.ps-detail-wide{
|
|
min-width:0;
|
|
padding:20px;
|
|
border:1px solid var(--border-subtle);
|
|
border-radius:var(--radius);
|
|
background:color-mix(in srgb,var(--bg-surface) 88%,transparent);
|
|
box-shadow:var(--shadow-sm);
|
|
}
|
|
.ps-section-head{
|
|
display:flex;
|
|
align-items:flex-start;
|
|
justify-content:space-between;
|
|
gap:16px;
|
|
}
|
|
.ps-section-head h2{
|
|
margin:5px 0 0;
|
|
color:var(--text-strong);
|
|
font-size:19px;
|
|
line-height:1.3;
|
|
letter-spacing:-.02em;
|
|
}
|
|
.ps-section-head > span{
|
|
color:var(--text-muted);
|
|
font-size:11px;
|
|
}
|
|
.ps-performance__metrics{
|
|
display:grid;
|
|
grid-template-columns:repeat(2,minmax(0,1fr));
|
|
gap:28px;
|
|
margin-top:28px;
|
|
}
|
|
.ps-performance__metrics > div{
|
|
display:grid;
|
|
grid-template-columns:minmax(0,1fr) auto;
|
|
align-items:end;
|
|
gap:8px 12px;
|
|
}
|
|
.ps-performance__metrics span{
|
|
color:var(--text-muted);
|
|
font-size:var(--fs-xs);
|
|
font-weight:730;
|
|
}
|
|
.ps-performance__metrics b{
|
|
color:var(--text-strong);
|
|
font-family:var(--font-num);
|
|
font-size:24px;
|
|
font-variant-numeric:tabular-nums;
|
|
}
|
|
.ps-performance__metrics i,
|
|
.ps-distribution i{
|
|
grid-column:1 / -1;
|
|
height:5px;
|
|
overflow:hidden;
|
|
border-radius:5px;
|
|
background:var(--bg-surface-2);
|
|
}
|
|
.ps-performance__metrics i span,
|
|
.ps-distribution i span{
|
|
display:block;
|
|
height:100%;
|
|
border-radius:inherit;
|
|
background:var(--accent);
|
|
}
|
|
.ps-performance > p{
|
|
margin:22px 0 0;
|
|
max-width:68ch;
|
|
color:var(--text-muted);
|
|
font-size:11px;
|
|
line-height:1.55;
|
|
}
|
|
.ps-review-summary__grid{
|
|
display:grid;
|
|
grid-template-columns:repeat(3,minmax(0,1fr));
|
|
margin-top:22px;
|
|
border-top:1px solid var(--border-subtle);
|
|
}
|
|
.ps-review-summary__grid > div{
|
|
min-width:0;
|
|
display:grid;
|
|
gap:5px;
|
|
padding:18px 14px 4px;
|
|
border-right:1px solid var(--border-subtle);
|
|
}
|
|
.ps-review-summary__grid > div:first-child{padding-left:0;}
|
|
.ps-review-summary__grid > div:last-child{border-right:0;}
|
|
.ps-review-summary__grid span,.ps-review-summary__grid small{color:var(--text-muted);font-size:11px;}
|
|
.ps-review-summary__grid b{color:var(--text-strong);font-family:var(--font-num);font-size:28px;}
|
|
.ps-active-table{padding:0;overflow:hidden;}
|
|
.ps-active-table > .ps-section-head{padding:18px 20px;}
|
|
.ps-usage-table{border-top:1px solid var(--border-subtle);}
|
|
.ps-usage-table__head,
|
|
.ps-usage-row{
|
|
display:grid;
|
|
grid-template-columns:minmax(260px,1.4fr) repeat(4,minmax(90px,.45fr));
|
|
gap:12px;
|
|
align-items:center;
|
|
}
|
|
.ps-usage-table__head{
|
|
padding:9px 16px;
|
|
color:var(--text-muted);
|
|
background:var(--bg-surface-2);
|
|
font-size:10px;
|
|
font-weight:780;
|
|
}
|
|
.ps-usage-row{
|
|
width:100%;
|
|
min-height:58px;
|
|
padding:9px 16px;
|
|
border:0;
|
|
border-top:1px solid var(--border-faint);
|
|
background:transparent;
|
|
color:var(--text-body);
|
|
text-align:left;
|
|
cursor:pointer;
|
|
}
|
|
.ps-usage-row:hover{background:var(--bg-surface-2);}
|
|
.ps-usage-row > span{min-width:0;display:grid;gap:2px;}
|
|
.ps-usage-row b{color:var(--accent-deep);font-family:var(--font-num);font-size:11px;}
|
|
.ps-usage-row small{overflow:hidden;color:var(--text-body);font-weight:700;text-overflow:ellipsis;white-space:nowrap;}
|
|
.ps-usage-row strong{color:var(--text-body);font-family:var(--font-num);font-size:12px;font-variant-numeric:tabular-nums;}
|
|
.ps-catalog-hero{
|
|
display:grid;
|
|
grid-template-columns:minmax(0,1fr) minmax(190px,.28fr);
|
|
gap:32px;
|
|
align-items:end;
|
|
padding:28px 30px;
|
|
border-top:1px solid var(--border-strong);
|
|
border-bottom:1px solid var(--border-strong);
|
|
background:color-mix(in srgb,var(--bg-surface) 74%,transparent);
|
|
}
|
|
.ps-catalog-hero h2{margin:8px 0 0;max-width:28ch;color:var(--text-strong);font-size:clamp(24px,3vw,38px);line-height:1.16;letter-spacing:-.035em;text-wrap:balance;}
|
|
.ps-catalog-hero p{margin:12px 0 0;max-width:62ch;color:var(--text-muted);font-size:var(--fs-sm);line-height:1.6;}
|
|
.ps-catalog-hero__count{display:grid;gap:4px;padding-left:24px;border-left:1px solid var(--border-subtle);}
|
|
.ps-catalog-hero__count span,.ps-catalog-hero__count small{color:var(--text-muted);font-size:11px;}
|
|
.ps-catalog-hero__count b{color:var(--text-strong);font-family:var(--font-num);font-size:54px;line-height:1;letter-spacing:-.06em;}
|
|
.ps-catalog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
|
|
.ps-settings-list{display:grid;margin:18px 0 0;}
|
|
.ps-settings-list > div{display:grid;grid-template-columns:minmax(130px,.4fr) minmax(0,1fr);gap:18px;padding:11px 0;border-top:1px solid var(--border-faint);}
|
|
.ps-settings-list dt{color:var(--text-muted);font-size:var(--fs-xs);font-weight:720;}
|
|
.ps-settings-list dd{margin:0;color:var(--text-strong);font-size:var(--fs-sm);text-align:right;overflow-wrap:anywhere;}
|
|
.ps-distribution{display:grid;gap:14px;margin-top:18px;}
|
|
.ps-distribution > div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px 12px;align-items:center;}
|
|
.ps-distribution span{color:var(--text-body);font-size:var(--fs-xs);}
|
|
.ps-distribution b{color:var(--text-strong);font-family:var(--font-num);font-size:12px;}
|
|
.ps-catalog-list{margin-top:16px;border-top:1px solid var(--border-subtle);}
|
|
.ps-catalog-list button{width:100%;display:grid;grid-template-columns:48px minmax(0,1fr) minmax(70px,.25fr) 46px 20px;gap:12px;align-items:center;padding:12px 4px;border:0;border-bottom:1px solid var(--border-faint);background:transparent;color:var(--text-body);text-align:left;cursor:pointer;}
|
|
.ps-catalog-list button:hover{background:var(--bg-surface-2);}
|
|
.ps-catalog-list button > span:nth-child(2){min-width:0;display:grid;gap:3px;}
|
|
.ps-catalog-list button b,.ps-catalog-list button small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
.ps-catalog-list button b{color:var(--text-strong);font-size:var(--fs-sm);}
|
|
.ps-catalog-list button small,.ps-catalog-list button > span:nth-child(3){color:var(--text-muted);font-size:11px;}
|
|
.ps-catalog-list button strong{font-family:var(--font-num);font-size:11px;}
|
|
.ps-code-box{display:grid;place-items:center;width:42px;min-height:34px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-surface-2);color:var(--accent-deep);font-family:var(--font-num);font-size:11px;font-weight:800;}
|
|
.ps-subtabs{display:flex;align-items:center;gap:4px;border-bottom:1px solid var(--border-subtle);}
|
|
.ps-subtabs button{min-height:42px;padding:0 16px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--text-muted);font-size:var(--fs-sm);font-weight:720;cursor:pointer;}
|
|
.ps-subtabs button.is-active{border-bottom-color:var(--accent);color:var(--text-strong);}
|
|
.ps-subtabs button b{margin-left:6px;font-family:var(--font-num);font-size:11px;}
|
|
.ps-table-tools{display:flex;align-items:end;justify-content:space-between;gap:14px;}
|
|
.ps-table-tools label{display:grid;gap:6px;min-width:min(420px,60%);}
|
|
.ps-table-tools label:last-child{min-width:190px;}
|
|
.ps-table-tools label > span{color:var(--text-muted);font-size:11px;font-weight:730;}
|
|
.ps-table-tools input,.ps-table-tools select{width:100%;min-height:40px;padding:0 12px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--bg-surface);color:var(--text-strong);}
|
|
.ps-persona-table{overflow:hidden;border:1px solid var(--border-subtle);border-radius:var(--radius);background:color-mix(in srgb,var(--bg-surface) 88%,transparent);}
|
|
.ps-persona-table__head,.ps-persona-row{display:grid;grid-template-columns:minmax(300px,1.5fr) minmax(135px,.55fr) minmax(100px,.4fr) minmax(110px,.42fr) 54px minmax(190px,.72fr);gap:12px;align-items:center;}
|
|
.ps-persona-table__head{padding:10px 14px;background:var(--bg-surface-2);color:var(--text-muted);font-size:10px;font-weight:780;}
|
|
.ps-persona-row{min-height:70px;padding:10px 14px;border-top:1px solid var(--border-faint);}
|
|
.ps-persona-row:hover{background:color-mix(in srgb,var(--bg-surface-2) 72%,transparent);}
|
|
.ps-persona-row__identity{min-width:0;display:grid;grid-template-columns:44px minmax(0,1fr);gap:11px;align-items:center;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;}
|
|
.ps-persona-row__identity > span:last-child,.ps-persona-row__usage{min-width:0;display:grid;gap:3px;}
|
|
.ps-persona-row__identity b,.ps-persona-row__identity small,.ps-persona-row__usage small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
.ps-persona-row__identity b{color:var(--text-strong);font-size:var(--fs-sm);}
|
|
.ps-persona-row__identity small,.ps-persona-row__usage small{color:var(--text-muted);font-size:11px;}
|
|
.ps-persona-row__usage b{color:var(--text-body);font-family:var(--font-num);font-size:12px;}
|
|
.ps-version{color:var(--text-muted);font-family:var(--font-num);font-size:11px;}
|
|
.ps-persona-row__actions{display:flex;justify-content:flex-end;gap:5px;}
|
|
.ps-review-page{display:grid;gap:16px;}
|
|
.ps-review-page__summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle);}
|
|
.ps-review-page__summary > div{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:16px 20px;border-right:1px solid var(--border-subtle);}
|
|
.ps-review-page__summary > div:last-child{border-right:0;}
|
|
.ps-review-page__summary span{color:var(--text-muted);font-size:var(--fs-xs);font-weight:720;}
|
|
.ps-review-page__summary b{color:var(--text-strong);font-family:var(--font-num);font-size:28px;}
|
|
.ps-review-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
|
|
.ps-review-card{display:grid;gap:12px;padding:18px;border:1px solid var(--border-subtle);border-radius:var(--radius);background:color-mix(in srgb,var(--bg-surface) 88%,transparent);}
|
|
.ps-review-card__top{display:flex;align-items:center;justify-content:space-between;gap:10px;}
|
|
.ps-review-card h3{margin:0;color:var(--text-strong);font-size:17px;}
|
|
.ps-review-card > p{margin:0;color:var(--text-muted);font-size:var(--fs-xs);line-height:1.5;}
|
|
.ps-review-card dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;border-top:1px solid var(--border-faint);}
|
|
.ps-review-card dl > div{display:grid;gap:4px;padding:10px 8px 0;}
|
|
.ps-review-card dt{color:var(--text-muted);font-size:10px;}
|
|
.ps-review-card dd{margin:0;color:var(--text-body);font-size:11px;overflow-wrap:anywhere;}
|
|
.ps-review-card__actions{display:flex;justify-content:flex-end;gap:6px;flex-wrap:wrap;}
|
|
.ps-drill-head{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px;align-items:start;padding:18px 0 20px;border-bottom:1px solid var(--border-subtle);}
|
|
.ps-drill-head h2{margin:5px 0 0;color:var(--text-strong);font-size:clamp(24px,3vw,34px);line-height:1.18;letter-spacing:-.035em;}
|
|
.ps-drill-head p{margin:7px 0 0;color:var(--text-muted);font-size:var(--fs-sm);}
|
|
.ps-drill-head__actions{display:flex;gap:7px;}
|
|
.ps-detail-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:14px;}
|
|
.ps-detail-wide{grid-column:1 / -1;}
|
|
.ps-detail-primary h3{margin:10px 0 0;color:var(--text-strong);font-size:24px;line-height:1.25;}
|
|
.ps-detail-primary > p{margin:14px 0 0;max-width:65ch;color:var(--text-body);font-size:var(--fs-body);line-height:1.7;}
|
|
.ps-chip-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:20px;}
|
|
.ps-chip-row span{padding:5px 8px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-muted);font-size:11px;}
|
|
.ps-detail-facts dl{display:grid;margin:0;}
|
|
.ps-detail-facts dl > div{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-top:1px solid var(--border-faint);}
|
|
.ps-detail-facts dl > div:first-child{border-top:0;}
|
|
.ps-detail-facts dt{color:var(--text-muted);font-size:var(--fs-xs);}
|
|
.ps-detail-facts dd{margin:0;color:var(--text-strong);font-size:var(--fs-xs);font-weight:720;text-align:right;}
|
|
.ps-learning-detail{display:grid;gap:14px;}
|
|
.ps-point-list{display:grid;margin-top:14px;border-top:1px solid var(--border-subtle);}
|
|
.ps-point-list > div{display:grid;grid-template-columns:minmax(0,1fr) 70px 120px;gap:12px;padding:11px 0;border-bottom:1px solid var(--border-faint);color:var(--text-body);font-size:var(--fs-xs);}
|
|
.ps-point-list b{font-family:var(--font-num);font-variant-numeric:tabular-nums;}
|
|
.ps-point-list small{color:var(--text-muted);text-align:right;}
|
|
.ps-stepper{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--border-subtle);border-radius:var(--radius);overflow:hidden;background:color-mix(in srgb,var(--bg-surface) 78%,transparent);}
|
|
.ps-stepper button{min-width:0;display:grid;grid-template-columns:32px minmax(0,1fr);gap:10px;align-items:center;padding:13px 14px;border:0;border-right:1px solid var(--border-subtle);background:transparent;color:var(--text-muted);text-align:left;cursor:pointer;}
|
|
.ps-stepper button:last-child{border-right:0;}
|
|
.ps-stepper button > span:first-child{display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--border-subtle);border-radius:50%;font-family:var(--font-num);font-size:11px;font-weight:800;}
|
|
.ps-stepper button > span:last-child{min-width:0;display:grid;gap:2px;}
|
|
.ps-stepper b,.ps-stepper small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
.ps-stepper b{color:var(--text-strong);font-size:var(--fs-xs);}
|
|
.ps-stepper small{font-size:10px;}
|
|
.ps-stepper button.is-current{background:var(--accent-tint);color:var(--accent-deep);}
|
|
.ps-stepper button.is-current > span:first-child,.ps-stepper button.is-done > span:first-child{border-color:var(--accent);background:var(--accent);color:var(--text-on-accent);}
|
|
.ps-authoring-layout{grid-template-columns:minmax(0,1fr) minmax(260px,320px);}
|
|
.ps-authoring-layout > .ps-rail{display:none;}
|
|
.ps-authoring-layout[data-authoring-step="source"] .ps-tabs,
|
|
.ps-authoring-layout[data-authoring-step="source"] .ps-edit-panel,
|
|
.ps-authoring-layout[data-authoring-step="generate"] .ps-tabs,
|
|
.ps-authoring-layout[data-authoring-step="generate"] .ps-edit-panel,
|
|
.ps-authoring-layout[data-authoring-step="edit"] .ps-source-panel,
|
|
.ps-authoring-layout[data-authoring-step="review"] .ps-source-panel{display:none;}
|
|
.ps-authoring-layout[data-authoring-step="source"] .ps-inspector__block:nth-child(n+2),
|
|
.ps-authoring-layout[data-authoring-step="generate"] .ps-inspector__block:nth-child(3){display:none;}
|
|
.ps-authoring-layout .ps-actions{padding-top:4px;}
|
|
|
|
@media (max-width:1180px){
|
|
.ps-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
|
|
.ps-kpi:nth-child(2){border-right:0;}
|
|
.ps-kpi:nth-child(-n+2){border-bottom:1px solid var(--border-subtle);}
|
|
.ps-dashboard-grid,.ps-catalog-grid{grid-template-columns:1fr;}
|
|
.ps-persona-table{overflow-x:auto;}
|
|
.ps-persona-table__head,.ps-persona-row{min-width:980px;}
|
|
.ps-authoring-layout{grid-template-columns:1fr;}
|
|
.ps-authoring-layout .ps-inspector{grid-column:auto;grid-template-columns:repeat(2,minmax(0,1fr));}
|
|
}
|
|
@media (max-width:760px){
|
|
.ps-workspace-tabs button{min-height:52px;padding:8px 10px 11px;text-align:center;}
|
|
.ps-workspace-tabs button::after{right:8px;left:8px;}
|
|
.ps-workspace-tabs small{display:none;}
|
|
.ps-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
|
|
.ps-kpi{padding:15px 14px 17px;}
|
|
.ps-kpi > b{font-size:30px;}
|
|
.ps-performance__metrics{grid-template-columns:1fr;gap:18px;}
|
|
.ps-review-summary__grid{grid-template-columns:1fr;}
|
|
.ps-review-summary__grid > div{padding:12px 0;border-right:0;border-bottom:1px solid var(--border-faint);}
|
|
.ps-usage-table__head{display:none;}
|
|
.ps-usage-row{grid-template-columns:minmax(0,1fr) repeat(2,58px);gap:8px;}
|
|
.ps-usage-row strong:nth-last-child(-n+2){display:none;}
|
|
.ps-catalog-hero{grid-template-columns:1fr;padding:22px 18px;}
|
|
.ps-catalog-hero__count{padding:16px 0 0;border-top:1px solid var(--border-subtle);border-left:0;}
|
|
.ps-catalog-list button{grid-template-columns:44px minmax(0,1fr) 42px 18px;}
|
|
.ps-catalog-list button > span:nth-child(3){display:none;}
|
|
.ps-table-tools{display:grid;}
|
|
.ps-table-tools label,.ps-table-tools label:last-child{min-width:0;width:100%;}
|
|
.ps-persona-table{overflow:visible;}
|
|
.ps-persona-table__head{display:none;}
|
|
.ps-persona-row{
|
|
min-width:0;
|
|
grid-template-columns:minmax(0,1fr) auto;
|
|
gap:10px 12px;
|
|
align-items:center;
|
|
padding:14px;
|
|
}
|
|
.ps-persona-row__identity{grid-column:1 / -1;}
|
|
.ps-persona-row__usage{grid-column:1 / -1;padding:9px 0;border-top:1px solid var(--border-faint);border-bottom:1px solid var(--border-faint);}
|
|
.ps-persona-row > span:nth-child(3),
|
|
.ps-persona-row > span:nth-child(4){justify-self:start;}
|
|
.ps-version{justify-self:end;}
|
|
.ps-persona-row__actions{grid-column:1 / -1;justify-content:stretch;}
|
|
.ps-persona-row__actions .vg-btn{flex:1 1 0;}
|
|
.ps-review-page__summary{grid-template-columns:1fr;}
|
|
.ps-review-page__summary > div{border-right:0;border-bottom:1px solid var(--border-faint);}
|
|
.ps-review-board{grid-template-columns:1fr;}
|
|
.ps-drill-head{grid-template-columns:1fr;}
|
|
.ps-drill-head__actions{justify-content:flex-start;}
|
|
.ps-detail-grid{grid-template-columns:1fr;}
|
|
.ps-detail-wide{grid-column:auto;}
|
|
.ps-stepper{grid-template-columns:repeat(4,minmax(54px,1fr));overflow-x:auto;}
|
|
.ps-stepper button{grid-template-columns:1fr;justify-items:center;padding:10px 7px;text-align:center;}
|
|
.ps-stepper button > span:last-child small{display:none;}
|
|
.ps-authoring-layout .ps-inspector{grid-template-columns:1fr;}
|
|
.ps-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));}
|
|
.ps-actions .vg-btn{width:100%;}
|
|
.ps-point-list > div{grid-template-columns:minmax(0,1fr) 64px;}
|
|
.ps-point-list small{grid-column:1 / -1;text-align:left;}
|
|
}
|