:root{--background:#14090E;--surface:#241117;--sin:#B52D4A;--sin-bright:#D13D5D;--virtue:#C8A85C;--virtue-bright:#E1C57A;--text:#F6EDE2;--muted:#C8B8AD;--line:#453139}
body{display:block;background:var(--background);color:var(--text);margin:0}
.app-shell{display:block;max-width:430px;margin:auto;padding:0;min-height:100dvh;background:var(--background)}
#app-nav{display:flex;align-items:center;gap:18px;padding:8px 18px;border-bottom:1px solid #45313944;color:var(--virtue);font-size:12px}
#app-nav button{min-width:44px;min-height:44px;background:none;border:0;font-size:28px;color:var(--text)}
#app-nav[hidden]{display:none}
#screen{overflow:visible;position:relative;min-height:80dvh}
#storage-warning{font-size:11px;line-height:1.8;margin:12px 18px;padding:10px 12px;border:1px solid #C8A85C55;color:var(--muted)}
.app-shell .quiet-progress{height:20px;display:grid;grid-template-columns:repeat(35,1fr);gap:2px;align-items:center;margin:20px 0 24px;padding:0;border:0}
.app-shell .node{display:flex;align-items:center;justify-content:center;width:3px;height:3px;border-radius:50%;background:#453139}
.app-shell .node.done{background:#A97565}
.app-shell .node.current{width:14px;height:14px;background:transparent;transform:none}
.app-shell .node-brand{width:14px;height:14px;filter:drop-shadow(0 0 3px #C8A85C33)}
.app-shell .question-count{display:flex;align-items:baseline;justify-content:space-between;margin-top:24px}
.app-shell .question-count b{font:24px Georgia;color:var(--text)}
.app-shell .question-count small{font-size:14px;color:#9C8A84}
.app-shell .question-count>span{font-size:12px;color:#9C8A84}
.app-shell .personality-option8{display:flex;align-items:center;gap:12px;width:100%;min-height:58px;text-align:left;padding:16px;border:1px solid #2D1A22;border-radius:14px;background:#1A0B11;margin:9px 0;color:var(--text)}
.app-shell .personality-option8.selected{border-color:#C8A85C;background:linear-gradient(120deg,#49202E44,#1A0B11);box-shadow:inset 0 0 12px #B52D4A18}
.app-shell .answer-check8{width:10px;flex-shrink:0;color:#C8A85C;font-size:11px}
.app-shell .option-voice8{font-size:14px;line-height:1.7;flex:1;color:#C8B8AD}
.app-shell .selected .option-voice8{color:#F6EDE2}
.app-shell .result-v4>.secondary{width:100%;margin-top:12px}
.share-live-image{width:100%;height:auto;display:block;border:1px solid #C8A85C55}
#share-status{font-size:11px;color:#9C8A84;text-align:center;min-height:24px;margin:8px 0}
.app-shell .directory-shade{position:fixed;inset:0;z-index:20}
.directory-shade{background:#000a;backdrop-filter:blur(3px)}
.app-shell .question-directory{position:fixed;inset:auto 0 0;left:50%;transform:translateX(-50%);width:min(100%,430px);max-height:85dvh;overflow:auto;z-index:21}
.app-shell .intro-benefits{text-align:center;font-size:11px;line-height:1.9;color:#9C8A84;margin:0 auto;max-width:330px}
.app-shell .error-card{padding:30px 22px}
.app-shell .report-nav{position:relative}
.app-shell .report-nav a{display:flex;align-items:center;min-height:44px}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--virtue-bright);outline-offset:3px}
#access-info{margin:12px 18px;padding:12px;border:1px solid #453139;border-radius:12px}
#access-info p{font-size:12px;color:#C8B8AD}
#access-info div{display:flex;justify-content:space-between;gap:10px;margin-top:7px}
#access-info button{background:none;border:0;padding:8px 4px;min-height:44px;font-size:12px;color:#C8A85C}
.history-result{margin-top:14px;text-align:left;padding:14px}
.history-result small{display:block;color:#9C8A84;font-size:10px;margin-top:6px}