#youpanel.personal-menu{
  --menu-border:#3a404c;
  --menu-quiet:#9ca3af;
  --menu-bone:#dcddd8;
  position:fixed;inset:50% auto auto 50%;transform:translate(-50%,-50%);
  width:min(1100px,calc(100vw - 48px));max-width:none;max-height:calc(100svh - 48px);
  height:min(720px,calc(100svh - 48px));
  min-width:0;margin:0;padding:0;display:grid;grid-template-columns:200px minmax(0,1fr);
  gap:0;overflow:hidden;background:#0b0c10;border:1px solid var(--menu-border);
  border-radius:4px;box-shadow:0 32px 100px #0009;animation:none;
}
#youpanel.personal-menu[hidden]{display:none}
#youpanel.personal-menu::backdrop{background:#07070ade}
#youpanel.personal-menu p,#youpanel.personal-menu label{margin:0;font:12px/1.6 var(--mono);letter-spacing:.04em;color:var(--menu-bone)}
#youpanel.personal-menu button{min-height:44px;padding:10px 12px;border:1px solid var(--menu-border);background:none;color:var(--menu-bone);font:11px/1.5 var(--mono);letter-spacing:.05em;cursor:pointer}
#youpanel.personal-menu button:disabled{opacity:.45;cursor:default}
#youpanel.personal-menu button[hidden]{display:none}
#youpanel.personal-menu .row{display:flex;flex-wrap:wrap;gap:8px}
#youpanel.personal-menu label{display:flex;align-items:center;gap:12px;min-height:44px;cursor:pointer}
#youpanel.personal-menu label[hidden]{display:none}
#youpanel.personal-menu input[type="checkbox"]{width:18px;height:18px;flex:none;accent-color:var(--menu-bone)}
#youpanel.personal-menu .small,#youpanel.personal-menu #younext{font:11px/1.7 var(--mono);letter-spacing:.03em;color:var(--menu-quiet)}
#youpanel.personal-menu #youmuted{display:flex;flex-wrap:wrap;gap:8px}
#youpanel.personal-menu #youmuted p{flex-basis:100%;color:var(--menu-quiet)}
#youpanel.personal-menu #youpetals{display:flex;flex-direction:column;gap:12px;margin-top:20px}
#youpanel.personal-menu #youpetals[hidden]{display:none}
#youpanel.personal-menu #personal-journal{display:flex;flex-direction:column;gap:16px}
#youpanel.personal-menu :is(button,a,summary):focus-visible{outline:2px solid var(--menu-bone);outline-offset:3px}
#youpanel.personal-menu .personal-sidebar{padding:26px 18px;border-right:1px solid var(--menu-border);overflow:auto}
#youpanel.personal-menu .personal-identity{display:flex;flex-direction:column;gap:12px;margin-bottom:26px;min-width:0}
#youpanel.personal-menu #youname{font:300 24px/1.2 var(--serif);letter-spacing:.01em;overflow-wrap:anywhere}
#youpanel.personal-menu .personal-appearance{display:block;width:96px;height:96px;margin:auto}
#youpanel.personal-menu .personal-nav{display:flex;flex-direction:column;gap:6px}
#youpanel.personal-menu .personal-nav button{min-height:48px;text-align:left;border-color:transparent;font:300 20px/1.2 var(--serif);letter-spacing:0}
#youpanel.personal-menu .personal-nav button[aria-current="page"]{border-color:var(--menu-border);background:#dcddd80b;color:#fff}
#youpanel.personal-menu .personal-main{min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;padding:28px;scrollbar-width:thin}
#youpanel.personal-menu .personal-heading{position:sticky;top:0;z-index:1;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:24px;background:#0b0c10;padding-bottom:12px}
#youpanel.personal-menu .personal-heading h2{font:300 clamp(32px,5vw,52px)/1.1 var(--serif);letter-spacing:.01em;margin:0}
#youpanel.personal-menu .personal-heading p{margin:8px 0 0;font:12px/1.6 var(--mono);letter-spacing:.05em;color:var(--menu-quiet)}
#youpanel.personal-menu #youclose{flex:none;min-width:44px;min-height:44px;border-color:transparent;margin:0}
#youpanel.personal-menu .personal-pane[hidden],#youpanel.personal-menu #personal-journal[hidden]{display:none}
#youpanel.personal-menu .personal-status{font:12px/1.7 var(--mono);letter-spacing:.02em;color:var(--menu-quiet);padding:14px 0}
#youpanel.personal-menu .personal-inventory{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,.5fr);gap:24px}
#youpanel.personal-menu .personal-items{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
#youpanel.personal-menu .personal-item{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;min-height:134px;padding:14px 8px;gap:10px;border:1px solid var(--menu-border);background:none;color:var(--menu-bone)}
#youpanel.personal-menu .personal-item[aria-pressed="true"]{border-color:var(--menu-bone);background:#dcddd808}
#youpanel.personal-menu .personal-item svg{width:34px;height:34px;flex:none}
#youpanel.personal-menu .personal-item img.itemart{width:72px;height:72px;flex:none;border-radius:6px;object-fit:cover;background:#0b0907}
@media(max-width:600px){#youpanel.personal-menu .personal-item img.itemart{width:64px;height:64px}}
#youpanel.personal-menu .personal-item .item-name{font:300 18px/1.2 var(--serif);letter-spacing:0;overflow-wrap:anywhere}
#youpanel.personal-menu .personal-item .item-count{font:11px/1.4 var(--mono);letter-spacing:0;color:var(--menu-quiet)}
#youpanel.personal-menu .personal-empty{min-height:134px;border:1px dashed #252b35;display:grid;place-items:center;color:#4a505b;font:24px var(--serif)}
#youpanel.personal-menu .personal-detail{border-left:1px solid var(--menu-border);padding-left:24px;min-width:0}
#youpanel.personal-menu .personal-detail h3{font:300 30px/1.2 var(--serif);letter-spacing:0;margin:0 0 14px}
#youpanel.personal-menu .personal-detail p{font:12px/1.7 var(--mono);letter-spacing:.02em;color:var(--menu-quiet);margin:0 0 14px}
#youpanel.personal-menu .personal-spells{margin-top:26px;padding-top:22px;border-top:1px solid var(--menu-border)}
#youpanel.personal-menu .personal-spells h3{font:300 26px/1.2 var(--serif);letter-spacing:0;margin:0 0 8px}
#youpanel.personal-menu .personal-spells p{font:12px/1.7 var(--mono);letter-spacing:.02em;color:var(--menu-quiet);margin:0}
#youpanel.personal-menu .personal-settings{display:flex;flex-direction:column;gap:20px}
#youpanel.personal-menu .personal-settings .yougroup{display:flex;flex-direction:column;gap:10px}
#youpanel.personal-menu .personal-settings .yougroup:has(label):not(:has(label:not([hidden]),#youmuted > *)){display:none}
#youpanel.personal-menu summary{min-height:44px;cursor:pointer;font:300 24px/1.8 var(--serif)}
#youpanel.personal-menu .personal-settings .yousection{margin:0;padding-top:0;border:0;font:300 24px/1.2 var(--serif);letter-spacing:0;color:var(--menu-bone)}
#youpanel.personal-menu .personal-settings .row{margin:0;padding-top:14px;gap:8px}
@media(max-width:900px){
  #youpanel.personal-menu{grid-template-columns:160px minmax(0,1fr)}
  #youpanel.personal-menu .personal-inventory{grid-template-columns:minmax(0,1fr)}
  #youpanel.personal-menu .personal-detail{border-left:0;border-top:1px solid var(--menu-border);padding:20px 0 0}
}
@media(max-width:600px){
  #youpanel.personal-menu{inset:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px);transform:none;width:100%;height:auto;max-height:none;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);border-radius:0;border-width:0}
  #youpanel.personal-menu .personal-sidebar{padding:12px 16px 0;border-right:0;overflow:visible}
  #youpanel.personal-menu .personal-identity{margin-bottom:12px;gap:8px}
  #youpanel.personal-menu #youname{font-size:22px}
  #youpanel.personal-menu .personal-appearance{width:64px;height:64px}
  #youpanel.personal-menu .personal-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-bottom:1px solid var(--menu-border)}
  #youpanel.personal-menu .personal-nav button{padding:12px 2px;font-size:16px;text-align:center;min-width:0;min-height:48px}
  #youpanel.personal-menu .personal-main{padding:20px 16px 28px}
  #youpanel.personal-menu .personal-heading{margin-bottom:20px}
  #youpanel.personal-menu .personal-heading h2{font-size:36px}
  #youpanel.personal-menu .personal-items{grid-template-columns:repeat(2,minmax(0,1fr))}
  #youpanel.personal-menu .personal-item,#youpanel.personal-menu .personal-empty{min-height:124px}
}
/* The satchel's tabs (2026-10-05, Breath of the Wild style): a row of pictures, Q / R at its ends on a computer only. */
#youpanel.personal-menu .satchel-tabs{display:flex;align-items:center;gap:4px;margin:0 0 14px;border-bottom:1px solid var(--menu-border);padding-bottom:10px;overflow-x:auto;scrollbar-width:none}
#youpanel.personal-menu .satchel-tabs[hidden],#youpanel.personal-menu .satchel-head[hidden],#youpanel.personal-menu .satchel-sort[hidden]{display:none}
#youpanel.personal-menu .satchel-tabs button{flex:none;min-width:48px;min-height:44px;padding:8px 10px;border-color:transparent;color:var(--menu-quiet);display:grid;place-items:center}
#youpanel.personal-menu .satchel-tabs button[aria-selected="true"]{border-color:var(--menu-bone);color:var(--menu-bone);background:#dcddd80b}
#youpanel.personal-menu .satchel-key{flex:none;font:10px/1 var(--mono);color:#6b7280;border:1px solid #2a303a;border-radius:3px;padding:4px 6px;margin:0 6px}
@media (pointer:coarse),(hover:none){#youpanel.personal-menu .satchel-key{display:none}}
#youpanel.personal-menu .satchel-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 14px}
#youpanel.personal-menu .satchel-tabname{font:300 26px/1.2 var(--serif);letter-spacing:0;margin:0}
#youpanel.personal-menu .satchel-sort{display:flex;gap:4px}
#youpanel.personal-menu .satchel-sort button{min-height:36px;padding:6px 10px;border-color:transparent;color:var(--menu-quiet)}
#youpanel.personal-menu .satchel-sort button[aria-pressed="true"]{border-color:var(--menu-border);color:var(--menu-bone)}
#youpanel.personal-menu .personal-item .item-cap{display:block;width:70%;height:2px;background:#252b35;overflow:hidden}
#youpanel.personal-menu .personal-item .item-cap>span{display:block;height:100%;background:#9ca3af}
#youpanel.personal-menu .personal-item .item-cap.full>span{background:var(--menu-bone)}
#youpanel.personal-menu .satchel-empty{grid-column:1/-1;color:var(--menu-quiet);padding:24px 0}
/* uses and found lines (Loop Build lead, 2026-10-10): what a kind is for, closest first; where more is found */
#youpanel.personal-menu .personal-detail p.use{display:flex;gap:12px;margin:0 0 6px;color:#9ca3af}
#youpanel.personal-menu .personal-detail p.use .k{flex:none;width:44px;color:#6e7684;letter-spacing:.14em}
#youpanel.personal-menu .personal-detail p.use .v{flex:1;min-width:0;overflow-wrap:anywhere}
#youpanel.personal-menu .personal-detail p.use.ready .v{color:#e8e0d0}
#youpanel.personal-menu .personal-detail p.use.later .v{color:#5c626c;font-style:italic}
#youpanel.personal-menu .personal-detail p.use.found{margin-top:12px}
#youpanel.personal-menu .personal-detail .satchel-uses{margin:4px 0 0}
/* the inspect card's key on desktop (?inspect=1, site/orchard-inspect.js; Drop 2 phase 1): never on a phone */
#youpanel.personal-menu .personal-detail p.use.inspect-key{margin-top:14px;font-size:10px;letter-spacing:.14em;color:#5f646c}
@media (pointer:coarse),(hover:none){#youpanel.personal-menu .personal-detail p.use.inspect-key{display:none}}
/* Phones open on the satchel's grid (Interface lead, 2026-10-16; TAB_TREE_AUDIT Q8): the sections' row, then the pane, then your
   light and its buttons below; the whole sheet scrolls as one (the grid's first row was ~65% down the screen at 390x844). */
@media(max-width:600px){
  #youpanel.personal-menu{display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain}
  #youpanel.personal-menu .personal-sidebar{display:contents}
  #youpanel.personal-menu .personal-nav{order:0;flex:none;margin:12px 16px 0}
  #youpanel.personal-menu .personal-main{order:1;flex:none;overflow:visible}
  #youpanel.personal-menu .personal-identity{order:2;flex:none;margin:0 16px;padding:18px 0 28px;border-top:1px solid var(--menu-border)}
}
/* nothing drawn for an empty detail or the (now always empty) spells block: they left bare rules on an empty tab (2026-10-16) */
#youpanel.personal-menu .personal-spells:empty{display:none}
#youpanel.personal-menu .personal-detail:empty{border:0;padding:0}
