:root{color-scheme:dark;--ink:#f5f5f7;--muted:#a1a1aa;--line:#ffffff16;--surface:#1c1c1e;--blue:#64b5ff}
html{scroll-behavior:smooth}body{background:#080809;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}
main{position:relative;isolation:isolate;max-width:560px;width:100%;padding:38px 22px 130px;background:radial-gradient(ellipse 500px 400px at 100% 0,#32364066,transparent 80%),#101011;min-height:100vh;overflow:hidden}
main:before{content:"";position:absolute;z-index:-1;right:-135px;top:-140px;width:390px;height:390px;border-radius:50%;background:radial-gradient(circle at 33% 26%,#333840,#121315 60%,#050506 74%);box-shadow:inset 0 1px 2px #bcc9df55,0 30px 100px #0005;animation:orb-arrive 1.6s cubic-bezier(.16,1,.3,1) both;pointer-events:none}
header{margin:0 2px 30px;position:relative}header small{color:#a9a9b1;font-size:11px;letter-spacing:.5px}header h1{color:#f5f5f7;font-size:32px;line-height:1.25;letter-spacing:-1.4px;font-weight:700;margin:12px 0}header p{color:#a1a1aa;font-size:13px;line-height:1.8;max-width:330px}h3{color:#eeeef0;font-weight:600;letter-spacing:-.3px}small,.muted,.post small{color:#a1a1aa}.build{color:#75757c}
.hero{border:1px solid #ffffff1c;border-radius:24px;background:linear-gradient(135deg,#f7f7fa,#d6d8df);color:#161618;box-shadow:0 12px 36px #0003,inset 0 1px 0 #fff;padding:24px;margin:12px 0;overflow:hidden}.hero b{font-size:21px;letter-spacing:-.7px}.hero small{color:#515158;line-height:1.7;font-size:12px;max-width:85%}.hero>span{color:#34343a}.hero.light{background:linear-gradient(130deg,#29292d,#1a1a1d);border:1px solid #ffffff1c;box-shadow:inset 0 1px 0 #ffffff08;color:#f5f5f7}.hero.light small{color:#aaaab3}.hero.light>span{color:#d0d0d6}.hero .btn{background:#1a1a1e;color:#f5f5f7}
.box{background:linear-gradient(145deg,#232326dd,#19191be8);border:1px solid var(--line);border-radius:24px;padding:22px 16px;box-shadow:0 12px 40px #0002,inset 0 1px 0 #ffffff04;margin-top:20px}.section-title{margin-bottom:16px}.menu-card{background:linear-gradient(120deg,#ffffff07,#ffffff02);color:#eeeef1;border:1px solid #ffffff08;border-radius:16px;padding:16px 12px;margin:10px 0}.menu-card small{color:#9999a3;line-height:1.65}.menu-card>span:last-child{color:#8b8b95}.icon{background:#ffffff0a;color:#dedee6;border:1px solid #ffffff0c;border-radius:11px}.avatar{background:linear-gradient(140deg,#484851,#1f1f24);color:#eeeef2;border:1px solid #ffffff25}
.btn{background:#ffffff0c;color:#dddde4;border:1px solid #ffffff0c;border-radius:999px;padding:11px 16px}.btn.primary{background:#f0f0f5;color:#17171b;border-color:transparent;box-shadow:0 2px 10px #0002}.tabs{background:#08080966;border:1px solid #ffffff09;border-radius:17px;padding:5px;gap:4px;overflow:auto;flex-wrap:nowrap}.tabs .btn{padding:10px 12px;background:transparent;color:#9999a6;border-color:transparent;min-width:max-content;box-shadow:none}.tabs .primary{background:#3a3a40;color:#fff;outline:none;box-shadow:0 2px 6px #0004;border:1px solid #ffffff12}.pill{background:#ffffff0c;color:#bcbcc8;border:1px solid #ffffff10}.account-status,.row{background:#ffffff05;border:1px solid #ffffff08}.account-status p{color:#a1a1ad}
input:not([type=checkbox]),textarea,select,.input{background:#101012;color:#ececf1;border:1px solid #ffffff20;border-radius:14px;padding:13px;font:inherit}input::placeholder,textarea::placeholder{color:#767680}input:focus,textarea:focus,select:focus{border-color:#8ebfff;outline:3px solid #72b4ff20}input[type=checkbox]{accent-color:#b8d8ff}label{color:#d4d4dd}.post{background:#151517;border:1px solid #ffffff12;border-radius:16px}.post p{color:#b1b1bc}.hot-choice{color:#e9e9ee}.hot-heat{color:#90909d}.hot-link,a{color:#82beff}.notice{background:#ffffff08;color:#b6b6c2;border:1px solid #ffffff09}.danger{color:#ff9b9f}.ok{color:#93dcb6}.role{background:#ffffff07;border-color:#ffffff20}.role p{color:#aaaab8}.stats,.steps{background:#ffffff05;border:1px solid #ffffff0c}.steps b{background:#35353e;color:#eeeef7}.empty{color:#a0a0ae}.image-card{background:#111114;border-color:#ffffff18}.rights{color:#b9b9c4}.article-body{color:#eeeef4}details{border-color:#ffffff10}details p{color:#aaaab6}
nav{width:min(calc(100% - 24px),530px);bottom:12px;border:1px solid #ffffff22;border-radius:25px;background:#242426c9;backdrop-filter:blur(28px) saturate(1.4);-webkit-backdrop-filter:blur(28px) saturate(1.4);box-shadow:0 12px 40px #0008,inset 0 1px 0 #ffffff10;padding:9px 5px calc(9px + env(safe-area-inset-bottom));z-index:10}nav button{position:relative;color:#8c8c98;border-radius:17px;padding:6px 0;transition:color .25s,background .3s,transform .35s cubic-bezier(.2,.8,.2,1)}nav button span{font-size:21px}nav button.active{color:#f5f5f7;background:#ffffff10;box-shadow:inset 0 1px 0 #ffffff08}
button{transition:transform .32s cubic-bezier(.16,1,.3,1),box-shadow .3s,background .3s,border-color .3s; -webkit-tap-highlight-color:transparent}button:active{transform:scale(.965)}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #86bfff;outline-offset:3px}.menu-card:hover{border-color:#ffffff25;background:#ffffff0b}.hero:hover{box-shadow:0 15px 40px #0005,0 0 0 1px #ffffff18;transform:translateY(-2px)}.btn:hover{filter:brightness(1.12)}.image-card:has(input:checked),.post:has(input:checked){border-color:#9fbedc;background:#a9cfff0a;box-shadow:0 0 0 1px #95bde329}.material-images img{transition:transform .5s}.material-images img:hover{transform:scale(1.025)}#panel>header,#panel>.hero,#panel>.menu-card,#panel>.box,#panel>.stats{animation:rise-in .65s cubic-bezier(.16,1,.3,1) both}#panel>:nth-child(2){animation-delay:.04s}#panel>:nth-child(3){animation-delay:.08s}#panel>:nth-child(4){animation-delay:.12s}#panel>:nth-child(5){animation-delay:.16s}.hot-row{animation:rise-in .45s cubic-bezier(.16,1,.3,1) both}.hot-row:nth-child(2){animation-delay:.025s}.hot-row:nth-child(3){animation-delay:.05s}.hot-row:nth-child(4){animation-delay:.075s}iframe{border-radius:14px;color-scheme:light}
@keyframes rise-in{from{opacity:0;transform:translateY(15px);filter:blur(3px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}@keyframes orb-arrive{from{opacity:0;transform:translate(30px,-15px) scale(.9)}to{opacity:1;transform:none}}
@media(hover:hover){.menu-card:hover{transform:translateY(-2px)}nav button:hover{color:white;background:#ffffff08}}@media(max-width:380px){main{padding:26px 14px 130px}header h1{font-size:28px}.hot-row{gap:5px}.hot-choice b{font-size:12px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

.works-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:16px}.work-tile{margin:0!important;padding:16px 13px;border-radius:18px;aspect-ratio:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}.work-tile .pill{align-self:flex-start;font-size:10px;padding:4px 7px}.work-tile h3{font-size:14px;line-height:1.6;margin:12px 0 8px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.work-tile .work-meta{font-size:11px;margin-top:auto}.work-tile .actions{margin:10px 0 0}.work-tile .btn{font-size:11px;padding:7px 12px}.work-tile:hover{border-color:#ffffff30}@media(max-width:360px){.work-tile{aspect-ratio:auto;min-height:190px;padding:13px 10px}.works-grid{gap:9px}}

.work-tile{aspect-ratio:auto;min-height:260px;padding:10px;position:relative}.work-thumb{display:block;width:100%;height:120px;object-fit:cover;object-position:center;border-radius:11px;margin-bottom:10px;background:#2b2b30;flex-shrink:0}.work-thumb-empty{display:grid;place-items:center;color:#858590;font-size:12px;background:linear-gradient(135deg,#2c2c33,#19191e)}.work-tile h3{-webkit-line-clamp:2;margin:9px 0;min-height:44px}.work-tile .pill{position:absolute;top:18px;left:18px;background:#161618c9;backdrop-filter:blur(8px);color:#eee;border-color:#ffffff25}.work-tile .work-meta{margin-top:auto}@media(max-width:360px){.work-thumb{height:100px}.work-tile{min-height:240px}}

/* Compact image picker; article preview keeps its reading size. */
.image-grid{grid-template-columns:repeat(auto-fill,minmax(112px,136px));gap:10px;align-items:start}
.image-grid .image-card{margin:0;padding:7px;border-radius:12px;cursor:pointer;min-width:0}
.image-grid .image-card img{display:block;width:100%;height:112px;max-height:112px;object-fit:cover;border-radius:7px}
.image-grid .image-card>div{display:flex;align-items:center;gap:4px;margin-top:7px;font-size:12px}
.image-grid .image-card input{margin:0}
.image-grid .image-card p{margin:6px 0 0;line-height:1.5;height:33px;max-height:33px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
@media(max-width:380px){.image-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Selection and publication state share a non-overlapping card header. */
.work-tile{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto auto 1fr auto;column-gap:6px;row-gap:0;align-content:start}
.work-tile>label{grid-column:1;grid-row:1;display:flex;align-items:center;gap:5px;min-width:0;min-height:26px;margin:0 0 9px!important;font-size:11px!important;cursor:pointer;white-space:nowrap}
.work-tile>label input{margin:0;flex-shrink:0;width:14px;height:14px}
.work-tile>.pill{position:static;grid-column:2;grid-row:1;align-self:start;justify-self:end;margin:0 0 9px;white-space:nowrap;line-height:16px;padding:4px 6px;font-size:10px}
.work-tile>.work-thumb{grid-column:1/-1;grid-row:2}
.work-tile>h3{grid-column:1/-1;grid-row:3}
.work-tile>.work-meta{grid-column:1/-1;grid-row:4;align-self:end}
.work-tile>.actions{grid-column:1/-1;grid-row:5;display:flex;flex-wrap:wrap;gap:6px}
.work-tile:has([data-work-select]:checked){border-color:#9fbedc;background:#a9cfff0a}

.admin-table{display:grid;gap:12px}.admin-table .post{padding:16px}.admin-table .post>div{justify-content:space-between;align-items:center}.admin-table .actions{display:flex;gap:8px}.admin-table .danger{color:#ff9b9f}
