:root { color-scheme:dark; scrollbar-color:var(--xepy-primary) var(--xepy-black); }
::-webkit-scrollbar { width:10px; height:8px; }
::-webkit-scrollbar-track { background:var(--xepy-black); }
::-webkit-scrollbar-thumb { background:var(--xepy-primary); border:2px solid var(--xepy-black); border-radius:3px; }
/* A compact directory and device browser, with progressive enhancement. */
html body.profile-page, html[data-theme="lapis"] body.profile-page {
 margin:0; padding:24px 18px; min-height:100vh; box-sizing:border-box;
 background:var(--xepy-page); color:var(--xepy-text); font:13px/1.6 Tahoma,Verdana,sans-serif; text-align:left;
 --profile-line:var(--xepy-border); --profile-muted:var(--xepy-muted); --profile-active:var(--xepy-primary);
}
.profile-page *, .profile-page *::before, .profile-page *::after { box-sizing:border-box; }
.profile-page .content { max-width:1060px; margin:0 auto; }
.profile-header { display:flex; align-items:center; padding:0; margin-bottom:18px; }
.profile-header h1 { margin:0; color:var(--xepy-text); font-size:22px; line-height:1.4; font-weight:600; }
.profile-shell { border:1px solid var(--profile-line); border-radius:3px; overflow:hidden; background:var(--xepy-black); }
.profile-menu:empty { display:none; }
.profile-picker { display:none; }
.profile-menu { padding:8px; }
.profile-tab { display:flex; align-items:center; gap:10px; width:100%; min-width:0; min-height:38px; padding:8px 10px; border:1px solid transparent; border-left:3px solid transparent; border-radius:2px; background:var(--xepy-black); color:var(--xepy-muted); text-align:left; font:12px/1.4 Tahoma,Verdana,sans-serif; cursor:pointer; }
.profile-tab .section-emoji { font-size:16px; flex:0 0 20px; text-align:center; }
.profile-tab:hover { background:var(--xepy-hover); color:#fff; }
.profile-tab[aria-selected="true"] { background:var(--xepy-hover); border-color:var(--xepy-blue); border-left-color:var(--profile-active); color:#fff; }
.profile-page :is(.profile-tab,.profile-panel):focus-visible { outline:2px solid var(--xepy-blue); outline-offset:-2px; }
.profile-page .profile-panel, html[data-theme="lapis"] .profile-page .profile-panel { min-width:0; margin:0; padding:18px 20px; border:0; border-radius:0; background:var(--xepy-black); }
.profile-page .profile-panel[hidden] { display:none; }
.profile-panel h2 { display:flex; align-items:center; gap:10px; margin:0 0 14px; padding:0; color:var(--xepy-text); font-size:17px; line-height:1.4; font-weight:600; }
.profile-panel h2 .section-emoji { flex-shrink:0; font-size:20px; }
.profile-panel p { display:grid; grid-template-columns:minmax(135px,31%) minmax(0,1fr); gap:18px; margin:0; padding:8px 0; border-bottom:1px dotted color-mix(in srgb,var(--profile-line) 50%,transparent); font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.profile-panel p:last-child { border-bottom:0; }
.profile-panel p strong { color:var(--profile-muted); font-size:12px; line-height:1.7; font-weight:400; }
.profile-panel .detail-value { min-width:0; color:var(--xepy-text); }
.profile-enhanced:not(.hardware-page) .profile-shell { display:grid; grid-template-columns:208px minmax(0,1fr); align-items:stretch; }
.profile-enhanced:not(.hardware-page) .profile-menu { display:flex; flex-direction:column; gap:3px; border-right:1px solid var(--profile-line); }
.profile-panels { min-width:0; }
.hardware-page .profile-menu { display:flex; gap:6px; border-bottom:1px solid var(--profile-line); }
.hardware-page .profile-tab { flex:1; border:1px solid var(--profile-line); padding:10px 12px; border-bottom:3px solid var(--profile-line); }
.hardware-page .profile-tab[aria-selected="true"] { border-color:var(--xepy-blue); border-bottom-color:var(--profile-active); }
.device-layout { display:grid; grid-template-columns:210px minmax(0,1fr); gap:24px; align-items:start; }
.device-photo { margin:0; padding:6px; border:1px solid var(--profile-line); background:var(--xepy-black); }
.device-photo img { display:block; width:100%; height:auto; max-height:300px; object-fit:contain; }
.device-details { min-width:0; }
.device-details p { grid-template-columns:108px minmax(0,1fr); gap:16px; padding:7px 0; }
@media(max-width:760px) {
 html body.profile-page, html[data-theme="lapis"] body.profile-page { padding:18px 12px; }
 .profile-enhanced:not(.hardware-page) .profile-shell { display:block; }
 .profile-enhanced:not(.hardware-page) .profile-menu, .hardware-page .profile-menu { display:flex; flex-direction:row; gap:6px; overflow-x:auto; border-right:0; border-bottom:1px solid var(--profile-line); }
 .profile-menu .profile-tab { flex:0 0 155px; min-height:48px; }
 .profile-page.profile-enhanced .profile-menu { display:none; }
 .profile-picker { display:block; width:calc(100% - 16px); margin:8px; padding:10px 12px; border:1px solid var(--profile-line); border-radius:2px; background:var(--xepy-black); color:var(--xepy-text); font:13px/1.5 Tahoma,Verdana,sans-serif; }
 .profile-page .profile-panel { padding:16px; }
 .device-layout { grid-template-columns:155px minmax(0,1fr); gap:16px; }
 .device-details p { grid-template-columns:1fr; gap:2px; }
}
@media(max-width:480px) {
 html body.profile-page, html[data-theme="lapis"] body.profile-page { padding:16px 10px; }
 .profile-header h1 { font-size:20px; }
 .profile-page .profile-panel { padding:14px; }
 .profile-panel h2 { font-size:16px; }
 .profile-panel p { grid-template-columns:1fr; gap:2px; padding:7px 0; }
 .device-layout { grid-template-columns:1fr; gap:14px; }
 .device-photo { width:136px; }
 .device-photo img { max-height:165px; }
 .hardware-page .profile-tab { flex-basis:175px; }
}
@media(prefers-reduced-motion:no-preference) { .profile-tab { transition:background-color .12s ease,color .12s ease; } }
