:root{--bg:#F2F5F7;--ink:#10222F;--mute:#52667A;--teal:#0F766E;--sun:#F5B700;--line:#C9D3DB;--err:#B42318}
@media(prefers-color-scheme:dark){:root{--bg:#0E1A24;--ink:#EAF0F4;--mute:#9DB0C0;--teal:#2DD4BF;--line:#26394A;--err:#FDA29B}}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 'Be Vietnam Pro',system-ui,sans-serif}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
header{display:flex;justify-content:space-between;align-items:center;padding:20px 0}
header a{color:var(--ink);text-decoration:none;font-weight:600}
h1{font-size:clamp(2rem,5.5vw,3.6rem);line-height:1.12;margin:0 0 16px;font-weight:800;letter-spacing:-.02em;max-width:16ch}
h2{font-size:1.4rem;margin:0 0 8px}
.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:center;padding:40px 0 64px}
.hero p{color:var(--mute);max-width:46ch}
.slip{background:#10222F;color:#F2F5F7;padding:28px;border-radius:4px;border-top:6px solid var(--sun)}
.slip h2{color:#F2F5F7}
label{display:block;font-size:.9rem;margin:14px 0 4px}
input,textarea{width:100%;font:inherit;padding:11px 12px;border:1.5px solid var(--line);border-radius:4px;background:#fff;color:#10222F}
input:focus,textarea:focus,button:focus-visible,a:focus-visible{outline:3px solid var(--sun);outline-offset:1px}
button{display:block;margin-top:18px;width:100%;padding:13px;border:0;border-radius:4px;background:var(--sun);color:#10222F;font:inherit;font-weight:700;cursor:pointer}
.msg{min-height:1.5em;margin-top:12px;font-size:.95rem}.msg.err{color:var(--err)}.msg.ok{color:var(--sun)}
.points{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;padding:48px 0;border-top:1px solid var(--line)}
.points p{color:var(--mute);margin:0}
.auth{max-width:420px;margin:48px auto;background:#fff;color:#10222F;padding:28px;border-radius:4px;border-top:6px solid var(--teal)}
.auth a{color:var(--teal)}.auth .msg.err{color:#B42318}
table{width:100%;border-collapse:collapse;margin-top:16px}th,td{text-align:left;padding:10px 8px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--mute);font-weight:500}
.hp{position:absolute;left:-9999px}
@media(max-width:760px){.hero,.points{grid-template-columns:1fr;gap:28px}.hero{padding-top:8px}}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:28px;padding:16px 0 48px}
.item{display:flex;flex-direction:column;gap:6px}
.item img,.ph{width:100%;aspect-ratio:1;object-fit:cover;background:var(--line);border-radius:4px}
.item h3{font-size:1rem;margin:6px 0 0;font-weight:600}.item .pr{color:var(--teal);font-weight:800}
.item a.buy{margin-top:auto;display:block;text-align:center;padding:11px;border-radius:4px;background:var(--sun);color:#10222F;font-weight:700;text-decoration:none}
.note{color:var(--mute);font-size:.9rem}
.row{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.row2{grid-column:1/-1}
.del{width:auto;margin:0;padding:4px 10px;background:transparent;color:var(--err);border:1px solid var(--err)}
.admin{background:#fff;color:#10222F;padding:20px;border-radius:4px;border-top:6px solid var(--teal);margin:8px 0 24px}
@media(max-width:760px){.row{grid-template-columns:1fr}}