.mph{flex-wrap:wrap;gap:6px;max-width:min(420px,100%);display:flex}.mph.end{justify-content:flex-end;margin-left:auto}.mph-t{border:1px solid var(--line);background:var(--card2);cursor:zoom-in;border-radius:10px;width:104px;height:104px;padding:0;display:block;position:relative;overflow:hidden}.mph-t.one{width:auto;max-width:min(280px,100%);height:auto;max-height:240px}.mph-t.one img{object-fit:contain;width:100%;height:100%;max-height:240px}.mph-t img{object-fit:cover;width:100%;height:100%;display:block}.mph-t:hover{border-color:var(--line2)}.mph-t:focus-visible{outline:2px solid var(--acc);outline-offset:2px}:is(.mph-t.one:has(.mph-wait),.mph-t.one:has(.mph-no)){width:200px;height:140px}.mph-wait{background:linear-gradient(90deg, var(--card2), var(--nav), var(--card2));background-size:200% 100%;width:100%;height:100%;min-height:60px;animation:1.4s ease-in-out infinite mph-shine;display:block}.mph-wait.big{border-radius:12px;width:min(60vw,480px);height:min(50vh,360px)}.mph-no{width:100%;height:100%;min-height:60px;color:var(--mut);text-align:center;place-items:center;padding:8px;font-size:12px;line-height:1.35;display:grid}.mph-no.big{background:var(--card2);border-radius:12px;width:min(60vw,480px);height:min(50vh,360px);padding:24px;font-size:14px}@keyframes mph-shine{0%{background-position:100% 0}to{background-position:-100% 0}}@media (prefers-reduced-motion:reduce){.mph-wait{animation:none}}.mph-view{background:0 0;border:0;max-width:94vw;max-height:92vh;padding:0;overflow:visible}.mph-view::backdrop{background:var(--scrim)}.mph-view img{width:auto;max-width:94vw;height:auto;max-height:88vh;box-shadow:var(--float);background:var(--card2);border-radius:12px;display:block}.mph-x{border:1px solid var(--line2);background:var(--side);width:34px;height:34px;color:var(--ink);cursor:pointer;box-shadow:var(--float);border-radius:50%;place-items:center;padding:0;display:grid;position:absolute;top:-14px;right:-14px}.mph-x .ic{width:16px;height:16px}.mph-x:focus-visible{outline:2px solid var(--acc);outline-offset:2px}@media (max-width:640px){.mph-x{top:8px;right:8px}}.mph-add{width:34px;height:34px;color:var(--mut);cursor:pointer;background:0 0;border:0;border-radius:9px;place-items:center;padding:0;display:grid}.mph-add .ic{width:19px;height:19px}.mph-add:hover:not(:disabled){background:var(--nav);color:var(--ink)}.mph-add:focus-visible{outline:2px solid var(--acc);outline-offset:1px}.mph-add:disabled{opacity:.45;cursor:default}.mph-tray{flex-wrap:wrap;gap:8px;padding:2px 0 6px;display:flex}.mph-p{border:1px solid var(--line);background:var(--card2);border-radius:9px;width:64px;height:64px;display:block;position:relative;overflow:hidden}.mph-p img{object-fit:cover;width:100%;height:100%;display:block}.mph-rm{color:#fff;cursor:pointer;background:#0000009e;border:0;border-radius:50%;place-items:center;width:22px;height:22px;padding:0;display:grid;position:absolute;top:3px;right:3px}.mph-rm .ic{width:12px;height:12px}.mph-rm:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.fb-btn{border:1px solid var(--line2);height:30px;color:var(--ink2);font:500 12.5px var(--f-ui);white-space:nowrap;cursor:pointer;background:0 0;border-radius:7px;align-items:center;gap:6px;padding:0 10px;display:inline-flex}.fb-btn .ic{flex-basis:14px;width:14px;height:14px}.fb-btn:hover,.fb-btn[aria-expanded=true]{background:var(--card2);color:var(--ink)}.fb-btn:focus-visible{outline:2px solid var(--acc);outline-offset:1px}.fb-pop{z-index:40;border:1px solid var(--line2);background:var(--side);width:min(380px,100vw - 32px);box-shadow:var(--float);color:var(--ink);white-space:normal;border-radius:14px;padding:16px;font-size:13px;position:absolute;top:calc(100% + 8px);right:20px}.fb-in{flex-direction:column;gap:10px;margin:0;display:flex}.fb-h{font:500 14px var(--f-ui);color:var(--ink);align-items:center;gap:8px;margin:0;display:flex}.fb-h .ic{width:16px;height:16px;color:var(--good-t);flex-basis:16px}.fb-sub{color:var(--mut);text-wrap:pretty;margin:0;font-size:13px;line-height:1.5}.fb-pop textarea{border:1px solid var(--line2);background:var(--stage);width:100%;min-height:104px;max-height:40vh;color:var(--ink);font:14px/1.5 var(--f-ui);resize:vertical;border-radius:10px;padding:10px 12px}.fb-pop textarea::placeholder{color:var(--dim)}.fb-pop textarea:focus-visible{outline:2px solid var(--acc);outline-offset:-1px;border-color:#0000}.fb-pop textarea:disabled{opacity:.6}.fb-pop .mph-tray{margin:0}.fb-no{color:var(--crit-t);align-items:flex-start;gap:6px;margin:0;font-size:13px;line-height:1.45;display:flex}.fb-no .ic{flex:0 0 15px;width:15px;height:15px;margin-top:1px}.fb-no .tl{color:inherit}.fb-acts{align-items:center;gap:8px;display:flex}.fb-gap{flex:1}@media (max-width:900px){.fb-pop{right:16px}}@media (max-width:480px){.fb-btn{justify-content:center;width:30px;padding:0}.fb-btn .l{display:none}}
.viewbar{background:var(--acc-fill);color:#fff;z-index:2;align-items:center;gap:10px;padding:9px 20px;font-size:13px;line-height:1.45;display:flex;position:relative}.viewbar>.ic{flex:0 0 15px;width:15px;height:15px}.viewbar>span{text-wrap:pretty;flex:auto;min-width:0}.viewbar b{color:inherit;font-weight:600}.viewbar>a{height:28px;color:inherit;font:500 12.5px var(--f-ui);white-space:nowrap;border:1px solid #fff9;border-radius:6px;flex:none;align-items:center;padding:0 10px;text-decoration:none;display:inline-flex}.viewbar>a:hover{background:#ffffff1f}.viewbar>a:focus-visible{outline-offset:2px;outline:2px solid #fff}.viewbar>span a{color:inherit;font-weight:500}.viewbar>span a:focus-visible{outline-offset:2px;border-radius:2px;outline:2px solid #fff}@media (max-width:640px){.viewbar{align-items:flex-start;padding:10px 16px}.viewbar>.ic{margin-top:2px}}.viewframe{border:3px solid var(--acc-fill);pointer-events:none;z-index:100;position:fixed;inset:0}.viewnote{border:1px solid var(--line2);background:var(--card2);color:var(--body);border-radius:14px;align-items:center;gap:10px;margin:0;padding:14px 16px;font-size:13.5px;line-height:1.5;display:flex}.viewnote>.ic{color:var(--acc)}.viewnote>span{text-wrap:pretty;min-width:0}.viewnote a{color:var(--acc-t);text-underline-offset:2px;white-space:nowrap}.viewnote a:hover{color:var(--ink)}@media (max-width:640px){.viewnote{align-items:flex-start}.viewnote>.ic{margin-top:2px}.viewnote a{white-space:normal}}