/* KMF visual layer. Original form visibility, handlers and role gates remain authoritative. */
html.kmf-glass {
  --bg:#eef3fb; --card:rgba(255,255,255,.73); --border:rgba(172,191,220,.38);
  --line:rgba(172,191,220,.36); --line2:rgba(188,203,225,.22);
  --t1:#20334f; --t2:#627590; --t3:#8292aa;
  --blue:#386fdf; --blue-d:#2858ba; --blue-l:#edf4ff;
  --ac:#386fdf; --ac-d:#2858ba; --ac-bg:#edf4ff; --ac-line:#c4d9f7;
  --ok:#228269; --warn:#b84255; --r:23px;
  --kmf-shadow:0 12px 36px -24px rgba(43,73,124,.42),inset 0 1px 0 rgba(255,255,255,.98);
  --kmf-glass:linear-gradient(145deg,rgba(255,255,255,.89),rgba(250,253,255,.70));
  --sh:var(--kmf-shadow); color-scheme:light;
}
.kmf-glass body {
  background:#eef3fb;
  background-image:radial-gradient(ellipse at 8% 4%,rgba(177,208,255,.42),transparent 45%),radial-gradient(ellipse at 91% 34%,rgba(207,197,249,.34),transparent 47%),linear-gradient(155deg,#eff6ff 0%,#edf2fa 45%,#f0effa 100%);
  background-attachment:fixed;color:var(--t1);font-family:"Segoe UI","Microsoft YaHei",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.kmf-glass button,.kmf-glass input,.kmf-glass textarea,.kmf-glass select {font:inherit}
.kmf-glass a,.kmf-glass button,.kmf-glass input,.kmf-glass textarea,.kmf-glass select {-webkit-tap-highlight-color:transparent}
.kmf-glass :focus-visible {outline:3px solid rgba(56,111,223,.55);outline-offset:3px}
.kmf-glass input:not([type=checkbox]):not([type=radio]):not([type=color]),
.kmf-glass textarea,.kmf-glass select {
  min-height:43px;border:1px solid rgba(176,195,224,.6);border-radius:13px;
  background:rgba(255,255,255,.79);box-shadow:inset 0 1px 2px rgba(49,76,119,.035),0 1px 0 rgba(255,255,255,.7);
  padding:10px 13px;color:#263953;transition:border-color .16s,box-shadow .16s;
}
.kmf-glass input::placeholder,.kmf-glass textarea::placeholder {color:#8898af;opacity:1}
.kmf-glass input:focus,.kmf-glass textarea:focus,.kmf-glass select:focus {
  border-color:#82a8ef;box-shadow:0 0 0 4px rgba(70,121,216,.10),inset 0 1px 1px rgba(255,255,255,.8);outline:none;
}
.kmf-glass input[type=checkbox],.kmf-glass input[type=radio] {accent-color:var(--blue);width:17px;height:17px;flex:none}
.kmf-glass label {color:#5b6e88;letter-spacing:.01em}
.kmf-glass .btn,.kmf-glass .tabs button,.kmf-glass .tab {
  border-radius:13px;min-height:40px;line-height:1.45;gap:7px;white-space:normal;
  transition:background .16s,box-shadow .16s,border-color .16s,transform .16s;
}
.kmf-glass .btn {box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 4px 9px -6px rgba(30,67,135,.36)}
.kmf-glass .btn-p,.kmf-user .btn:not(.btn-s):not(.btn-d):not(.btn-ok),.kmf-register .btn:not(.btn-s) {
  color:#fff;background:linear-gradient(160deg,#4d85ed,#3268d6);border:1px solid rgba(56,105,204,.25);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32),0 8px 17px -10px rgba(42,93,198,.65);
}
.kmf-glass .btn-p:hover,.kmf-user .btn:not(.btn-s):not(.btn-d):not(.btn-ok):hover,.kmf-register .btn:not(.btn-s):hover {
  background:linear-gradient(160deg,#5b90f6,#3972df);
}
.kmf-glass .btn-s,.kmf-glass .btn-g {background:rgba(255,255,255,.74);border:1px solid rgba(179,199,230,.57);color:#375577}
.kmf-glass .btn-s:hover,.kmf-glass .btn-g:hover {background:#fff;border-color:#a8c2ed}
.kmf-glass .btn-d {background:#fff5f6;border-color:#efd4dc;color:#b2445a}
.kmf-glass .btn-ok {background:#f0faf6;border-color:#cbe6d9;color:#257b62}
.kmf-glass .btn-xs {min-height:30px;border-radius:9px;padding:5px 10px;font-size:12px}
.kmf-glass .btn:active:not(:disabled) {transform:translateY(1px)}
.kmf-glass .btn:disabled {cursor:not-allowed;opacity:.48;transform:none;box-shadow:none}
.kmf-glass .card,.kmf-glass .panel,.kmf-glass .stat,.kmf-glass .modal-card,
.kmf-glass .login-card,.kmf-glass .feat-card,.kmf-glass .member-card,.kmf-glass .shot,
.kmf-glass .news-box,.kmf-glass .ver-box,.kmf-glass .guide-box,.kmf-glass .kmf-glass-card {
  background:var(--kmf-glass);border:1px solid rgba(255,255,255,.89);outline:1px solid rgba(181,198,224,.3);
  border-radius:23px;box-shadow:var(--kmf-shadow);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);
}
.kmf-glass .card {padding:27px 29px;margin-bottom:22px}
.kmf-glass .card h2,.kmf-glass .panel-h h3 {letter-spacing:-.02em;color:#203653}
.kmf-glass .panel {overflow:hidden}
.kmf-glass .panel-h {padding:17px 21px;background:rgba(247,251,255,.48);border-bottom-color:rgba(176,195,224,.27)}
.kmf-glass .panel-b {padding:21px;overflow-x:auto}
.kmf-glass .stat {padding:19px 21px}
.kmf-glass .stat .v {font-size:27px;letter-spacing:-.8px}
.kmf-glass .tag {border-radius:8px;padding:3px 10px}
.kmf-glass .tabs {gap:6px;flex-wrap:wrap}
.kmf-glass .tabs button,.kmf-glass .tab {border:1px solid rgba(179,199,230,.55);background:rgba(255,255,255,.65);color:#5b7090}
.kmf-glass .tabs button.on,.kmf-glass .tab.on {background:linear-gradient(150deg,#4d82e4,#386fda);color:#fff;border-color:transparent;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 7px 16px -10px #386fdf}
.kmf-glass .msg {border-radius:13px;line-height:1.65;overflow-wrap:anywhere}
.kmf-glass .msg.err {background:#fff0f3;border-color:#efd0d9;color:#aa3e53}
.kmf-glass .msg.ok {background:#eff9f5;border-color:#c9e3d7;color:#26775e}
.kmf-glass .nav {background:rgba(255,255,255,.67);backdrop-filter:blur(22px) saturate(155%);-webkit-backdrop-filter:blur(22px) saturate(155%);border-color:rgba(255,255,255,.9);box-shadow:0 7px 25px -23px #37537e}
.kmf-glass .brand .mark,.kmf-glass .logo-mark,.kmf-glass .login-card .lg .m,.kmf-glass .side .brand .m {border-radius:12px;background:linear-gradient(140deg,#79a9f7,#3b73dc);box-shadow:inset 0 1px 0 #c7ddff,0 5px 12px -7px #386fdf}
.kmf-glass .nav-in {height:68px}
.kmf-glass .footer {background:rgba(249,252,255,.4);border-color:rgba(184,202,230,.27);color:#70849e}
.kmf-glass .kv {border-bottom-color:rgba(173,195,223,.38);padding:11px 0}
.kmf-glass table {font-size:13px}
.kmf-glass th {padding:13px 12px;color:#70839c;background:rgba(237,243,252,.56);border-color:rgba(177,195,222,.3)}
.kmf-glass td {padding:12px;border-color:rgba(177,195,222,.23)}
.kmf-glass tr:hover td {background:rgba(236,244,255,.7)}
.kmf-glass .pager {padding:15px 20px;flex-wrap:wrap;gap:10px;background:rgba(246,250,255,.46)}
.kmf-glass .hint {line-height:1.7;color:#72859e}
.kmf-glass .toast {background:rgba(35,54,85,.94);border:1px solid rgba(255,255,255,.18);border-radius:14px;box-shadow:0 10px 28px -12px #263e64;max-width:calc(100vw - 24px);overflow-wrap:anywhere}
.kmf-glass #modal {background:rgba(39,55,82,.24);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:18px}
.kmf-glass .modal-card {padding:28px;max-height:calc(100vh - 36px);overscroll-behavior:contain}
.kmf-glass .modal-card h3 {font-size:19px}
.kmf-glass .gen-result {border-radius:13px;background:rgba(245,249,255,.8);border-color:#cbdcf4;overflow-wrap:anywhere}

/* Landing page */
.kmf-portal .nav {max-width:1156px;width:calc(100% - 32px);margin:14px auto 0;border:1px solid rgba(255,255,255,.92);border-radius:22px;top:12px}
.kmf-portal .nav-in {gap:18px;padding:0 18px}
.kmf-portal .wrap {max-width:1130px}
.kmf-portal .notice {max-width:1112px;margin:13px auto 0;width:calc(100% - 60px);border:1px solid rgba(255,255,255,.82);background:rgba(255,255,255,.46);border-radius:14px}
.kmf-portal .notice-in {padding:8px 0}
.kmf-portal .hero {padding:77px 0 62px}
.kmf-portal .hero-grid {opacity:.2;background-size:58px 58px}
.kmf-portal .hero-glow {opacity:.65}
.kmf-portal h1.hero-title {font-size:58px;font-weight:750;letter-spacing:-1.9px;color:#264267;background:linear-gradient(150deg,#233753,#4875b6);-webkit-background-clip:text;background-clip:text}
.kmf-portal .hero .lead {max-width:620px;line-height:1.9}
.kmf-portal .kicker,.kmf-portal .hero .tags span,.kmf-portal .callout {background:rgba(255,255,255,.72);border-color:rgba(255,255,255,.96);box-shadow:var(--kmf-shadow)}
.kmf-portal .hero .stats {max-width:520px;margin:30px auto 0;border-top-color:rgba(154,181,221,.32)}
.kmf-portal .hero .btn {min-height:48px;padding:12px 25px;border-radius:15px}
.kmf-portal .sec {background:transparent!important;padding:55px 0}
.kmf-portal .sec-head h2 {font-size:29px;color:#273e5e}
.kmf-portal .feat-card:hover {transform:translateY(-3px);box-shadow:0 17px 32px -23px rgba(34,75,139,.5),inset 0 1px 0 #fff}
.kmf-portal .member-card.hl {background:linear-gradient(145deg,rgba(235,245,255,.96),rgba(241,239,255,.9));border-color:#c1d7fa}
.kmf-portal .shot {padding:13px;border-radius:26px}
.kmf-portal .shot img {border-radius:16px}
.kmf-portal .fake {background:rgba(251,253,255,.78);border-radius:16px}
.kmf-portal #toTop {border-radius:15px;background:rgba(255,255,255,.86);color:#3d6bab;border-color:#d3e1f5;box-shadow:var(--kmf-shadow)}

/* Accounts and authentication */
.kmf-user .wrap {max-width:1100px;padding-top:32px}
.kmf-user .nav-in {max-width:1100px}
.kmf-user #app > .grid2 {display:flex;flex-wrap:wrap}
.kmf-user #app > .grid2 > .card {flex:1 1 360px;min-width:0}
.kmf-user #loginBox {max-width:448px;margin:54px auto 26px;padding:34px}
.kmf-user #loginBox h1,.kmf-register h1 {font-size:27px;letter-spacing:-.5px}
.kmf-user #loginBox .sub,.kmf-register .sub {line-height:1.8;margin:10px 0 25px}
.kmf-user #loginBox .btn,.kmf-register #btn,.kmf-register #rBtn {min-height:47px}
.kmf-user #logBody {overflow:auto}
.kmf-register .wrap {max-width:508px;padding-top:40px}
.kmf-register #formCard {padding:32px}
.kmf-register .tabs {padding:5px;background:rgba(221,233,250,.52);border-radius:16px}
.kmf-register .tabs button {min-width:0;border:0;background:transparent;border-radius:12px}
.kmf-register .tabs button.on {background:rgba(255,255,255,.98);box-shadow:0 3px 9px -6px #6282ad;color:#356ac9}

/* Admin remains the same navigation and role-aware layout. */
.kmf-admin .layout {padding:14px;gap:16px}
.kmf-admin .side {width:222px;position:sticky;top:14px;height:calc(100vh - 28px);border-radius:25px;background:rgba(247,251,255,.75);border:1px solid rgba(255,255,255,.95);outline:1px solid rgba(179,198,226,.22);box-shadow:var(--kmf-shadow);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);color:#69809f}
.kmf-admin .side .brand {color:#2c466a;padding:23px 19px 20px}
.kmf-admin .side nav {padding:3px 11px 12px}
.kmf-admin .side nav a {padding:11px 13px;margin:3px 0;border-radius:13px;color:#657c9b}
.kmf-admin .side nav a:hover {background:rgba(222,234,252,.7);color:#355d99}
.kmf-admin .side nav a.on {background:linear-gradient(140deg,#5287e9,#386edd);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 7px 15px -12px #3163bf}
.kmf-admin .side .foot {border-top-color:rgba(178,199,228,.3);padding:14px}
.kmf-admin .side .foot .btn {background:rgba(226,236,252,.63);color:#5b77a0;border:1px solid rgba(195,211,237,.42)}
.kmf-admin .main {padding:14px 12px 20px;min-width:0}
.kmf-admin .topbar {min-height:42px;margin-bottom:23px;gap:14px}
.kmf-admin .topbar h2 {font-size:24px;letter-spacing:-.5px}
.kmf-admin .topbar .st {background:rgba(255,255,255,.7);border-color:rgba(255,255,255,.9);padding:7px 14px;color:#7087a3}
.kmf-admin #navBtn {background:rgba(255,255,255,.87);color:#4870a9;border:1px solid rgba(195,214,241,.55);border-radius:12px}
.kmf-admin #login {background:radial-gradient(ellipse at 24% 20%,rgba(175,208,255,.44),transparent 50%),radial-gradient(ellipse at 86% 80%,rgba(214,198,247,.42),transparent 55%),#eff4fc;padding:24px;overflow:auto}
.kmf-admin .login-card {width:408px;padding:39px;max-width:100%;border-radius:28px}
.kmf-admin .login-card h1 {font-size:24px;letter-spacing:-.6px}
.kmf-admin .login-card .lg {gap:13px;margin-bottom:12px}
.kmf-admin .login-card .lg .m {width:44px;height:44px;border-radius:15px}
.kmf-admin .login-card .sub {font-size:13px;margin-bottom:29px;color:#7a8da6}
.kmf-admin .login-card .btn {min-height:46px}

/* Optional UI-extension components. */
.kmf-glass-card {padding:26px;margin-bottom:22px}
.kmf-glass-card h2,.kmf-glass-card h3 {font-size:17px;margin:0 0 8px;color:#294363}
.kmf-glass-card p {font-size:13px;line-height:1.8;color:#71849e}
.kmf-glass-card .kmf-row {display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:16px}
.kmf-glass-card .kmf-row .btn {flex:none}
.kmf-glass-card .kmf-field {display:block;flex:1;min-width:200px}
.kmf-glass-card .kmf-feedback {min-height:22px;margin-top:12px;font-size:13px;overflow-wrap:anywhere;color:#5c779c}
.kmf-glass-card .kmf-feedback[data-error=true] {color:#b34256}
.kmf-glass .kmf-log-tabs {margin:18px 0 14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.kmf-log-table {overflow-x:auto;border:1px solid rgba(181,202,231,.42);border-radius:15px;background:rgba(255,255,255,.42)}
.kmf-log-table table {min-width:680px}
.kmf-log-pages {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:16px;color:#7387a2;font-size:12px}
.kmf-log-pages .kmf-row {margin:0}
.kmf-detail-overlay {position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:22px;background:rgba(33,51,77,.28);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.kmf-detail-dialog {width:860px;max-width:100%;max-height:calc(100vh - 44px);display:flex;flex-direction:column;background:#f8fbff;border:1px solid #fff;border-radius:24px;padding:25px;box-shadow:0 24px 70px -28px #354e73}
.kmf-detail-head {display:flex;align-items:center;gap:15px;margin-bottom:16px;flex-wrap:wrap}
.kmf-detail-head h3 {font-size:19px;flex:1;color:#294363;margin:0}
.kmf-detail-meta {font-size:12px;color:#7a8ba4;margin-bottom:13px;overflow-wrap:anywhere}
.kmf-detail-dialog pre {margin:0;min-height:120px;overflow:auto;overscroll-behavior:contain;white-space:pre-wrap;overflow-wrap:anywhere;padding:18px;border:1px solid #dce7f7;border-radius:15px;background:#f0f5fc;color:#33516d;line-height:1.8;font:12px/1.8 Consolas,"Microsoft YaHei",monospace;flex:1;tab-size:4}
.kmf-detail-dialog .kmf-feedback {min-height:20px;font-size:12px;color:#657f9e;margin-top:10px}
.kmf-log-enhanced>#logBody,.kmf-log-enhanced>.tabs {display:none}

@media(max-width:860px) {
  .kmf-admin .layout {padding:0;gap:0}
  .kmf-admin .main {padding:18px 14px}
  .kmf-admin .side {position:fixed;top:12px;left:12px;bottom:12px;height:calc(100vh - 24px);width:246px;z-index:50;transform:translateX(calc(-100% - 18px));background:rgba(244,249,255,.97)}
  .kmf-admin .side.open {transform:translateX(0)}
  .kmf-admin #blMask {background:rgba(33,51,77,.28);backdrop-filter:blur(4px)}
  .kmf-admin .topbar h2 {font-size:21px}
  .kmf-admin .panel-h {padding:15px}
  .kmf-admin .panel-b {padding:15px}
  .kmf-admin .cards {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .kmf-portal .nav-links {overflow-x:auto;white-space:nowrap}
  .kmf-portal .nav-in {gap:10px}
  .kmf-glass .modal-card {padding:22px;width:min(560px,100%);margin:0}
}
@media(max-width:640px) {
  .kmf-glass .nav-in {height:auto;min-height:62px;gap:10px;padding:14px 18px;flex-wrap:wrap}
  .kmf-glass .logo {font-size:14px;min-width:0}
  .kmf-glass .nav-in .back {font-size:12px}
  .kmf-glass .card,.kmf-glass .kmf-glass-card {padding:22px 19px;border-radius:21px}
  .kmf-glass .grid2,.kmf-glass .grid3 {grid-template-columns:minmax(0,1fr)}
  .kmf-glass .wrap {padding-left:16px;padding-right:16px}
  .kmf-user #loginBox {padding:27px 23px;margin-top:24px}
  .kmf-register .wrap {padding-top:25px}
  .kmf-register #formCard {padding:26px 23px}
  .kmf-portal .nav {width:calc(100% - 24px);margin-top:10px;border-radius:20px;top:8px}
  .kmf-portal .notice {width:calc(100% - 38px)}
  .kmf-portal .hero {padding:56px 0 39px}
  .kmf-portal h1.hero-title {font-size:38px;letter-spacing:-1px;overflow-wrap:anywhere}
  .kmf-portal .hero .sub {font-size:16px}
  .kmf-portal .hero .lead {font-size:14px}
  .kmf-portal .hero .tags {gap:7px;margin:20px 0 24px}
  .kmf-portal .hero .tags span {padding:5px 12px}
  .kmf-portal .sec {padding:36px 0}
  .kmf-portal .sec-head h2 {font-size:25px}
  .kmf-portal .feat-card {padding:22px}
  .kmf-admin .login-card {padding:29px 25px;margin:auto}
  .kmf-glass .toolbar {align-items:stretch}
  .kmf-glass .toolbar input {min-width:140px;max-width:100%}
  .kmf-glass-card .kmf-field {min-width:0;flex-basis:100%}
  .kmf-detail-overlay {padding:12px}
  .kmf-detail-dialog {padding:19px;max-height:calc(100vh - 24px);border-radius:21px}
  .kmf-detail-head h3 {flex:0 0 100%;white-space:nowrap}
  .kmf-detail-head .btn {min-height:36px;font-size:12px}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  .kmf-glass .card,.kmf-glass .panel,.kmf-glass .stat,.kmf-glass .modal-card,.kmf-glass .login-card,.kmf-glass .feat-card,.kmf-glass .member-card,.kmf-glass .shot,.kmf-glass .kmf-glass-card {background:#f9fbff}
  .kmf-glass .nav,.kmf-admin .side {background:#f4f8ff}
  .kmf-detail-overlay,.kmf-glass #modal {background:rgba(31,48,74,.52)}
}
@media(prefers-reduced-motion:reduce) {
  .kmf-glass * {scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
@media(forced-colors:active) {
  .kmf-glass .card,.kmf-glass .panel,.kmf-glass .btn,.kmf-glass input,.kmf-glass textarea,.kmf-glass select,.kmf-glass .kmf-glass-card {border:1px solid CanvasText;box-shadow:none;outline:none}
  .kmf-portal h1.hero-title {-webkit-text-fill-color:CanvasText}
}
