/* People, profile avatar, sidebar toggle and practice-type chips. Paper + ink: flat borders, offset shadows, no gradients.
   Works with both variable sets (app: --surface/--text..., Studio/Profile: --sf/--tx...). */
:root{--rw-sf:var(--surface,var(--sf,#fffdf7));--rw-bg:var(--bg,#f4efe4);--rw-tx:var(--text,var(--tx,#1d1b16));--rw-mu:var(--muted,var(--mu,#57524a));
 --rw-bd:var(--border,var(--bd,#1d1b16));--rw-bds:var(--border-subtle,var(--bd-s,#d9d0bd));--rw-red:var(--accent-text,var(--ac-tx,#a3261a));
 --rw-hl:var(--accent-subtle,var(--hl,#fff2a8));--rw-ok:var(--success,var(--ok,#1f6b3a))}

/* ---- avatar ---- */
.rw-me-slot{display:inline-flex}
.rw-me{position:relative;display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--rw-tx);border-radius:999px;flex:none;view-transition-name:rw-me;-webkit-tap-highlight-color:transparent}
.rw-me:focus-visible{outline:2px solid var(--rw-red);outline-offset:3px}
.rw-me.rw-me-out{border:1.5px solid var(--rw-bd);background:var(--rw-sf);padding:2px 12px 2px 2px;font-weight:600;font-size:14px}
.rw-me-out:hover{background:var(--rw-hl)}
.rw-face{--s:32px;width:var(--s);height:var(--s);border-radius:50%;overflow:hidden;flex:none;display:inline-flex;align-items:center;justify-content:center;background:var(--rw-hl);color:var(--rw-tx);border:1.5px solid var(--rw-bd);box-sizing:border-box;font-weight:700;font-size:calc(var(--s) * .44);line-height:1;font-family:var(--serif,"Fraunces",Georgia,serif)}
.rw-face img{width:100%;height:100%;object-fit:cover;display:block}
.rw-me-out .rw-face{border:0;background:transparent;color:var(--rw-mu)}
.rw-badge{position:absolute;top:-4px;right:-6px;min-width:18px;height:18px;padding:0 5px;box-sizing:border-box;border-radius:9px;background:var(--rw-red);color:#fff;font:700 11px/18px var(--font,system-ui);text-align:center;border:2px solid var(--rw-bg)}
header.top .rw-me-studio{margin-left:auto}
@media (max-width:760px){.rw-me-out .rw-me-t{display:none}.rw-me.rw-me-out{padding:2px}}

/* the local "who is studying" switcher sits next to the Google photo: make it a tab, not a second face */
html.rw-signed .top .avatar{border-radius:8px;width:32px;height:32px;font-size:13px}

/* ---- sidebar toggle (app) ---- */
@media (min-width:761px){.app>.side .brand{display:flex;align-items:center}}
.rw-side-btn,.rw-side-show{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;color:var(--rw-mu);cursor:pointer}
.rw-side-btn{margin-left:auto}
.rw-side-btn:hover,.rw-side-show:hover{background:var(--surface-2,rgba(0,0,0,.06));color:var(--rw-tx)}
.rw-side-btn:focus-visible,.rw-side-show:focus-visible{outline:2px solid var(--rw-red);outline-offset:2px}
.rw-side-btn{display:none!important}
.rw-side-show{position:fixed;top:16px;left:calc(var(--rw-side-w,232px) + 14px);z-index:30;color:var(--rw-tx);background:transparent;border:1.5px solid transparent;transition:left .22s ease,background-color .15s,border-color .15s}
.rw-side-show:hover{background:var(--rw-sf);border-color:var(--rw-bds,rgba(0,0,0,.2))}
html.rw-side-off .rw-side-show{left:14px}
@media (prefers-reduced-motion:reduce){.rw-side-show{transition:none}}
.rw-side-show[hidden]{display:none}
.app>.side{view-transition-name:rw-side}
@media (min-width:761px){
  html.rw-side-off .app{grid-template-columns:minmax(0,1fr)!important}
  html.rw-side-off .app>.side{display:none!important}
  .app .top{padding-left:56px}
  html.rw-side-off .app .top{padding-left:56px}
}
@media (max-width:760px){.rw-side-btn,.rw-side-show{display:none!important}}

/* ---- practice question types ---- */
.rw-pt{margin:0 0 14px;padding:10px 12px;border:1px solid var(--rw-bds);border-radius:8px;background:var(--rw-sf)}
.rw-pt-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.rw-pt-k{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--rw-mu);margin-right:4px}
.rw-chip{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:4px 12px;border:1.5px solid var(--rw-bd);border-radius:999px;background:var(--rw-sf);color:var(--rw-tx);font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap}
.rw-chip[aria-pressed=true]{background:var(--rw-tx);color:var(--rw-sf)}
.rw-chip:disabled{opacity:.45;cursor:default}
.rw-chip:focus-visible{outline:2px solid var(--rw-red);outline-offset:2px}
.rw-chip-n{font-size:12px;font-weight:700;opacity:.7;font-variant-numeric:tabular-nums}
.rw-chip-more{border-style:dashed}
.rw-pt-types{display:flex;flex-wrap:wrap;gap:6px 14px;margin:10px 0 2px;padding:10px 0 0;border-top:1px dashed var(--rw-bds);list-style:none}
.rw-pt-type{display:inline-flex;align-items:center;gap:6px;font-size:14px}
.rw-pt-type input{width:16px;height:16px;accent-color:var(--rw-tx)}
.rw-pt-note{margin:8px 0 0;font-size:13px;color:var(--rw-mu)}
.rw-pt-empty{margin-top:10px;padding:14px;border:1.5px dashed var(--rw-bd);border-radius:8px;text-align:center}
.rw-link{all:unset;cursor:pointer;color:var(--rw-red);text-decoration:underline;text-underline-offset:2px;font-weight:600}
.rws-btn.rw-link{border:0;background:none;box-shadow:none;padding:0 4px}

/* ---- people search / send ---- */
.rw-lab{display:block;font-size:13px;font-weight:700;margin:12px 0 6px}
.rw-in{box-sizing:border-box;width:100%;font:inherit;font-size:16px;padding:9px 11px;border:1.5px solid var(--rw-bd);border-radius:6px;background:var(--rw-sf);color:var(--rw-tx)}
.rw-in:focus{outline:2px solid var(--rw-red);outline-offset:1px}
.rw-inrow{display:flex;align-items:center;gap:8px}.rw-inrow .rw-in{flex:1}
.rw-at{font-weight:700;font-size:18px;color:var(--rw-mu)}
.rw-note{font-size:13px;color:var(--rw-mu);margin:6px 0;min-height:1em}
.rw-results{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.rw-row.rw-person{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:12px;width:100%;padding:8px 10px;border:1px solid var(--rw-bds);border-radius:8px;background:var(--rw-sf);cursor:pointer}
button.rw-person:hover{border-color:var(--rw-bd)}
button.rw-person:focus-visible{outline:2px solid var(--rw-red);outline-offset:1px}
.rw-person-t{display:flex;flex-direction:column;min-width:0;flex:1}
.rw-person-t b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rw-handle{font-size:13px;color:var(--rw-mu)}
.rw-to{cursor:default}
.rw-setcard{display:flex;flex-direction:column;gap:2px;margin:10px 0 0;padding:12px 14px;border:1.5px solid var(--rw-bd);border-radius:4px;background:var(--rw-sf);box-shadow:3px 3px 0 var(--rw-bd);background-image:linear-gradient(var(--rw-red),var(--rw-red));background-size:100% 2px;background-repeat:no-repeat;background-position:0 30px}
.rw-setcard b{font-family:var(--serif,"Fraunces",Georgia,serif);font-size:17px;padding-bottom:8px}
.rw-setcard span{font-size:13px;color:var(--rw-mu)}
.rw-send-body .rws-btn.rws-primary{margin-top:10px}
.rw-sent{text-align:center;padding:10px 0}.rw-sent .rws-btn{margin:6px 4px 0}
.rw-big{font-family:var(--serif,"Fraunces",Georgia,serif);font-size:28px;margin:6px 0}
.rw-google{display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border:1.5px solid var(--rw-bd);border-radius:999px;background:var(--rw-sf);color:var(--rw-tx);font-weight:700;text-decoration:none;box-shadow:2px 2px 0 var(--rw-bd)}
.rw-google:hover{background:var(--rw-hl)}
.rw-g{display:inline-flex;width:22px;height:22px;border-radius:50%;align-items:center;justify-content:center;border:1.5px solid var(--rw-bd);font:800 13px/1 var(--font,system-ui)}
/* phone: keep the header on one line so the profile avatar stays top right */
@media (max-width:760px){.app .top{flex-wrap:nowrap}.app .top .setsel{min-width:0;flex:1 1 auto;width:auto;max-width:none;text-overflow:ellipsis}.app .top .hdr-sp{display:none}.app .top .saved-l{display:none}.app .top .rw-me-slot{flex:none}}
/* Back out of the send-to-a-person sheet / Find people */
.rw-backbtn{min-height:36px;padding:4px 10px 4px 6px;box-shadow:none;font-weight:600;display:inline-flex;align-items:center;gap:2px}
.rw-backbtn span{font-size:20px;line-height:1;margin-top:-2px}
.rwp-find-top{display:flex;justify-content:flex-start;margin:0 0 8px}
/* People on this device moved to Profile (both layouts); the letter avatar is no longer in the top bar. */
.top .avatar{display:none!important}