/* iOS-inspired light appearance. Layout and account settings are unchanged. */
:root{color-scheme:light;--bg:#f2f2f7;--bg2:#f2f2f7;--panel:#fff;--panel2:#fff;--panel3:#f2f2f7;--line:#e5e5ea;--line2:#d1d1d6;--pri:#007aff;--pri2:#007aff;--mag:#af52de;--amb:#a76800;--grn:#248a3d;--red:#d70015;--blu:#007aff;--tx:#1c1c1e;--tx2:#636366;--tx3:#737378;--grad:#007aff;--grad-m:#007aff;--sh:0 2px 12px #00000008;--glow:none}
html.ios{scroll-behavior:auto}
html.ios body{background:#f2f2f7;color:#1c1c1e;font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text','Helvetica Neue','PingFang SC','Microsoft YaHei',sans-serif;letter-spacing:0}
html.ios body:before,html.ios body:after{display:none}
html.ios ::selection{background:#007aff25}
html.ios *{scrollbar-color:#c7c7cc transparent}
html.ios .m-app{box-shadow:none;border:0;max-width:760px}
html.ios .m-body{padding-left:16px;padding-right:16px}
html.ios :is(.m-card,.card,.stat,.auth-card,.slot-block,.node-card,.setup-step,.link-chip){background:#fff;box-shadow:none;border:1px solid #e5e5ea;border-radius:12px}
html.ios :is(.hero,.copy-btn,.brand-logo){background:#007aff;box-shadow:none;color:#fff}
html.ios .hero{padding:20px;border-radius:16px;border:0}
html.ios .hero:before,html.ios .hero:after{display:none}
html.ios .hero :is(.h-l,.h-d){color:#ffffffd9}
html.ios .hero .h-v{color:#fff;font-weight:700}
html.ios .hero .h-ring{display:none}
html.ios :is(.btn,.inp,.chip,.m-opt,.m-skin,.quick button){box-shadow:none;text-shadow:none;transition:background-color .12s,border-color .12s}
html.ios .btn{background:#f2f2f7;color:#007aff;border:0;border-radius:9px;font-weight:500}
html.ios :is(.btn-pri,.copy-btn){background:#007aff;color:#fff;border:0;box-shadow:none}
html.ios .btn-danger{background:#fff1f0;color:#d70015}
html.ios .btn-ghost{background:transparent;color:#007aff}
html.ios .btn:disabled{color:#8e8e93;opacity:.55}
html.ios .inp{background:#f2f2f7;color:#1c1c1e;border:1px solid transparent;border-radius:9px;box-shadow:none}
html.ios .inp:focus{border-color:#007aff;box-shadow:none}
html.ios .inp::placeholder{color:#8e8e93}
html.ios .lbl{color:#636366;font-weight:400}
html.ios .m-tabbar{max-width:760px;background:rgba(249,249,249,.96);border-top:1px solid #d1d1d6;box-shadow:none;backdrop-filter:blur(12px)}
html.ios .m-tab{color:#737378;font-size:11px}
html.ios .m-tab.active{color:#007aff}
html.ios .m-tab.active:before,html.ios .m-tab-ind{display:none}
html.ios .m-tab .ic{stroke-width:1.7}
html.ios .quick{gap:8px}
html.ios .quick button{background:#fff;border:0;border-radius:12px;color:#1c1c1e;padding:12px 4px}
html.ios .quick .q-ic{background:#f2f2f7;color:#007aff;border-radius:9px}
html.ios .m-sec-t{font-weight:600;color:#636366;font-size:13px}
html.ios .m-row{border-bottom-color:#e5e5ea}
html.ios .m-row .r-ic{background:#f2f2f7;color:#007aff}
html.ios :is(.pill,.badge){background:#f2f2f7;border:0;color:#636366}
html.ios .p-ok{color:#248a3d;background:#eef8f0}
html.ios .p-err{color:#d70015;background:#fff1f0}
html.ios :is(.banner.info,.banner.warn){background:#fff;border:1px solid #e5e5ea;color:#636366;box-shadow:none}
html.ios .chip{border:0;background:#e9e9ee;color:#636366}
html.ios .chip.active{background:#fff;color:#1c1c1e;font-weight:600;box-shadow:0 1px 3px #00000012}
html.ios #skin-zone .primary-categories{display:flex;gap:2px;padding:3px;background:#e3e3e8;border-radius:10px;flex-wrap:nowrap}
html.ios #skin-zone .primary-categories .chip{flex:1;padding:7px 4px;min-height:34px;border-radius:7px;font-size:13px;background:transparent;color:#636366}
html.ios #skin-zone .primary-categories .chip.active{background:#fff;color:#1c1c1e;box-shadow:0 1px 3px #00000018}
html.ios #skin-zone .subcategories{border-bottom:1px solid #e5e5ea}
html.ios #skin-zone .subcategories .chip{background:transparent;box-shadow:none;color:#636366}
html.ios #skin-zone .subcategories .chip.active{color:#007aff}
html.ios .skin-search-bar{background:#e9e9ee!important;border:0!important;border-radius:10px!important;box-shadow:none!important;backdrop-filter:none}
html.ios .skin-search-bar .inp{background:transparent}
html.ios :is(.m-skin,.m-opt){background:#fff;border:1px solid #e5e5ea;border-radius:10px}
html.ios :is(.m-skin.sel,.m-opt.sel){border-color:#007aff;box-shadow:inset 0 0 0 1px #007aff;background:#f0f6ff}
html.ios .sel-badge{background:#007aff;color:#fff}
html.ios :is(.skin-list .thumb,.skin-list .o-thumb,.skin-list .thumb img,.skin-list .o-thumb img){background:#fff}
html.ios .skin-list .ms-n{color:#1c1c1e;font-weight:500}
html.ios .skin-list .ms-b{color:#737378}
html.ios .thumb-skel{background:#f2f2f7;animation:none}
html.ios #profile-settings .settings-section{background:#fff;border:0;border-radius:12px;padding:0 12px}
html.ios #profile-settings summary{font-weight:600;color:#1c1c1e}
html.ios #profile-settings .chips{gap:4px;background:#e3e3e8;border-radius:9px;padding:3px}
html.ios #profile-settings .chips .chip{flex:1;min-height:32px;border-radius:6px;padding:6px}
html.ios .switch{width:44px;height:26px;min-width:44px}
html.ios .switch .tr{background:#e5e5ea;border:0}
html.ios .switch .tr:after{width:22px;height:22px;left:2px;top:2px;background:#fff;box-shadow:0 1px 3px #0002}
html.ios .switch input:checked+.tr{background:#34c759}
html.ios .switch input:checked+.tr:after{left:20px}
html.ios input[type=checkbox]{accent-color:#007aff}
html.ios :is(.modal,.drawer,.sidebar,.topbar,.m-savebar){background:#fff;color:#1c1c1e;box-shadow:0 8px 32px #00000016;border-color:#e5e5ea}
html.ios .modal-wrap .m-scrim{background:#0005;backdrop-filter:blur(2px)}
html.ios .auth-tabs .auth-tab.active{color:#007aff}
html.ios .auth-card{backdrop-filter:none;padding:28px}
html.ios .auth-h :is(span,em){background:none;color:#007aff;-webkit-text-fill-color:#007aff}
html.ios .auth-node{background:#fff;color:#636366}
html.ios :is(.reveal,.tab-anim,.press){animation:none}
html.ios :is(.m-skin:hover,.skin-card:hover,.quick button:active){transform:none}
html.ios .toast{background:#313135;color:#fff;border:0;box-shadow:0 3px 15px #0002}
@media(min-width:761px){html.ios .m-body{padding-left:24px;padding-right:24px}}
html.ios .auth-left:before,html.ios .auth-left:after{display:none}
html.ios .auth-h1 .grad-t{background:none;color:#007aff;-webkit-text-fill-color:#007aff}
html.ios .thumb:after{display:none}
html.ios .thumb .ic{color:#c7c7cc;filter:none}
html.ios :is(.m-tab,.btn,.chip,.copy-btn,.quick button,.skin-list .m-skin){transition:background-color .16s ease,color .16s ease,opacity .16s ease,transform .16s cubic-bezier(.2,.8,.2,1)}
html.ios :is(.btn,.copy-btn,.quick button):active{opacity:.65;transform:scale(.98)}
html.ios :is(.m-tab,.chip,.skin-list .m-skin):active{opacity:.65}
html.ios .switch .tr{transition:background-color .22s ease}
html.ios .switch .tr:after{transition:left .22s cubic-bezier(.25,.8,.25,1)}
@keyframes ios-page{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
html.ios .tab-anim{animation:ios-page .2s ease-out both}
html.ios .reveal{opacity:1;transform:none;animation:none;transition:none}
html.ios .modal-wrap{transition:opacity .24s ease}
html.ios .modal{transform:translateY(16px) scale(.98);transition:transform .28s cubic-bezier(.2,.8,.2,1);border:0;border-radius:16px}
html.ios .modal-wrap.show .modal{transform:translateY(0) scale(1)}
html.ios .modal .m-h,html.ios .modal .m-f{border-color:#e5e5ea;background:#fff}
html.ios .modal .m-h{padding:16px}
html.ios .modal .m-h .icon-btn{background:#f2f2f7;border-radius:50%;color:#636366}
html.ios .auth-card{border:0;border-radius:16px}
html.ios input,html.ios select{font-size:16px}
@media(max-width:600px){html.ios .modal-wrap{align-items:flex-end;padding:0}html.ios .modal{width:100%;max-width:none;max-height:90dvh;border-radius:18px 18px 0 0;transform:translateY(100%);padding-bottom:env(safe-area-inset-bottom)}html.ios .modal-wrap.show .modal{transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){html.ios *,html.ios *:before,html.ios *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Shared secondary pages and administrative controls. */
html.ios :is(.public-guide-header,.public-guide-footer){border-color:#e5e5ea;background:transparent}
html.ios .public-guide-main{padding-top:22px}
html.ios .setup-intro h2{font-weight:700;letter-spacing:-.5px}
html.ios :is(.setup-routes,.setup-fallback){background:#fff;border-color:#e5e5ea;border-radius:12px}
html.ios .nav-item.active{background:#007aff12;color:#007aff;border-color:transparent;box-shadow:none}
html.ios :is(.nav-item:hover,.tbl tbody tr:hover){background:#f2f2f7}
html.ios :is(.tbl th,.card-h,.m-h,.m-f,.drawer-h,.drawer-f){background:#fff;color:#636366;border-color:#e5e5ea}
html.ios :is(.tbl td,.tbl th,.card-h){border-color:#e5e5ea}
html.ios :is(.dd,.search-pop,.code-box,.kv,.device,.notice){background:#fff;border-color:#e5e5ea;color:#1c1c1e;box-shadow:none}
html.ios :is(.s-item:hover,.dd-item:hover){background:#f2f2f7}
html.ios .pg-btn.active{background:#007aff;color:#fff}
html.ios :is(.sidebar .brand-name,.card-t,.stat .v){color:#1c1c1e}
html.ios .code-box .code{color:#007aff}
html.ios .avatar{background:#e8f2ff;color:#007aff;box-shadow:none}
html.ios .ring{display:none}

/* Legible light-theme messages, including inherited emphasis from the dark theme. */
html.ios .banner{background:#fff;border-color:#e5e5ea;color:#48484a;box-shadow:none}
html.ios .banner b,html.ios .banner strong{color:inherit;-webkit-text-fill-color:currentColor}
html.ios .banner.vip,html.ios .banner.info{background:#eef5ff;color:#24538a;border-color:#d6e5fa}
html.ios .banner.warn{background:#fff8e9;color:#775000;border-color:#f0dfb9}
html.ios .banner.err{background:#fff1f0;color:#a52121;border-color:#f3d2d2}
html.ios .banner.ok{background:#eef8f0;color:#246535;border-color:#d4e9d8}
html.ios .grad-t{background:none;color:var(--pri);-webkit-text-fill-color:currentColor}
html.ios .m-app>.m-body,html.ios .m-app>.m-body:has(#skin-zone){padding-top:calc(12px + env(safe-area-inset-top,0px))!important;padding-bottom:calc(80px + env(safe-area-inset-bottom,0px))!important}
html.ios .skin-search-bar{position:static!important;top:auto!important;margin:8px 0 10px}
html.ios .skin-search-bar input{min-width:0;font-size:16px;color:#1c1c1e;-webkit-text-fill-color:#1c1c1e}

html.ios :is(.icon-btn:hover,.tab.active,.opt.sel .o-name,.m-opt.sel .o-n){color:#007aff}
html.ios :is(.role-tag,.role-tag.user,.p-vip){background:#eef5ff;color:#24538a;border-color:#d6e5fa}
html.ios .r-legend{background:#fff8e9;color:#775000;border-color:#f0dfb9}
html.ios .r-epic{background:#f4effa;color:#694394;border-color:#dfd0ed}
html.ios .r-rare{background:#eef5ff;color:#24538a;border-color:#d6e5fa}

html.ios .home-actions{display:grid;gap:12px;margin:18px 0 16px}
html.ios .import-btn{min-height:54px;background:#e8f2ff;border:1px solid #cddff7;color:#007aff;border-radius:12px;font-weight:600;box-shadow:none}
html.ios .import-btn:disabled{color:#737378;background:#e9e9ee;border-color:#dedee4;cursor:default}
html.ios .renewal-entry{margin-bottom:20px}
html.ios .skin-search-bar input::placeholder{color:#8e8e93;-webkit-text-fill-color:#8e8e93;opacity:1}
/* Shared management pages: grouped surfaces and readable controls. */
html.ios .shell{background:#f2f2f7}
html.ios .sidebar{background:#f9f9fb;box-shadow:none;backdrop-filter:none;border-right:1px solid #e5e5ea}
html.ios .nav-group{font-size:12px;letter-spacing:0;font-weight:500}
html.ios .nav-item{min-height:42px;font-weight:500}
html.ios .nav-item.active{background:#e6effb;color:#0065d5}
html.ios .nav-item.active:before{display:none}
html.ios .shell .topbar{background:#f9f9fb;box-shadow:none;backdrop-filter:none}
html.ios .shell :is(.stat-v,.ph-title,.node-card b){color:#1c1c1e;letter-spacing:0}
html.ios .shell .stat-ic{background:#eef5ff;color:#007aff;box-shadow:none;border-radius:10px}
html.ios .shell :is(.card,.stat,.node-card){background:#fff;border:1px solid #e5e5ea;border-radius:14px;box-shadow:none}
html.ios .shell .card.hover:hover{transform:none;box-shadow:none}
html.ios .shell :is(.sel,.txta,.tb-search,.toolbar,.seg){background:#f2f2f7;color:#1c1c1e;border-color:#e5e5ea;box-shadow:none}
html.ios .shell .seg-btn.active{background:#fff;color:#007aff;box-shadow:0 1px 3px #0001}
html.ios .shell :is(.tbl .sel-row,.bulk-bar){background:#eef5ff;color:#24538a}
html.ios .shell .page-head{align-items:center}
html.ios .shell :is(.brand-sub,.side-foot){letter-spacing:0;line-height:1.6}
@media(max-width:760px){html.ios .shell .page{padding:16px 12px 40px}html.ios .shell .topbar{padding-top:env(safe-area-inset-top);height:calc(62px + env(safe-area-inset-top))}html.ios .shell .sidebar{padding-top:env(safe-area-inset-top)}}

html.ios .shell .stat:before,html.ios .shell .stat:after{display:none}
html.ios .shell .progress{background:#e5e5ea}
html.ios .shell .avatar{background:#e8f2ff!important;color:#007aff}

/* Management resources and dismissible mobile navigation. */
.sidebar-backdrop,.sidebar-close{display:none}
html.ios #admin-skin-results .skin-card{background:#fff;border:1px solid #e5e5ea;border-radius:14px;overflow:hidden;box-shadow:none}
html.ios #admin-skin-results .thumb{position:relative;background:#f2f2f7;aspect-ratio:1.3;height:auto}
html.ios #admin-skin-results .thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:1}
html.ios #admin-skin-results .thumb>svg{color:#c7c7cc}
html.ios #admin-skin-results .skin-name{color:#1c1c1e;font-weight:600}
html.ios #admin-skin-results .skin-base,html.ios #admin-skin-results .skin-foot{color:#6c6c70}
html.ios #admin-skin-results .skin-foot{border-top:1px solid #eee;background:#fff}
html.ios #admin-skin-results .skin-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
@media(max-width:760px){
 .shell.menu-open .sidebar-backdrop{display:block;position:fixed;inset:0;border:0;background:rgba(0,0,0,.28);z-index:79}
 .sidebar .sidebar-close{display:flex;margin-left:auto;flex-shrink:0}
 html.ios .shell .toolbar{flex-wrap:wrap;gap:12px}
 html.ios .shell .toolbar .search-box{width:100%;min-width:0}
 html.ios .shell .toolbar .chips{width:100%;flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}
 html.ios #admin-skin-results .skin-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
}

@media(max-width:760px){html.ios .shell .toolbar .search-box{flex:0 0 100%;max-width:100%}html.ios .shell .toolbar .search-box input{width:100%;min-width:0}}
