/* Shared styles for the nail idea pages (the studio keeps its own inline CSS). */
@font-face{font-family:"Silkscreen";font-weight:400;font-display:swap;src:url(/assets/fonts/silkscreen-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"VT323";font-weight:400;font-display:swap;src:url(/assets/fonts/vt323-latin-400-normal.woff2) format("woff2")}
:root{--room:#e7dde4;--room2:#d9ccd6;--bar:#1b1830;--bar-ink:#aab0ff;--panel:#eef0fb;--line:#2a2838;--ink:#1d1b2c;--muted:#5e5a73;--head:#2b2850;--link:#34349c;--blue:#8a8af5;--blue-hi:#b8b8ff;--blue-lo:#4a4ab8;--blue-ink:#14125a}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--room:#1d1922;--room2:#141118}}
:root[data-theme="dark"]{--room:#1d1922;--room2:#141118}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 20%,var(--room),var(--room2)) fixed;color:var(--ink);font:21px/1.3 "VT323","Courier New",monospace;padding:0 16px 40px}
.bar{max-width:820px;margin:16px auto 0;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;justify-content:space-between;background:var(--bar);color:var(--bar-ink);padding:8px 14px;font-family:"Silkscreen",monospace;font-size:13px}
.bar a{color:#fff;font-size:18px;text-decoration:none}
.win{display:block;max-width:820px;margin:14px auto 0;background:var(--panel);border:3px solid var(--line);box-shadow:6px 6px 0 rgba(0,0,0,.18)}
.winbar{background:var(--bar);color:var(--bar-ink);font-family:"Silkscreen",monospace;font-size:13px;padding:6px 10px}
.body{padding:12px 22px 24px}
h1,h2{font-family:"Silkscreen",monospace;color:var(--head);line-height:1.2}
h1{font-size:26px;margin:10px 0 12px}
p{margin:8px 0}
a{color:var(--link)}
.looks{list-style:none;padding:0;margin:22px 0;display:grid;gap:14px}
.look{display:grid;grid-template-columns:200px 1fr;gap:16px;align-items:center;background:#fff;border:2px solid var(--line);padding:12px}
.look svg{width:100%;height:auto;display:block}
.look h2{font-size:17px;margin:0 0 4px}
.look p{margin:2px 0}
.shades{color:var(--muted);font-size:18px}
.btn{display:inline-block;margin-top:8px;font-family:"Silkscreen",monospace;font-weight:700;font-size:14px;color:var(--blue-ink);background:var(--blue);padding:9px 14px;border:2px solid #111;box-shadow:inset 2px 2px 0 var(--blue-hi),inset -2px -2px 0 var(--blue-lo);text-decoration:none}
.btn:active{box-shadow:inset -2px -2px 0 var(--blue-hi),inset 2px 2px 0 var(--blue-lo)}
.btn.big{font-size:18px;padding:14px 20px;border-width:3px}
.cta{text-align:center;margin:26px 0}
.more{font-size:16px;margin-top:26px}
.links{margin:6px 0;padding-left:22px}
.foot{max-width:820px;margin:16px auto 0;text-align:center;color:var(--muted);font-size:18px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .foot{color:#b9b3c9}:root:not([data-theme="light"]) .foot a{color:#c9c9ff}}
:root[data-theme="dark"] .foot{color:#b9b3c9}
:root[data-theme="dark"] .foot a{color:#c9c9ff}
@media (max-width:560px){
  body{font-size:19px;padding:0 10px 30px}
  .body{padding:8px 14px 18px}
  h1{font-size:20px}
  .look{grid-template-columns:1fr;gap:8px}
  .look svg{max-width:260px}
}
