89 lines
11 KiB
CSS
89 lines
11 KiB
CSS
.ps5-native-package-dialog {
|
|
background: radial-gradient(circle at 82% 8%, rgba(93, 214, 255, .12), transparent 32%), radial-gradient(circle at 8% 88%, rgba(154, 124, 255, .12), transparent 30%), linear-gradient(145deg, rgba(17, 22, 34, .99), rgba(10, 11, 19, .99));
|
|
border-color: rgba(93, 214, 255, .25);
|
|
}
|
|
.ps5-native-package-emblem { border-color: rgba(154, 124, 255, .62); box-shadow: 0 0 28px rgba(154, 124, 255, .2), inset 0 0 18px rgba(93, 214, 255, .08); }
|
|
.ps5-native-package-emblem i { border-color: rgba(93, 214, 255, .62); }
|
|
.ps5-native-truthbar { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center; padding: 12px 14px; margin-bottom: 16px; border: 1px solid rgba(93, 214, 255, .22); border-radius:12px; background: linear-gradient(90deg, rgba(93, 214, 255, .1), rgba(154, 124, 255, .08)); color: var(--text-dim); font-size:12px; }
|
|
.ps5-native-truthbar strong { color: #d8f6ff; letter-spacing: .04em; text-transform: uppercase; }
|
|
.ps5-native-settings-card { position: relative; overflow: hidden; }
|
|
.ps5-native-settings-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: linear-gradient(#5dd6ff, #9a7cff); }
|
|
.ps5-native-settings-truth { margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(154, 124, 255, .14); }
|
|
.ps5-fpkg-phasebar { grid-template-columns: repeat(6, minmax(0, 1fr)); }
|
|
.ps5-fpkg-evidence-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 0 18px; }
|
|
.ps5-fpkg-evidence-grid article { display: grid; gap: 7px; min-width: 0; padding: 13px 14px; border: 1px solid rgba(255,255,255,.09); border-radius: 13px; background: rgba(4,8,16,.34); }
|
|
.ps5-fpkg-evidence-grid small { color: var(--text-dim); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
|
|
.ps5-fpkg-evidence-grid strong { overflow-wrap: anywhere; color: #cbd5e6; font-size: 12px; line-height: 1.45; }
|
|
.ps5-fpkg-evidence-grid strong[data-state="safe"], .ps5-fpkg-evidence-grid strong[data-state="ready"], .ps5-fpkg-evidence-grid strong[data-state="qualified"] { color: #64e6bd; }
|
|
.ps5-fpkg-evidence-grid strong[data-state="pending"], .ps5-fpkg-evidence-grid strong[data-state="running"] { color: #8ce9ff; }
|
|
.ps5-fpkg-evidence-grid strong[data-state="blocked"], .ps5-fpkg-evidence-grid strong[data-state="failed"] { color: #ff9da7; }
|
|
.ps5-staging-workflow { position: relative; display: grid; grid-template-columns: minmax(230px, .8fr) minmax(300px, 1.2fr); gap: 18px 24px; padding: 20px; margin: 0 0 18px; overflow: hidden; border: 1px solid rgba(154, 124, 255, .24); border-radius:16px; background: linear-gradient(125deg, rgba(30, 39, 61, .86), rgba(13, 16, 28, .92)); box-shadow: inset 0 1px rgba(255,255,255,.04), 0 18px 55px rgba(0,0,0,.18); }
|
|
.ps5-staging-workflow::after { content: ""; position: absolute; width: 260px; height: 260px; right: -120px; top: -150px; border-radius: 50%; background: rgba(93, 214, 255, .07); filter: blur(3px); pointer-events: none; }
|
|
.ps5-staging-copy { position: relative; z-index: 1; }
|
|
.ps5-staging-copy h4 { margin: 5px 0 7px; color: #eefaff; }
|
|
.ps5-staging-copy p, .ps5-staging-limit { margin: 0; color: var(--text-dim); font-size:12px; line-height: 1.55; }
|
|
.ps5-staging-illustration { display: flex; align-items: center; min-height: 76px; padding: 8px 0; }
|
|
.ps5-stage-node { position: relative; display: grid; flex: 0 0 58px; height: 58px; place-items: center; border: 1px solid rgba(93,214,255,.38); border-radius:17px; background: radial-gradient(circle at 35% 25%, rgba(93,214,255,.2), rgba(12,18,31,.95)); box-shadow: 0 0 26px rgba(93,214,255,.11), inset 0 1px rgba(255,255,255,.08); }
|
|
.ps5-stage-node.vault { border-color: rgba(154,124,255,.52); transform: rotate(45deg); }
|
|
.ps5-stage-node.vault i { transform: rotate(-45deg); }
|
|
.ps5-stage-node.package { border-color: rgba(73,226,179,.45); }
|
|
.ps5-stage-node i { font: 700 11px/1 var(--font-mono, monospace); color: #d9f8ff; letter-spacing: .08em; font-style: normal; }
|
|
.ps5-stage-track { position: relative; flex: 1; height: 1px; overflow: visible; background: linear-gradient(90deg, rgba(93,214,255,.28), rgba(154,124,255,.5)); }
|
|
.ps5-stage-track.build { background: linear-gradient(90deg, rgba(154,124,255,.5), rgba(73,226,179,.35)); }
|
|
.ps5-stage-track i { position: absolute; width: 7px; height: 7px; top: -3px; border-radius: 50%; background: #8ce9ff; box-shadow: 0 0 12px #5dd6ff; animation: ps5-stage-pulse 2.2s ease-in-out infinite; }
|
|
.ps5-stage-track.build i { animation-delay: 1.1s; background: #a994ff; box-shadow: 0 0 12px #9a7cff; }
|
|
@keyframes ps5-stage-pulse { 0% { left: 0; opacity: 0; } 18% { opacity: 1; } 82% { opacity: 1; } 100% { left: calc(100% - 7px); opacity: 0; } }
|
|
.ps5-staging-controls { display: flex; gap: 9px; align-items: center; justify-content: flex-end; z-index: 1; }
|
|
.ps5-staging-components { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 9px; }
|
|
.ps5-staging-component { display: grid; grid-template-columns: auto 1fr auto; gap: 9px; align-items: center; min-width: 0; padding: 11px 12px; border: 1px solid rgba(255,255,255,.09); border-radius:12px; background: rgba(4,8,16,.34); }
|
|
.ps5-staging-component input { accent-color: #7cddff; }
|
|
.ps5-staging-component > span { display: grid; min-width: 0; gap: 4px; }
|
|
.ps5-staging-component strong { font-size:12px; text-transform: uppercase; letter-spacing: .06em; }
|
|
.ps5-staging-component small { overflow: hidden; color: var(--text-dim); text-overflow: ellipsis; white-space: nowrap; }
|
|
.ps5-staging-component em { padding: 3px 6px; border-radius:99px; background: rgba(93,214,255,.09); color: #bcefff; font-size:11px; font-style: normal; text-transform: uppercase; }
|
|
.ps5-staging-limit { grid-column: 1 / -1; padding-top: 12px; border-top: 1px solid rgba(255,255,255,.07); }
|
|
.ps5-package-comparison { display: grid; gap: 14px; margin: 0 0 18px; padding: 18px; border: 1px solid rgba(154,124,255,.24); border-radius:16px; background: linear-gradient(135deg, rgba(23,29,47,.86), rgba(10,13,23,.94)); }
|
|
.ps5-package-comparison h4 { margin: 5px 0 6px; }
|
|
.ps5-package-comparison p { margin: 0; color: var(--text-dim); font-size:12px; line-height: 1.5; }
|
|
.ps5-package-comparison-controls { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto; gap: 10px; align-items: end; }
|
|
.ps5-package-comparison-controls label { display: grid; min-width: 0; gap: 6px; color: var(--text-dim); font-size:11px; }
|
|
.ps5-package-comparison-controls select { width: 100%; min-width: 0; }
|
|
.ps5-package-comparison-controls .btn { white-space: nowrap; }
|
|
.ps5-package-comparison-result { min-height: 56px; padding: 13px; border: 1px solid rgba(93,214,255,.16); border-radius:12px; background: rgba(4,8,16,.34); }
|
|
.ps5-package-comparison-trust { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: center; margin-bottom: 10px; }
|
|
.ps5-package-comparison-trust span { display: grid; gap: 3px; }
|
|
.ps5-package-comparison-trust span:last-child { text-align: right; }
|
|
.ps5-package-comparison-trust small { color: var(--text-dim); }
|
|
.ps5-package-comparison-trust strong[data-trust="post-scan-proven"] { color: #64e6bd; }
|
|
.ps5-package-comparison-trust strong[data-trust="appinst-rejected"] { color: #ff8f9b; }
|
|
.ps5-package-comparison-result ul { display: grid; gap: 6px; margin: 0 0 10px; padding: 0; list-style: none; }
|
|
.ps5-package-comparison-result li { display: flex; justify-content: space-between; gap: 12px; font-size:11px; }
|
|
.ps5-package-comparison-result li span { color: var(--text-dim); }
|
|
.ps5-upstream-control { position: relative; display: grid; gap: 15px; margin: 0 0 18px; padding: 19px; overflow: hidden; border: 1px solid rgba(73,226,179,.24); border-radius:16px; background: radial-gradient(circle at 92% 5%, rgba(73,226,179,.13), transparent 34%), linear-gradient(135deg, rgba(17,32,40,.88), rgba(9,14,24,.95)); box-shadow: inset 0 1px rgba(255,255,255,.04), 0 16px 48px rgba(0,0,0,.16); }
|
|
.ps5-upstream-control::after { content: "UPSTREAM / STOCK"; position: absolute; right: 18px; top: 17px; color: rgba(157,247,220,.24); font: 700 11px/1 var(--font-mono, monospace); letter-spacing: .14em; pointer-events: none; }
|
|
.ps5-upstream-control-copy { display: flex; gap: 12px; align-items: flex-start; }
|
|
.ps5-upstream-control-copy h4 { margin: 5px 0 6px; color: #ecfff9; }
|
|
.ps5-upstream-control-copy p { max-width: 720px; margin: 0; color: var(--text-dim); font-size:12px; line-height: 1.55; }
|
|
.ps5-upstream-control-proof { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
|
|
.ps5-upstream-control-proof span { display: grid; gap: 4px; padding: 11px 12px; border: 1px solid rgba(73,226,179,.13); border-radius:12px; background: rgba(3,12,17,.38); }
|
|
.ps5-upstream-control-proof small { color: var(--text-dim); font-size:11px; letter-spacing: .08em; text-transform: uppercase; }
|
|
.ps5-upstream-control-proof strong { overflow: hidden; color: #dffbf3; font: 600 11px/1.3 var(--font-mono, monospace); text-overflow: ellipsis; white-space: nowrap; }
|
|
.ps5-upstream-control-proof strong[data-trust="post-scan-proven"] { color: #64e6bd; }
|
|
.ps5-upstream-control-status { min-height: 20px; color: #bceee0; font-size:11px; }
|
|
.ps5-upstream-control-actions { display: flex; flex-wrap: wrap; gap: 9px; }
|
|
.ps5-p15-r2-qualification::after { content: "R4 / READ ONLY"; }
|
|
.ps5-p15-r2-matrix { width: 100%; border-collapse: collapse; color: var(--text-dim); font-size: 11px; }
|
|
.ps5-p15-r2-matrix th, .ps5-p15-r2-matrix td { padding: 7px 9px; border-bottom: 1px solid rgba(73,226,179,.12); text-align: left; }
|
|
.ps5-p15-r2-matrix td[data-result="PASS"] { color: #64e6bd; font-weight: 700; }
|
|
.ps5-p15-r2-matrix td[data-result="FAIL"] { color: #ff8f9b; font-weight: 700; }
|
|
.ps5-p15-r2-kstuff-evidence { display: block; max-width: 72ch; color: inherit; overflow-wrap: anywhere; white-space: normal; }
|
|
.ps5-launch-reference { border-color: rgba(93,214,255,.28); background: radial-gradient(circle at 92% 5%, rgba(93,214,255,.14), transparent 34%), linear-gradient(135deg, rgba(17,27,44,.9), rgba(9,14,24,.95)); }
|
|
.ps5-launch-reference::after { content: "LAUNCH / REFERENCE"; color: rgba(157,225,247,.28); }
|
|
.ps5-launch-reference .ps5-upstream-control-proof span { border-color: rgba(93,214,255,.15); }
|
|
@media (prefers-reduced-motion: reduce) { .ps5-stage-track i { animation: none; left: 50%; } }
|
|
@media (max-width: 760px) { .ps5-staging-workflow { grid-template-columns: 1fr; } .ps5-staging-controls { justify-content: flex-start; } .ps5-staging-components { grid-template-columns: 1fr; } }
|
|
@media (max-width: 760px) { .ps5-package-comparison-controls { grid-template-columns: 1fr; } }
|
|
@media (max-width: 760px) { .ps5-fpkg-phasebar { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ps5-fpkg-evidence-grid { grid-template-columns: 1fr; } }
|
|
@media (max-width: 620px) { .ps5-upstream-control-proof { grid-template-columns: 1fr; } }
|
|
@media (max-width: 620px) { .ps5-native-truthbar { grid-template-columns: 1fr; } }
|