/* The same 402 × 874 device used by the retained chat screen. */
html,body{width:100%;height:100%;min-width:0;overflow:hidden;background:#000000}
body{display:grid;place-items:center}
.device-stage{transform:scale(var(--phone-scale,1))}
.device-phone{position:relative;width:402px;height:874px;padding:5px;border-radius:56px;background:linear-gradient(150deg,#6e6e6e,#2a2a2a 30%,#1c1c1c 55%,#5a5a5a 85%,#262626);box-shadow:0 40px 90px -20px #000000ee}
.device-phone:before,.device-phone:after{content:'';position:absolute;width:3px;background:#484848;border-radius:2px}
.device-phone:before{left:-3px;top:150px;height:62px;box-shadow:0 78px 0 #484848,0 -90px 0 -22px #484848}
.device-phone:after{right:-3px;top:190px;height:90px}
.device-screen{position:relative;width:100%;height:100%;overflow:hidden;border-radius:51px;background:var(--ink)}
.device-island{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:122px;height:36px;border-radius:20px;background:#000000;z-index:20;pointer-events:none}
#app{width:100%;height:100%;min-height:0;max-width:none;margin:0}
.app-header{position:absolute;top:54px;left:0;right:0;height:50px;padding:0 22px}
.wordmark{font-size:21px}.edition{font-size:8px;letter-spacing:1px}.edition b{margin-left:8px}
.view{position:absolute;inset:104px 0 0;max-width:none;width:100%;padding:14px 20px 22px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
.view-heading{min-height:48px}.view-heading h1{font-size:25px}.view-heading>.icon-button{margin-left:-10px}.step{font-size:20px}
.primary{height:52px;font-size:15px}.fine-print{font-size:10px;margin-top:11px}
.intro-view{min-height:0;justify-content:center;padding:20px 25px}
.intro-code{font-size:9px}.intro-copy h1{font-size:34px}.intro-copy>p:last-child{font-size:13px;margin-bottom:26px}
.portal{width:230px;height:210px;margin:20px auto 28px}.portal-frame{width:190px;height:190px}.portal-frame.second{width:225px;height:225px}.portal img{width:172px}.intro-foot{margin-top:28px;font-size:8px}
.selection-note{font-size:12px;margin:10px 0 14px}.starter-deck{height:394px;margin:0 -20px}.starter-card{width:282px;max-width:none}.starter-name{left:19px;bottom:18px}.starter-name strong{font-size:28px}.starter-summary{min-height:50px;margin-bottom:12px}.starter-summary p{font-size:12px}
.archive-toolbar{margin:12px 0;padding-bottom:10px}.archive-toolbar>span:last-child{font-size:10px}.archive-total strong{font-size:30px}.archive-total span{font-size:8px}
.archive-grid{gap:9px}.archive-card{height:173px}.tile-caption{left:8px;bottom:9px}.tile-caption strong{font-size:13px}.tile-caption small{font-size:7px}.archive-card.unrevealed .tile-caption strong{font-size:11px}
.archive-hint{font-size:10px;margin:12px 0}.bottom-nav{margin-top:10px;padding-top:5px}.bottom-nav button{height:44px}
.reveal-view{min-height:0;padding-top:20px}.reveal-view>h1{font-size:20px}.reveal-stage{height:430px}.reveal-art{max-width:260px}.reveal-frame{max-width:284px}.reveal-caption{margin:23px 0}.reveal-caption h2{font-size:32px}
.status{position:absolute;bottom:24px;font-size:12px;width:calc(100% - 40px)}
/* Archive detail occupies the entire device display, including behind its header. */
#app[data-view="detail"] .app-header{display:none}
.detail-view{inset:0;padding:0;overflow:hidden}
.detail-view .view-heading{position:absolute;top:60px;left:22px;right:22px;margin:0;z-index:6;pointer-events:none}
.detail-view .view-heading h1{font-size:18px;text-shadow:0 2px 10px #000000}.detail-view .view-heading .icon-button{pointer-events:auto;background:#1717178c}.detail-view .step{font-size:17px;text-shadow:0 2px 8px #000000}
.detail-deck{position:absolute;inset:0;height:100%;margin:0;perspective:none}
.detail-deck .profile-card{width:100%;max-width:none;height:100%;cursor:grab}
.profile-surface,.profile-art{inset:0;clip-path:none;padding:0;box-shadow:none}
.profile-art>img{object-position:100% center;transform:none;filter:brightness(.92)}
.profile-art:after{background:linear-gradient(180deg,#0d0d0d99,transparent 25%,transparent 46%,#0d0d0d80 74%,#0d0d0d 100%)}
.profile-identity{left:auto;right:20px;top:135px;width:204px;transform:none;transform-origin:right center;background:#191919e6;padding:14px 13px;border-top:3px solid var(--acid);clip-path:var(--cut)}
.profile-identity h2{font-size:29px;margin:6px 0 10px}.profile-identity .eyebrow{font-size:9px}.profile-identity .profile-state{font-size:10px}
.info-panel{top:385px;bottom:auto;right:20px;width:204px;transform:none}
.info-panel .info-band{font-size:10px;padding:9px 11px;letter-spacing:.6px}.info-content{padding:15px 12px;background:#1e1e1ef2}.info-content h3{font-size:16px}.info-content p{font-size:13px;line-height:1.65}.traits span{font-size:10px}.info-footer{font-size:9px}
.profile-strip{top:72%;width:46%}.profile-file{left:22px;bottom:193px;font-size:9px}
.detail-controls{position:absolute;left:20px;right:20px;bottom:126px;margin:0;z-index:5}.detail-controls>span{font-size:10px;color:#f4f4f4}.detail-controls .icon-button{background:#171717b3}
.detail-view>.primary{position:absolute;left:20px;right:20px;bottom:65px;width:calc(100% - 40px);max-width:none;z-index:5}
.detail-lock-note{position:absolute;left:25px;right:25px;bottom:24px;margin:0;font-size:10px;z-index:5;color:#d9d9d9}
.profile-card:focus-visible{outline-offset:-7px}
.stage-art{display:none}
#app{background:#161616}
.primary{background:#ffd600;color:#171717}
.primary:hover:not(:disabled){background:#ffe033;filter:none}
.primary:disabled{background:#303030;color:#b8b8b8}
.info-panel .info-band{background:#ffd600;color:#171717}
.portal-frame,.portal-light{display:none}