/* ============================================================
   index-skins.css — per-skin shapes for the INDEX landing components
   (colour tiles + action buttons). Loaded ONLY by index.html and scoped
   to body[data-skin], so the default "console" skin keeps the index its
   own look and no other page is touched. The window controls now use the
   shared .console-window-controls / .window-control-btn component, so the
   skins restyle those directly — no override needed here.
   ============================================================ */

/* ---- AURORA: pill swatches ---- */
body[data-skin="aurora"] .color-node,
body[data-skin="aurora"] .color-node .color-preview { border-radius: 999px !important; }
body[data-skin="aurora"] .btn-launch,
body[data-skin="aurora"] .btn-create,
body[data-skin="aurora"] .btn-login,
body[data-skin="aurora"] .btn-auth-action,
body[data-skin="aurora"] .who-r-we-btn { border-radius: 28px !important; }

/* ---- SOLAR: round swatches ---- */
body[data-skin="solar"] .color-node,
body[data-skin="solar"] .color-node .color-preview { border-radius: 50% !important; }
body[data-skin="solar"] .btn-launch,
body[data-skin="solar"] .btn-create,
body[data-skin="solar"] .btn-login,
body[data-skin="solar"] .btn-auth-action,
body[data-skin="solar"] .who-r-we-btn { border-radius: 18px !important; }

/* ---- SYNTHWAVE: sharp neon ---- */
body[data-skin="synthwave"] .color-node,
body[data-skin="synthwave"] .color-node .color-preview { border-radius: 0 !important; }
body[data-skin="synthwave"] .btn-launch,
body[data-skin="synthwave"] .btn-create,
body[data-skin="synthwave"] .btn-login,
body[data-skin="synthwave"] .btn-auth-action,
body[data-skin="synthwave"] .who-r-we-btn { border-radius: 10px !important; }

/* ---- NEBULA: organic blob swatches ---- */
body[data-skin="nebula"] .color-node,
body[data-skin="nebula"] .color-node .color-preview { border-radius: 40% 60% 55% 45% / 55% 45% 60% 40% !important; }
body[data-skin="nebula"] .btn-launch,
body[data-skin="nebula"] .btn-create,
body[data-skin="nebula"] .btn-login,
body[data-skin="nebula"] .btn-auth-action,
body[data-skin="nebula"] .who-r-we-btn { border-radius: 24px !important; }

/* ---- OCEAN: leaf swatches ---- */
body[data-skin="ocean"] .color-node,
body[data-skin="ocean"] .color-node .color-preview { border-radius: 2px 16px 2px 16px !important; }
body[data-skin="ocean"] .btn-launch,
body[data-skin="ocean"] .btn-create,
body[data-skin="ocean"] .btn-login,
body[data-skin="ocean"] .btn-auth-action,
body[data-skin="ocean"] .who-r-we-btn { border-radius: 20px !important; }

/* ---- CIRCUIT: cut-corner swatches ---- */
body[data-skin="circuit"] .color-node,
body[data-skin="circuit"] .color-node .color-preview { border-radius: 10px 0 10px 0 !important; }
body[data-skin="circuit"] .btn-launch,
body[data-skin="circuit"] .btn-create,
body[data-skin="circuit"] .btn-login,
body[data-skin="circuit"] .btn-auth-action,
body[data-skin="circuit"] .who-r-we-btn { border-radius: 4px !important; }

/* ---- FROST: arch swatches ---- */
body[data-skin="frost"] .color-node,
body[data-skin="frost"] .color-node .color-preview { border-radius: 50% 50% 12px 12px !important; }
body[data-skin="frost"] .btn-launch,
body[data-skin="frost"] .btn-create,
body[data-skin="frost"] .btn-login,
body[data-skin="frost"] .btn-auth-action,
body[data-skin="frost"] .who-r-we-btn { border-radius: 22px !important; }