.friend-page{max-width:1160px;color:var(--web2-ink);margin:auto;padding:18px 40px 80px;font-family:system-ui,sans-serif}body:has(.observer-workspace){background:var(--web2-paper)}.friend-page header{max-width:760px;margin:28px 0 34px}.friend-page h1{letter-spacing:-.03em;margin:16px 0;font-size:clamp(30px,4vw,44px);line-height:1.3}.friend-page h2{margin:12px 0 20px;font-size:22px;line-height:1.6}.friend-page p{color:var(--web2-muted);line-height:1.8}.friend-page .eyebrow{letter-spacing:.08em;color:var(--web2-purple);font-size:12px}.friend-page button,.friend-page input{font:inherit}.friend-page button{border:1px solid var(--web2-line);background:var(--web2-surface);color:var(--web2-ink);cursor:pointer;border-radius:10px;justify-content:center;align-items:center;gap:8px;min-height:44px;padding:11px 18px;display:inline-flex}.friend-page button.primary{background:var(--web2-purple);border-color:var(--web2-purple);color:var(--web2-on-purple)}.friend-page button:hover:not(:disabled){border-color:var(--web2-purple)}.friend-page button:disabled{opacity:.45;cursor:default}:is(.friend-page button:focus-visible,.friend-page input:focus-visible,.friend-page a:focus-visible){outline:3px solid var(--web2-purple);outline-offset:3px}.friend-card,.friend-invites article{background:var(--web2-surface);border:1px solid var(--web2-line);border-radius:16px;padding:28px}.friend-card input{box-sizing:border-box;border:1px solid var(--web2-line);background:var(--web2-paper);width:100%;min-width:0;color:var(--web2-ink);border-radius:10px;padding:13px 16px;font-size:16px}.friend-card label{gap:12px;font-weight:600;display:grid}.friend-card>button{margin-top:12px}.friend-card footer{justify-content:space-between;gap:12px;margin-top:28px;display:flex}.friend-notice{background:var(--web2-tint);color:var(--web2-purple);overflow-wrap:anywhere;border-radius:10px;margin-top:24px;padding:14px 18px;line-height:1.7;display:block}.friend-invite-title,.observer-custom-name{overflow-wrap:anywhere}.observer-custom-name{color:#a34271;font-weight:600}html[data-web2-theme=dark] .observer-custom-name{color:#efa4c9}.observer-topline{justify-content:flex-end;align-items:center;gap:16px;display:flex}.friend-back,.observer-history-link{color:var(--web2-purple);align-items:center;gap:8px;min-height:40px;font-size:13px;text-decoration:none;display:inline-flex}.observer-tabs{background:var(--web2-tint);border-radius:999px;gap:4px;padding:5px;display:inline-flex}.friend-page .observer-tabs button{min-height:42px;color:var(--web2-muted);background:0 0;border:0;border-radius:999px;padding:10px 22px;font-size:14px}.friend-page .observer-tabs button[aria-pressed=true]{background:var(--web2-surface);color:var(--web2-purple);box-shadow:0 2px 8px #00000009}.observer-login-card,.observer-create-card,.observer-subject-card{max-width:620px}.observer-login-card>svg,.observer-create-card>svg{color:var(--web2-purple)}.observer-subject-card>button{margin-top:22px}.observer-resume{border-top:1px solid var(--web2-line);margin-top:28px;padding-top:12px}.observer-resume button{font-size:13px}.friend-invites{max-width:820px;margin-top:36px}.friend-invites article{margin:12px 0;padding:20px 24px}.friend-invites article>div{justify-content:space-between;align-items:center;gap:18px;display:flex}.friend-invites small{color:var(--web2-muted);margin-top:6px;font-size:12px;display:block}.observer-invite-actions{gap:8px;display:flex}.observer-invite-actions>button{font-size:13px}.observer-record-list{margin-top:38px}.observer-record{background:var(--web2-surface);border:1px solid var(--web2-line);border-radius:14px;align-items:center;gap:8px;margin:12px 0;padding:10px 16px 10px 8px;display:flex}.friend-page .observer-record-open{text-align:left;background:0 0;border:0;flex:1;justify-content:flex-start;gap:20px;min-width:0;padding:10px;display:flex}.observer-record-open>img{object-fit:contain;width:65px;height:80px}.observer-record-open>span{flex:1;gap:8px;min-width:0;display:grid}.observer-record-open strong{overflow-wrap:anywhere;font-size:18px;line-height:1.4}.observer-record-open>svg{color:var(--web2-purple);flex-shrink:0}.observer-record-meta{color:var(--web2-muted);font-size:12px;line-height:1.6}.observer-source{background:var(--web2-tint);color:var(--web2-purple);border-radius:5px;justify-self:start;padding:4px 7px;font-size:10px;line-height:1}.observer-source-invited{color:#486578;background:#e7eff4}.observer-source-received{color:#476f53;background:#e5f0e8}html[data-web2-theme=dark] .observer-source-invited{color:#b9cfdf;background:#243340}html[data-web2-theme=dark] .observer-source-received{color:#b1d2b8;background:#25372b}.friend-page .observer-icon-button{color:var(--web2-muted);background:0 0;border:0;padding:12px}.observer-record-filters{flex-wrap:wrap;gap:8px;display:flex}.observer-record-filters button{font-size:13px}.observer-record-filters button[aria-pressed=true]{background:var(--web2-purple);border-color:var(--web2-purple);color:var(--web2-on-purple)}.observer-empty{border:1px dashed var(--web2-line);text-align:center;color:var(--web2-muted);border-radius:14px;padding:36px 24px}.observer-empty p{font-size:14px}.observer-error{border:1px solid var(--web2-line);border-radius:12px;margin-top:24px;padding:16px}.observer-quiz-layout{grid-template-columns:210px minmax(0,1fr);align-items:start;gap:34px;display:grid}.observer-overview{position:sticky;top:110px}.observer-number-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.observer-number-grid button{min-width:0;min-height:42px;padding:8px;font-size:13px}.observer-number-grid button[data-answered=true]{background:var(--web2-tint);color:var(--web2-purple)}.observer-number-grid button[aria-current=step]{border-color:var(--web2-purple);box-shadow:0 0 0 1px var(--web2-purple)}.friend-page .observer-text-button{color:var(--web2-purple);background:0 0;border:0;justify-content:flex-start;padding:10px 0;font-size:13px}.observer-overview>.observer-text-button{margin-top:12px}.friend-progress{color:var(--web2-muted);margin:0;font-size:12px}.friend-page .observer-question-text{margin:16px 0 28px;font-size:clamp(21px,2.6vw,27px);line-height:1.65}.friend-options{gap:10px;display:grid}.friend-options button{justify-content:flex-start;min-height:48px}.friend-options button.active{background:var(--web2-tint);border-color:var(--web2-purple);box-shadow:0 0 0 1px var(--web2-purple);color:var(--web2-purple)}.observer-skip-action{flex-wrap:wrap;align-items:center;gap:12px;margin-top:14px;display:flex}.observer-skip-action small,.observer-skip-count{color:var(--web2-muted);font-size:12px}.observer-review-actions{justify-content:space-between;gap:14px;margin-top:30px;display:flex}.observer-workspace .observer-report button{min-height:44px}.observer-workspace .observer-report h2{font-size:32px}.observer-workspace .observer-report h3{font-size:25px}@media (max-width:767px){.friend-page{padding:18px 20px 60px}.observer-quiz-layout{grid-template-columns:1fr;gap:18px}.observer-overview{flex-wrap:wrap;align-items:center;gap:8px 20px;display:flex;position:static}.observer-number-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:6px;width:100%}.observer-overview>.observer-text-button{margin:0}.friend-card{padding:24px}.friend-page header{margin-top:22px}.observer-record-open strong{font-size:16px}}@media (max-width:420px){.friend-page{padding:18px 16px 50px}.observer-topline{gap:8px}.friend-back,.observer-history-link{font-size:12px}.observer-tabs{box-sizing:border-box;width:100%}.friend-page .observer-tabs button{flex:1;padding:10px 12px}.friend-card{padding:21px 18px}.friend-invites article>div{flex-wrap:wrap}.observer-invite-actions{width:100%}.observer-review-actions{flex-direction:column}.observer-record{padding-right:5px}.friend-page .observer-record-open{gap:12px}.observer-record-open>img{width:45px;height:64px}.observer-record-meta{font-size:11px}.observer-number-grid button{min-height:36px;padding:5px}.friend-card footer button{flex:1;padding:11px}.observer-workspace .observer-report h2{font-size:26px}}.observer-question-text{scroll-margin-top:110px}.observer-question-text:focus{outline:none}@media (max-width:767px){.observer-question-text{scroll-margin-top:86px}}.observer-create-card .observer-invite-actions{flex-wrap:wrap;margin-top:22px}.observer-toast{z-index:120;left:50%;bottom:calc(28px + env(safe-area-inset-bottom));border:1px solid var(--web2-line);background:var(--web2-surface);max-width:calc(100vw - 40px);color:var(--web2-ink);text-align:center;pointer-events:none;border-radius:12px;padding:12px 20px;font-size:14px;position:fixed;transform:translate(-50%);box-shadow:0 6px 24px #0002}@media (max-width:639px){.observer-toast{bottom:calc(86px + env(safe-area-inset-bottom))}}