.panel-shell { --rail-width: 76px; --menu-width: 236px; grid-template-columns: var(--menu-width) minmax(0, 1fr); }
.panel-shell .feedback-sidebar { z-index: 20; gap: 18px; padding: 18px 14px; min-width: 0; }
.shell-brand-row { display: flex; align-items: center; justify-content: space-between; min-height: 44px; gap: 12px; }
.shell-brand { display: inline-flex; align-items: center; min-width: 0; height: 44px; color: var(--fb-brand); text-decoration: none; }
.shell-brand img { display: block; width: 116px; max-width: 100%; height: 44px; object-fit: contain; }
.shell-brand-fallback { display: grid; place-items: center; width: 44px; height: 44px; font-size: 17px; font-weight: 750; border-bottom: 3px solid var(--fb-brand); }
.shell-rail-toggle { align-self: flex-start; }
.shell-rail-toggle, .shell-menu-toggle, .shell-menu-close, .shell-backdrop { display: none; }
.panel-shell .feedback-nav { grid-template-columns: 1fr; }
.panel-shell .feedback-nav a { gap: 12px; min-height: 44px; padding: 10px; }
.shell-nav-label { min-width: 0; overflow-wrap: anywhere; }
.panel-shell .feedback-main { display: flex; flex-direction: column; }
.panel-shell .feedback-content { width: 100%; flex: 1; }
.panel-footer { padding: 18px 28px 24px; border-top: 1px solid var(--fb-line); font-size: 12px; }
.panel-footer a { display: inline-flex; align-items: center; gap: 6px; }
.panel-footer .icon { width: 16px; height: 16px; }

@media (min-width: 961px) {
    .shell-enhanced .panel-shell { grid-template-columns: var(--rail-width) minmax(0, 1fr); transition: grid-template-columns .16s ease; }
    .shell-enhanced .panel-shell[data-expanded="true"] { grid-template-columns: var(--menu-width) minmax(0, 1fr); }
    .shell-enhanced .shell-rail-toggle { display: inline-flex; margin-left: 4px; }
    .shell-enhanced .panel-shell:not([data-expanded="true"]) .shell-nav-label { display: none; }
    .shell-enhanced .panel-shell:not([data-expanded="true"]) .shell-brand img { width: 46px; }
    .panel-shell[data-expanded="true"] .shell-rail-toggle .icon { transform: rotate(180deg); }
}
@media (max-width: 960px) {
    .panel-shell { display: block; }
    .panel-shell .feedback-sidebar { height: auto; padding: 18px; }
    .panel-shell .feedback-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .shell-enhanced .panel-shell .feedback-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 50; width: min(300px, 86vw); height: 100vh; height: 100dvh; overflow-y: auto; visibility: hidden; transform: translateX(-100%); border-right: 1px solid var(--fb-line); transition: transform .18s ease, visibility .18s; }
    .shell-enhanced .feedback-nav { grid-template-columns: 1fr; }
    .shell-enhanced .shell-menu-toggle, .shell-enhanced .shell-menu-close { display: inline-flex; }
    .shell-enhanced.shell-menu-open .feedback-sidebar { visibility: visible; transform: translateX(0); }
    .shell-menu-open { overflow: hidden; }
    .shell-backdrop, .shell-backdrop:hover { position: fixed; inset: 0; z-index: 40; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 0; background: rgb(21 36 28 / 35%); }
    .shell-menu-open .shell-backdrop { display: block; }
}
@media (max-width: 640px) {
    .panel-shell .feedback-topbar { gap: 10px; }
    .panel-shell .feedback-topbar-context { flex-shrink: 0; }
    .panel-shell .feedback-account { margin-left: auto; }
    .panel-shell .feedback-account strong, .panel-shell .feedback-account small { max-width: 185px; }
    .panel-footer { padding-inline: 16px; }
}

.panel-login { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
.login-main { flex: 1; display: grid; place-items: center; padding: 40px 24px; }
.login-form { display: grid; gap: 22px; width: min(100%, 424px); padding: 32px; background: var(--fb-card); border: 1px solid var(--fb-line); border-radius: 8px; box-shadow: 0 8px 28px rgb(37 51 47 / 6%); }
.login-heading { padding-bottom: 20px; border-bottom: 1px solid var(--fb-line); text-align: center; }
.login-heading h1 { font-size: 24px; margin: 24px 0 0; }
.login-logo { display: block; width: 240px; max-width: 100%; height: auto; margin-inline: auto; }
.login-brand-fallback { display: block; color: var(--fb-brand); font-size: 32px; font-weight: 750; }
.login-form input, .login-form > .button { min-height: 44px; }
.login-form .feedback-alert { margin: 0; }
.login-back { display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-size: 13px; text-decoration: none; }
.login-back:hover { text-decoration: underline; }
@media (max-width: 640px) {
    .login-main { padding: 24px 16px; }
    .login-form { padding: 28px 20px; }
}
@media (prefers-reduced-motion: reduce) {
    .panel-shell, .panel-shell .feedback-sidebar { transition: none !important; }
}
@media print {
    .panel-shell { display: block !important; }
    .panel-shell .feedback-sidebar, .shell-backdrop, .panel-footer { display: none !important; }
}
