/* Friends page + visit-home chrome. Runic Tech look: gold Cinzel headings, deep teal, cyan rune corners. */
.fr-wrap{max-width:1080px;padding-top:26px;padding-bottom:64px}
.fr-top{display:flex;gap:24px;align-items:flex-end;justify-content:space-between;margin-bottom:18px}
.fr-top h1{margin:0 0 6px;font-size:44px;line-height:1.05}
.fr-top p{margin:0;max-width:520px}
body.runic main .fr-code.panel{display:flex;align-items:center;gap:12px;padding:12px 16px;flex:none}
.fr-code-l{font-size:12px;color:#B9C6C9;text-transform:uppercase;letter-spacing:.08em}
.fr-code b{font:700 19px/1 "Cinzel",serif;color:#F2E3B8;letter-spacing:.06em;white-space:nowrap}
.fr-newcode{appearance:none;background:none;border:0;color:#7FEADB;font-size:12.5px;text-decoration:underline;cursor:pointer;padding:4px}
.fr-tabs{display:flex;gap:4px;border-bottom:1px solid rgba(201,162,76,.35);margin-bottom:20px;overflow-x:auto;scrollbar-width:none}
.fr-tabs button{appearance:none;background:none;border:0;border-bottom:3px solid transparent;color:#B9C6C9;font:700 15px/1 "Cinzel",serif;letter-spacing:.03em;padding:12px 14px 11px;cursor:pointer;white-space:nowrap;display:flex;align-items:center;gap:7px}
.fr-tabs button:hover{color:#F2E3B8}
.fr-tabs button[aria-selected=true]{color:#F6DC93;border-bottom-color:#5EE8D6;text-shadow:0 0 12px rgba(94,232,214,.35)}
.fr-n{font:700 12px/1 Inter,system-ui;background:rgba(201,162,76,.25);color:#F2E3B8;border-radius:999px;padding:3px 7px}
.fr-n.hot{background:#5EE8D6;color:#062023}
.fr-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.fr-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.fr-card{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 16px;border:1px solid rgba(201,162,76,.45);border-radius:6px;background:linear-gradient(180deg,#0B2A2D,#08201F);box-shadow:0 0 0 4px #08201F,0 0 0 5px rgba(201,162,76,.22)}
.fr-grid .fr-card::before{content:"";position:absolute;inset:6px;pointer-events:none;background:linear-gradient(#5EE8D6,#5EE8D6) top left/16px 2px no-repeat,linear-gradient(#5EE8D6,#5EE8D6) top left/2px 16px no-repeat,linear-gradient(#5EE8D6,#5EE8D6) bottom right/16px 2px no-repeat,linear-gradient(#5EE8D6,#5EE8D6) bottom right/2px 16px no-repeat;filter:drop-shadow(0 0 3px #3FE0CC);opacity:.8}
.fr-list .fr-card{background:rgba(5,24,26,.6);box-shadow:none;border-color:rgba(201,162,76,.28)}
.fr-av{display:grid;place-items:center;width:64px;height:64px}
.fr-fav,.fr-fav .av-dot{width:50px;height:50px}.fr-fav .av-dot{display:block}
.fr-id{min-width:0;display:flex;flex-direction:column;gap:3px}
.fr-nm{font:700 19px/1.15 var(--display,system-ui);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fr-tt{align-self:flex-start;font:700 11.5px/1 "Cinzel",serif;letter-spacing:.06em;color:#1D1405;background:linear-gradient(180deg,#F6DC93,#C9A24C);padding:4px 8px 3px;border-radius:3px}
.fr-act{display:flex;gap:8px;align-items:center;position:relative}
.fr-act .btn{white-space:nowrap}.fr-act .btn svg{margin-right:6px;vertical-align:-3px}
.fr-act .ib{padding-left:9px;padding-right:9px}.fr-act .ib svg{margin:0}
.fr-ghost{opacity:.8}
.fr-wait{font-size:12.5px;color:#7FEADB;border:1px solid rgba(94,232,214,.4);border-radius:999px;padding:4px 9px}
.fr-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:20;min-width:170px;display:flex;flex-direction:column;padding:6px;background:#06191B;border:1px solid #C9A24C;border-radius:5px;box-shadow:0 12px 30px rgba(0,0,0,.55)}
.fr-menu button{appearance:none;background:none;border:0;color:#EEF2F6;text-align:left;padding:9px 10px;border-radius:3px;font:500 14px/1 Inter,system-ui;cursor:pointer}
.fr-menu button:hover,.fr-menu button:focus-visible{background:rgba(94,232,214,.14)}
.fr-menu [data-m=report],.fr-menu [data-m=block]{color:#FFB4A8}
.fr-cols{display:grid;grid-template-columns:1fr 1fr;gap:18px}
body.runic main .fr-cols .panel,body.runic main .fr-add,body.runic main .fr-priv,body.runic main .fr-empty{padding:22px 22px 24px}
.fr-cols .fr-card{grid-template-columns:56px minmax(0,1fr)}
.fr-cols .fr-act{grid-column:1/-1;justify-content:flex-end}
.fr-cols .fr-av{width:56px;height:56px}
.fr-cols h2,.fr-add h2,.fr-priv h2{margin:0 0 12px;font-size:22px}
.fr-add,.fr-priv{max-width:640px}
.fr-add-f{display:flex;gap:10px;margin-top:14px}.fr-add-f .input{flex:1;min-width:0;height:46px;padding:0 14px;font-size:16px;letter-spacing:.02em}
.fr-msg{min-height:22px;margin:10px 0 0;font-size:14px}.fr-msg.ok{color:#7FF3E0}.fr-msg.bad{color:#FFB4A8}
.fr-rules{margin:18px 0 0;padding:14px 0 0 20px;border-top:1px solid rgba(201,162,76,.25);color:#B9C6C9;font-size:14px;display:grid;gap:6px}
.fr-opts{border:0;margin:14px 0 0;padding:0;display:grid;gap:10px}
.fr-opt{display:flex;gap:12px;align-items:flex-start;padding:13px 14px;border:1px solid rgba(201,162,76,.35);border-radius:5px;background:rgba(5,24,26,.55);cursor:pointer}
.fr-opt:has(input:checked){border-color:#5EE8D6;background:rgba(94,232,214,.08);box-shadow:0 0 0 1px #5EE8D6,0 0 18px rgba(94,232,214,.18)}
.fr-opt input{margin-top:3px;accent-color:#5EE8D6;width:18px;height:18px;flex:none}
.fr-opt b{display:block;color:#F2E3B8;font-size:15px}.fr-opt small{display:block;color:#9FB2B5;font-size:13px;margin-top:3px}
.fr-opts.sm .fr-opt{padding:9px 12px}
.fr-chk{display:flex;gap:8px;align-items:center;margin:12px 0 16px;font-size:14px;color:#EEF2F6}
.fr-priv h3{margin:24px 0 10px;font-size:17px}
.fr-blocked{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:8px}
.fr-blocked li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;border:1px solid rgba(201,162,76,.22);border-radius:4px}
.fr-blocked li.muted{border:0;padding:0}
.small{font-size:13px}
.fr-stamprow{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:13.5px;color:#B9C6C9}
.fr-st{font-size:14px;display:inline-flex;gap:3px;align-items:center}.fr-st b{font-size:11.5px;color:#C9D6D8}
.fr-toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:60;background:#06191B;color:#EEF2F6;border:1px solid #C9A24C;border-radius:5px;padding:11px 16px;font-size:14px;box-shadow:0 10px 30px rgba(0,0,0,.5)}
body.fr-busy .fr-act .btn,body.fr-busy .fr-add-f .btn{opacity:.6;pointer-events:none}
body.runic main .fr-signin{max-width:560px;padding:26px}.fr-signin h1{margin:0 0 14px}
body.runic .dlg{border:1px solid #C9A24C;border-radius:6px;background:linear-gradient(180deg,#0B2A2D,#08201F);color:#EEF2F6;padding:24px;max-width:420px;width:calc(100% - 32px);box-shadow:0 0 0 5px #08201F,0 30px 80px rgba(0,0,0,.6)}
body.runic .dlg::backdrop{background:rgba(0,0,0,.6)}
body.runic .dlg h2{margin:0 0 8px;font:700 21px/1.2 "Cinzel",serif;color:#E2BE6A}
body.runic .dlg .btns{display:flex;gap:8px;justify-content:flex-end}
@media (max-width:820px){.fr-grid,.fr-cols{grid-template-columns:1fr}.fr-top{flex-direction:column;align-items:stretch}}
@media (max-width:520px){
  .fr-wrap{padding-top:16px}.fr-top h1{font-size:34px}
  .fr-card{grid-template-columns:52px minmax(0,1fr);gap:10px 12px;padding:12px}
  .fr-av,.fr-cols .fr-av{width:52px;height:52px}.fr-fav,.fr-fav .av-dot{width:42px;height:42px}
  .fr-grid .fr-act{grid-column:1/-1;justify-content:flex-end}.fr-grid .fr-act .btn-primary{flex:1;justify-content:center}
  .fr-add-f{flex-direction:column}
  .fr-tabs{gap:0}.fr-tabs button{padding:11px 8px;font-size:13px;letter-spacing:0}.fr-n{padding:2px 6px}.fr-code-l{font-size:11px}.fr-long{display:none}
  body.runic main .fr-code.panel{justify-content:space-between;flex-wrap:wrap}
}
/* ---------- visiting a friend's home (home.html?visit=…) ---------- */
body.is-visit #editBtn,body.is-visit #collBtn,body.is-visit .bal,body.is-visit #evBtn,body.is-visit #floorNav{display:none!important}
html.visit-mode .room-scene{visibility:hidden}html.visit-mode body.is-visit .room-scene{visibility:visible}
.vis-card{display:flex;align-items:center;gap:12px;min-width:0}
.vis-back{display:inline-flex;align-items:center;gap:6px;flex:none;text-decoration:none;color:#F2E3B8!important;border:1px solid rgba(201,162,76,.6);background:rgba(6,23,25,.75);border-radius:4px;padding:7px 11px 7px 8px;font:700 13px/1 "Cinzel",serif;letter-spacing:.03em}
.vis-back:hover{border-color:#5EE8D6;box-shadow:0 0 12px rgba(94,232,214,.3)}
.vis-av{display:grid;place-items:center;width:52px;height:52px;flex:none}.vis-av .fr-fav,.vis-av .fr-fav .av-dot{width:42px;height:42px}
.vis-id{min-width:0;display:flex;flex-direction:column;gap:3px}
.vis-id .fr-nm{font-size:18px}
.vis-ro{font-size:12px;color:#9FB2B5;display:flex;gap:6px;align-items:center}.vis-ro a{color:#7FEADB}
.vis-react{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.vis-react button{appearance:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;border:1px solid rgba(201,162,76,.55);background:rgba(6,23,25,.8);color:#F2E3B8;border-radius:999px;padding:6px 11px;font:600 13px/1 Inter,system-ui}
.vis-react button:hover{border-color:#5EE8D6}
.vis-react button[aria-pressed=true]{background:rgba(94,232,214,.16);border-color:#5EE8D6;color:#DFFCF7}
.vis-react .e{font-size:15px}
.vis-stamp{position:absolute;left:50%;top:38%;z-index:40;pointer-events:none;transform:translate(-50%,-50%) rotate(-8deg);font:800 34px/1 "Cinzel",serif;color:#F6DC93;text-shadow:0 2px 0 #5E420F,0 0 24px rgba(94,232,214,.5);display:flex;flex-direction:column;align-items:center;gap:6px;animation:visStamp 1.6s ease-out forwards}
.vis-stamp .e{font-size:64px}
.vis-again{font:600 13px/1.3 Inter,system-ui;color:#EEF2F6;background:rgba(6,23,25,.85);padding:6px 10px;border-radius:4px;text-shadow:none}
@keyframes visStamp{0%{opacity:0;transform:translate(-50%,-50%) rotate(-8deg) scale(1.8)}15%{opacity:1;transform:translate(-50%,-50%) rotate(-8deg) scale(1)}75%{opacity:1}100%{opacity:0;transform:translate(-50%,-62%) rotate(-8deg) scale(1)}}
html.no-anim .vis-stamp{animation:visStampStill 1.6s steps(1) forwards}
@keyframes visStampStill{0%{opacity:1}100%{opacity:0}}
@media (max-width:820px){
  body.is-visit .room-bar{flex-wrap:wrap;row-gap:8px}
  body.is-visit .rb-t{position:static;width:auto;height:auto;overflow:visible;clip:auto;flex:1 1 100%}
  body.is-visit .rb-a{flex:1 1 100%;justify-content:flex-start}
  body.is-visit .rb-t h1.fr-nm{font-size:19px!important}
}
@media (max-width:560px){.vis-react{justify-content:flex-start;width:100%}.vis-react button{padding:6px 9px}.vis-react .t{display:none}.vis-react .e{font-size:18px}}
/* admin report queue */
.adm-reports{margin:0 0 24px;padding:20px 22px}.adm-reports h2{display:flex;gap:10px;align-items:center;margin:0 0 6px}
.rep-list{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px}
.rep{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center;padding:12px 14px;border:1px solid rgba(201,162,76,.35);border-radius:6px}
.rep>div:first-child{display:flex;flex-direction:column;gap:3px}.rep-r{font-size:14px}.rep-a{display:flex;gap:6px;flex-wrap:wrap}
.rep-done{margin-top:14px;font-size:13.5px}
