/* Source: css/fonts.css — original cascade order preserved. */
/* Generated by tools/build-local-fonts.mjs. Fontsource files are OFL-1.1 licensed. */
/* bebas-neue-latin-ext-400-normal */
@font-face {
font-family: 'Bebas Neue';
font-style: normal;
font-display: swap;
font-weight: 400;
src: url("../fonts/bebas-neue-latin-ext-400-normal.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* bebas-neue-latin-400-normal */
@font-face {
font-family: 'Bebas Neue';
font-style: normal;
font-display: swap;
font-weight: 400;
src: url("../fonts/bebas-neue-latin-400-normal.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* playfair-display-cyrillic-400-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 400;
src: url("../fonts/playfair-display-cyrillic-400-normal.woff2") format("woff2");
unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
/* playfair-display-vietnamese-400-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 400;
src: url("../fonts/playfair-display-vietnamese-400-normal.woff2") format("woff2");
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* playfair-display-latin-ext-400-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 400;
src: url("../fonts/playfair-display-latin-ext-400-normal.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* playfair-display-latin-400-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 400;
src: url("../fonts/playfair-display-latin-400-normal.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* playfair-display-cyrillic-400-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 400;
src: url("../fonts/playfair-display-cyrillic-400-italic.woff2") format("woff2");
unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
/* playfair-display-vietnamese-400-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 400;
src: url("../fonts/playfair-display-vietnamese-400-italic.woff2") format("woff2");
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* playfair-display-latin-ext-400-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 400;
src: url("../fonts/playfair-display-latin-ext-400-italic.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* playfair-display-latin-400-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 400;
src: url("../fonts/playfair-display-latin-400-italic.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* playfair-display-cyrillic-700-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 700;
src: url("../fonts/playfair-display-cyrillic-700-normal.woff2") format("woff2");
unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
/* playfair-display-vietnamese-700-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 700;
src: url("../fonts/playfair-display-vietnamese-700-normal.woff2") format("woff2");
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* playfair-display-latin-ext-700-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 700;
src: url("../fonts/playfair-display-latin-ext-700-normal.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* playfair-display-latin-700-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 700;
src: url("../fonts/playfair-display-latin-700-normal.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* playfair-display-cyrillic-700-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 700;
src: url("../fonts/playfair-display-cyrillic-700-italic.woff2") format("woff2");
unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
/* playfair-display-vietnamese-700-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 700;
src: url("../fonts/playfair-display-vietnamese-700-italic.woff2") format("woff2");
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* playfair-display-latin-ext-700-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 700;
src: url("../fonts/playfair-display-latin-ext-700-italic.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* playfair-display-latin-700-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 700;
src: url("../fonts/playfair-display-latin-700-italic.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* playfair-display-cyrillic-900-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 900;
src: url("../fonts/playfair-display-cyrillic-900-normal.woff2") format("woff2");
unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
/* playfair-display-vietnamese-900-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 900;
src: url("../fonts/playfair-display-vietnamese-900-normal.woff2") format("woff2");
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* playfair-display-latin-ext-900-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 900;
src: url("../fonts/playfair-display-latin-ext-900-normal.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* playfair-display-latin-900-normal */
@font-face {
font-family: 'Playfair Display';
font-style: normal;
font-display: swap;
font-weight: 900;
src: url("../fonts/playfair-display-latin-900-normal.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* playfair-display-cyrillic-900-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 900;
src: url("../fonts/playfair-display-cyrillic-900-italic.woff2") format("woff2");
unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
/* playfair-display-vietnamese-900-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 900;
src: url("../fonts/playfair-display-vietnamese-900-italic.woff2") format("woff2");
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* playfair-display-latin-ext-900-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 900;
src: url("../fonts/playfair-display-latin-ext-900-italic.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* playfair-display-latin-900-italic */
@font-face {
font-family: 'Playfair Display';
font-style: italic;
font-display: swap;
font-weight: 900;
src: url("../fonts/playfair-display-latin-900-italic.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* space-grotesk-vietnamese-300-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 300;
src: url("../fonts/space-grotesk-vietnamese-300-normal.woff2") format("woff2");
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* space-grotesk-latin-ext-300-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 300;
src: url("../fonts/space-grotesk-latin-ext-300-normal.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* space-grotesk-latin-300-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 300;
src: url("../fonts/space-grotesk-latin-300-normal.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* space-grotesk-vietnamese-400-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 400;
src: url("../fonts/space-grotesk-vietnamese-400-normal.woff2") format("woff2");
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* space-grotesk-latin-ext-400-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 400;
src: url("../fonts/space-grotesk-latin-ext-400-normal.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* space-grotesk-latin-400-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 400;
src: url("../fonts/space-grotesk-latin-400-normal.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* space-grotesk-vietnamese-500-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 500;
src: url("../fonts/space-grotesk-vietnamese-500-normal.woff2") format("woff2");
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* space-grotesk-latin-ext-500-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 500;
src: url("../fonts/space-grotesk-latin-ext-500-normal.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* space-grotesk-latin-500-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 500;
src: url("../fonts/space-grotesk-latin-500-normal.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* space-grotesk-vietnamese-600-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 600;
src: url("../fonts/space-grotesk-vietnamese-600-normal.woff2") format("woff2");
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* space-grotesk-latin-ext-600-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 600;
src: url("../fonts/space-grotesk-latin-ext-600-normal.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* space-grotesk-latin-600-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 600;
src: url("../fonts/space-grotesk-latin-600-normal.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* space-grotesk-vietnamese-700-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 700;
src: url("../fonts/space-grotesk-vietnamese-700-normal.woff2") format("woff2");
unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* space-grotesk-latin-ext-700-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 700;
src: url("../fonts/space-grotesk-latin-ext-700-normal.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* space-grotesk-latin-700-normal */
@font-face {
font-family: 'Space Grotesk';
font-style: normal;
font-display: swap;
font-weight: 700;
src: url("../fonts/space-grotesk-latin-700-normal.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* special-elite-latin-ext-400-normal */
@font-face {
font-family: 'Special Elite';
font-style: normal;
font-display: swap;
font-weight: 400;
src: url("../fonts/special-elite-latin-ext-400-normal.woff2") format("woff2");
unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* special-elite-latin-400-normal */
@font-face {
font-family: 'Special Elite';
font-style: normal;
font-display: swap;
font-weight: 400;
src: url("../fonts/special-elite-latin-400-normal.woff2") format("woff2");
unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* Source: css/tailwind.generated.css — original cascade order preserved. */
*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.\!container{width:100%!important}.container{width:100%}@media (min-width:640px){.\!container{max-width:640px!important}.container{max-width:640px}}@media (min-width:768px){.\!container{max-width:768px!important}.container{max-width:768px}}@media (min-width:1024px){.\!container{max-width:1024px!important}.container{max-width:1024px}}@media (min-width:1280px){.\!container{max-width:1280px!important}.container{max-width:1280px}}@media (min-width:1536px){.\!container{max-width:1536px!important}.container{max-width:1536px}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.invisible{visibility:hidden}.collapse{visibility:collapse}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.inset-0{inset:0}.inset-x-0{left:0;right:0}.inset-x-8{left:2rem;right:2rem}.-bottom-2{bottom:-.5rem}.-left-2{left:-.5rem}.-right-2{right:-.5rem}.-top-2{top:-.5rem}.bottom-0{bottom:0}.left-0{left:0}.left-1\/2{left:50%}.right-0{right:0}.top-0{top:0}.z-10{z-index:10}.z-30{z-index:30}.z-50{z-index:50}.mx-3{margin-left:.75rem;margin-right:.75rem}.mx-auto{margin-left:auto;margin-right:auto}.mb-1{margin-bottom:.25rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mb-16{margin-bottom:4rem}.mb-2{margin-bottom:.5rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-7{margin-bottom:1.75rem}.mb-8{margin-bottom:2rem}.mt-1{margin-top:.25rem}.mt-10{margin-top:2.5rem}.mt-16{margin-top:4rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-5{margin-top:1.25rem}.mt-6{margin-top:1.5rem}.mt-\[-4px\]{margin-top:-4px}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.contents{display:contents}.hidden{display:none}.aspect-\[2\/3\]{aspect-ratio:2/3}.h-10{height:2.5rem}.h-11{height:2.75rem}.h-12{height:3rem}.h-14{height:3.5rem}.h-16{height:4rem}.h-20{height:5rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-\[460px\]{height:460px}.h-\[69vh\]{height:69vh}.h-auto{height:auto}.h-full{height:100%}.h-px{height:1px}.min-h-\[1\.2rem\]{min-height:1.2rem}.min-h-screen{min-height:100vh}.w-10{width:2.5rem}.w-11{width:2.75rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-16{width:4rem}.w-20{width:5rem}.w-3\.5{width:.875rem}.w-32{width:8rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-7{width:1.75rem}.w-full{width:100%}.w-px{width:1px}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-5xl{max-width:64rem}.max-w-6xl{max-width:72rem}.max-w-7xl{max-width:80rem}.max-w-lg{max-width:32rem}.max-w-xl{max-width:36rem}.shrink-0{flex-shrink:0}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.-translate-x-full{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-full{--tw-translate-x:-100%}.scale-105{--tw-scale-x:1.05;--tw-scale-y:1.05}.scale-105,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-0{gap:0}.gap-10{gap:2.5rem}.gap-12{gap:3rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-x-3{-moz-column-gap:.75rem;column-gap:.75rem}.gap-y-2{row-gap:.5rem}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem*var(--tw-space-y-reverse))}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem*var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.whitespace-nowrap{white-space:nowrap}.break-all{word-break:break-all}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-sm{border-radius:.125rem}.rounded-bl-full{border-bottom-left-radius:9999px}.rounded-bl-lg{border-bottom-left-radius:.5rem}.rounded-br-full{border-bottom-right-radius:9999px}.rounded-br-lg{border-bottom-right-radius:.5rem}.rounded-tl-lg{border-top-left-radius:.5rem}.rounded-tr-lg{border-top-right-radius:.5rem}.border{border-width:1px}.border-2{border-width:2px}.border-4{border-width:4px}.border-b{border-bottom-width:1px}.border-b-2{border-bottom-width:2px}.border-l-2{border-left-width:2px}.border-r-2{border-right-width:2px}.border-t{border-top-width:1px}.border-t-2{border-top-width:2px}.border-\[\#37AEFF\]\/45{border-color:rgba(55,174,255,.45)}.border-\[\#4aa8ff\]{--tw-border-opacity:1;border-color:rgb(74 168 255/var(--tw-border-opacity,1))}.border-\[\#4aa8ff\]\/20{border-color:rgba(74,168,255,.2)}.border-\[\#D4A843\]\/35{border-color:rgba(212,168,67,.35)}.border-\[\#FF2D55\]\/30{border-color:rgba(255,45,85,.3)}.border-\[\#FF2D55\]\/35{border-color:rgba(255,45,85,.35)}.border-cinema-gold{--tw-border-opacity:1;border-color:rgb(212 168 67/var(--tw-border-opacity,1))}.border-cinema-gold\/10{border-color:rgba(212,168,67,.1)}.border-cinema-gold\/20{border-color:rgba(212,168,67,.2)}.border-cinema-gold\/30{border-color:rgba(212,168,67,.3)}.border-cinema-gold\/35{border-color:rgba(212,168,67,.35)}.border-cinema-gold\/40{border-color:rgba(212,168,67,.4)}.border-cinema-gold\/50{border-color:rgba(212,168,67,.5)}.border-cinema-midgray{--tw-border-opacity:1;border-color:rgb(42 42 42/var(--tw-border-opacity,1))}.border-cinema-neonblue\/20{border-color:rgba(0,212,255,.2)}.border-cinema-red\/20{border-color:rgba(139,0,0,.2)}.border-green-400\/20{border-color:rgba(74,222,128,.2)}.border-green-400\/30{border-color:rgba(74,222,128,.3)}.border-green-400\/35{border-color:rgba(74,222,128,.35)}.border-green-400\/45{border-color:rgba(74,222,128,.45)}.bg-\[\#0088cc\]\/10{background-color:rgba(0,136,204,.1)}.bg-\[\#1DA1F2\]\/10{background-color:rgba(29,161,242,.1)}.bg-\[\#4aa8ff\]\/10{background-color:rgba(74,168,255,.1)}.bg-\[\#FF003D\]{--tw-bg-opacity:1;background-color:rgb(255 0 61/var(--tw-bg-opacity,1))}.bg-\[\#FF2D55\]\/10{background-color:rgba(255,45,85,.1)}.bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0/var(--tw-bg-opacity,1))}.bg-cinema-black{--tw-bg-opacity:1;background-color:rgb(10 10 10/var(--tw-bg-opacity,1))}.bg-cinema-black\/40{background-color:hsla(0,0%,4%,.4)}.bg-cinema-black\/50{background-color:hsla(0,0%,4%,.5)}.bg-cinema-black\/60{background-color:hsla(0,0%,4%,.6)}.bg-cinema-darkgold{--tw-bg-opacity:1;background-color:rgb(155 123 47/var(--tw-bg-opacity,1))}.bg-cinema-darkgray{--tw-bg-opacity:1;background-color:rgb(26 26 26/var(--tw-bg-opacity,1))}.bg-cinema-darkgray\/50{background-color:rgba(26,26,26,.5)}.bg-cinema-gold\/10{background-color:rgba(212,168,67,.1)}.bg-cinema-gold\/20{background-color:rgba(212,168,67,.2)}.bg-cinema-gold\/30{background-color:rgba(212,168,67,.3)}.bg-cinema-gold\/60{background-color:rgba(212,168,67,.6)}.bg-cinema-red{--tw-bg-opacity:1;background-color:rgb(139 0 0/var(--tw-bg-opacity,1))}.bg-cinema-red\/20{background-color:rgba(139,0,0,.2)}.bg-green-400\/10{background-color:rgba(74,222,128,.1)}.bg-green-500\/10{background-color:rgba(34,197,94,.1)}.bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}.from-black\/45{--tw-gradient-from:rgba(0,0,0,.45) var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-black\/95{--tw-gradient-from:rgba(0,0,0,.95) var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-cinema-black{--tw-gradient-from:#0a0a0a var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,4%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-cinema-black\/60{--tw-gradient-from:hsla(0,0%,4%,.6) var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,4%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-cinema-black\/80{--tw-gradient-from:hsla(0,0%,4%,.8) var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,4%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-cinema-cream{--tw-gradient-from:#e8d5b7 var(--tw-gradient-from-position);--tw-gradient-to:hsla(37,52%,81%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-cinema-darkgray{--tw-gradient-from:#1a1a1a var(--tw-gradient-from-position);--tw-gradient-to:rgba(26,26,26,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-cinema-red{--tw-gradient-from:#8b0000 var(--tw-gradient-from-position);--tw-gradient-to:rgba(139,0,0,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-cinema-red\/20{--tw-gradient-from:rgba(139,0,0,.2) var(--tw-gradient-from-position);--tw-gradient-to:rgba(139,0,0,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-transparent{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.via-black\/30{--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(0,0,0,.3) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-cinema-black\/30{--tw-gradient-to:hsla(0,0%,4%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),hsla(0,0%,4%,.3) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-cinema-black\/60{--tw-gradient-to:hsla(0,0%,4%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),hsla(0,0%,4%,.6) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-cinema-darkgray\/20{--tw-gradient-to:rgba(26,26,26,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(26,26,26,.2) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-cinema-darkred\/10{--tw-gradient-to:rgba(74,0,0,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(74,0,0,.1) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-cinema-darkred\/20{--tw-gradient-to:rgba(74,0,0,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(74,0,0,.2) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-cinema-darkred\/5{--tw-gradient-to:rgba(74,0,0,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(74,0,0,.05) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-cinema-gold{--tw-gradient-to:rgba(212,168,67,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),#d4a843 var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-cinema-midgray{--tw-gradient-to:rgba(42,42,42,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),#2a2a2a var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-cinema-midgray\/10{--tw-gradient-to:rgba(42,42,42,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(42,42,42,.1) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-cinema-red{--tw-gradient-to:rgba(139,0,0,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),#8b0000 var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-transparent{--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),transparent var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-white\/10{--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),hsla(0,0%,100%,.1) var(--tw-gradient-via-position),var(--tw-gradient-to)}.to-black\/80{--tw-gradient-to:rgba(0,0,0,.8) var(--tw-gradient-to-position)}.to-cinema-black{--tw-gradient-to:#0a0a0a var(--tw-gradient-to-position)}.to-cinema-black\/80{--tw-gradient-to:hsla(0,0%,4%,.8) var(--tw-gradient-to-position)}.to-cinema-darkgold{--tw-gradient-to:#9b7b2f var(--tw-gradient-to-position)}.to-cinema-darkgray{--tw-gradient-to:#1a1a1a var(--tw-gradient-to-position)}.to-cinema-darkred{--tw-gradient-to:#4a0000 var(--tw-gradient-to-position)}.to-cinema-midgray{--tw-gradient-to:#2a2a2a var(--tw-gradient-to-position)}.to-cinema-red\/20{--tw-gradient-to:rgba(139,0,0,.2) var(--tw-gradient-to-position)}.to-transparent{--tw-gradient-to:transparent var(--tw-gradient-to-position)}.bg-clip-text{-webkit-background-clip:text;background-clip:text}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-3\.5{padding:.875rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-14{padding-top:3.5rem;padding-bottom:3.5rem}.py-16{padding-top:4rem;padding-bottom:4rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-20{padding-top:5rem;padding-bottom:5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem}.pb-6,.py-6{padding-bottom:1.5rem}.pb-9{padding-bottom:2.25rem}.pt-12{padding-top:3rem}.pt-4{padding-top:1rem}.text-left{text-align:left}.text-center{text-align:center}.font-bebas{font-family:Bebas Neue,sans-serif}.font-elite{font-family:Special Elite,monospace}.font-grotesk{font-family:Space Grotesk,sans-serif}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.font-playfair{font-family:Playfair Display,serif}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}.text-6xl{font-size:3.75rem;line-height:1}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[12px\]{font-size:12px}.text-\[9px\]{font-size:9px}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.uppercase{text-transform:uppercase}.italic{font-style:italic}.leading-none{line-height:1}.leading-relaxed{line-height:1.625}.tracking-\[0\.15em\]{letter-spacing:.15em}.tracking-\[0\.16em\]{letter-spacing:.16em}.tracking-\[0\.18em\]{letter-spacing:.18em}.tracking-\[0\.22em\]{letter-spacing:.22em}.tracking-\[0\.24em\]{letter-spacing:.24em}.tracking-\[0\.25em\]{letter-spacing:.25em}.tracking-\[0\.26em\]{letter-spacing:.26em}.tracking-\[0\.28em\]{letter-spacing:.28em}.tracking-\[0\.2em\]{letter-spacing:.2em}.tracking-\[0\.36em\]{letter-spacing:.36em}.tracking-\[0\.3em\]{letter-spacing:.3em}.tracking-\[0\.42em\]{letter-spacing:.42em}.tracking-\[0\.45em\]{letter-spacing:.45em}.tracking-\[0\.4em\]{letter-spacing:.4em}.tracking-\[0\.5em\]{letter-spacing:.5em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.text-\[\#0088cc\]{--tw-text-opacity:1;color:rgb(0 136 204/var(--tw-text-opacity,1))}.text-\[\#37AEFF\]{--tw-text-opacity:1;color:rgb(55 174 255/var(--tw-text-opacity,1))}.text-\[\#4aa8ff\]{--tw-text-opacity:1;color:rgb(74 168 255/var(--tw-text-opacity,1))}.text-\[\#D4A843\]{--tw-text-opacity:1;color:rgb(212 168 67/var(--tw-text-opacity,1))}.text-\[\#D4A843\]\/85{color:rgba(212,168,67,.85)}.text-\[\#FF003D\]{--tw-text-opacity:1;color:rgb(255 0 61/var(--tw-text-opacity,1))}.text-\[\#FF2D55\]{--tw-text-opacity:1;color:rgb(255 45 85/var(--tw-text-opacity,1))}.text-\[\#FF2D55\]\/80{color:rgba(255,45,85,.8)}.text-\[\#FF2D55\]\/85{color:rgba(255,45,85,.85)}.text-cinema-black{--tw-text-opacity:1;color:rgb(10 10 10/var(--tw-text-opacity,1))}.text-cinema-cream{--tw-text-opacity:1;color:rgb(232 213 183/var(--tw-text-opacity,1))}.text-cinema-cream\/40{color:hsla(37,52%,81%,.4)}.text-cinema-cream\/45{color:hsla(37,52%,81%,.45)}.text-cinema-cream\/50{color:hsla(37,52%,81%,.5)}.text-cinema-cream\/60{color:hsla(37,52%,81%,.6)}.text-cinema-cream\/70{color:hsla(37,52%,81%,.7)}.text-cinema-cream\/80{color:hsla(37,52%,81%,.8)}.text-cinema-cream\/90{color:hsla(37,52%,81%,.9)}.text-cinema-gold{--tw-text-opacity:1;color:rgb(212 168 67/var(--tw-text-opacity,1))}.text-cinema-gold\/40{color:rgba(212,168,67,.4)}.text-cinema-gold\/50{color:rgba(212,168,67,.5)}.text-cinema-gold\/65{color:rgba(212,168,67,.65)}.text-cinema-gold\/75{color:rgba(212,168,67,.75)}.text-cinema-gold\/80{color:rgba(212,168,67,.8)}.text-cinema-gold\/85{color:rgba(212,168,67,.85)}.text-cinema-neon{--tw-text-opacity:1;color:rgb(255 45 85/var(--tw-text-opacity,1))}.text-cinema-neon\/80{color:rgba(255,45,85,.8)}.text-cinema-neonblue{--tw-text-opacity:1;color:rgb(0 212 255/var(--tw-text-opacity,1))}.text-green-300{--tw-text-opacity:1;color:rgb(134 239 172/var(--tw-text-opacity,1))}.text-green-400{--tw-text-opacity:1;color:rgb(74 222 128/var(--tw-text-opacity,1))}.text-transparent{color:transparent}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.text-white\/30{color:hsla(0,0%,100%,.3)}.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-20{opacity:.2}.opacity-40{opacity:.4}.opacity-45{opacity:.45}.opacity-5{opacity:.05}.opacity-60{opacity:.6}.shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.shadow-2xl,.shadow-\[0_0_14px_rgba\(74\2c 168\2c 255\2c 0\.18\)\]{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_0_14px_rgba\(74\2c 168\2c 255\2c 0\.18\)\]{--tw-shadow:0 0 14px rgba(74,168,255,.18);--tw-shadow-colored:0 0 14px var(--tw-shadow-color)}.shadow-\[0_0_20px_rgba\(255\2c 0\2c 61\2c 1\)\]{--tw-shadow:0 0 20px #ff003d;--tw-shadow-colored:0 0 20px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_0_22px_rgba\(0\2c 212\2c 255\2c 0\.09\)\]{--tw-shadow:0 0 22px rgba(0,212,255,.09);--tw-shadow-colored:0 0 22px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_0_22px_rgba\(212\2c 168\2c 67\2c 0\.10\)\]{--tw-shadow:0 0 22px rgba(212,168,67,.1);--tw-shadow-colored:0 0 22px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_0_22px_rgba\(255\2c 45\2c 85\2c 0\.10\)\]{--tw-shadow:0 0 22px rgba(255,45,85,.1);--tw-shadow-colored:0 0 22px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-\[0_0_24px_rgba\(74\2c 168\2c 255\2c 0\.35\)\]{--tw-shadow:0 0 24px rgba(74,168,255,.35);--tw-shadow-colored:0 0 24px var(--tw-shadow-color)}.shadow-\[0_0_24px_rgba\(74\2c 168\2c 255\2c 0\.35\)\],.shadow-lg{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-cinema-gold\/30{--tw-shadow-color:rgba(212,168,67,.3);--tw-shadow:var(--tw-shadow-colored)}.shadow-cinema-red\/30{--tw-shadow-color:rgba(139,0,0,.3);--tw-shadow:var(--tw-shadow-colored)}.blur{--tw-blur:blur(8px)}.blur,.blur-0{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.blur-0{--tw-blur:blur(0)}.blur-md{--tw-blur:blur(12px)}.blur-md,.drop-shadow-2xl{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow-2xl{--tw-drop-shadow:drop-shadow(0 25px 25px rgba(0,0,0,.15))}.drop-shadow-\[0_0_12px_rgba\(255\2c 0\2c 61\2c 0\.85\)\]{--tw-drop-shadow:drop-shadow(0 0 12px rgba(255,0,61,.85))}.drop-shadow-\[0_0_12px_rgba\(255\2c 0\2c 61\2c 0\.85\)\],.drop-shadow-\[0_0_12px_rgba\(74\2c 222\2c 128\2c 0\.55\)\]{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow-\[0_0_12px_rgba\(74\2c 222\2c 128\2c 0\.55\)\]{--tw-drop-shadow:drop-shadow(0 0 12px rgba(74,222,128,.55))}.drop-shadow-\[0_0_8px_rgba\(34\2c 197\2c 94\2c 0\.45\)\]{--tw-drop-shadow:drop-shadow(0 0 8px rgba(34,197,94,.45))}.drop-shadow-\[0_0_8px_rgba\(34\2c 197\2c 94\2c 0\.45\)\],.saturate-50{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.saturate-50{--tw-saturate:saturate(.5)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur{--tw-backdrop-blur:blur(8px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.duration-700{transition-duration:.7s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.will-change-transform{will-change:transform}.\[backface-visibility\:hidden\]{backface-visibility:hidden}.\[transform\:translateZ\(0\)\]{transform:translateZ(0)}.hover\:border-\[\#37AEFF\]:hover{--tw-border-opacity:1;border-color:rgb(55 174 255/var(--tw-border-opacity,1))}.hover\:border-cinema-gold:hover{--tw-border-opacity:1;border-color:rgb(212 168 67/var(--tw-border-opacity,1))}.hover\:border-cinema-gold\/40:hover{border-color:rgba(212,168,67,.4)}.hover\:border-cinema-gold\/50:hover{border-color:rgba(212,168,67,.5)}.hover\:border-cinema-neonblue\/35:hover{border-color:rgba(0,212,255,.35)}.hover\:border-cinema-red\/35:hover{border-color:rgba(139,0,0,.35)}.hover\:border-green-400\/45:hover{border-color:rgba(74,222,128,.45)}.hover\:bg-\[\#FF2D55\]\/20:hover{background-color:rgba(255,45,85,.2)}.hover\:bg-cinema-darkred:hover{--tw-bg-opacity:1;background-color:rgb(74 0 0/var(--tw-bg-opacity,1))}.hover\:bg-cinema-gold\/10:hover{background-color:rgba(212,168,67,.1)}.hover\:text-cinema-gold:hover{--tw-text-opacity:1;color:rgb(212 168 67/var(--tw-text-opacity,1))}.hover\:text-white\/70:hover{color:hsla(0,0%,100%,.7)}.hover\:shadow-\[0_0_24px_rgba\(34\2c 197\2c 94\2c 0\.18\)\]:hover{--tw-shadow:0 0 24px rgba(34,197,94,.18);--tw-shadow-colored:0 0 24px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.hover\:shadow-\[0_0_28px_rgba\(255\2c 0\2c 61\2c 0\.45\)\]:hover{--tw-shadow:0 0 28px rgba(255,0,61,.45);--tw-shadow-colored:0 0 28px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.hover\:shadow-\[0_0_32px_rgba\(0\2c 212\2c 255\2c 0\.15\)\]:hover{--tw-shadow:0 0 32px rgba(0,212,255,.15);--tw-shadow-colored:0 0 32px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.hover\:shadow-\[0_0_32px_rgba\(212\2c 168\2c 67\2c 0\.16\)\]:hover{--tw-shadow:0 0 32px rgba(212,168,67,.16);--tw-shadow-colored:0 0 32px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.hover\:shadow-\[0_0_32px_rgba\(255\2c 45\2c 85\2c 0\.16\)\]:hover{--tw-shadow:0 0 32px rgba(255,45,85,.16);--tw-shadow-colored:0 0 32px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.group:hover .group-hover\:translate-x-full{--tw-translate-x:100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:border-cinema-gold\/30{border-color:rgba(212,168,67,.3)}@media (min-width:320px){.min-\[320px\]\:flex-nowrap{flex-wrap:nowrap}}@media (min-width:640px){.sm\:col-span-2{grid-column:span 2/span 2}.sm\:block{display:block}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:justify-between{justify-content:space-between}.sm\:gap-6{gap:1.5rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:px-8{padding-left:2rem;padding-right:2rem}.sm\:py-4{padding-top:1rem;padding-bottom:1rem}.sm\:text-8xl{font-size:6rem;line-height:1}.sm\:text-xl{font-size:1.25rem;line-height:1.75rem}}@media (min-width:768px){.md\:mb-0{margin-bottom:0}.md\:mb-12{margin-bottom:3rem}.md\:mb-16{margin-bottom:4rem}.md\:mb-6{margin-bottom:1.5rem}.md\:block{display:block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:h-20{height:5rem}.md\:h-\[53\.5vh\]{height:53.5vh}.md\:h-\[560px\]{height:560px}.md\:w-1\/2{width:50%}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:flex-row{flex-direction:row}.md\:items-center{align-items:center}.md\:justify-start{justify-content:flex-start}.md\:gap-16{gap:4rem}.md\:gap-8{gap:2rem}.md\:gap-9{gap:2.25rem}.md\:object-cover{-o-object-fit:cover;object-fit:cover}.md\:p-12{padding:3rem}.md\:p-6{padding:1.5rem}.md\:p-8{padding:2rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:px-9{padding-left:2.25rem;padding-right:2.25rem}.md\:py-12{padding-top:3rem;padding-bottom:3rem}.md\:py-20{padding-top:5rem;padding-bottom:5rem}.md\:py-32{padding-top:8rem;padding-bottom:8rem}.md\:pl-12{padding-left:3rem}.md\:pr-12{padding-right:3rem}.md\:text-right{text-align:right}.md\:text-2xl{font-size:1.5rem;line-height:2rem}.md\:text-3xl{font-size:1.875rem;line-height:2.25rem}.md\:text-5xl{font-size:3rem;line-height:1}.md\:text-6xl{font-size:3.75rem;line-height:1}.md\:text-7xl{font-size:4.5rem;line-height:1}.md\:text-\[10rem\]{font-size:10rem}.md\:text-base{font-size:1rem;line-height:1.5rem}.md\:text-sm{font-size:.875rem;line-height:1.25rem}.md\:text-xl{font-size:1.25rem;line-height:1.75rem}.md\:text-xs{font-size:.75rem;line-height:1rem}.md\:hover\:border-cinema-gold\/30:hover{border-color:rgba(212,168,67,.3)}.md\:hover\:bg-cinema-darkgray\/80:hover{background-color:rgba(26,26,26,.8)}.group:hover .md\:group-hover\:scale-105{--tw-scale-x:1.05;--tw-scale-y:1.05;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .md\:group-hover\:bg-\[\#0088cc\]\/20{background-color:rgba(0,136,204,.2)}.group:hover .md\:group-hover\:bg-\[\#1DA1F2\]\/20{background-color:rgba(29,161,242,.2)}.group:hover .md\:group-hover\:bg-green-500\/20{background-color:rgba(34,197,94,.2)}}@media (min-width:1024px){.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:px-8{padding-left:2rem;padding-right:2rem}.lg\:text-\[12rem\]{font-size:12rem}}
/* Source: css/style.css — original cascade order preserved. */
:root {
--gizmo-pink: #ff2d95;
--gizmo-pink-soft: #ff4da6;
--gizmo-blue: #4da3ff;
--gizmo-blue-soft: #7ab8ff;
--gizmo-pink-glow: rgba(255, 45, 149, 0.45);
--gizmo-blue-glow: rgba(77, 163, 255, 0.45);
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: #0A0A0A; color: #E8D5B7; overflow-x: hidden; }
/* Film grain overlay: stronger cinematic version */
.film-grain {
position: fixed;
top: -25%;
left: -25%;
width: 150%;
height: 150%;
pointer-events: none;
z-index: 60;
opacity: 0.0075;
background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.62' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
animation: grain 7s steps(2) infinite;
}
@media (max-width: 768px) {
.film-grain {
top: -10%;
left: -10%;
width: 120%;
height: 120%;
opacity: 0.004;
animation: none;
}
}
@keyframes grain {
0%, 100% { transform: translate(0, 0); }
10% { transform: translate(-5%, -10%); }
20% { transform: translate(-15%, 5%); }
30% { transform: translate(7%, -25%); }
40% { transform: translate(-5%, 25%); }
50% { transform: translate(-15%, 10%); }
60% { transform: translate(15%, 0%); }
70% { transform: translate(0%, 15%); }
80% { transform: translate(3%, 35%); }
90% { transform: translate(-10%, 10%); }
}
/* ===== FRONTEND PERFORMANCE SAFETY PASS ===== */
@media (max-width: 768px) {
#particles {
opacity: 0.45;
}
.reveal,
.poster-card,
.poster-card img,
#community .aka-social-card,
#community .aka-social-card > div:first-child,
#community .aka-social-card > div:first-child svg {
will-change: auto;
}
.reveal {
transform: translateY(24px) translateZ(0);
transition-duration: 0.64s;
}
.reveal.active {
transform: translateY(0) translateZ(0);
}
.aka-nav-cinema-segment,
.aka-language-menu,
.aka-wallet-dropdown,
.modal-overlay.active {
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
}
}
/* Projector flicker */
@keyframes flicker {
0%, 100% { opacity: 1; }
3% { opacity: 0.85; }
6% { opacity: 0.95; }
7% { opacity: 0.88; }
8% { opacity: 1; }
9% { opacity: 0.9; }
10% { opacity: 1; }
50% { opacity: 1; }
52% { opacity: 0.92; }
53% { opacity: 1; }
88% { opacity: 1; }
90% { opacity: 0.87; }
92% { opacity: 1; }
}
.flicker { animation: flicker 4s infinite; }
/* Neon glow */
.neon-glow {
text-shadow:
0 0 7px #FF2D55,
0 0 10px #FF2D55,
0 0 21px #FF2D55,
0 0 42px #8B0000,
0 0 82px #8B0000;
}
.neon-glow-gold {
text-shadow:
0 0 7px #D4A843,
0 0 10px #D4A843,
0 0 21px #D4A843,
0 0 42px #9B7B2F;
}
/* ===== DISCLAIMER SOFT GLOW ===== */
.disclaimer-glow {
color: rgba(255,245,220,0.92);
font-size: 1rem;
line-height: 1.9;
letter-spacing: 0.015em;
text-shadow:
0 0 1px rgba(255,255,255,0.25),
0 0 4px rgba(212,168,67,0.35),
0 0 10px rgba(212,168,67,0.22),
0 0 18px rgba(212,168,67,0.12),
0 0 34px rgba(212,168,67,0.06);
animation: disclaimerGlow 5s ease-in-out infinite;
}
@keyframes disclaimerGlow {
0%, 100% {
opacity: 0.78;
text-shadow:
0 0 1px rgba(255,255,255,0.18),
0 0 4px rgba(212,168,67,0.28),
0 0 8px rgba(212,168,67,0.18),
0 0 16px rgba(212,168,67,0.10),
0 0 28px rgba(212,168,67,0.05);
}
50% {
opacity: 1;
text-shadow:
0 0 2px rgba(255,255,255,0.28),
0 0 6px rgba(212,168,67,0.40),
0 0 14px rgba(212,168,67,0.26),
0 0 24px rgba(212,168,67,0.14),
0 0 42px rgba(212,168,67,0.08);
}
}
.neon-border {
box-shadow:
0 0 5px #FF2D55,
0 0 10px #FF2D55,
inset 0 0 5px rgba(255, 45, 85, 0.1);
}
.gold-border {
box-shadow:
0 0 5px #D4A843,
0 0 10px #D4A843,
inset 0 0 5px rgba(212, 168, 67, 0.1);
}
/* Scanlines */
.scanlines::after {
content: '';
position: absolute;
top: 0; left: 0;
width: 100%; height: 100%;
background: repeating-linear-gradient(
0deg,
transparent,
transparent 2px,
rgba(0, 0, 0, 0.08) 2px,
rgba(0, 0, 0, 0.08) 4px
);
pointer-events: none;
z-index: 2;
}
/* Cinematic bar */
.cinema-bar-top, .cinema-bar-bottom {
position: fixed;
left: 0; right: 0;
height: 0;
background: #000;
z-index: 9998;
transition: height 1s ease;
}
.cinema-bar-top { top: 0; }
.cinema-bar-bottom { bottom: 0; }
.cinema-mode .cinema-bar-top,
.cinema-mode .cinema-bar-bottom { height: 50px; }
.poster-card {
transform: translateZ(0);
max-width: 330px;
margin-left: auto;
margin-right: auto;
transition:
transform 0.55s cubic-bezier(0.23, 1, 0.32, 1),
box-shadow 0.55s cubic-bezier(0.23, 1, 0.32, 1),
border-color 0.55s ease;
overflow: hidden;
will-change: transform;
}
.poster-card:hover {
transform: translateZ(0);
box-shadow:
0 0 20px rgba(255, 45, 85, 0.4),
0 0 40px rgba(255, 45, 85, 0.2),
0 20px 60px rgba(0, 0, 0, 0.8);
}
.poster-card img {
transition: transform 0.7s cubic-bezier(0.23, 1, 0.32, 1);
}
.poster-card:hover img {
transform: scale(1.04);
}
.poster-card.unlocked:hover {
transform: translateZ(0);
box-shadow:
0 0 12px rgba(34, 197, 94, 0.22),
0 0 28px rgba(34, 197, 94, 0.18),
0 0 55px rgba(16, 185, 129, 0.12),
0 24px 70px rgba(0, 0, 0, 0.88);
border-color: rgba(74, 222, 128, 0.22);
}
.poster-card::after {
content: '';
position: absolute;
top: 0; left: -100%;
width: 50%; height: 100%;
background: linear-gradient(
90deg,
transparent,
rgba(255, 255, 255, 0.08),
transparent
);
transition: left 0.6s ease;
}
.poster-card:hover::after { left: 150%; }
.poster-card::before {
content: '';
position: absolute;
inset: 0;
background:
radial-gradient(
circle at top,
rgba(255,255,255,0.06),
transparent 60%
);
opacity: 0;
transition: opacity 0.5s ease;
pointer-events: none;
border-radius: inherit;
}
.poster-card:hover::before {
opacity: 1;
}
/* Parallax */
.parallax-bg {
background-attachment: fixed;
background-size: cover;
background-position: center;
}
/* Film strip decoration */
.film-strip {
background: repeating-linear-gradient(
90deg,
#1A1A1A 0px,
#1A1A1A 20px,
#0A0A0A 20px,
#0A0A0A 24px,
#1A1A1A 24px,
#1A1A1A 44px
);
height: 30px;
}
.film-strip-holes {
background: repeating-linear-gradient(
90deg,
transparent 0px,
transparent 8px,
#2A2A2A 8px,
#2A2A2A 12px,
#0A0A0A 12px,
#0A0A0A 32px
);
height: 14px;
}
/* Scroll reveal */
.reveal {
opacity: 0;
transform: translateY(40px) translateZ(0);
transition:
opacity 0.8s cubic-bezier(0.23, 1, 0.32, 1),
transform 0.8s cubic-bezier(0.23, 1, 0.32, 1);
will-change: opacity, transform;
}
.reveal.active {
opacity: 1;
transform: translateY(0) translateZ(0);
}
/* VHS glitch */
@keyframes glitch1 {
0%, 100% { clip-path: inset(0 0 0 0); transform: translate(0); }
20% { clip-path: inset(20% 0 60% 0); transform: translate(-3px, 2px); }
40% { clip-path: inset(50% 0 30% 0); transform: translate(3px, -1px); }
60% { clip-path: inset(70% 0 10% 0); transform: translate(-2px, 3px); }
80% { clip-path: inset(10% 0 80% 0); transform: translate(2px, -2px); }
}
@keyframes glitch2 {
0%, 100% { clip-path: inset(0 0 0 0); transform: translate(0); }
20% { clip-path: inset(60% 0 20% 0); transform: translate(3px, -2px); }
40% { clip-path: inset(30% 0 50% 0); transform: translate(-3px, 1px); }
60% { clip-path: inset(10% 0 70% 0); transform: translate(2px, -3px); }
80% { clip-path: inset(80% 0 10% 0); transform: translate(-2px, 2px); }
}
/* EL MULLERO premium brand lockups: retain the same cinematic hierarchy,
while compensating for the longer name instead of forcing wraps or crowding. */
.aka-hero-brand-title {
max-width: 100%;
margin-inline: auto;
white-space: nowrap;
letter-spacing: .026em !important;
}
.aka-hero-studio-line {
max-width: 100%;
margin-inline: auto;
white-space: nowrap;
font-size: clamp(.58rem, 1.45vw, .82rem) !important;
letter-spacing: clamp(.16em, .48vw, .34em) !important;
}
.aka-top-brand-name {
white-space: nowrap;
font-size: clamp(1.02rem, 1.55vw, 1.34rem) !important;
letter-spacing: .075em !important;
}
#gallery .aka-gallery-brand-title {
max-width: 100%;
margin-inline: auto;
font-size: clamp(2.55rem, 6.1vw, 4.5rem) !important;
line-height: .94;
letter-spacing: .045em !important;
text-wrap: balance;
}
@media (max-width: 639px) {
.aka-hero-brand-title { font-size: clamp(2.88rem, 12.58vw, 4.8rem) !important; }
}
@media (min-width: 640px) and (max-width: 767px) {
.aka-hero-brand-title { font-size: clamp(4.752rem, 11.952vw, 5.664rem) !important; }
}
@media (min-width: 768px) and (max-width: 1023px) {
.aka-hero-brand-title { font-size: clamp(5.616rem, 10.128vw, 6.624rem) !important; }
}
@media (min-width: 1024px) {
.aka-hero-brand-title { font-size: clamp(6.672rem, 7.824vw, 7.872rem) !important; }
}
.glitch-text {
position: relative;
}
.glitch-text::before,
.glitch-text::after {
content: attr(data-text);
position: absolute;
top: 0; left: 0;
width: 100%; height: 100%;
}
.glitch-text::before {
color: #00D4FF;
animation: glitch1 3s infinite;
opacity: 0.5;
}
.glitch-text::after {
color: #FF2D55;
animation: glitch2 3s infinite;
opacity: 0.5;
}
/* Custom scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #0A0A0A; }
::-webkit-scrollbar-thumb {
background: linear-gradient(to bottom, #8B0000, #D4A843);
border-radius: 4px;
}
/* Star rating */
.stars { color: #D4A843; letter-spacing: 4px; }
/* ===== HERO R / STAR ZONE SEQUENCE: CLEAN LAYERED SIGNALS ===== */
.aka-hero-r-trigger,
.aka-hero-star-trigger {
appearance: none;
-webkit-appearance: none;
border: 0;
background: transparent;
color: inherit;
font: inherit;
line-height: 1;
padding: 0;
margin: 0;
display: inline-flex;
align-items: center;
justify-content: center;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
border-radius: 0.22rem;
transition:
color 220ms ease,
text-shadow 520ms ease,
filter 520ms ease,
transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.aka-hero-star-trigger {
width: 1rem;
height: 1rem;
flex: 0 0 auto;
}
.aka-hero-star-trigger svg {
width: 1rem;
height: 1rem;
color: #D4A843;
transition:
color 360ms ease,
filter 620ms ease,
transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
.aka-hero-r-trigger.is-pressed,
.aka-hero-star-trigger.is-pressed {
transform: translateY(0.5px) scale(0.965);
filter: brightness(1.16);
}
.aka-hero-rating-badge,
.aka-hero-restricted-copy,
.aka-hero-rating-stars,
.aka-hero-star-line,
.aka-hero-studio-line,
.aka-hero-legend-line,
.aka-hero-view-story-cta {
transition:
color 1100ms ease,
border-color 1100ms ease,
background 1100ms ease,
box-shadow 1100ms ease,
text-shadow 1100ms ease,
filter 1100ms ease,
opacity 1100ms ease;
}
body:where(:not(.aka-hero-composited)).is-hero-r-zone-active .aka-hero-r-trigger,
.aka-hero-fx-copy[data-hero-look~="r"].aka-hero-r-trigger,
.aka-hero-fx-copy[data-hero-look~="r"] .aka-hero-r-trigger{
color: #D4A843;
text-shadow:
0 0 8px rgba(212,168,67,0.92),
0 0 18px rgba(212,168,67,0.62),
0 0 34px rgba(212,168,67,0.30),
0 0 48px rgba(139,0,0,0.34);
filter: brightness(1.22) saturate(1.06);
}
body:where(:not(.aka-hero-composited)).is-hero-r-zone-active .aka-hero-restricted-copy,
.aka-hero-fx-copy[data-hero-look~="r"].aka-hero-restricted-copy,
.aka-hero-fx-copy[data-hero-look~="r"] .aka-hero-restricted-copy{
color: rgba(255,236,190,0.96);
text-shadow:
0 0 5px rgba(232,213,183,0.30),
0 0 12px rgba(212,168,67,0.36),
0 0 24px rgba(212,168,67,0.20),
0 0 38px rgba(139,0,0,0.30);
filter: brightness(1.12);
}
body:where(:not(.aka-hero-composited)).is-hero-r-zone-active .aka-hero-rating-badge,
.aka-hero-fx-copy[data-hero-look~="r"].aka-hero-rating-badge,
.aka-hero-fx-copy[data-hero-look~="r"] .aka-hero-rating-badge{
border-color: rgba(212,168,67,0.76);
background:
radial-gradient(ellipse at 12% 50%, rgba(139,0,0,0.44), transparent 58%),
linear-gradient(90deg, rgba(139,0,0,0.32), rgba(212,168,67,0.10), rgba(8,8,8,0.52));
box-shadow:
0 0 18px rgba(139,0,0,0.52),
0 0 34px rgba(212,168,67,0.24),
0 0 54px rgba(212,168,67,0.10),
inset 0 0 18px rgba(212,168,67,0.075);
filter: brightness(1.10) saturate(1.05);
}
body:where(:not(.aka-hero-composited)).is-hero-star-zone-active .aka-hero-star-trigger svg,
.aka-hero-fx-copy[data-hero-look~="star"].aka-hero-star-trigger svg,
.aka-hero-fx-copy[data-hero-look~="star"] .aka-hero-star-trigger svg{
color: #D4A843;
filter:
brightness(1.24)
drop-shadow(0 0 8px rgba(212,168,67,0.92))
drop-shadow(0 0 18px rgba(212,168,67,0.58))
drop-shadow(0 0 34px rgba(212,168,67,0.28))
drop-shadow(0 0 46px rgba(139,0,0,0.22));
}
body:where(:not(.aka-hero-composited)).is-hero-star-zone-active .aka-hero-star-line,
.aka-hero-fx-copy[data-hero-look~="star"].aka-hero-star-line,
.aka-hero-fx-copy[data-hero-look~="star"] .aka-hero-star-line{
background-color: rgba(212,168,67,0.98);
box-shadow:
0 0 8px rgba(212,168,67,0.74),
0 0 18px rgba(212,168,67,0.44),
0 0 34px rgba(212,168,67,0.20),
0 0 48px rgba(139,0,0,0.16);
filter: brightness(1.16);
}
body:where(:not(.aka-hero-composited)).is-hero-r-zone-active .aka-hero-rating-stars,
.aka-hero-fx-copy[data-hero-look~="r"].aka-hero-rating-stars,
.aka-hero-fx-copy[data-hero-look~="r"] .aka-hero-rating-stars{
color: #D4A843;
text-shadow:
0 0 8px rgba(212,168,67,0.92),
0 0 18px rgba(212,168,67,0.58),
0 0 34px rgba(212,168,67,0.28),
0 0 46px rgba(139,0,0,0.20);
filter: brightness(1.20) saturate(1.05);
}
body:where(:not(.aka-hero-composited)).is-hero-studio-zone-active .aka-hero-studio-line,
.aka-hero-fx-copy[data-hero-look~="studio"].aka-hero-studio-line,
.aka-hero-fx-copy[data-hero-look~="studio"] .aka-hero-studio-line{
color: rgba(212,168,67,1);
text-shadow:
0 0 7px rgba(212,168,67,0.68),
0 0 16px rgba(212,168,67,0.42),
0 0 30px rgba(212,168,67,0.20),
0 0 44px rgba(139,0,0,0.18);
filter: brightness(1.16) saturate(1.04);
}
body:where(:not(.aka-hero-composited)).is-hero-studio-zone-active .aka-hero-legend-line,
.aka-hero-fx-copy[data-hero-look~="studio"].aka-hero-legend-line,
.aka-hero-fx-copy[data-hero-look~="studio"] .aka-hero-legend-line{
color: rgba(255,236,190,0.98);
text-shadow:
0 0 5px rgba(232,213,183,0.32),
0 0 14px rgba(212,168,67,0.30),
0 0 30px rgba(212,168,67,0.14),
0 0 42px rgba(139,0,0,0.15);
filter: brightness(1.10);
}
body:where(:not(.aka-hero-composited)).is-hero-studio-zone-active .aka-hero-view-story-cta,
.aka-hero-fx-copy[data-hero-look~="studio"].aka-hero-view-story-cta,
.aka-hero-fx-copy[data-hero-look~="studio"] .aka-hero-view-story-cta{
border-color: rgba(212,168,67,0.90);
color: rgba(255,232,176,0.98);
background:
radial-gradient(ellipse at 50% 0%, rgba(212,168,67,0.18), transparent 62%),
linear-gradient(180deg, rgba(212,168,67,0.10), rgba(8,8,8,0.18));
box-shadow:
0 0 18px rgba(212,168,67,0.38),
0 0 36px rgba(212,168,67,0.18),
0 0 52px rgba(139,0,0,0.16),
inset 0 0 18px rgba(212,168,67,0.070);
text-shadow:
0 0 8px rgba(212,168,67,0.52),
0 0 18px rgba(212,168,67,0.28),
0 0 30px rgba(139,0,0,0.20);
filter: brightness(1.14) saturate(1.04);
}
body.is-hero-nav-zone-active .aka-nav-cinema-segment {
border-color: rgba(255,45,85,0.78);
background:
linear-gradient(90deg, rgba(139,0,0,0.42), rgba(255,45,85,0.13), rgba(139,0,0,0.30)),
rgba(8,8,8,0.58);
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.10),
0 0 18px rgba(255,45,85,0.38),
0 0 36px rgba(139,0,0,0.34),
0 0 54px rgba(212,168,67,0.10),
0 12px 30px rgba(0,0,0,0.34);
filter: brightness(1.08) saturate(1.03);
}
body.is-hero-nav-zone-active .aka-nav-cinema-segment::before,
body.is-hero-nav-zone-active .aka-nav-cinema-segment::after {
background: linear-gradient(to bottom, transparent, rgba(255,45,85,0.98), rgba(212,168,67,0.40), transparent);
box-shadow:
0 0 14px rgba(255,45,85,0.54),
0 0 26px rgba(139,0,0,0.34),
0 0 36px rgba(212,168,67,0.14);
}
body.is-hero-nav-zone-active .aka-nav-cinema-segment > a {
color: rgba(255,232,176,1) !important;
text-shadow:
0 0 8px rgba(212,168,67,0.46),
0 0 17px rgba(212,168,67,0.22),
0 0 24px rgba(255,45,85,0.18);
filter: brightness(1.12);
}
body.is-hero-nav-zone-active #navbar .aka-language-button {
border-color: rgba(212,168,67,0.62);
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.20), transparent 64%),
linear-gradient(180deg, rgba(255,45,85,0.13), rgba(8,8,8,0.34));
color: rgba(255,236,190,0.98);
box-shadow:
0 0 14px rgba(212,168,67,0.26),
0 0 26px rgba(255,45,85,0.20),
inset 0 1px 0 rgba(232,213,183,0.085);
filter: brightness(1.12);
}
body:where(:not(.aka-hero-composited)).is-hero-final-signal .aka-hero-rating-badge,
.aka-hero-fx-copy[data-hero-look~="final"].aka-hero-rating-badge,
.aka-hero-fx-copy[data-hero-look~="final"] .aka-hero-rating-badge{
border-color: rgba(212,168,67,0.94);
box-shadow:
0 0 22px rgba(212,168,67,0.46),
0 0 44px rgba(212,168,67,0.24),
0 0 68px rgba(139,0,0,0.24),
inset 0 0 22px rgba(212,168,67,0.10);
}
body:where(:not(.aka-hero-composited)).is-hero-final-signal .aka-hero-view-story-cta,
.aka-hero-fx-copy[data-hero-look~="final"].aka-hero-view-story-cta,
.aka-hero-fx-copy[data-hero-look~="final"] .aka-hero-view-story-cta{
border-color: rgba(212,168,67,0.96);
box-shadow:
0 0 22px rgba(212,168,67,0.52),
0 0 46px rgba(212,168,67,0.25),
0 0 70px rgba(139,0,0,0.20),
inset 0 0 24px rgba(212,168,67,0.11);
}
body:where(:not(.aka-hero-composited)).is-hero-final-signal .aka-nav-cinema-segment,
.aka-hero-fx-copy[data-hero-look~="final"].aka-nav-cinema-segment,
.aka-hero-fx-copy[data-hero-look~="final"] .aka-nav-cinema-segment{
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.13),
0 0 22px rgba(255,45,85,0.46),
0 0 42px rgba(139,0,0,0.36),
0 0 64px rgba(212,168,67,0.16),
0 12px 30px rgba(0,0,0,0.34);
/* Keep the NAV at the existing breath animation's peak instead of
periodically dimming the whole segment (including every underline). */
filter: brightness(1.24) saturate(1.10);
animation: none;
}
body:where(:not(.aka-hero-composited)).is-hero-final-signal .aka-hero-rating-stars,
.aka-hero-fx-copy[data-hero-look~="final"].aka-hero-rating-stars,
.aka-hero-fx-copy[data-hero-look~="final"] .aka-hero-rating-stars,
body:where(:not(.aka-hero-composited)).is-hero-final-signal .aka-hero-studio-line,
.aka-hero-fx-copy[data-hero-look~="final"].aka-hero-studio-line,
.aka-hero-fx-copy[data-hero-look~="final"] .aka-hero-studio-line{
text-shadow:
0 0 9px rgba(212,168,67,0.98),
0 0 20px rgba(212,168,67,0.66),
0 0 38px rgba(212,168,67,0.32),
0 0 56px rgba(139,0,0,0.22);
}
body:where(:not(.aka-hero-composited)).is-hero-final-signal .aka-hero-star-trigger svg,
.aka-hero-fx-copy[data-hero-look~="final"].aka-hero-star-trigger svg,
.aka-hero-fx-copy[data-hero-look~="final"] .aka-hero-star-trigger svg{
filter:
brightness(1.30)
drop-shadow(0 0 9px rgba(212,168,67,0.98))
drop-shadow(0 0 20px rgba(212,168,67,0.68))
drop-shadow(0 0 38px rgba(212,168,67,0.34))
drop-shadow(0 0 54px rgba(139,0,0,0.24));
}
body:where(:not(.aka-hero-composited)).is-hero-final-signal .aka-hero-rating-badge,
.aka-hero-fx-copy[data-hero-look~="final"].aka-hero-rating-badge,
.aka-hero-fx-copy[data-hero-look~="final"] .aka-hero-rating-badge,
body:where(:not(.aka-hero-composited)).is-hero-final-signal .aka-hero-view-story-cta,
.aka-hero-fx-copy[data-hero-look~="final"].aka-hero-view-story-cta,
.aka-hero-fx-copy[data-hero-look~="final"] .aka-hero-view-story-cta{
/* The completed combination holds one stable peak. The exit is handled by
one synchronized release state instead of independent breath phases. */
animation: none;
filter: brightness(1.24) saturate(1.10);
}
body.is-hero-final-releasing {
--aka-hero-final-fade-duration: 1100ms;
--aka-hero-final-fade-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-r-trigger,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-restricted-copy,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-rating-badge,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-rating-stars,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-star-trigger svg,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-star-line,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-classification,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-studio-line,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-legend-line,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing #hero .aka-hero-view-story-cta,
body.is-hero-final-releasing .aka-nav-cinema-segment,
body.is-hero-final-releasing #navbar .aka-nav-cinema-segment > a,
body.is-hero-final-releasing #navbar .aka-language-button,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-classification::before,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-classification::after,
body.is-hero-final-releasing .aka-nav-cinema-segment::before,
body.is-hero-final-releasing .aka-nav-cinema-segment::after,
body.is-hero-final-releasing #navbar .aka-nav-cinema-segment > a::after {
transition-property: color, border-color, background-color, box-shadow, text-shadow, filter, opacity !important;
transition-duration: var(--aka-hero-final-fade-duration) !important;
transition-timing-function: var(--aka-hero-final-fade-ease) !important;
transition-delay: 0ms !important;
}
@media (prefers-reduced-motion: reduce) {
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-r-trigger,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-restricted-copy,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-rating-badge,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-rating-stars,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-star-trigger svg,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-star-line,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-classification,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-studio-line,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-legend-line,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing #hero .aka-hero-view-story-cta,
body.is-hero-final-releasing .aka-nav-cinema-segment,
body.is-hero-final-releasing #navbar .aka-nav-cinema-segment > a,
body.is-hero-final-releasing #navbar .aka-language-button,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-classification::before,
body:where(:not(.aka-hero-composited)).is-hero-final-releasing .aka-hero-classification::after,
body.is-hero-final-releasing .aka-nav-cinema-segment::before,
body.is-hero-final-releasing .aka-nav-cinema-segment::after,
body.is-hero-final-releasing #navbar .aka-nav-cinema-segment > a::after {
transition-duration: 0.001ms !important;
}
}
/* Mobile HERO: the original controls keep their geometry and hit targets.
Their static lit looks share the declarations above; only layer opacity
changes during the combination. Desktop keeps the original renderer. */
@media (max-width: 768px) {
/* Keep the projector flicker local: never dim the entire filtered subtree. */
#hero::before {
content: "";
position: absolute;
inset: 0;
z-index: 20;
background: #0a0a0a;
opacity: var(--aka-hero-projector-dim, 0);
pointer-events: none;
}
/* A stable base title cannot share the clipped VHS pseudo-element surface. */
#hero .glitch-text { isolation: isolate; }
#hero .glitch-text > span { display: block; position: relative; transform: translateZ(0); }
#hero .glitch-text::before, #hero .glitch-text::after { pointer-events: none; }
body.aka-hero-composited #hero .aka-hero-fx-source { position: relative; }
body.aka-hero-composited #hero :is(.aka-hero-r-trigger, .aka-hero-star-trigger) {
/* Press feedback keeps its small transform, without refiltering the glow. */
transition: transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
}
body.aka-hero-composited #hero :is(.aka-hero-r-trigger, .aka-hero-star-trigger).is-pressed { filter: none; }
body.aka-hero-composited #hero .aka-hero-rating-badge.aka-hero-fx-source { --aka-hero-fx-inset: -1px; }
body.aka-hero-composited #hero .aka-hero-view-story-cta.aka-hero-fx-source { --aka-hero-fx-inset: -2px; }
#hero .aka-hero-fx-layer {
position: absolute;
inset: var(--aka-hero-fx-inset, 0px);
display: block;
z-index: 1;
pointer-events: none;
user-select: none;
opacity: 0;
transition: opacity 1100ms ease;
}
#hero .aka-hero-fx-layer > .aka-hero-fx-copy {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
box-sizing: border-box;
margin: 0 !important;
pointer-events: none;
backdrop-filter: none;
-webkit-backdrop-filter: none;
}
#hero .aka-hero-fx-copy,
#hero .aka-hero-fx-copy *,
#hero .aka-hero-fx-copy::before,
#hero .aka-hero-fx-copy::after {
transition: none !important;
animation: none !important;
pointer-events: none !important;
}
body.is-hero-r-zone-active #hero [data-hero-zone="r"][data-hero-level="zone"],
body.is-hero-star-zone-active #hero [data-hero-zone="star"][data-hero-level="zone"],
body.is-hero-studio-zone-active #hero [data-hero-zone="studio"][data-hero-level="zone"],
body.is-hero-final-signal #hero [data-hero-level="final"] { opacity: 1; }
body.is-hero-final-signal #hero [data-hero-level="zone"][data-hero-has-peak] { opacity: 0; }
body.is-hero-final-releasing #hero .aka-hero-fx-layer {
transition-duration: 1100ms;
transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1);
}
}
@media (prefers-reduced-motion: reduce) {
#hero .aka-hero-fx-layer { transition: none !important; }
}
/* Pulse animation for CTA */
@keyframes pulse-neon {
0%, 100% { box-shadow: 0 0 5px #FF2D55, 0 0 10px #FF2D55, 0 0 20px rgba(255, 45, 85, 0.3); }
50% { box-shadow: 0 0 10px #FF2D55, 0 0 20px #FF2D55, 0 0 40px rgba(255, 45, 85, 0.5); }
}
.pulse-neon { animation: pulse-neon 2s infinite; }
/* Typewriter */
@keyframes typing { from { width: 0; } to { width: 100%; } }
@keyframes blink-caret { 50% { border-color: transparent; } }
.typewriter {
overflow: hidden;
border-right: 2px solid #D4A843;
white-space: nowrap;
animation: typing 3s steps(40) 1s forwards, blink-caret 0.75s step-end infinite;
width: 0;
}
/* Float animation */
@keyframes float {
0%, 100% { transform: translateY(0px); }
50% { transform: translateY(-15px); }
}
.float { animation: float 4s ease-in-out infinite; }
/* ===== REDUCED MOTION SAFETY ===== */
@media (prefers-reduced-motion: reduce) {
* {
animation-duration: 0.001ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.001ms !important;
scroll-behavior: auto !important;
}
html {
scroll-behavior: auto;
}
.film-grain,
.glitch-text::before,
.glitch-text::after,
.pulse-neon,
.float,
.typewriter,
body:where(:not(.aka-hero-composited)).is-hero-final-signal .aka-hero-rating-badge,
.aka-hero-fx-copy[data-hero-look~="final"].aka-hero-rating-badge,
.aka-hero-fx-copy[data-hero-look~="final"] .aka-hero-rating-badge,
body:where(:not(.aka-hero-composited)).is-hero-final-signal .aka-hero-view-story-cta,
.aka-hero-fx-copy[data-hero-look~="final"].aka-hero-view-story-cta,
.aka-hero-fx-copy[data-hero-look~="final"] .aka-hero-view-story-cta{
animation: none !important;
}
.film-grain {
transform: none !important;
}
#heroBg {
transform: translate3d(0, 0, 0) scale(1.03) !important;
}
.aka-vault-terminal::after,
.aka-cinematic-cta::after,
.aka-nav-cinema-segment > a::after {
animation: none !important;
transition: none !important;
}
.aka-nav-cinema-segment > a > .aka-nav-link-label {
transform: none !important;
transition: none !important;
}
}
/* Responsive parallax fallback */
@media (max-width: 768px) {
.parallax-bg { background-attachment: scroll; }
}
/* Slideshow */
.slideshow-container { position: relative; overflow: hidden; }
.slide {
position: absolute;
top: 0; left: 0;
width: 100%; height: 100%;
opacity: 0;
transition: opacity 1.2s ease-in-out;
}
.slide.active-slide { opacity: 1; position: relative; }
/* Cinematic Modal */
.modal-overlay {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0);
z-index: 10000;
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
opacity: 0;
pointer-events: none;
transition: all 0.4s ease;
backdrop-filter: blur(0px);}
.modal-overlay[hidden] {
display: none !important;
}
.modal-overlay.active {
opacity: 1;
pointer-events: auto;
background: rgba(0, 0, 0, 0.92);
backdrop-filter: blur(6px);
}
.modal-overlay.is-closing {
pointer-events: none;
}
.modal-overlay.is-closing .modal-close {
opacity: 0;
pointer-events: none;
}
.modal-overlay.is-closing .modal-box {
border-color: transparent;
box-shadow: none;
}
.modal-box {
position: relative;
width: min(88vw, 760px);
border: 1px solid rgba(212, 168, 67, 0.35);
background: #0A0A0A;
box-shadow: 0 0 40px rgba(212, 168, 67, 0.25);
transform: scale(0.85);
transition: all 0.4s ease;
opacity: 0;
}
.modal-overlay.active .modal-box {
transform: scale(1);
opacity: 1;}
.modal-close {
position: absolute;
top: -44px;
right: 0;
color: #D4A843;
font-family: 'Bebas Neue', sans-serif;
font-size: 28px;
cursor: pointer;
z-index: 9999;
}
@media (max-width: 768px) {
.modal-overlay {
height: 100vh;
height: 100dvh;
min-height: 100dvh;
align-items: flex-start;
justify-content: center;
padding:
max(12px, calc(env(safe-area-inset-top, 0px) + 12px))
12px
max(22px, calc(env(safe-area-inset-bottom, 0px) + 22px));
overflow-x: hidden;
overflow-y: auto;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
}
.modal-box {
width: min(94vw, 430px);
max-height: none;
margin: 0 auto;
transform-origin: top center;
}
.modal-close {
top: 12px !important;
right: 12px !important;
font-size: 18px !important;
width: 2rem !important;
height: 2rem !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
background: rgba(8, 8, 8, 0.74) !important;
border: 1px solid rgba(212,168,67,0.22) !important;
border-radius: 999px !important;
box-shadow: 0 0 14px rgba(0,0,0,0.38) !important;
padding: 0 !important;
margin: 0 !important;
line-height: 1 !important;
}
#modalContent > div {
padding-top: 26px !important;
padding-bottom: 14px !important;
}
#modalContent h2 {
font-size: 2rem !important;
line-height: 0.92 !important;
margin-bottom: 10px !important;
}
#modalContent .lock-neon {
transform: translateY(0) scale(0.8) !important;
margin-bottom: 4px !important;
}
#modalContent p {
margin-bottom: 10px !important;
}
}
/* ===== WALLET PROVIDER MISSING MODAL: PREMIUM ACTION BUTTONS =====
Visual-only polish for the no-wallet browser modal.
Wallet detection, connect flow, provider retry, and copy logic stay in JS.
*/
.aka-wallet-provider-modal {
isolation: isolate;
background:
radial-gradient(circle at 50% -18%, rgba(212,168,67,0.12), transparent 38%),
radial-gradient(circle at 50% 22%, rgba(139,0,0,0.24), transparent 62%),
linear-gradient(180deg, rgba(9,7,6,0.98), rgba(4,1,1,0.98)) !important;
}
.aka-wallet-provider-modal::before,
.aka-wallet-provider-modal::after {
content: "";
position: absolute;
pointer-events: none;
}
.aka-wallet-provider-modal::before {
inset: 1px;
border: 1px solid rgba(212,168,67,0.08);
background:
linear-gradient(90deg, transparent, rgba(255,45,85,0.08), transparent),
radial-gradient(circle at 50% 0%, rgba(255,255,255,0.030), transparent 42%);
opacity: 0.95;
}
.aka-wallet-provider-modal::after {
left: 12%;
right: 12%;
top: 26%;
height: 1px;
background:
linear-gradient(90deg, transparent, rgba(255,45,85,0.34), rgba(212,168,67,0.32), transparent);
box-shadow:
0 0 18px rgba(255,45,85,0.16),
0 0 28px rgba(212,168,67,0.08);
opacity: 0.72;
}
.aka-wallet-provider-icon {
background:
radial-gradient(circle at 50% 22%, rgba(212,168,67,0.14), transparent 58%),
linear-gradient(180deg, rgba(139,0,0,0.30), rgba(5,2,2,0.86)) !important;
box-shadow:
0 0 18px rgba(212,168,67,0.14),
0 0 34px rgba(139,0,0,0.22),
inset 0 1px 0 rgba(232,213,183,0.10);
}
.aka-wallet-provider-kicker {
text-shadow:
0 0 8px rgba(255,45,85,0.34),
0 0 16px rgba(139,0,0,0.22);
}
.aka-wallet-provider-title {
text-shadow:
0 0 7px rgba(232,213,183,0.10),
0 0 18px rgba(212,168,67,0.12),
0 0 32px rgba(139,0,0,0.16);
}
.aka-wallet-provider-copy {
max-width: 34rem;
margin-left: auto;
margin-right: auto;
padding: 1rem 1.15rem;
border: 1px solid rgba(212,168,67,0.13);
border-radius: 18px;
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.060), transparent 56%),
linear-gradient(180deg, rgba(90,0,0,0.16), rgba(8,8,8,0.24));
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.055),
0 0 22px rgba(139,0,0,0.12);
}
.aka-wallet-provider-actions {
max-width: 34rem;
margin-left: auto;
margin-right: auto;
}
.aka-wallet-provider-action {
min-height: 3.05rem;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid rgba(212,168,67,0.28) !important;
border-radius: 999px;
color: rgba(255,232,176,0.92) !important;
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.105), transparent 58%),
linear-gradient(180deg, rgba(90,0,0,0.30), rgba(8,8,8,0.42)) !important;
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.085),
inset 0 -1px 0 rgba(139,0,0,0.18),
0 0 14px rgba(139,0,0,0.24),
0 9px 22px rgba(0,0,0,0.34);
text-shadow:
0 0 7px rgba(212,168,67,0.22),
0 0 12px rgba(139,0,0,0.26);
}
.aka-wallet-provider-action::after {
width: 28%;
background:
linear-gradient(90deg, transparent, rgba(255,235,190,0.20), transparent);
}
.aka-wallet-provider-action:disabled {
cursor: wait;
opacity: 0.62;
filter: saturate(0.86);
}
.aka-wallet-provider-status {
display: inline-block;
max-width: 34rem;
padding: 0.68rem 0.95rem;
border: 1px solid rgba(212,168,67,0.10);
border-radius: 999px;
background:
linear-gradient(90deg, transparent, rgba(90,0,0,0.18), transparent);
text-shadow:
0 0 6px rgba(232,213,183,0.12),
0 0 12px rgba(139,0,0,0.16);
}
.aka-wallet-provider-close {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 2.45rem;
padding: 0.62rem 1.35rem;
border: 1px solid rgba(212,168,67,0.16);
border-radius: 999px;
background:
linear-gradient(180deg, rgba(212,168,67,0.035), rgba(90,0,0,0.12));
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.045),
0 0 14px rgba(139,0,0,0.12);
transition:
transform 180ms cubic-bezier(0.23, 1, 0.32, 1),
color 240ms ease,
border-color 240ms ease,
box-shadow 260ms ease,
filter 240ms ease;
}
@media (hover: hover) and (pointer: fine) {
.aka-wallet-provider-action:hover {
transform: translateY(-1.5px);
border-color: rgba(212,168,67,0.48) !important;
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.12),
inset 0 -1px 0 rgba(139,0,0,0.20),
0 0 18px rgba(255,45,85,0.22),
0 0 28px rgba(212,168,67,0.13),
0 12px 28px rgba(0,0,0,0.40);
filter: brightness(1.08) saturate(1.04);
}
.aka-wallet-provider-action:hover::after {
left: 118%;
opacity: 1;
}
.aka-wallet-provider-close:hover {
color: rgba(255,232,176,0.92) !important;
border-color: rgba(212,168,67,0.28);
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.07),
0 0 16px rgba(212,168,67,0.10),
0 0 18px rgba(139,0,0,0.16);
filter: brightness(1.05);
}
}
.aka-wallet-provider-action:active,
.aka-wallet-provider-close:active {
transform: translateY(1px) scale(0.985);
}
@media (max-width: 768px) {
.aka-wallet-provider-modal {
padding-left: 1rem !important;
padding-right: 1rem !important;
}
.aka-wallet-provider-modal::after {
top: 24%;
left: 16%;
right: 16%;
opacity: 0.52;
}
.aka-wallet-provider-copy {
padding: 0.85rem 0.9rem;
border-radius: 14px;
}
.aka-wallet-provider-action {
min-height: 2.75rem;
border-radius: 16px;
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.075),
0 0 10px rgba(139,0,0,0.18);
}
.aka-wallet-provider-status {
border-radius: 14px;
padding: 0.6rem 0.7rem;
}
}
@media (prefers-reduced-motion: reduce) {
.aka-wallet-provider-action,
.aka-wallet-provider-close,
.aka-wallet-provider-action::after {
transition: none !important;
}
}
/* ===== WALLET SELECT MODAL: 4 PRIMARY WALLETS ===== */
.aka-wallet-select-modal {
--aka-wallet-card-border: rgba(212,168,67,0.18);
--aka-wallet-card-border-ready: rgba(74,222,128,0.34);
overflow: visible !important;
}
.aka-wallet-select-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.82rem;
max-width: 42rem;
margin: 0 auto;
}
.aka-wallet-option {
position: relative;
min-height: 8.35rem;
width: 100%;
display: grid;
grid-template-columns: auto 1fr;
grid-template-rows: auto 1fr auto;
gap: 0.68rem 0.78rem;
padding: 1rem;
border: 1px solid var(--aka-wallet-card-border);
border-radius: 22px;
overflow: visible;
text-align: left;
color: rgba(255,236,190,0.90);
background:
radial-gradient(circle at 22% 0%, rgba(212,168,67,0.100), transparent 44%),
radial-gradient(circle at 100% 100%, rgba(255,45,85,0.085), transparent 46%),
linear-gradient(180deg, rgba(32,12,10,0.68), rgba(5,2,2,0.86));
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.070),
0 14px 30px rgba(0,0,0,0.30),
0 0 18px rgba(139,0,0,0.13);
cursor: pointer;
transition:
transform 180ms cubic-bezier(0.23, 1, 0.32, 1),
border-color 240ms ease,
box-shadow 260ms ease,
filter 240ms ease;
}
.aka-wallet-option::before {
content: "";
position: absolute;
inset: 0;
background:
linear-gradient(115deg, transparent 0%, rgba(255,235,190,0.085) 46%, transparent 58%);
opacity: 0;
transform: translateX(-28%);
transition: opacity 260ms ease, transform 520ms cubic-bezier(0.23, 1, 0.32, 1);
pointer-events: none;
border-radius: inherit;
}
.aka-wallet-option.is-primary {
border-color: rgba(212,168,67,0.34);
background:
radial-gradient(circle at 22% 0%, rgba(212,168,67,0.155), transparent 44%),
radial-gradient(circle at 100% 100%, rgba(255,45,85,0.105), transparent 46%),
linear-gradient(180deg, rgba(47,18,10,0.76), rgba(6,2,2,0.88));
}
.aka-wallet-option-rank {
position: absolute;
top: 0.72rem;
right: 0.82rem;
font-family: 'Special Elite', monospace;
font-size: 0.62rem;
letter-spacing: 0.18em;
color: rgba(212,168,67,0.42);
}
.aka-wallet-option-mark {
grid-row: 1 / span 2;
width: 3.18rem;
height: 3.18rem;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid rgba(212,168,67,0.26);
border-radius: 999px;
font-family: 'Bebas Neue', sans-serif;
font-size: 1.05rem;
letter-spacing: 0.055em;
color: rgba(255,232,176,0.94);
background:
radial-gradient(circle at 50% 20%, rgba(212,168,67,0.16), transparent 58%),
linear-gradient(180deg, rgba(139,0,0,0.30), rgba(5,2,2,0.84));
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.085),
0 0 16px rgba(212,168,67,0.12),
0 0 22px rgba(139,0,0,0.14);
flex: 0 0 auto;
margin-top: 0.08rem;
overflow: visible;
}
.aka-wallet-option-body {
display: flex;
flex-direction: column;
min-width: 0;
padding-right: 2.15rem;
}
.aka-wallet-option-name {
font-family: 'Bebas Neue', sans-serif;
font-size: 1.65rem;
line-height: 0.95;
letter-spacing: 0.06em;
color: rgba(255,236,190,0.98);
text-shadow:
0 0 8px rgba(212,168,67,0.13),
0 0 18px rgba(139,0,0,0.18);
}
.aka-wallet-option-headline {
margin-top: 0.42rem;
font-family: 'Special Elite', monospace;
font-size: 0.66rem;
line-height: 1.45;
letter-spacing: 0.12em;
color: rgba(212,168,67,0.70);
text-transform: uppercase;
}
.aka-wallet-option-note {
margin-top: 0.34rem;
font-family: 'Space Grotesk', sans-serif;
font-size: 0.75rem;
line-height: 1.45;
color: rgba(232,213,183,0.50);
}
.aka-wallet-option-status {
grid-column: 1 / -1;
cursor: pointer;
width: fit-content;
min-height: 1.55rem;
display: inline-flex;
align-items: center;
padding: 0.28rem 0.58rem;
border: 1px solid rgba(212,168,67,0.16);
border-radius: 999px;
font-family: 'Special Elite', monospace;
font-size: 0.58rem;
letter-spacing: 0.16em;
color: rgba(232,213,183,0.50);
background: rgba(8,8,8,0.36);
}
.aka-wallet-option-status:is(.is-ready, .is-reconnect) {
border-color: var(--aka-wallet-card-border-ready);
color: rgba(154,255,174,0.82);
background: rgba(21,128,61,0.10);
text-shadow: 0 0 8px rgba(74,222,128,0.22);
}
.aka-wallet-option.is-not-detected {
border-color: rgba(255,45,85,0.34);
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.070),
0 0 18px rgba(255,45,85,0.12),
0 14px 30px rgba(0,0,0,0.30);
}
.aka-wallet-option-status.is-not-detected {
border-color: rgba(255,45,85,0.32);
color: rgba(255,135,154,0.86);
background: rgba(255,45,85,0.085);
text-shadow: 0 0 8px rgba(255,45,85,0.18);
}
.aka-wallet-option:disabled {
cursor: wait;
opacity: 0.72;
}
.aka-wallet-option.is-connecting {
filter: brightness(1.10);
}
.aka-wallet-select-safety {
max-width: 42rem;
margin-left: auto;
margin-right: auto;
padding: 0.78rem 0.9rem;
border: 1px solid rgba(212,168,67,0.11);
border-radius: 999px;
background: linear-gradient(90deg, transparent, rgba(90,0,0,0.18), transparent);
}
@media (hover: hover) and (pointer: fine) {
.aka-wallet-option:hover {
transform: translateY(-2px);
border-color: rgba(212,168,67,0.46);
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.10),
0 0 20px rgba(255,45,85,0.16),
0 0 32px rgba(212,168,67,0.12),
0 16px 34px rgba(0,0,0,0.38);
filter: brightness(1.07) saturate(1.04);
}
.aka-wallet-option:hover::before {
opacity: 1;
transform: translateX(26%);
}
}
.aka-wallet-option:active {
transform: translateY(1px) scale(0.988);
}
/* ===== WALLET SELECT I18N + DESKTOP FIT PASS ===== */
@media (min-width: 769px) {
#modalContent.aka-wallet-select-content {
max-height: none !important;
overflow-y: visible !important;
}
#modalContent.aka-wallet-select-content > .aka-wallet-select-modal {
padding: 1.15rem 1.55rem 0.95rem !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-provider-icon {
width: 2.65rem !important;
height: 2.65rem !important;
margin-bottom: 0.72rem !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-provider-kicker {
margin-bottom: 0.52rem !important;
font-size: 0.54rem !important;
letter-spacing: 0.30em !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-provider-title {
margin-bottom: 0.58rem !important;
font-size: clamp(2.35rem, 4.2vw, 3.15rem) !important;
line-height: 0.90 !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-provider-copy {
margin-bottom: 0.90rem !important;
font-size: 0.78rem !important;
line-height: 1.45 !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-select-grid {
gap: 0.62rem !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-main {
min-height: 4.72rem !important;
padding: 0.72rem 0.78rem 0.10rem !important;
gap: 0.50rem 0.62rem !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-mark {
width: 2.34rem !important;
height: 2.34rem !important;
border-radius: 12px !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-logo {
max-width: 1.68rem !important;
max-height: 1.68rem !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-name {
font-size: 1.36rem !important;
line-height: 0.92 !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-headline {
margin-top: 0.24rem !important;
font-size: 0.54rem !important;
line-height: 1.24 !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-note {
margin-top: 0.18rem !important;
font-size: 0.62rem !important;
line-height: 1.25 !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-actions {
min-height: 1.62rem !important;
padding: 0 0.78rem 0.62rem !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-status,
#modalContent.aka-wallet-select-content .aka-wallet-option-download {
min-height: 1.24rem !important;
padding: 0.20rem 0.48rem !important;
font-size: 0.50rem !important;
letter-spacing: 0.12em !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-select-safety {
margin-top: 0.72rem !important;
padding: 0.56rem 0.72rem !important;
border-radius: 14px !important;
font-size: 0.52rem !important;
line-height: 1.42 !important;
letter-spacing: 0.12em !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-provider-close {
margin-top: 0.70rem !important;
min-height: 1.60rem !important;
}
}
#modalContent .aka-wallet-select-safety {
display: grid;
gap: 0.24rem;
}
#modalContent .aka-wallet-select-safety-title {
display: block;
color: rgba(212,168,67,0.82);
letter-spacing: 0.24em;
}
#modalContent .aka-wallet-select-safety-body,
#modalContent .aka-wallet-select-safety-official,
#modalContent .aka-wallet-select-safety-status {
display: block;
}
#modalContent .aka-wallet-select-safety-status:empty {
display: none;
}
@media (max-width: 768px) {
.aka-wallet-select-grid {
grid-template-columns: 1fr;
gap: 0.68rem;
}
.aka-wallet-option {
min-height: 7.35rem;
border-radius: 18px;
padding: 0.9rem;
}
.aka-wallet-option-name {
font-size: 1.45rem;
}
.aka-wallet-option-headline {
font-size: 0.60rem;
}
.aka-wallet-option-note {
font-size: 0.70rem;
}
.aka-wallet-select-safety {
border-radius: 16px;
line-height: 1.55;
}
}
@media (prefers-reduced-motion: reduce) {
.aka-wallet-option,
.aka-wallet-option::before {
transition: none !important;
}
}
/* ===== WALLET SELECT MODAL FIX PASS: NO OLD FALLBACK / NO CLIPPED BADGES ===== */
#modalContent > .aka-wallet-select-modal {
overflow: visible !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option,
#modalContent .aka-wallet-select-modal .aka-wallet-option-mark {
overflow: visible !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option::before {
border-radius: inherit;
}
/* ===== WALLET SELECT MODAL FIX PASS: CLEAN BADGES + DOWNLOAD AFTER NOT DETECTED ===== */
#modalContent > .aka-wallet-select-modal,
#modalContent .aka-wallet-select-modal .aka-wallet-option {
overflow: hidden !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option {
display: flex;
flex-direction: column;
gap: 0;
padding: 0;
outline: none !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-main {
appearance: none;
-webkit-appearance: none;
width: 100%;
display: grid;
grid-template-columns: auto 1fr;
grid-template-rows: auto 1fr;
gap: 0.68rem 0.78rem;
min-height: 5.75rem;
padding: 1rem 1rem 0.28rem;
border: 0;
outline: none !important;
background: transparent;
color: inherit;
text-align: left;
cursor: pointer;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-main[hidden],
#modalContent.aka-wallet-select-content .aka-wallet-option-download[hidden] {
display: none !important;
}
#modalContent .aka-wallet-select-modal a.aka-wallet-option-main {
text-decoration: none;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-main:focus-visible {
outline: none !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option:focus-within {
border-color: rgba(212,168,67,0.42);
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.10),
0 0 18px rgba(212,168,67,0.13),
0 14px 30px rgba(0,0,0,0.34);
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-mark {
width: 2.78rem;
height: 2.78rem;
border-radius: 14px !important;
outline: none !important;
overflow: hidden !important;
border-color: rgba(212,168,67,0.24);
background:
linear-gradient(145deg, rgba(74,20,12,0.78), rgba(5,2,2,0.92));
box-shadow:
inset 0 1px 0 rgba(232,213,183,0.080),
inset 0 -10px 18px rgba(0,0,0,0.20),
0 0 14px rgba(212,168,67,0.10);
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-mark::before,
#modalContent .aka-wallet-select-modal .aka-wallet-option-mark::after {
content: none !important;
display: none !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-logo {
width: 72%;
height: 72%;
max-width: 2.05rem;
max-height: 2.05rem;
display: block;
object-fit: contain;
object-position: center;
filter:
drop-shadow(0 0 7px rgba(212,168,67,0.14))
drop-shadow(0 3px 7px rgba(0,0,0,0.34));
transform: translateZ(0);
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-logo.is-missing {
display: none !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-fallback {
display: none;
align-items: center;
justify-content: center;
font-family: 'Bebas Neue', sans-serif;
font-size: 1.05rem;
letter-spacing: 0.055em;
color: rgba(255,232,176,0.94);
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-fallback.is-visible {
display: inline-flex;
}
#modalContent .aka-wallet-select-modal [data-wallet-card="phantom"] .aka-wallet-option-logo,
#modalContent .aka-wallet-select-modal [data-wallet-card="metamask"] .aka-wallet-option-logo {
width: 78%;
height: 78%;
max-width: 2.18rem;
max-height: 2.18rem;
}
#modalContent .aka-wallet-select-modal [data-wallet-card="solflare"] .aka-wallet-option-logo {
width: 82%;
height: 82%;
max-width: 2.20rem;
max-height: 2.20rem;
border-radius: 0.54rem;
}
#modalContent .aka-wallet-select-modal [data-wallet-card="backpack"] .aka-wallet-option-logo {
width: 70%;
height: 70%;
max-width: 1.96rem;
max-height: 1.96rem;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-actions {
display: flex;
align-items: center;
justify-content: flex-start;
gap: 0.46rem;
min-height: 2.2rem;
padding: 0 1rem 1rem;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-status {
grid-column: auto;
flex: 0 0 auto;
white-space: nowrap;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-download {
display: none;
min-height: 1.55rem;
align-items: center;
justify-content: center;
padding: 0.28rem 0.62rem;
border: 1px solid rgba(212,168,67,0.36);
border-radius: 999px;
font-family: 'Special Elite', monospace;
font-size: 0.58rem;
letter-spacing: 0.16em;
color: rgba(255,232,176,0.92);
background: rgba(212,168,67,0.085);
text-decoration: none;
text-shadow: 0 0 8px rgba(212,168,67,0.18);
transition: border-color 180ms ease, background 180ms ease, transform 140ms ease, filter 180ms ease;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-download.is-visible {
display: inline-flex;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-download:hover {
border-color: rgba(212,168,67,0.58);
background: rgba(212,168,67,0.14);
filter: brightness(1.08);
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-download:active {
transform: translateY(1px) scale(0.98);
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-main:disabled {
cursor: wait;
opacity: 0.72;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-main.is-connecting {
filter: brightness(1.10);
}
@media (max-width: 768px) {
#modalContent > .aka-wallet-select-modal {
padding: 1.15rem 0.86rem 1rem !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-provider-icon {
width: 2.75rem !important;
height: 2.75rem !important;
margin-bottom: 0.72rem !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-provider-kicker {
margin-bottom: 0.56rem !important;
font-size: 0.52rem !important;
letter-spacing: 0.28em !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-provider-title {
margin-bottom: 0.68rem !important;
font-size: clamp(2rem, 9.6vw, 2.72rem) !important;
line-height: 0.92 !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-provider-copy {
margin-bottom: 0.92rem !important;
padding: 0.72rem 0.78rem !important;
font-size: 0.78rem !important;
line-height: 1.55 !important;
border-radius: 14px !important;
}
#modalContent .aka-wallet-select-grid {
gap: 0.58rem !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option {
min-height: 5.85rem !important;
border-radius: 17px !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-main {
min-height: 4.55rem !important;
padding: 0.72rem 0.78rem 0.12rem !important;
gap: 0.52rem 0.68rem !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-actions {
min-height: 1.75rem !important;
padding: 0 0.78rem 0.62rem !important;
flex-wrap: wrap;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-mark {
width: 2.28rem !important;
height: 2.28rem !important;
border-radius: 12px !important;
font-size: 0.92rem !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-logo {
max-width: 1.68rem !important;
max-height: 1.68rem !important;
}
#modalContent .aka-wallet-select-modal [data-wallet-card="phantom"] .aka-wallet-option-logo,
#modalContent .aka-wallet-select-modal [data-wallet-card="metamask"] .aka-wallet-option-logo {
max-width: 1.78rem !important;
max-height: 1.78rem !important;
}
#modalContent .aka-wallet-select-modal [data-wallet-card="solflare"] .aka-wallet-option-logo {
max-width: 1.80rem !important;
max-height: 1.80rem !important;
border-radius: 0.48rem !important;
}
#modalContent .aka-wallet-select-modal [data-wallet-card="backpack"] .aka-wallet-option-logo {
max-width: 1.60rem !important;
max-height: 1.60rem !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-rank {
top: 0.58rem !important;
right: 0.66rem !important;
font-size: 0.55rem !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-body {
padding-right: 1.72rem !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-name {
font-size: 1.45rem !important;
line-height: 0.94 !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-headline {
margin-top: 0.28rem !important;
font-size: 0.56rem !important;
line-height: 1.34 !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-note {
margin-top: 0.24rem !important;
font-size: 0.66rem !important;
line-height: 1.35 !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-option-status,
#modalContent .aka-wallet-select-modal .aka-wallet-option-download {
min-height: 1.32rem !important;
padding: 0.22rem 0.50rem !important;
font-size: 0.52rem !important;
letter-spacing: 0.13em !important;
}
#modalContent .aka-wallet-select-safety {
margin-top: 0.9rem !important;
padding: 0.62rem 0.7rem !important;
border-radius: 14px !important;
font-size: 0.54rem !important;
line-height: 1.52 !important;
letter-spacing: 0.14em !important;
}
#modalContent .aka-wallet-select-modal .aka-wallet-provider-close {
margin-top: 0.82rem !important;
min-height: 2.1rem !important;
padding: 0.48rem 1.1rem !important;
}
}
.modal-video {
width: 100%;
max-height: 75vh;
display: block;
}
.lock-neon {
filter: drop-shadow(0 0 6px #FF2D55)
drop-shadow(0 0 14px #FF2D55)
drop-shadow(0 0 26px rgba(255, 45, 85, 0.8));
transform: translateY(14px) scale(0.9);
}
.aka-trailer-locked-modal {
isolation: isolate;
background:
radial-gradient(circle at 50% 12%, rgba(255,45,85,0.14), transparent 44%),
#0A0A0A;
}
.aka-trailer-locked-bg {
position: absolute;
inset: 0;
z-index: -3;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
opacity: 0.46;
pointer-events: none;
user-select: none;
}
.aka-trailer-locked-bg[hidden] {
display: none;
}
.aka-trailer-locked-modal::before,
.aka-trailer-locked-modal::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
}
.aka-trailer-locked-modal::before {
z-index: -2;
background:
linear-gradient(180deg, rgba(0,0,0,0.72), rgba(0,0,0,0.56) 46%, rgba(0,0,0,0.84)),
linear-gradient(90deg, rgba(0,0,0,0.68), transparent 24%, transparent 76%, rgba(0,0,0,0.68));
}
.aka-trailer-locked-modal::after {
z-index: -1;
background:
radial-gradient(ellipse at 50% 12%, rgba(212,168,67,0.17), transparent 48%),
radial-gradient(ellipse at 50% 100%, rgba(255,45,85,0.16), transparent 58%);
}
.group:hover .lock-neon {
transform: translateY(0) scale(1);
}
/* ===== POSTER LOCK SYSTEM ===== */
.poster-lock-overlay {
position: absolute;
inset: 0;
background: rgba(0,0,0,0.72);
z-index: 20;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
overflow: hidden;
pointer-events: none;
}
.poster-lock-overlay > span {
display: none !important;
}
/* DESKTOP HOVER */
.poster-card:hover .lock-neon {
opacity: 1;
transform: translateY(0) scale(1);
}
.poster-card:hover .poster-lock-overlay span {
opacity: 0;
transform: translateY(-12px);
}
.poster-card.is-archive-entry-locked .lock-neon {
opacity: 1;
transform: translateY(0) scale(1);
}
/* MOBILE TOUCH ACTIVE */
.poster-card.active-touch .lock-neon {
opacity: 1;
transform: translateY(0) scale(1);
}
@media (max-width: 768px) {
.poster-card.active-touch > .absolute.inset-0.flex.items-center.justify-center {
opacity: 1 !important;
}
.poster-card.active-touch {
transform: scale(1.015);
box-shadow:
0 0 18px rgba(255, 45, 85, 0.28),
0 0 36px rgba(255, 45, 85, 0.14),
0 18px 50px rgba(0, 0, 0, 0.75);
}
.poster-card.unlocked.active-touch {
box-shadow:
0 0 12px rgba(34, 197, 94, 0.22),
0 0 28px rgba(34, 197, 94, 0.18),
0 0 55px rgba(16, 185, 129, 0.12),
0 20px 60px rgba(0, 0, 0, 0.85);
}
}
/* ===== GLOBAL IMAGE PROTECTION ===== */
html,
body,
img {
-webkit-touch-callout: none;
-webkit-user-select: none;
user-select: none;
}
img {
-webkit-user-drag: none;
user-drag: none;
}
.poster-card img,
#modalContent img,
#story img,
#hero img {
pointer-events: none;
}
/* ===== JOHN 3:16 GLOW ===== */
@keyframes johnGlow {
0%, 100% {
opacity: 0.35;
text-shadow: 0 0 4px rgba(212,168,67,0.15);
}
50% {
opacity: 1;
text-shadow:
0 0 8px rgba(212,168,67,0.5),
0 0 18px rgba(212,168,67,0.35);
}
}
.john-glow {
color: rgba(212,168,67,0.75);
animation: johnGlow 4s ease-in-out infinite;
}
.aka-john-316-trigger {
all: unset;
position: relative;
cursor: pointer;
touch-action: manipulation;
-webkit-tap-highlight-color: transparent;
}
.aka-john-316-trigger::before {
content: "";
position: absolute;
inset: -12px;
}
.aka-john-316-trigger:focus-visible {
outline: 1px solid currentColor;
outline-offset: 5px;
}
/* ===== LEGEND PORTAL ===== */
.legend-portal {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
margin-top: 10px;
padding: 18px 26px;
border: 1px solid rgba(255,45,85,0.18);
background:
radial-gradient(
circle at center,
rgba(255,45,85,0.20),
rgba(255,45,85,0.08) 45%,
rgba(10,10,10,0.08) 100%
),
linear-gradient(
90deg,
rgba(255,45,85,0.10),
rgba(255,45,85,0.16),
rgba(255,45,85,0.10)
);
box-shadow:
0 0 18px rgba(255,45,85,0.20),
0 0 38px rgba(255,45,85,0.12),
inset 0 0 22px rgba(255,45,85,0.04);
overflow: hidden;
cursor: pointer;
transition: all 0.55s ease;
}
.legend-portal::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(
120deg,
transparent,
rgba(212,168,67,0.08),
transparent
);
transform: translateX(-120%);
transition: transform 0.9s ease;
}
.legend-portal:hover {
border-color: rgba(212,168,67,0.34);
box-shadow:
0 0 22px rgba(139,0,0,0.34),
0 0 56px rgba(139,0,0,0.22),
inset 0 0 26px rgba(212,168,67,0.07);
transform: translateY(-2px);
}
.legend-portal:hover::before {
transform: translateX(120%);
}
.legend-portal-text {
position: relative;
z-index: 2;
color: #4aa8ff;
text-shadow:
0 0 5px rgba(255,45,85,0.38),
0 0 12px rgba(255,45,85,0.24),
0 0 24px rgba(255,45,85,0.14),
0 0 42px rgba(139,0,0,0.10);
}
/* ===== MANIFESTO SOFT GLOW ===== */
.manifesto-glow {
opacity: 0.78;
text-shadow:
0 0 3px rgba(232,213,183,0.055),
0 0 9px rgba(212,168,67,0.035);
transition:
color 1.8s ease,
opacity 1.8s ease,
text-shadow 1.8s ease,
filter 1.8s ease;
}
/* ===== TRAILER END CREDITS ===== */
@keyframes creditsRoll {
0% {
transform: translateY(100%);
opacity: 0;
}
10% {
opacity: 1;
}
90% {
opacity: 1;
}
100% {
transform: translateY(-130%);
opacity: 0;
}
}
.modal-image {
width: 100%;
max-height: 85vh;
object-fit: contain;
display: block;
}
.credits-roll {
animation: creditsRoll 95s linear forwards;
}
/* ===== FOOTER MANIFESTO ACT COLORS ===== */
.footer-act-red {
color: #FF2D55;
text-shadow:
0 0 2px rgba(255,45,85,0.35);
}
.footer-act-gold {
color: rgba(232,213,183,0.68);
text-shadow:
0 0 2px rgba(212,168,67,0.20);
}
.footer-act-blue {
color: #00D4FF;
text-shadow:
0 0 4px rgba(0,212,255,0.32),
0 0 12px rgba(0,212,255,0.18);
}
/* ===== AAA FINAL REEL TRANSITION ===== */
.aka-final-reel-transition {
position: relative;
height: clamp(5.1rem, 8.6vw, 7.2rem);
margin-top: -0.7rem;
margin-bottom: -1.85rem;
overflow: hidden;
isolation: isolate;
pointer-events: none;
background:
linear-gradient(180deg, rgba(7,7,7,0), rgba(6,6,6,0.78) 34%, rgba(5,5,5,0.92) 62%, rgba(5,5,5,0));
}
.aka-final-reel-transition::before,
.aka-final-reel-transition::after,
.aka-final-reel-haze,
.aka-final-reel-strip,
.aka-final-reel-core {
content: "";
position: absolute;
pointer-events: none;
}
.aka-final-reel-transition::before {
inset: 0;
z-index: 0;
background:
radial-gradient(ellipse at 50% 48%, rgba(212,168,67,0.16), transparent 50%),
radial-gradient(ellipse at 50% 58%, rgba(139,0,0,0.16), transparent 62%),
linear-gradient(90deg, rgba(0,0,0,0.85), transparent 18%, transparent 82%, rgba(0,0,0,0.85));
opacity: 0.72;
}
.aka-final-reel-transition::after {
left: 50%;
top: 50%;
z-index: 4;
width: min(1060px, 94vw);
height: 1px;
transform: translate(-50%, -50%);
background: linear-gradient(90deg, transparent, rgba(212,168,67,0.10), rgba(212,168,67,0.28), rgba(255,45,85,0.10), rgba(212,168,67,0.28), rgba(212,168,67,0.10), transparent);
box-shadow:
0 0 14px rgba(212,168,67,0.14),
0 0 34px rgba(139,0,0,0.10);
}
.aka-final-reel-haze {
inset: 13% 0 0;
z-index: 1;
background:
radial-gradient(ellipse at 50% 44%, rgba(212,168,67,0.13), transparent 42%),
linear-gradient(180deg, transparent, rgba(10,10,10,0.55) 48%, transparent);
filter: blur(0.2px);
opacity: 0.72;
}
.aka-final-reel-strip {
left: 50%;
top: 50%;
z-index: 2;
width: min(980px, 90vw);
height: 28px;
transform: translate(-50%, -50%);
border-top: 1px solid rgba(212,168,67,0.075);
border-bottom: 1px solid rgba(212,168,67,0.055);
background:
repeating-linear-gradient(
90deg,
transparent 0,
transparent 24px,
rgba(212,168,67,0.06) 24px,
rgba(212,168,67,0.06) 29px,
transparent 29px,
transparent 54px
),
linear-gradient(90deg, transparent, rgba(212,168,67,0.035) 18%, rgba(139,0,0,0.055) 50%, rgba(212,168,67,0.035) 82%, transparent);
box-shadow:
0 0 18px rgba(212,168,67,0.055),
inset 0 0 18px rgba(0,0,0,0.54);
opacity: 0.66;
-webkit-mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}
.aka-final-reel-strip::before,
.aka-final-reel-strip::after {
content: "";
position: absolute;
left: 0;
right: 0;
height: 6px;
background:
repeating-linear-gradient(
90deg,
rgba(212,168,67,0.13) 0,
rgba(212,168,67,0.13) 6px,
transparent 6px,
transparent 29px
);
opacity: 0.26;
}
.aka-final-reel-strip::before {
top: 4px;
}
.aka-final-reel-strip::after {
bottom: 4px;
}
.aka-final-reel-core {
left: 50%;
top: 50%;
z-index: 3;
width: min(420px, 52vw);
height: 34px;
transform: translate(-50%, -50%);
background:
radial-gradient(ellipse at 50% 50%, rgba(212,168,67,0.13), transparent 66%),
radial-gradient(ellipse at 50% 50%, rgba(255,45,85,0.055), transparent 74%);
filter: blur(0.4px);
opacity: 0.82;
}
.aka-site-finale {
border-top: 0;
}
@media (max-width: 768px) {
.aka-final-reel-transition {
height: 4.8rem;
margin-top: -0.45rem;
margin-bottom: -1.45rem;
}
.aka-final-reel-strip {
width: 92vw;
height: 22px;
opacity: 0.50;
}
.aka-final-reel-core {
width: 58vw;
height: 28px;
}
}
/* ===== AAA FOOTER FINALE / MANIFESTO POLISH ===== */
.aka-site-finale {
position: relative;
padding: 5.35rem 0 4.6rem;
isolation: isolate;
background: #050505;
}
.aka-finale-bg,
.aka-finale-vignette {
position: absolute;
inset: 0;
pointer-events: none;
}
.aka-finale-bg {
z-index: 0;
background:
radial-gradient(ellipse at 50% 6%, rgba(212,168,67,0.105), transparent 34%),
radial-gradient(ellipse at 50% 38%, rgba(139,0,0,0.115), transparent 52%),
linear-gradient(180deg, rgba(10,10,10,0.98), rgba(7,7,7,0.94) 48%, rgba(3,3,3,1));
}
.aka-finale-vignette {
z-index: 1;
background:
linear-gradient(90deg, rgba(0,0,0,0.78), transparent 20%, transparent 80%, rgba(0,0,0,0.78)),
radial-gradient(ellipse at 50% 100%, rgba(0,0,0,0.92), transparent 66%);
opacity: 0.92;
}
.aka-end-credits-card {
position: relative;
max-width: 760px;
margin: 0 auto 2.15rem;
padding: 2.45rem 1.5rem 1.35rem;
}
.aka-end-credits-card::before {
content: "";
position: absolute;
inset: -2.4rem -1.6rem;
z-index: -1;
background:
radial-gradient(ellipse at 50% 0%, rgba(212,168,67,0.13), transparent 55%),
linear-gradient(180deg, rgba(212,168,67,0.035), transparent 70%);
filter: blur(0.2px);
opacity: 0.82;
}
.aka-end-credits-card::after {
content: "";
position: absolute;
left: 50%;
top: 0.3rem;
width: min(420px, 66vw);
height: 1px;
transform: translateX(-50%);
background: linear-gradient(90deg, transparent, rgba(212,168,67,0.33), rgba(255,45,85,0.16), rgba(212,168,67,0.33), transparent);
box-shadow: 0 0 16px rgba(212,168,67,0.18);
}
.aka-footer-kicker {
margin-bottom: 1.7rem;
color: rgba(212,168,67,0.72);
font-size: 0.62rem;
letter-spacing: 0.58em;
text-shadow:
0 0 8px rgba(212,168,67,0.24),
0 0 22px rgba(212,168,67,0.12);
}
.aka-credits-stack {
display: grid;
gap: 1.05rem;
margin-bottom: 2.05rem;
}
.aka-credit-line {
display: grid;
gap: 0.22rem;
}
.aka-credit-label {
color: rgba(232,213,183,0.38);
font-size: 0.66rem;
letter-spacing: 0.08em;
}
.aka-credit-value {
color: rgba(212,168,67,0.86);
font-size: clamp(1.5rem, 2.2vw, 2rem);
letter-spacing: 0.045em;
text-shadow:
0 0 8px rgba(212,168,67,0.16),
0 0 22px rgba(139,0,0,0.15);
}
.aka-credit-studio-name {
font-size: clamp(1.34rem, 1.95vw, 1.82rem);
letter-spacing: 0.035em;
white-space: nowrap;
}
.aka-credit-subvalue {
color: rgba(232,213,183,0.52);
font-size: 0.82rem;
letter-spacing: 0.025em;
}
.aka-footer-reel-line {
width: min(18rem, 68vw);
height: 1px;
margin: 0 auto 1.85rem;
background: linear-gradient(90deg, transparent, rgba(212,168,67,0.30), transparent);
box-shadow: 0 0 18px rgba(212,168,67,0.12);
}
.aka-studio-seal {
display: inline-flex;
align-items: flex-start;
justify-content: center;
gap: 0.95rem;
margin-bottom: 1.04rem;
}
.aka-studio-orb {
width: 2.65rem;
height: 2.65rem;
display: grid;
transform: translateY(-0.30rem);
place-items: center;
border-radius: 999px;
color: #D4A843;
background:
radial-gradient(circle at 35% 30%, rgba(255,255,255,0.12), transparent 34%),
linear-gradient(135deg, #8B0000, #4A0000);
border: 2px solid rgba(212,168,67,0.78);
box-shadow:
0 0 12px rgba(212,168,67,0.18),
0 0 26px rgba(139,0,0,0.18),
inset 0 0 12px rgba(0,0,0,0.35);
}
.aka-studio-lockup {
display: grid;
justify-items: start;
line-height: 1;
}
.aka-studio-name {
color: rgba(232,213,183,0.92);
font-size: clamp(1.62rem, 2.55vw, 2.28rem);
line-height: 0.9;
letter-spacing: 0.13em;
white-space: nowrap;
text-shadow: 0 0 16px rgba(232,213,183,0.08);
}
.aka-studio-subtitle {
margin-top: 0.36rem;
color: rgba(232,213,183,0.48);
font-size: 0.82rem;
font-style: italic;
letter-spacing: 0.015em;
}
.aka-footer-links {
position: relative;
display: flex;
justify-content: center;
margin-top: 0.45rem;
padding-bottom: 0.95rem;
}
.aka-footer-links::after {
content: "";
position: absolute;
left: 50%;
bottom: 0;
width: min(18rem, 66vw);
height: 1px;
transform: translateX(-50%);
background: linear-gradient(90deg, transparent, rgba(212,168,67,0.20), rgba(139,0,0,0.14), rgba(212,168,67,0.20), transparent);
box-shadow: 0 0 16px rgba(212,168,67,0.10);
opacity: 0.75;
}
.aka-footer-whitepaper {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.42rem 0.85rem;
color: rgba(232,213,183,0.46);
font-size: 1.1rem;
letter-spacing: 0.23em;
transform: translateY(0) scale(1) translateZ(0);
transform-origin: center;
transition:
color 0.42s ease,
text-shadow 0.46s ease,
transform 0.58s cubic-bezier(0.22, 1, 0.36, 1),
filter 0.48s ease;
}
.aka-footer-whitepaper::after {
content: "";
position: absolute;
left: 50%;
bottom: 0.18rem;
width: 0;
height: 1px;
transform: translateX(-50%);
background: linear-gradient(90deg, transparent, rgba(212,168,67,0.75), transparent);
transition: width 0.32s ease;
}
.aka-footer-whitepaper:hover {
color: rgba(212,168,67,0.90);
text-shadow:
0 0 10px rgba(212,168,67,0.28),
0 0 18px rgba(255,45,85,0.12);
transform: translateY(-1.55px) scale(1.006) translateZ(0);
filter: brightness(1.045) saturate(1.02);
}
.aka-footer-whitepaper:hover::after {
width: 100%;
}
.aka-manifesto-panel {
position: relative;
max-width: 860px;
margin: 0 auto;
padding: clamp(1.72rem, 3.25vw, 2.42rem) clamp(1.15rem, 3.7vw, 2.72rem);
overflow: hidden;
border-radius: 1.65rem;
border: 1px solid rgba(212,168,67,0.20);
background:
linear-gradient(180deg, rgba(32,27,20,0.60), rgba(13,13,13,0.82)),
radial-gradient(ellipse at 50% 0%, rgba(212,168,67,0.10), transparent 44%),
radial-gradient(ellipse at 50% 100%, rgba(139,0,0,0.12), transparent 54%);
box-shadow:
0 0 0 1px rgba(255,255,255,0.018),
0 0 32px rgba(212,168,67,0.08),
0 0 68px rgba(139,0,0,0.12),
inset 0 1px 0 rgba(255,255,255,0.055),
inset 0 0 46px rgba(0,0,0,0.52);
backdrop-filter: blur(10px);
}
.aka-manifesto-panel::before {
content: "";
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
background:
repeating-linear-gradient(
0deg,
rgba(255,255,255,0.018) 0,
rgba(255,255,255,0.018) 1px,
transparent 1px,
transparent 5px
),
linear-gradient(90deg, rgba(0,0,0,0.30), transparent 17%, transparent 83%, rgba(0,0,0,0.30));
opacity: 0.23;
}
.aka-manifesto-panel::after {
content: "";
position: absolute;
left: 14%;
right: 14%;
top: 0;
height: 1px;
background: linear-gradient(90deg, transparent, rgba(212,168,67,0.55), rgba(255,45,85,0.20), rgba(212,168,67,0.55), transparent);
box-shadow: 0 0 22px rgba(212,168,67,0.20);
}
.aka-manifesto-panel > * {
position: relative;
z-index: 1;
}
.aka-manifesto-topline {
width: min(8rem, 42vw);
height: 1px;
margin: 0 auto 1.4rem;
background: linear-gradient(90deg, transparent, rgba(212,168,67,0.38), transparent);
}
.aka-manifesto-title {
margin-bottom: 0.76rem;
text-align: center;
color: rgba(230,201,122,0.92);
font-size: clamp(1.52rem, 3.1vw, 2.32rem);
line-height: 0.94;
letter-spacing: 0.178em;
text-shadow:
0 0 7px rgba(212,168,67,0.34),
0 0 20px rgba(212,168,67,0.14),
0 0 36px rgba(139,0,0,0.10);
}
.aka-risk-line {
appearance: none;
display: block;
width: fit-content;
margin: 0 auto 1.45rem;
padding: 0.40rem 0.82rem 0.34rem;
border: 1px solid rgba(255,45,85,0.24);
border-radius: 0.40rem;
color: rgba(255,79,97,0.90);
background: rgba(139,0,0,0.125);
font-size: clamp(0.80rem, 1.55vw, 0.96rem);
letter-spacing: 0.22em;
text-align: center;
box-shadow:
0 0 16px rgba(255,45,85,0.10),
inset 0 0 14px rgba(255,45,85,0.035);
text-shadow:
0 0 6px rgba(255,45,85,0.22),
0 0 18px rgba(139,0,0,0.20);
cursor: pointer;
-webkit-tap-highlight-color: transparent;
transition:
color 1.15s ease,
border-color 1.15s ease,
background 1.15s ease,
box-shadow 1.15s ease,
text-shadow 1.15s ease,
filter 1.15s ease,
transform 0.18s cubic-bezier(0.23, 1, 0.32, 1);
}
.aka-risk-line:hover,
.aka-risk-line:focus-visible {
border-color: rgba(255,79,97,0.34);
color: rgba(255,105,119,0.95);
}
.aka-risk-line.is-pressed {
transform: translateY(1px) scale(0.996);
}
.aka-risk-line.is-signal-active {
color: rgba(255,156,150,0.98);
border-color: rgba(255,79,97,0.52);
background: rgba(139,0,0,0.19);
filter: brightness(1.08);
box-shadow:
0 0 18px rgba(255,45,85,0.22),
0 0 42px rgba(139,0,0,0.20),
inset 0 0 20px rgba(255,45,85,0.075);
text-shadow:
0 0 7px rgba(255,105,119,0.46),
0 0 18px rgba(255,45,85,0.30),
0 0 34px rgba(139,0,0,0.24);
}
.aka-risk-line:focus-visible {
outline: 1px solid rgba(255,156,150,0.42);
outline-offset: 0.32rem;
}
.aka-manifesto-copy {
max-width: 710px;
margin: 0 auto;
color: rgba(232,213,183,0.74);
font-size: clamp(0.72rem, 1.08vw, 0.81rem);
line-height: 1.82;
letter-spacing: 0.012em;
text-align: center;
}
.aka-manifesto-copy .footer-act-gold {
color: rgba(232,213,183,0.74);
transition:
color 1.8s ease,
text-shadow 1.8s ease,
filter 1.8s ease;
}
.aka-manifesto-copy.is-signal-active {
opacity: 1;
filter: brightness(1.12);
text-shadow:
0 0 4px rgba(232,213,183,0.20),
0 0 12px rgba(212,168,67,0.18),
0 0 28px rgba(212,168,67,0.105),
0 0 52px rgba(139,0,0,0.075);
}
.aka-manifesto-copy.is-signal-active .footer-act-gold {
color: rgba(245,229,198,0.93);
text-shadow:
0 0 4px rgba(232,213,183,0.30),
0 0 12px rgba(212,168,67,0.22),
0 0 24px rgba(212,168,67,0.13),
0 0 46px rgba(139,0,0,0.09);
}
.aka-final-signal {
width: fit-content;
max-width: 100%;
margin: 2.05rem auto 0;
padding: 0.78rem 1.1rem 0.72rem;
border-top: 1px solid rgba(212,168,67,0.15);
border-bottom: 1px solid rgba(212,168,67,0.15);
background: linear-gradient(90deg, transparent, rgba(77,163,255,0.045), rgba(212,168,67,0.035), transparent);
}
.aka-final-signal .legend-portal-text {
display: block;
color: rgba(91,174,255,0.95);
font-size: clamp(0.76rem, 1.5vw, 1rem);
letter-spacing: 0.34em;
text-align: center;
text-shadow:
0 0 8px rgba(77,163,255,0.30),
0 0 20px rgba(212,168,67,0.10),
0 0 34px rgba(139,0,0,0.12);
}
.aka-site-copyright {
display: grid;
gap: 0.42rem;
margin: 2.25rem auto 0;
color: rgba(232,213,183,0.36);
font-size: 0.62rem;
line-height: 1.7;
letter-spacing: 0.16em;
text-align: center;
text-transform: uppercase;
transition:
color 1.45s ease,
text-shadow 1.45s ease,
filter 1.45s ease;
}
.aka-site-copyright p {
margin: 0;
}
.aka-copyright-line {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.36rem;
color: rgba(212,168,67,0.48);
}
.aka-copyright-mark {
appearance: none;
display: inline-flex;
align-items: center;
justify-content: center;
width: 1.38em;
height: 1.38em;
margin: 0;
padding: 0;
border: 1px solid rgba(212,168,67,0.30);
border-radius: 999px;
color: rgba(199,156,58,0.64);
background:
radial-gradient(circle at 50% 45%, rgba(212,168,67,0.055), rgba(139,0,0,0.028) 58%, rgba(10,10,10,0.02));
font-family: 'Space Grotesk', system-ui, sans-serif;
font-size: 2em;
font-weight: 600;
line-height: 1;
letter-spacing: 0;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
box-shadow:
0 0 7px rgba(212,168,67,0.050),
inset 0 0 7px rgba(212,168,67,0.032);
text-shadow:
0 0 4px rgba(212,168,67,0.11),
0 0 10px rgba(139,0,0,0.055);
transform: translateY(-0.075em) translateZ(0);
transition:
color 1.45s ease,
border-color 1.45s ease,
background 1.45s ease,
box-shadow 1.45s ease,
text-shadow 1.45s ease,
filter 1.45s ease,
transform 0.18s cubic-bezier(0.23, 1, 0.32, 1);
}
.aka-copyright-ring {
display: inline-flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
border-radius: inherit;
pointer-events: none;
box-shadow:
inset 0 0 0 1px rgba(212,168,67,0.20),
inset 0 0 6px rgba(212,168,67,0.030);
transition:
box-shadow 1.45s ease,
opacity 1.45s ease;
}
.aka-copyright-c-letter {
display: block;
color: inherit;
font-family: 'Space Grotesk', system-ui, sans-serif;
font-size: 1.02em;
font-weight: 700;
line-height: 0.82;
letter-spacing: 0;
text-transform: uppercase;
text-shadow: inherit;
transform: translateY(-0.01em) scaleX(1.02);
transform-origin: center;
}
.aka-copyright-studio,
.aka-copyright-culture {
transition:
color 1.45s ease,
text-shadow 1.45s ease,
filter 1.45s ease;
}
.aka-copyright-mark:hover,
.aka-copyright-mark:focus-visible {
color: rgba(218,174,78,0.72);
border-color: rgba(212,168,67,0.42);
box-shadow:
0 0 10px rgba(212,168,67,0.10),
0 0 20px rgba(139,0,0,0.065),
inset 0 0 10px rgba(212,168,67,0.050);
}
.aka-copyright-mark:hover .aka-copyright-ring,
.aka-copyright-mark:focus-visible .aka-copyright-ring {
box-shadow:
inset 0 0 0 1px rgba(212,168,67,0.34),
inset 0 0 7px rgba(212,168,67,0.045);
}
.aka-copyright-mark.is-pressed {
transform: translateY(-0.018em) scale(0.985);
}
.aka-site-copyright.is-signal-active {
filter: none;
}
.aka-site-copyright.is-signal-active .aka-copyright-mark,
.aka-copyright-mark.is-signal-active {
color: rgba(218,174,78,0.76);
border-color: rgba(212,168,67,0.56);
background:
radial-gradient(circle at 50% 45%, rgba(212,168,67,0.095), rgba(139,0,0,0.045) 58%, rgba(10,10,10,0.02));
box-shadow:
0 0 10px rgba(212,168,67,0.13),
0 0 24px rgba(212,168,67,0.075),
0 0 38px rgba(139,0,0,0.055),
inset 0 0 12px rgba(212,168,67,0.055);
text-shadow:
0 0 4px rgba(218,174,78,0.22),
0 0 11px rgba(212,168,67,0.16),
0 0 22px rgba(139,0,0,0.085);
filter: none;
}
.aka-site-copyright.is-signal-active .aka-copyright-ring,
.aka-copyright-mark.is-signal-active .aka-copyright-ring {
box-shadow:
inset 0 0 0 1px rgba(212,168,67,0.46),
inset 0 0 7px rgba(212,168,67,0.055),
0 0 7px rgba(212,168,67,0.060);
}
.aka-site-copyright.is-signal-active .aka-copyright-studio {
color: rgba(224,178,72,0.84);
text-shadow:
0 0 5px rgba(212,168,67,0.34),
0 0 14px rgba(212,168,67,0.21),
0 0 28px rgba(139,0,0,0.085);
}
.aka-site-copyright.is-signal-active .aka-copyright-culture {
color: rgba(205,190,160,0.58);
text-shadow:
0 0 4px rgba(232,213,183,0.13),
0 0 11px rgba(212,168,67,0.075),
0 0 22px rgba(139,0,0,0.055);
}
.aka-copyright-mark:focus-visible {
outline: 1px solid rgba(212,168,67,0.38);
outline-offset: 0.25rem;
}
@media (max-width: 768px) {
.aka-site-finale {
padding: 4.05rem 0 3.5rem;
}
.aka-end-credits-card {
margin-bottom: 1.9rem;
padding-inline: 0.35rem;
}
.aka-footer-kicker {
letter-spacing: 0.44em;
}
.aka-studio-seal {
gap: 0.75rem;
align-items: flex-start;
}
.aka-studio-orb {
width: 2.25rem;
height: 2.25rem;
transform: translateY(-0.22rem);
}
.aka-studio-name {
font-size: clamp(1.48rem, 6.2vw, 1.94rem);
letter-spacing: 0.10em;
}
.aka-manifesto-panel {
border-radius: 1.25rem;
}
.aka-manifesto-title {
letter-spacing: 0.115em;
font-size: clamp(1.42rem, 7.2vw, 1.98rem);
}
.aka-risk-line {
width: 100%;
max-width: 22rem;
letter-spacing: 0.16em;
}
.aka-manifesto-copy {
line-height: 1.72;
}
.aka-final-signal .legend-portal-text {
letter-spacing: 0.18em;
}
.aka-site-copyright {
padding-inline: 0.75rem;
letter-spacing: 0.10em;
}
}
/* ===== MODAL SCROLL LOCK: NO PAGE SHIFT ===== */
html {
overflow-y: scroll;
scrollbar-gutter: stable;
}
body.modal-open {
overflow: hidden;
width: 100%;
}
#modalContent {
max-height: 88vh;
overflow-y: auto;
overscroll-behavior: contain;
}
@media (max-width: 768px) {
#modalContent {
max-height: calc(100dvh - max(34px, calc(env(safe-area-inset-top, 0px) + env(safe-area-inset-bottom, 0px) + 34px)));
overflow-y: auto;
overflow-x: hidden;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
}
}
/* ===== MOBILE TRAILER SIZE MATCH ===== */
@media (max-width: 768px) {
.modal-video {
height: 53.5vh !important;
object-fit: cover;
}
}
/* ===== ARCHIVE ACCESS CTA ===== */
.archive-access-cta {
border: 1px solid rgba(255,45,85,0.42);
background: rgba(10,10,10,0.74);
box-shadow:
0 0 12px rgba(255,45,85,0.20),
inset 0 0 12px rgba(255,45,85,0.06);
transition:
border-color 0.35s ease,
box-shadow 0.35s ease,
background 0.35s ease,
transform 0.35s ease;
}
.archive-access-cta span {
color: rgba(255,255,255,0.92);
text-shadow: 0 0 8px rgba(255,45,85,0.35);
}
.poster-card:hover .archive-access-cta {
transform: translateY(-1px) scale(1.02);
border-color: rgba(255,45,85,0.70);
box-shadow:
0 0 18px rgba(255,45,85,0.32),
inset 0 0 14px rgba(255,45,85,0.08);
}
.poster-card.archive-access-granted .archive-access-cta {
border-color: rgba(74,222,128,0.62);
background: rgba(34,197,94,0.10);
box-shadow:
0 0 16px rgba(74,222,128,0.34),
inset 0 0 16px rgba(74,222,128,0.08);
}
.poster-card.archive-access-granted .archive-access-cta span {
color: rgb(74,222,128);
text-shadow: 0 0 10px rgba(74,222,128,0.52);
}
/* ===== AAA CINEMATIC DENSITY: MAIN PAGE ONLY ===== */
@media (min-width: 1024px) {
/* Top navigation: separate left and right positioning */
#navbar > div {
max-width: 82rem;
}
#navbar a[href="#hero"] {
transform: translateX(-26px) scale(1.12);
transform-origin: left center;
}
#navbar .hidden.md\:flex {
gap: 2.25rem;
transform: translateX(26px);
}
#navbar .hidden.md\:flex > a {
font-size: 0.92rem;
letter-spacing: 0.04em;
}
#navbar button[data-language-toggle] {
transform: scale(1.08);
transform-origin: center;
}
/* Hero: bigger cinematic emphasis, background held higher */
#heroBg {
object-position: center 38%;
}
#hero > .relative.z-10 {
max-width: 74rem;
transform: translateY(-0.4rem);
}
#hero h1 {
font-size: clamp(7.68rem, 12.288vw, 13.44rem) !important;
letter-spacing: 0.055em;
}
#hero .reveal:first-child p {
font-size: 0.95rem;
letter-spacing: 0.58em;
}
#heroSubtitle {
font-size: 1.75rem !important;
}
#hero .inline-block .font-elite {
font-size: 0.85rem;
}
#hero .flex.flex-col.sm\:flex-row a {
font-size: 1.45rem;
padding: 1.05rem 2.25rem;
}
/* Story: more text presence, image not overwhelming */
#story .max-w-6xl {
max-width: 78rem;
}
#story .grid.grid-cols-1.md\:grid-cols-2 {
grid-template-columns: 0.92fr 1.08fr;
gap: 4.5rem;
}
#story .grid.grid-cols-1.md\:grid-cols-2 > .reveal:first-child {
max-width: 34rem;
justify-self: end;
}
#story [data-i18n="officialSynopsis"] {
font-size: 0.82rem;
}
#story [data-i18n="storyQuote"] {
font-size: 1.85rem !important;
line-height: 1.28;
}
#story [data-i18n="storyParagraphOne"],
#story [data-i18n="storyParagraphTwo"] {
font-size: 1.05rem !important;
line-height: 1.78;
}
/* Poster gallery: bigger wall, still controlled */
#gallery .max-w-7xl {
max-width: 82rem;
}
#gallery .grid.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-3 {
gap: 2.3rem;
}
#gallery .poster-card {
max-width: 375px;
}
#gallery .poster-card h3 {
font-size: 1.85rem;
}
#gallery .poster-card p {
font-size: 0.92rem;
}
/* Coin: slightly stronger, but not stretched */
#token .max-w-5xl {
max-width: 68rem;
}
#token .max-w-3xl {
max-width: 56rem;
}
#token .p-8.md\:p-12 {
padding: 3.25rem;
}
#token .font-bebas.text-xl {
font-size: 1.45rem;
}
/* Fan Club: bigger blocks without becoming oversized */
#community .max-w-6xl {
max-width: 78rem;
}
#community .grid.grid-cols-2.lg\:grid-cols-4,
#community .grid.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-4 {
max-width: 72rem;
gap: 1.65rem;
}
#community .grid.grid-cols-2.lg\:grid-cols-4 > div,
#community .grid.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-4 > a,
#community #walletConnectBtn {
padding: 1.85rem;
}
#community .grid.grid-cols-2.lg\:grid-cols-4 p.font-bebas {
font-size: 2.85rem;
}
#community .grid.grid-cols-1.sm\:grid-cols-2.lg\:grid-cols-4 p.font-bebas,
#community #walletStatusTitle {
font-size: 1.35rem;
}
footer .max-w-6xl {
max-width: 76rem;
}
}
@media (max-width: 768px) {
/* Keep mobile poster cards same ratio/height feel */
#gallery .poster-card {
max-width: 330px;
}
}
/* ===== ARCHIVE ACCESS CTA: RED, SOLID, NO BLUR ===== */
.archive-access-cta {
border: 1px solid rgba(255,45,85,0.72) !important;
background: linear-gradient(135deg, rgba(255,45,85,0.88), rgba(139,0,0,0.88)) !important;
box-shadow:
0 0 18px rgba(255,45,85,0.34),
inset 0 0 12px rgba(255,255,255,0.06) !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
transition:
border-color 0.28s ease,
box-shadow 0.28s ease,
background 0.28s ease !important;
}
.archive-access-cta span {
color: rgba(255,255,255,0.96) !important;
text-shadow: 0 0 9px rgba(255,255,255,0.18), 0 0 12px rgba(255,45,85,0.35) !important;
}
.poster-card:hover .archive-access-cta,
.poster-card.active-touch .archive-access-cta,
.poster-card.archive-access-granted .archive-access-cta {
border-color: rgba(255,255,255,0.42) !important;
background: linear-gradient(135deg, rgba(255,45,85,0.98), rgba(139,0,0,0.98)) !important;
box-shadow:
0 0 20px rgba(255,45,85,0.48),
0 0 42px rgba(255,45,85,0.22),
inset 0 0 16px rgba(255,255,255,0.08) !important;
}
.poster-card.archive-access-granted .archive-access-cta span {
color: rgba(255,255,255,0.98) !important;
text-shadow: 0 0 10px rgba(255,45,85,0.45) !important;
}
/* Actual archive grid can be wider; access/locked/trailer modals stay compact */
.modal-box.archive-modal-wide {
width: min(92vw, 980px);
}
@media (max-width: 768px) {
.modal-box.archive-modal-wide {
width: min(94vw, 760px);
}
}
/* ===== ARCHIVE VAULT TERMINAL ===== */
.modal-box.archive-modal-wide {
border-color: rgba(212,168,67,0.26);
box-shadow:
0 0 34px rgba(212,168,67,0.12),
0 0 78px rgba(0,0,0,0.78);
}
.modal-box.archive-modal-wide .modal-close {
top: 0.88rem;
right: 1rem;
z-index: 6;
color: rgba(255,255,255,0.92);
text-shadow: 0 0 12px rgba(255,255,255,0.18);
}
.aka-vault-terminal {
position: relative;
max-height: min(84vh, 820px);
overflow-y: auto;
background:
linear-gradient(180deg, rgba(255,255,255,0.026), rgba(255,255,255,0)),
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.055), transparent 44%),
linear-gradient(135deg, rgba(74,168,255,0.025), transparent 42%),
#080808;
}
#modalContent > .aka-vault-terminal {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.aka-vault-terminal::before {
content: '';
position: absolute;
inset: 0;
pointer-events: none;
opacity: 0.10;
background: repeating-linear-gradient(
0deg,
transparent,
transparent 3px,
rgba(212,168,67,0.10) 4px
);
}
.aka-vault-terminal::after {
content: '';
position: absolute;
left: 0;
right: 0;
top: -20%;
height: 24%;
pointer-events: none;
opacity: 0.16;
background: linear-gradient(to bottom, transparent, rgba(74,222,128,0.15), transparent);
animation: akaVaultScanline 7s ease-in-out infinite;
}
.aka-vault-topbar {
position: relative;
z-index: 1;
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
padding: 0.9rem 1.1rem;
border-bottom: 1px solid rgba(212,168,67,0.14);
background: rgba(0,0,0,0.42);
}
.aka-vault-topbar-left,
.aka-vault-topbar-right {
display: inline-flex;
align-items: center;
gap: 0.5rem;
font-family: 'Special Elite', monospace;
font-size: 0.62rem;
letter-spacing: 0.22em;
color: rgba(232,213,183,0.62);
text-transform: uppercase;
}
.aka-vault-active-dot {
position: relative;
top: -0.05rem;
flex: 0 0 auto;
width: 0.48rem;
height: 0.48rem;
border-radius: 999px;
background: #4ade80;
box-shadow:
0 0 7px rgba(74,222,128,0.52),
0 0 14px rgba(74,222,128,0.24);
animation: akaVaultDotPulse 3.4s ease-in-out infinite;
}
.aka-vault-topbar-left.is-complete .aka-vault-active-dot {
background: #D4A843;
box-shadow:
0 0 7px rgba(212,168,67,0.52),
0 0 15px rgba(212,168,67,0.22);
animation: none;
}
.aka-vault-topbar-left.is-complete {
color: rgba(241,202,106,0.82);
text-shadow: 0 0 8px rgba(212,168,67,0.12);
}
.aka-vault-header {
position: relative;
z-index: 1;
padding: 2.35rem 1.4rem 1.95rem;
border-bottom: 1px solid rgba(212,168,67,0.10);
text-align: center;
overflow: hidden;
background:
linear-gradient(180deg, rgba(255,255,255,0.018), rgba(0,0,0,0.08)),
rgba(0,0,0,0.18);
}
.aka-vault-verified {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.58rem;
margin-bottom: 1.25rem;
font-family: 'Special Elite', monospace;
font-size: 0.82rem;
line-height: 1;
letter-spacing: 0.38em;
color: rgba(255,255,255,0.92);
}
.aka-vault-verified span {
display: block;
line-height: 1;
}
.aka-vault-verified svg {
position: relative;
top: -0.11rem;
display: block;
flex: 0 0 auto;
width: 0.98rem;
height: 0.98rem;
color: rgba(255,232,85,0.96);
filter: drop-shadow(0 0 8px rgba(255,232,85,0.25));
}
.aka-vault-state-label {
min-height: 0.85rem;
margin-bottom: 0.45rem !important;
color: rgba(74,222,128,0.0) !important;
}
.aka-vault-title {
margin-bottom: 1rem !important;
color: rgba(255,255,255,0.96) !important;
text-shadow: 0 0 18px rgba(255,255,255,0.08);
}
.aka-vault-chapter {
margin-bottom: 1.65rem !important;
font-size: 0.82rem !important;
letter-spacing: 0.08em;
color: rgba(255,255,255,0.78) !important;
text-transform: uppercase;
}
.aka-vault-counter {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.62rem;
padding: 0.72rem 1.05rem;
border: 1px solid rgba(212,168,67,0.34);
border-radius: 4px;
background: rgba(212,168,67,0.075);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.04),
0 0 18px rgba(212,168,67,0.08);
font-family: 'Special Elite', monospace;
font-size: 0.92rem;
letter-spacing: 0.08em;
color: rgba(255,255,255,0.94);
}
.aka-vault-counter svg {
color: rgba(110,255,201,0.92);
filter: drop-shadow(0 0 8px rgba(74,222,128,0.28));
}
.aka-vault-content {
position: relative;
z-index: 1;
padding: 1.5rem;
}
.aka-vault-summary {
display: none !important;
align-items: center;
justify-content: space-between;
gap: 1rem;
margin-bottom: 1.5rem;
}
.aka-vault-chip {
border: 1px solid rgba(74,168,255,0.22);
background: rgba(74,168,255,0.08);
color: rgba(150,220,255,0.88);
box-shadow: 0 0 14px rgba(74,168,255,0.13);
padding: 0.72rem 0.92rem;
border-radius: 4px;
font-family: 'Special Elite', monospace;
font-size: 0.68rem;
letter-spacing: 0.22em;
}
.aka-archive-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 1rem;
}
.aka-archive-file-card {
min-height: 7.55rem;
aspect-ratio: auto !important;
border-color: rgba(212,168,67,0.18) !important;
background:
linear-gradient(180deg, rgba(255,255,255,0.018), rgba(0,0,0,0.18)),
#050505 !important;
box-shadow: 0 14px 34px rgba(0,0,0,0.34);
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 1rem 0.86rem 0.95rem;
border-radius: 4px !important;
overflow: hidden;
}
.aka-archive-file-card.is-recovered {
border-color: rgba(74,222,128,0.36) !important;
background:
radial-gradient(circle at 50% 0%, rgba(74,222,128,0.14), transparent 58%),
rgba(5,15,10,0.70) !important;
box-shadow:
0 0 18px rgba(74,222,128,0.18),
inset 0 0 24px rgba(74,222,128,0.055),
0 18px 42px rgba(0,0,0,0.46);
}
.aka-archive-file-card.is-sealed {
border-color: rgba(212,168,67,0.14) !important;
}
.aka-archive-recover-btn {
width: auto !important;
min-height: 1.92rem;
padding: 0.38rem 0.74rem;
border: 1px solid rgba(255,45,85,0.30);
background: rgba(255,45,85,0.06);
color: rgba(255,91,124,0.94);
font-family: 'Special Elite', monospace;
font-size: 0.68rem !important;
letter-spacing: 0.18em !important;
transition: border-color 0.22s ease, color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease;
}
.aka-archive-recover-btn:hover {
border-color: rgba(255,45,85,0.50);
background: rgba(255,45,85,0.12);
box-shadow: 0 0 14px rgba(255,45,85,0.16);
}
.aka-archive-recover-btn.is-done,
.aka-archive-file-card.is-recovered .aka-archive-recover-btn {
border-color: rgba(74,222,128,0.0);
background: transparent;
color: rgba(110,255,201,0.86);
box-shadow: none;
cursor: default;
}
.aka-archive-file-card img,
.aka-archive-file-card .pointer-events-none {
display: none !important;
}
.aka-archive-file-card > .absolute.inset-x-0.bottom-0 {
position: static !important;
inset: auto !important;
width: auto !important;
padding: 0 !important;
background: transparent !important;
}
.aka-archive-file-inner {
display: grid;
place-items: center;
gap: 0.42rem;
width: 100%;
text-align: center;
}
.aka-archive-file-icon {
width: 2rem;
height: 2rem;
color: rgba(255,255,255,0.86);
filter: drop-shadow(0 0 8px rgba(255,255,255,0.08));
}
.aka-archive-file-card.is-recovered .aka-archive-file-icon {
color: rgba(110,255,201,0.96);
filter: drop-shadow(0 0 10px rgba(74,222,128,0.40));
}
.aka-archive-file-card.is-classified .aka-archive-file-icon {
color: rgba(125,220,255,0.94);
}
.aka-archive-file-state {
margin: 0 !important;
font-family: 'Special Elite', monospace;
font-size: 0.76rem;
letter-spacing: 0.08em;
color: rgba(255,255,255,0.88);
}
.aka-archive-file-card.is-recovered .aka-archive-file-state {
color: rgba(110,255,201,0.94);
}
.aka-archive-file-name {
margin: 0 !important;
font-family: 'Special Elite', monospace;
font-size: 0.62rem;
letter-spacing: 0.03em;
color: rgba(255,255,255,0.70);
}
.aka-archive-file-actions {
margin-top: 0.74rem;
text-align: center;
}
.aka-archive-download-btn {
position: absolute;
top: 0.52rem;
right: 0.52rem;
z-index: 6;
width: 1.74rem;
height: 1.74rem;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid rgba(212,168,67,0.48);
border-radius: 999px;
background: rgba(0,0,0,0.68);
color: rgba(255,235,178,0.97);
font-family: 'Special Elite', monospace;
font-size: 0.82rem;
line-height: 1;
box-shadow:
0 0 9px rgba(212,168,67,0.18),
0 0 18px rgba(212,168,67,0.075),
inset 0 0 7px rgba(212,168,67,0.025);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
cursor: pointer;
transition:
transform 180ms ease,
border-color 180ms ease,
box-shadow 180ms ease,
background-color 180ms ease;
-webkit-tap-highlight-color: transparent;
}
.aka-archive-download-btn svg {
width: 0.93rem;
height: 0.93rem;
}
@media (hover: hover) and (pointer: fine) {
.aka-archive-download-btn:hover,
.aka-archive-download-btn:focus-visible {
transform: translateY(-1px) scale(1.025);
border-color: rgba(255,226,151,0.68);
background: rgba(8,6,3,0.76);
box-shadow:
0 0 12px rgba(212,168,67,0.29),
0 0 23px rgba(212,168,67,0.12),
inset 0 0 8px rgba(212,168,67,0.04);
outline: none;
}
}
.aka-archive-download-btn:active {
transform: translateY(0) scale(0.96);
border-color: rgba(255,226,151,0.72);
box-shadow: 0 0 9px rgba(212,168,67,0.18);
}
@media (max-width: 640px) {
.aka-archive-download-btn {
top: 0.48rem;
right: 0.48rem;
width: 1.80rem;
height: 1.80rem;
}
.aka-archive-download-btn svg {
width: 0.96rem;
height: 0.96rem;
}
}
@keyframes akaVaultDotPulse {
0%, 100% { opacity: 0.62; transform: scale(0.92); }
50% { opacity: 1; transform: scale(1); }
}
@keyframes akaVaultScanline {
0%, 100% { transform: translateY(0); opacity: 0; }
12% { opacity: 0.16; }
58% { opacity: 0.10; }
85% { transform: translateY(520%); opacity: 0; }
}
@media (max-width: 900px) {
.aka-archive-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 640px) {
.aka-vault-topbar,
.aka-vault-summary {
align-items: flex-start;
flex-direction: column;
}
.aka-vault-topbar-right {
letter-spacing: 0.14em;
}
.aka-vault-header {
padding: 2rem 1rem 1.35rem !important;
}
.aka-vault-content {
padding: 1rem;
}
.aka-archive-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.72rem;
}
.aka-archive-file-card {
min-height: 6.9rem;
padding: 0.85rem 0.42rem 0.76rem;
}
.aka-archive-file-icon {
width: 1.65rem;
height: 1.65rem;
}
.aka-archive-file-state {
font-size: 0.62rem;
}
.aka-archive-file-name {
font-size: 0.52rem;
word-break: break-word;
}
}
@media (max-width: 360px) {
.aka-archive-grid {
grid-template-columns: 1fr;
}
}
/* ===== MOBILE POSTER / ARCHIVE PROPORTIONS ===== */
@media (max-width: 640px) {
#gallery .poster-card {
max-width: min(88vw, 315px);
}
#gallery .poster-card > img {
height: auto !important;
aspect-ratio: 2 / 3;
object-fit: cover;
}
.modal-box.archive-modal-wide {
width: min(92vw, 680px);
}
#modalContent [data-file-card] {
max-width: 92%;
margin-left: auto;
margin-right: auto;
}
#modalContent .aka-vault-terminal [data-file-card] {
max-width: none;
margin-left: 0;
margin-right: 0;
}
}
/* ===== DESKTOP POSTER IDLE CINEMATIC GLOW ===== */
@media (min-width: 1024px) {
.poster-card:not(.unlocked) {
box-shadow:
0 0 14px rgba(255,45,85,0.14),
0 0 34px rgba(255,45,85,0.07),
0 18px 50px rgba(0,0,0,0.74);
}
.poster-card.unlocked {
box-shadow:
0 0 14px rgba(74,222,128,0.15),
0 0 34px rgba(34,197,94,0.08),
0 18px 50px rgba(0,0,0,0.76);
}
.poster-card:not(.unlocked):hover {
box-shadow:
0 0 24px rgba(255,45,85,0.28),
0 0 58px rgba(255,45,85,0.16),
0 24px 70px rgba(0,0,0,0.88);
}
.poster-card.unlocked:hover {
box-shadow:
0 0 24px rgba(74,222,128,0.26),
0 0 58px rgba(34,197,94,0.16),
0 24px 70px rgba(0,0,0,0.88);
}
}
/* ===== FAN CLUB LIVE CINEMA TERMINAL ===== */
#community .aka-social-card {
position: relative;
overflow: hidden;
isolation: isolate;
border-radius: 6px;
transition:
transform 0.44s cubic-bezier(0.22, 1, 0.36, 1),
filter 0.42s ease,
border-color 0.44s ease,
box-shadow 0.46s ease,
background 0.44s ease;
}
#community .aka-social-card::after {
content: '';
position: absolute;
inset: 0 auto 0 -45%;
width: 38%;
pointer-events: none;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.08), transparent);
transform: skewX(-18deg);
opacity: 0;
transition: left 0.7s ease, opacity 0.3s ease;
}
@media (hover: hover) and (pointer: fine) {
#community .aka-social-card:hover {
transform: translateY(-0.8px) scale(1.003);
filter: brightness(1.025);
}
#community .aka-social-card:hover::after {
left: 120%;
opacity: 1;
}
#community .aka-social-x:hover {
border-color: rgba(29,161,242,0.42) !important;
box-shadow: 0 0 26px rgba(29,161,242,0.12), 0 18px 42px rgba(0,0,0,0.32);
}
#community .aka-social-telegram:hover {
border-color: rgba(0,136,204,0.44) !important;
box-shadow: 0 0 26px rgba(0,136,204,0.13), 0 18px 42px rgba(0,0,0,0.32);
}
#community .aka-social-chart:hover {
border-color: rgba(74,222,128,0.42) !important;
box-shadow: 0 0 26px rgba(74,222,128,0.12), 0 18px 42px rgba(0,0,0,0.32);
}
}
.aka-live-terminal {
position: relative;
max-width: 68rem;
margin: 0 auto 3.25rem;
border: 1px solid rgba(212,168,67,0.18);
border-radius: 6px;
background:
linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.008)),
rgba(5,5,5,0.72);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.055),
0 22px 54px rgba(0,0,0,0.38),
0 0 34px rgba(212,168,67,0.055);
overflow: hidden;
}
.aka-live-terminal::before {
content: '';
position: absolute;
inset: 0;
pointer-events: none;
opacity: 0.11;
background:
repeating-linear-gradient(0deg, transparent, transparent 3px, rgba(212,168,67,0.11) 4px),
radial-gradient(circle at 10% 0%, rgba(255,45,85,0.14), transparent 35%),
radial-gradient(circle at 90% 0%, rgba(74,168,255,0.10), transparent 34%);
}
.aka-terminal-header {
position: relative;
z-index: 1;
display: flex;
align-items: center;
justify-content: space-between;
gap: 1rem;
padding: 0.92rem 1rem;
border-bottom: 1px solid rgba(212,168,67,0.16);
}
.aka-terminal-title,
.aka-terminal-subtitle {
font-family: 'Special Elite', monospace;
font-size: 0.64rem;
letter-spacing: 0.24em;
color: rgba(232,213,183,0.70);
}
.aka-terminal-title {
display: inline-flex;
align-items: center;
gap: 0.55rem;
}
.aka-terminal-live-dot {
width: 0.52rem;
height: 0.52rem;
border-radius: 999px;
background: #FF2D55;
box-shadow: 0 0 14px rgba(255,45,85,0.60);
animation: akaTerminalLivePulse 2.8s ease-in-out infinite;
}
.aka-terminal-grid {
position: relative;
z-index: 1;
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
}
.aka-terminal-cell {
min-height: 5.3rem;
display: grid;
grid-template-columns: max-content minmax(0, 1fr);
grid-template-rows: auto auto;
align-content: center;
align-items: center;
column-gap: 0.75rem;
row-gap: 0.32rem;
padding: 1rem;
border-right: 1px solid rgba(212,168,67,0.12);
background: rgba(0,0,0,0.10);
}
/* The label occupies row 1; the icon and value share row 2. */
.aka-terminal-cell > div { display: contents; }
.aka-terminal-cell > :is(svg, i),
.aka-terminal-cell-signal::before {
grid-column: 1;
grid-row: 2;
align-self: center;
}
.aka-terminal-cell .aka-terminal-label { grid-column: 2; grid-row: 1; }
.aka-terminal-cell .aka-terminal-value { grid-column: 2; grid-row: 2; }
.aka-terminal-cell:last-child {
border-right: 0;
}
.aka-terminal-cell i {
color: rgba(212,168,67,0.72);
filter: drop-shadow(0 0 8px rgba(212,168,67,0.16));
flex: 0 0 auto;
}
.aka-terminal-label {
font-family: 'Special Elite', monospace;
font-size: 0.56rem;
letter-spacing: 0.18em;
color: rgba(232,213,183,0.42);
line-height: 1.25;
}
.aka-terminal-value {
margin-top: 0;
font-family: 'Bebas Neue', sans-serif;
font-size: 1.18rem;
letter-spacing: 0.06em;
line-height: 1;
color: rgba(232,213,183,0.86);
}
.aka-terminal-cell-holders .aka-terminal-value { color: rgba(255,220,132,0.94); }
.aka-terminal-cell-recovered .aka-terminal-value { color: rgba(74,222,128,0.90); }
.aka-terminal-cell-act .aka-terminal-value { color: rgba(255,105,128,0.94); }
.aka-terminal-cell-signal .aka-terminal-value { color: rgba(99,210,255,0.94); }
.aka-terminal-cell-community .aka-terminal-value { color: rgba(232,213,183,0.90); }
@keyframes akaTerminalLivePulse {
0%, 100% { opacity: 0.58; transform: scale(0.90); }
50% { opacity: 1; transform: scale(1); }
}
/* ===== CINEMATIC BUY CTA ===== */
.aka-cinematic-cta {
position: relative;
isolation: isolate;
overflow: hidden;
transform: translateZ(0);
transform-origin: center;
transition:
transform 0.56s cubic-bezier(0.22, 1, 0.36, 1),
box-shadow 0.58s ease,
border-color 0.56s ease,
filter 0.52s ease !important;
}
.aka-cinematic-cta::after {
content: '';
position: absolute;
inset: 0 auto 0 -44%;
width: 34%;
pointer-events: none;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.18), transparent);
opacity: 0;
transform: skewX(-18deg);
transition: left 0.72s ease, opacity 0.28s ease;
z-index: 0;
}
.aka-cinematic-cta > * {
position: relative;
z-index: 1;
}
.aka-buy-hover:hover {
transform: translateY(-1.55px) scale(1.006);
box-shadow:
0 0 18px rgba(255,45,85,0.30),
0 0 34px rgba(212,168,67,0.13),
0 13px 34px rgba(0,0,0,0.42) !important;
filter: brightness(1.045) saturate(1.02);
}
.aka-buy-hover:hover::after {
left: 118%;
opacity: 1;
}
@media (max-width: 1020px) {
.aka-terminal-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.aka-terminal-cell {
border-right: 1px solid rgba(212,168,67,0.10);
border-bottom: 1px solid rgba(212,168,67,0.10);
}
}
@media (max-width: 767px) {
.aka-terminal-header {
align-items: flex-start;
flex-direction: column;
}
.aka-terminal-grid {
grid-template-columns: 1fr;
}
.aka-terminal-cell {
min-height: 4.65rem;
border-right: 0;
}
.aka-terminal-title,
.aka-terminal-subtitle {
letter-spacing: 0.16em;
}
}
/* ===== NAVIGATION EDGE SPACING ===== */
@media (min-width: 1024px) {
#navbar > div.max-w-7xl {
max-width: 100% !important;
padding-left: 4% !important;
padding-right: 2% !important;
}
#navbar a[href="#hero"] {
transform: scale(1.12) !important;
transform-origin: left center !important;
}
#navbar .hidden.md\:flex {
gap: 2.25rem !important;
transform: none !important;
}
}
/* ===== PREMIUM TOPBAR ARCHIVE CONTROLS ===== */
#navbar .hidden.md\:flex {
gap: clamp(0.7rem, 1.35vw, 1.45rem) !important;
}
#navbar .hidden.md\:flex > a {
white-space: nowrap;
}
.aka-brand-zone {
display: flex;
align-items: center;
gap: 1.18rem;
min-width: 0;
}
.aka-brand-orb {
position: relative;
isolation: isolate;
transform: translateY(-0.02rem);
color: #D4A843;
background:
radial-gradient(circle at 35% 30%, rgba(255,255,255,0.12), transparent 34%),
linear-gradient(135deg, #8B0000, #4A0000) !important;
border-color: rgba(212,168,67,0.78) !important;
box-shadow:
0 0 10px rgba(212,168,67,0.13),
0 0 22px rgba(139,0,0,0.16),
inset 0 0 10px rgba(0,0,0,0.34);
transition:
transform 0.18s cubic-bezier(0.22, 1, 0.36, 1),
box-shadow 0.18s ease,
border-color 0.18s ease,
background 0.18s ease;
}
.aka-brand-orb span {
position: relative;
z-index: 1;
color: #D4A843 !important;
line-height: 1;
transform: translateY(0.02rem);
text-shadow:
0 0 5px rgba(212,168,67,0.26),
0 0 12px rgba(139,0,0,0.18);
}
.aka-brand-orb:hover {
transform: translateY(-0.02rem);
border-color: rgba(212,168,67,0.86) !important;
box-shadow:
0 0 12px rgba(212,168,67,0.16),
0 0 26px rgba(139,0,0,0.18),
inset 0 0 10px rgba(0,0,0,0.34);
}
.aka-brand-orb:active,
#navbar a[href="#hero"]:active .aka-brand-orb {
transform: translateY(1px) scale(0.965);
box-shadow:
inset 0 2px 8px rgba(0,0,0,0.45),
0 0 10px rgba(212,168,67,0.14);
}
/* HERO MAX: a secondary brand accent, not another flashing focal point.
The small static halo fades by opacity; no loop, blur filter, or new JS timer. */
#navbar .aka-brand-orb::before {
content: "";
position: absolute;
inset: -2px;
z-index: 0;
pointer-events: none;
border: 1px solid rgba(255,218,125,.88);
border-radius: inherit;
background: radial-gradient(circle at 35% 30%, rgba(255,101,74,.22), rgba(189,13,36,.25) 58%, rgba(132,6,27,.12));
box-shadow:
0 0 5px rgba(255,211,111,.48),
0 0 15px rgba(219,22,45,.38),
0 0 28px rgba(176,9,33,.20),
inset 0 0 10px rgba(224,24,41,.24);
opacity: 0;
transition: opacity 650ms ease;
}
#navbar .aka-brand-orb span,
#navbar .aka-top-brand-name {
transition: color 650ms ease, text-shadow 650ms ease;
}
body.is-hero-final-signal #navbar .aka-brand-orb::before {
opacity: 1;
}
body.is-hero-final-signal #navbar .aka-brand-orb span {
color: #f8dc91 !important;
text-shadow: 0 0 6px rgba(255,209,102,.55), 0 0 13px rgba(213,34,39,.25);
}
body.is-hero-final-signal #navbar .aka-top-brand-name {
color: #f4dba5;
text-shadow: 0 0 7px rgba(237,198,108,.38), 0 0 17px rgba(197,25,38,.22);
}
body.is-hero-final-releasing #navbar .aka-brand-orb::before,
body.is-hero-final-releasing #navbar .aka-brand-orb span,
body.is-hero-final-releasing #navbar .aka-top-brand-name {
transition-duration: 1100ms;
}
@media (prefers-reduced-motion: reduce) {
#navbar .aka-brand-orb::before,
#navbar .aka-brand-orb span,
#navbar .aka-top-brand-name {
transition: none;
}
}
.aka-topbar-actions {
display: flex;
align-items: center;
gap: 0.9rem;
margin-left: 0.65rem;
}
#topbarClassified {
margin-right: -0.2rem;
}
#topbarReward {
margin-right: 0.25rem;
}
.aka-topbar-actions .aka-wallet-control {
margin-left: 0.42rem;
}
.aka-sound-toggle {
position:relative;
width:2.28rem;
height:2.28rem;
flex:0 0 2.28rem;
display:inline-flex;
align-items:center;
justify-content:center;
color:rgba(232,213,183,.78);
border:1px solid rgba(212,168,67,.24);
border-radius:5px;
background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.008)),rgba(7,7,7,.72);
box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 8px 22px rgba(0,0,0,.30);
transition:color 220ms ease,border-color 220ms ease,filter 220ms ease,transform 180ms ease;
}
.aka-sound-toggle:hover,
.aka-sound-toggle:focus-visible {
color:rgba(255,232,176,.98);
border-color:rgba(212,168,67,.48);
filter:drop-shadow(0 0 7px rgba(212,168,67,.22));
}
.aka-sound-toggle:active { transform:translateY(1px) scale(.97); }
.aka-sound-toggle.is-muted {
color:rgba(232,213,183,.42);
border-color:rgba(232,213,183,.14);
filter:none;
}
.aka-sound-icon {
width:1.08rem;
height:1.08rem;
stroke:currentColor;
stroke-width:1.55;
stroke-linecap:round;
stroke-linejoin:round;
}
.aka-sound-toggle .is-off,
.aka-sound-toggle.is-muted .is-on { display:none; }
.aka-sound-toggle.is-muted .is-off { display:block; }
.aka-sound-toggle.is-wallet-locked { color:rgba(232,213,183,.54); border-color:rgba(212,168,67,.18); }
.aka-sound-toggle.is-wallet-locked::after { content:""; position:absolute; right:4px; bottom:4px; width:7px; height:7px; border:1px solid rgba(245,211,142,.78); border-radius:2px; background:#1a120c; box-shadow:0 0 7px rgba(212,168,67,.22); }
.aka-sound-toggle.is-wallet-locked::before { content:""; position:absolute; right:5.8px; bottom:9.2px; width:3.6px; height:3.6px; border:1px solid rgba(245,211,142,.68); border-bottom:0; border-radius:4px 4px 0 0; z-index:1; }
.elm-sound-panel {
position:fixed;
z-index:10010;
width:min(306px,calc(100vw - 24px));
padding:16px;
color:#e8d5b7;
border:1px solid rgba(212,168,67,.3);
border-radius:10px;
background:linear-gradient(145deg,rgba(63,31,22,.45),transparent 60%),#110e0c;
box-shadow:0 18px 48px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,231,194,.06);
font-family:Arial,sans-serif;
text-align:start;
}
.elm-sound-panel[hidden] { display:none; }
.elm-sound-panel, #walletDropdown, #mobileMenu { transform-origin:top right; }
.elm-sound-panel button { cursor:pointer; }
.elm-sound-panel button:focus-visible,.elm-sound-range:focus-visible { outline:2px solid #d4a843; outline-offset:3px; }
.elm-sound-panel-head,.elm-sound-power-row,.elm-sound-power,.elm-sound-prev,.elm-sound-next {
display:flex; align-items:center; justify-content:space-between;
}
.elm-sound-panel-head { padding-bottom:10px; border-bottom:1px solid rgba(212,168,67,.16); }
.elm-sound-panel-head > span { font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.elm-sound-close { display:grid; place-items:center; width:32px; height:32px; margin:-7px -6px -7px 0; background:transparent; border:0; color:#ba9e78; }
.elm-sound-close svg,.elm-sound-prev svg,.elm-sound-next svg { width:18px; height:18px; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.elm-sound-power-row { gap:12px; margin-top:8px; font-size:13px; }
.elm-sound-power { gap:10px; min-height:44px; border:0; background:transparent; color:#dac39c; font-size:12px; }
.elm-sound-switch { width:30px; height:17px; padding:3px; border-radius:12px; background:#36302a; transition:background 160ms ease; }
.elm-sound-switch::after { content:""; display:block; width:11px; height:11px; border-radius:50%; background:#9c9081; transition:transform 160ms ease,background 160ms ease; }
.elm-sound-power[aria-checked="true"] .elm-sound-switch { background:#766039; }
.elm-sound-power[aria-checked="true"] .elm-sound-switch::after { transform:translateX(13px); background:#f1d59e; }
.elm-sound-panel[dir="rtl"] .elm-sound-power[aria-checked="true"] .elm-sound-switch::after { transform:translateX(-13px); }
.elm-sound-levels { display:grid; gap:14px; padding:13px 0 15px; border-top:1px solid rgba(212,168,67,.09); border-bottom:1px solid rgba(212,168,67,.12); }
.elm-sound-level { display:grid; gap:8px; }
.elm-sound-level-head { display:flex; align-items:center; justify-content:space-between; color:#cbb391; font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.elm-sound-mood-scale { display:grid; grid-template-columns:22fr 38fr 40fr; align-items:end; margin:1px 1px -3px; color:#8f7b62; font-size:8px; font-weight:700; letter-spacing:.11em; line-height:1; text-transform:uppercase; pointer-events:none; }
.elm-sound-mood-scale span:nth-child(1) { text-align:left; }
.elm-sound-mood-scale span:nth-child(2) { text-align:center; }
.elm-sound-mood-scale span:nth-child(3) { text-align:right; }
.elm-sound-mood-scale span { transition:color 160ms ease,text-shadow 160ms ease,opacity 160ms ease; }
.elm-sound-mood-scale span.is-active { color:#f0d39a; text-shadow:0 0 10px rgba(212,168,67,.22); opacity:1; }
.elm-sound-level output { min-width:38px; color:#f0d7a6; font-variant-numeric:tabular-nums; text-align:end; letter-spacing:.04em; }
.elm-sound-range { --elm-level:50%; width:100%; height:18px; margin:0; appearance:none; -webkit-appearance:none; direction:ltr; background:transparent; cursor:pointer; }
.elm-sound-range::-webkit-slider-runnable-track { height:4px; border:1px solid rgba(212,168,67,.18); border-radius:999px; background:linear-gradient(90deg,rgba(224,183,93,.92) 0 var(--elm-level),rgba(67,56,45,.82) var(--elm-level) 100%); box-shadow:inset 0 1px 2px rgba(0,0,0,.55),0 0 9px rgba(212,168,67,.08); }
.elm-sound-range::-webkit-slider-thumb { width:15px; height:15px; margin-top:-6px; appearance:none; -webkit-appearance:none; border:1px solid rgba(255,232,185,.88); border-radius:50%; background:radial-gradient(circle at 38% 32%,#fff1c7,#c49547 56%,#6d4d20 100%); box-shadow:0 0 0 3px rgba(17,14,12,.92),0 0 12px rgba(212,168,67,.32); }
.elm-sound-range::-moz-range-track { height:4px; border:1px solid rgba(212,168,67,.18); border-radius:999px; background:rgba(67,56,45,.82); box-shadow:inset 0 1px 2px rgba(0,0,0,.55); }
.elm-sound-range::-moz-range-progress { height:4px; border-radius:999px; background:rgba(224,183,93,.92); }
.elm-sound-range::-moz-range-thumb { width:15px; height:15px; border:1px solid rgba(255,232,185,.88); border-radius:50%; background:radial-gradient(circle at 38% 32%,#fff1c7,#c49547 56%,#6d4d20 100%); box-shadow:0 0 0 3px rgba(17,14,12,.92),0 0 12px rgba(212,168,67,.32); }
.elm-sound-range:disabled { opacity:.38; cursor:default; }
.elm-sound-track { display:grid; gap:7px; padding:15px 0 18px; }
.elm-sound-status { color:#bca88c; font-size:10px; text-transform:uppercase; letter-spacing:.12em; }
.elm-sound-track strong { font-size:18px; line-height:1.3; font-weight:600; overflow-wrap:anywhere; }
.elm-sound-kind { color:#ac9273; font-size:11px; }
.elm-sound-track-nav { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.elm-sound-prev,.elm-sound-next { gap:9px; width:100%; min-height:44px; padding:10px 11px; border:1px solid rgba(212,168,67,.28); border-radius:5px; background:linear-gradient(180deg,rgba(212,168,67,.13),rgba(212,168,67,.04)); color:#eddbb9; font-size:11px; font-weight:650; letter-spacing:.02em; }
.elm-sound-prev { justify-content:flex-start; }
.elm-sound-next { justify-content:flex-end; }
.elm-sound-prev:hover:not(:disabled),.elm-sound-next:hover:not(:disabled) { border-color:rgba(212,168,67,.65); background:rgba(212,168,67,.16); }
.elm-sound-prev:disabled,.elm-sound-next:disabled { opacity:.45; cursor:default; }
@media (prefers-reduced-motion:reduce) {
.elm-sound-switch,.elm-sound-switch::after { transition:none; }
}
.elm-wallet-access-panel {
position:fixed;
z-index:10025;
width:min(316px,calc(100vw - 24px));
padding:14px 16px 16px;
color:#e9d5b1;
border:1px solid rgba(212,168,67,.30);
border-radius:5px;
background:
radial-gradient(130% 85% at 100% 0,rgba(116,21,24,.18),transparent 45%),
radial-gradient(85% 70% at 0 100%,rgba(212,168,67,.055),transparent 58%),
linear-gradient(155deg,rgba(29,18,15,.985),rgba(8,7,7,.992) 58%,rgba(5,5,5,.996));
box-shadow:
0 24px 64px rgba(0,0,0,.68),
0 0 0 1px rgba(0,0,0,.72),
inset 0 1px 0 rgba(255,235,198,.055),
inset 0 0 34px rgba(129,39,26,.035);
font-family:'Special Elite',monospace;
text-align:start;
overflow:hidden;
isolation:isolate;
}
.elm-wallet-access-panel::before {
content:"";
position:absolute;
z-index:-1;
inset:4px;
border:1px solid rgba(236,201,132,.055);
border-radius:2px;
pointer-events:none;
}
.elm-wallet-access-panel::after {
content:"";
position:absolute;
top:0;
left:18px;
right:18px;
height:1px;
background:linear-gradient(90deg,transparent,rgba(212,168,67,.28) 20%,rgba(255,212,127,.72) 50%,rgba(117,22,26,.52) 76%,transparent);
box-shadow:0 0 10px rgba(212,168,67,.10);
pointer-events:none;
}
.elm-wallet-access-panel[hidden] { display:none; }
.elm-wallet-access-head {
display:flex;
align-items:center;
justify-content:space-between;
min-height:28px;
padding-bottom:9px;
border-bottom:1px solid rgba(212,168,67,.115);
}
.elm-wallet-access-head > span {
color:rgba(211,181,133,.76);
font-size:8px;
font-weight:400;
letter-spacing:.24em;
line-height:1;
text-transform:uppercase;
}
.elm-wallet-access-head button {
display:grid;
place-items:center;
width:29px;
height:29px;
margin:-5px -5px -5px 0;
border:0;
background:transparent;
color:rgba(192,160,113,.72);
cursor:pointer;
transition:color 150ms ease,filter 150ms ease;
}
.elm-wallet-access-head button:hover { color:#f0d29a;filter:drop-shadow(0 0 5px rgba(212,168,67,.22)); }
.elm-wallet-access-head svg,.elm-wallet-access-connect svg {
width:16px;
height:16px;
stroke:currentColor;
stroke-width:1.45;
stroke-linecap:round;
stroke-linejoin:round;
}
.elm-wallet-access-intro {
display:grid;
grid-template-columns:39px minmax(0,1fr);
align-items:center;
gap:12px;
padding:14px 0 11px;
}
.elm-wallet-access-monogram {
display:grid;
place-items:center;
width:36px;
height:36px;
border:1px solid rgba(221,174,74,.56);
border-radius:50%;
background:
radial-gradient(circle at 50% 22%,rgba(255,218,137,.13),transparent 38%),
linear-gradient(180deg,rgba(91,13,18,.72),rgba(47,7,10,.96));
box-shadow:
inset 0 0 0 3px rgba(5,5,5,.64),
inset 0 1px 0 rgba(255,228,167,.09),
0 0 16px rgba(150,18,25,.13);
color:#e8bd60;
}
.elm-wallet-access-monogram span {
font-family:'Bebas Neue',sans-serif;
font-size:15px;
line-height:1;
letter-spacing:.035em;
transform:translateX(.02em) scaleX(1.04);
text-shadow:0 1px 0 rgba(0,0,0,.86),0 0 7px rgba(212,168,67,.12);
}
.elm-wallet-access-titleblock { min-width:0; }
.elm-wallet-access-eyebrow {
display:block;
margin-bottom:3px;
color:rgba(166,139,99,.72);
font-size:7px;
letter-spacing:.19em;
line-height:1.1;
text-transform:uppercase;
}
.elm-wallet-access-panel h3 {
margin:0;
color:#f0d9ad;
font-family:'Bebas Neue',sans-serif;
font-size:26px;
font-weight:400;
line-height:.98;
letter-spacing:.075em;
text-transform:uppercase;
text-shadow:0 1px 0 rgba(0,0,0,.9),0 0 12px rgba(212,168,67,.06);
}
.elm-wallet-access-rule {
display:flex;
align-items:center;
height:8px;
margin:-2px 0 1px;
}
.elm-wallet-access-rule::before,.elm-wallet-access-rule::after {
content:"";
height:1px;
flex:1;
background:linear-gradient(90deg,transparent,rgba(212,168,67,.18));
}
.elm-wallet-access-rule::after { transform:scaleX(-1); }
.elm-wallet-access-rule span {
width:4px;
height:4px;
margin:0 7px;
border:1px solid rgba(219,177,91,.58);
transform:rotate(45deg);
box-shadow:0 0 7px rgba(212,168,67,.09);
}
.elm-wallet-access-panel p {
margin:8px 1px 10px;
color:rgba(199,177,145,.78);
font-size:10px;
line-height:1.55;
letter-spacing:.012em;
}
.elm-wallet-access-meta {
display:flex;
align-items:center;
gap:7px;
margin:0 1px 13px;
}
.elm-wallet-access-meta i {
width:5px;
height:5px;
border:1px solid rgba(216,171,80,.68);
transform:rotate(45deg);
background:rgba(212,168,67,.08);
box-shadow:0 0 7px rgba(212,168,67,.12);
flex:0 0 auto;
}
.elm-wallet-access-panel small {
display:block;
color:rgba(151,125,89,.70);
font-size:7px;
font-weight:400;
letter-spacing:.17em;
line-height:1.25;
text-transform:uppercase;
}
.elm-wallet-access-connect {
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
gap:14px;
width:100%;
min-height:46px;
padding:10px 12px 9px 14px;
border:1px solid rgba(214,170,81,.43);
border-radius:3px;
background:
linear-gradient(90deg,rgba(116,18,23,.16),transparent 34%),
linear-gradient(180deg,rgba(212,168,67,.105),rgba(212,168,67,.025));
color:#f1d9ad;
font-family:'Bebas Neue',sans-serif;
font-size:15px;
font-weight:400;
letter-spacing:.085em;
line-height:1;
text-transform:uppercase;
cursor:pointer;
box-shadow:inset 0 1px 0 rgba(255,229,179,.045),inset 0 -8px 18px rgba(0,0,0,.12);
transition:border-color 160ms ease,background 160ms ease,box-shadow 160ms ease,color 160ms ease,transform 120ms ease;
}
.elm-wallet-access-connect::before {
content:"";
position:absolute;
left:0;
top:8px;
bottom:8px;
width:1px;
background:linear-gradient(180deg,transparent,#d4a843,transparent);
opacity:.58;
}
.elm-wallet-access-connect svg { color:rgba(225,187,110,.78);transition:transform 160ms ease,color 160ms ease; }
.elm-wallet-access-connect:hover:not(:disabled),.elm-wallet-access-connect:focus-visible {
border-color:rgba(229,187,101,.74);
background:linear-gradient(90deg,rgba(129,20,26,.24),transparent 38%),linear-gradient(180deg,rgba(212,168,67,.145),rgba(212,168,67,.04));
color:#ffe3ad;
box-shadow:inset 0 1px 0 rgba(255,231,181,.07),0 0 17px rgba(212,168,67,.07),0 8px 22px rgba(0,0,0,.22);
}
.elm-wallet-access-connect:hover:not(:disabled) svg { color:#f0c675;transform:translateX(2px); }
.elm-wallet-access-connect:active:not(:disabled) { transform:translateY(1px); }
.elm-wallet-access-connect:disabled { opacity:.52;cursor:wait; }
.elm-wallet-access-panel button:focus-visible { outline:1px solid rgba(232,192,112,.86);outline-offset:3px; }
@media (max-width:420px) {
.elm-wallet-access-panel { width:min(300px,calc(100vw - 20px));padding:13px 14px 14px; }
.elm-wallet-access-intro { grid-template-columns:36px minmax(0,1fr);gap:10px;padding-top:13px; }
.elm-wallet-access-monogram { width:34px;height:34px; }
.elm-wallet-access-monogram span { font-size:14px; }
.elm-wallet-access-panel h3 { font-size:24px; }
}
@media (prefers-reduced-motion:reduce) {
.elm-wallet-access-head button,.elm-wallet-access-connect,.elm-wallet-access-connect svg { transition:none; }
}
.aka-mobile-nav-actions {
display:flex;
align-items:center;
gap:.18rem;
margin-left:auto;
}
@media (min-width:768px) {
.aka-mobile-nav-actions { display:none !important; }
}
@media (max-width:767px) {
.aka-sound-toggle.is-mobile {
width:2.38rem;
height:2.38rem;
flex-basis:2.38rem;
border-color:rgba(212,168,67,.18);
background:rgba(6,6,6,.48);
}
}
#navbar {
background: transparent;
border-bottom: 1px solid transparent;
backdrop-filter: none;
-webkit-backdrop-filter: none;
}
#navbar.navbar-scrolled {
background: rgba(10, 10, 10, 0.95);
border-bottom-color: rgba(212, 168, 67, 0.10);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
}
@media (max-width: 768px) {
#navbar.navbar-scrolled {
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
}
}
.aka-nav-cinema-segment {
position: relative;
min-height: 3.05rem;
display: flex;
align-items: center;
gap: clamp(0.78rem, 1.18vw, 1.35rem);
padding: 0 0.72rem 0 0.9rem;
border: 1px solid rgba(255,45,85,0.28);
border-radius: 5px;
background:
linear-gradient(90deg, rgba(139,0,0,0.18), rgba(255,45,85,0.055), rgba(139,0,0,0.12)),
rgba(8,8,8,0.52);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.055),
0 0 22px rgba(255,45,85,0.10),
0 10px 28px rgba(0,0,0,0.30);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
overflow: visible;
}
.aka-nav-cinema-segment::before,
.aka-nav-cinema-segment::after {
content: '';
position: absolute;
top: 50%;
width: 1px;
height: 58%;
transform: translateY(-50%);
background: linear-gradient(to bottom, transparent, rgba(255,45,85,0.78), transparent);
box-shadow: 0 0 12px rgba(255,45,85,0.26);
pointer-events: none;
}
.aka-nav-cinema-segment::before {
left: 0;
}
.aka-nav-cinema-segment::after {
right: 0;
}
.aka-nav-cinema-segment > a {
position: relative;
display: inline-flex;
align-self: stretch;
align-items: center;
min-height: 0;
transition:
color 560ms ease,
text-shadow 600ms ease;
}
.aka-nav-cinema-segment > a > .aka-nav-link-label {
display: inline-block;
transform: translateY(0) scale(1);
transform-origin: center;
transition: transform var(--aka-premium-press-motion-ms, 640ms) var(--aka-premium-press-ease, cubic-bezier(0.20, 0.90, 0.24, 1));
}
@media (hover: hover) and (pointer: fine) {
.aka-nav-cinema-segment > a:hover > .aka-nav-link-label,
.aka-nav-cinema-segment > a:focus-visible > .aka-nav-link-label {
transform: translateY(var(--aka-nav-label-hover-y, -0.2px)) scale(var(--aka-nav-label-hover-scale, 1.001));
}
}
.aka-nav-cinema-segment > a::after {
content: '';
position: absolute;
left: -8%;
right: -8%;
bottom: 0.28rem;
height: 1px;
background: linear-gradient(90deg, transparent 0%, rgba(255,232,176,0.98) 22%, rgba(212,168,67,1) 50%, rgba(255,45,85,0.88) 76%, transparent 100%);
opacity: 0;
transform: scaleX(0.35);
transform-origin: center;
box-shadow: none;
filter: none;
transition:
opacity 360ms ease,
transform 580ms cubic-bezier(0.20, 0.90, 0.24, 1);
pointer-events: none;
}
.aka-nav-cinema-segment > a:hover,
.aka-nav-cinema-segment > a:focus-visible,
.aka-nav-cinema-segment > a.is-nav-glow-held {
color: rgba(255,232,176,0.98) !important;
text-shadow:
0 0 6px rgba(212,168,67,0.24),
0 0 12px rgba(255,45,85,0.13);
}
.aka-nav-cinema-segment > a.is-nav-glow-held {
transition: none;
}
.aka-nav-cinema-segment > a:hover::after,
.aka-nav-cinema-segment > a:focus-visible::after,
.aka-nav-cinema-segment > a.is-nav-glow-held::after,
body.is-hero-nav-zone-active .aka-nav-cinema-segment > a::after {
opacity: 1;
transform: scaleX(1);
box-shadow:
0 0 5px rgba(212,168,67,0.65),
0 0 7px rgba(255,232,176,0.82),
0 0 11px rgba(255,45,85,0.28),
0 0 14px rgba(212,168,67,0.58),
0 0 24px rgba(255,45,85,0.30);
}
.aka-nav-cinema-segment > a.is-nav-glow-held::after {
transition: none;
}
.aka-language-control {
margin-left: 0.15rem;
}
.aka-language-menu {
min-width: 9.1rem;
padding: 0.42rem;
background:
linear-gradient(180deg, rgba(19,10,10,0.92), rgba(7,7,7,0.86)),
radial-gradient(circle at 100% 0%, rgba(212,168,67,0.12), transparent 48%),
radial-gradient(circle at 0% 100%, rgba(255,45,85,0.10), transparent 52%) !important;
border: 1px solid rgba(212,168,67,0.24) !important;
border-radius: 10px !important;
box-shadow:
0 18px 42px rgba(0,0,0,0.72),
0 0 22px rgba(212,168,67,0.10),
inset 0 1px 0 rgba(255,255,255,0.065),
inset 0 0 18px rgba(255,45,85,0.035) !important;
overflow: hidden;
backdrop-filter: blur(16px) saturate(1.08);
-webkit-backdrop-filter: blur(16px) saturate(1.08);
}
.aka-language-menu :is(a, button) {
display: block;
width: 100%;
margin: 0.14rem 0;
padding: 0.55rem 0.75rem !important;
appearance: none;
-webkit-appearance: none;
cursor: pointer;
border-top: 0;
border-bottom: 0;
background: rgba(8,8,8,0.62);
border-left: 1px solid rgba(255,45,85,0.30);
border-right: 1px solid rgba(255,45,85,0.10);
color: rgba(232,213,183,0.62) !important;
text-shadow: none;
transition:
color 0.38s ease,
background 0.38s ease,
border-color 0.38s ease,
text-shadow 0.40s ease,
transform 0.40s cubic-bezier(0.22, 1, 0.36, 1);
}
.aka-language-menu :is(a, button):hover {
color: rgba(255,226,150,0.98) !important;
background: rgba(212,168,67,0.075) !important;
border-left-color: rgba(212,168,67,0.55);
border-right-color: rgba(212,168,67,0.20);
text-shadow: 0 0 10px rgba(212,168,67,0.44);
transform: translateX(-0.8px);
}
.aka-icon-control {
width: 2rem;
height: 2rem;
border: 0;
border-radius: 0;
display: inline-flex;
align-items: center;
justify-content: center;
background: transparent;
box-shadow: none;
transition:
color 0.38s ease,
filter 0.38s ease,
transform 0.40s cubic-bezier(0.22, 1, 0.36, 1);
}
.aka-icon-control:hover {
transform: translateY(-0.6px);
filter: drop-shadow(0 0 7px rgba(212,168,67,0.36));
}
.aka-topbar-chip,
.aka-mobile-chip,
.aka-wallet-control {
border: 1px solid rgba(212,168,67,0.22);
border-radius: 5px;
background:
linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.012)),
rgba(8,8,8,0.70);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.06),
0 10px 28px rgba(0,0,0,0.34);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
}
.aka-topbar-chip,
.aka-mobile-chip {
height: 2.35rem;
border-radius: 5px;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.42rem;
color: rgba(232,213,183,0.78);
font-family: 'Special Elite', monospace;
font-size: 0.66rem;
letter-spacing: 0.08em;
line-height: 1;
white-space: nowrap;
}
.aka-topbar-chip {
min-width: 6.85rem;
padding: 0 0.72rem;
}
.aka-logo-holders {
min-width: 0;
height: auto;
padding: 0;
margin-left: 0.68rem;
border: 0;
background: transparent;
box-shadow: none;
backdrop-filter: none;
-webkit-backdrop-filter: none;
gap: 0.38rem;
color: rgba(232,213,183,0.72);
font-size: 0.70rem;
transform: translateY(-1px);
}
.aka-logo-holders i {
width: 1rem;
height: 1rem;
}
@media (min-width: 768px) {
#topbarHolders {
display: none !important;
}
}
.aka-mobile-chip {
min-width: 2.35rem;
padding: 0 0.52rem;
}
.aka-holders-chip {
color: rgba(232,213,183,0.86);
}
.aka-holders-chip i,
.aka-mobile-chip i {
color: rgba(212,168,67,0.86);
}
#topbarHoldersCount,
#mobileTopbarHoldersCount {
max-width: 4.4rem;
overflow: hidden;
text-overflow: ellipsis;
color: rgba(255,255,255,0.92);
}
.aka-chip-label {
color: rgba(232,213,183,0.42);
}
.aka-reward-chip {
min-width: 5.35rem;
color: rgba(232,213,183,0.62);
cursor: pointer;
}
.aka-reward-chip i {
color: rgba(212,168,67,0.62);
}
.aka-reward-chip.is-claimable {
border-color: rgba(212,168,67,0.55);
color: rgba(255,232,170,0.96);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.08),
0 0 24px rgba(212,168,67,0.34),
0 0 52px rgba(212,168,67,0.13),
0 10px 28px rgba(0,0,0,0.34);
animation: akaRewardPulse 2.9s ease-in-out infinite;
}
.aka-reward-chip.is-claimable i {
color: rgba(255,224,132,0.98);
filter: drop-shadow(0 0 10px rgba(212,168,67,0.78));
}
.aka-classified-chip {
min-width: 5.85rem;
color: rgba(128,214,255,0.64);
}
.aka-classified-chip i {
color: rgba(74,168,255,0.70);
}
.aka-classified-chip.is-active {
border-color: rgba(45,212,191,0.54);
color: rgba(190,255,244,0.96);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.08),
0 0 22px rgba(45,212,191,0.28),
0 0 48px rgba(74,168,255,0.12),
0 10px 28px rgba(0,0,0,0.34);
animation: akaClassifiedPulse 3.2s ease-in-out infinite;
}
.aka-classified-chip.is-active i {
color: rgba(125,255,231,0.98);
filter: drop-shadow(0 0 10px rgba(45,212,191,0.70));
}
.aka-wallet-control {
min-width: 10.2rem;
max-width: 12.2rem;
min-height: 2.8rem;
border-radius: 5px;
display: inline-flex;
align-items: center;
gap: 0.56rem;
padding: 0.4rem 0.68rem;
color: rgba(232,213,183,0.86);
cursor: pointer;
transition:
border-color 0.54s ease,
box-shadow 0.56s ease,
background 0.54s ease,
filter 0.52s ease,
transform 0.56s cubic-bezier(0.22, 1, 0.36, 1);
}
.aka-wallet-control:hover {
transform: translateY(-0.95px) scale(1.004);
border-color: rgba(212,168,67,0.44);
filter: brightness(1.045) saturate(1.02);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.075),
0 0 18px rgba(212,168,67,0.13),
0 0 30px rgba(255,45,85,0.08),
0 13px 30px rgba(0,0,0,0.40);
}
.aka-wallet-icon-wrap {
width: 1.72rem;
height: 1.72rem;
border-radius: 5px;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
background: rgba(255,45,85,0.10);
color: rgba(255,45,85,0.92);
box-shadow: inset 0 0 14px rgba(255,45,85,0.06);
}
.aka-wallet-copy {
min-width: 0;
display: grid;
gap: 0.08rem;
text-align: left;
line-height: 1;
}
.aka-wallet-copy span {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
#walletStatusTitle,
#mobileWalletStatusTitle {
font-family: 'Bebas Neue', sans-serif;
font-size: 0.94rem;
letter-spacing: 0.08em;
color: rgba(255,255,255,0.90);
}
#walletStatusText,
#mobileWalletStatusText {
font-family: 'Space Grotesk', sans-serif;
font-size: 0.68rem;
letter-spacing: 0.02em;
color: rgba(74,168,255,0.82);
}
#walletIdentityStatus,
#mobileWalletIdentityStatus {
font-family: 'Special Elite', monospace;
font-size: 0.56rem;
letter-spacing: 0.12em;
color: rgba(232,213,183,0.48);
font-weight: 400;
max-width: 9.4rem;
position: relative;
top: 1px;
}
.aka-wallet-control.aka-status-no-id .aka-wallet-icon-wrap,
.aka-wallet-control.aka-status-outsider .aka-wallet-icon-wrap {
background: rgba(255,45,85,0.10);
color: rgba(255,45,85,0.86);
box-shadow: 0 0 14px rgba(255,45,85,0.10);
}
.aka-wallet-control.aka-status-outsider .aka-wallet-icon-wrap {
box-shadow: 0 0 16px rgba(255,45,85,0.14);
}
.aka-wallet-control.aka-status-initiated .aka-wallet-icon-wrap {
background: linear-gradient(135deg, rgba(255,45,85,0.12), rgba(212,168,67,0.10));
color: rgba(255,208,116,0.96);
box-shadow: 0 0 18px rgba(255,45,85,0.12), 0 0 18px rgba(212,168,67,0.14);
}
.aka-wallet-control.aka-status-origin-witness .aka-wallet-icon-wrap {
background: rgba(212,168,67,0.12);
color: rgba(255,216,128,0.98);
box-shadow: 0 0 20px rgba(212,168,67,0.20);
}
.aka-wallet-control.aka-status-origin-survivor .aka-wallet-icon-wrap {
background: rgba(212,168,67,0.16);
color: rgba(255,226,151,1);
box-shadow: 0 0 24px rgba(212,168,67,0.28), 0 0 38px rgba(212,168,67,0.08);
}
.aka-wallet-control.aka-status-ascendant .aka-wallet-icon-wrap {
background: linear-gradient(135deg, rgba(212,168,67,0.13), rgba(74,168,255,0.12));
color: rgba(255,224,150,0.98);
box-shadow: 0 0 18px rgba(74,168,255,0.13), 0 0 18px rgba(212,168,67,0.12);
}
.aka-wallet-control.aka-status-rise-transcended .aka-wallet-icon-wrap {
background: linear-gradient(135deg, rgba(212,168,67,0.15), rgba(74,168,255,0.16));
color: rgba(233,244,255,0.98);
box-shadow: 0 0 22px rgba(74,168,255,0.20), 0 0 18px rgba(212,168,67,0.16);
}
.aka-wallet-control.aka-status-dominion-holder .aka-wallet-icon-wrap {
background: linear-gradient(135deg, rgba(255,45,85,0.13), rgba(74,168,255,0.10));
color: rgba(255,106,136,0.96);
box-shadow: 0 0 18px rgba(255,45,85,0.16), 0 0 16px rgba(74,168,255,0.09);
}
.aka-wallet-control.aka-status-night-witness .aka-wallet-icon-wrap {
background: linear-gradient(135deg, rgba(120,18,42,0.20), rgba(15,20,30,0.18));
color: rgba(255,95,129,0.92);
box-shadow: 0 0 20px rgba(255,45,85,0.15), inset 0 0 18px rgba(0,0,0,0.18);
}
.aka-wallet-control.aka-status-night-survivor .aka-wallet-icon-wrap {
background: linear-gradient(135deg, rgba(120,18,42,0.24), rgba(74,168,255,0.08));
color: rgba(255,116,148,0.98);
box-shadow: 0 0 24px rgba(255,45,85,0.20), 0 0 18px rgba(74,168,255,0.08), inset 0 0 18px rgba(0,0,0,0.16);
}
.aka-wallet-control.aka-status-archive-seeker .aka-wallet-icon-wrap {
background: linear-gradient(135deg, rgba(212,168,67,0.13), rgba(255,45,85,0.11));
color: rgba(255,219,135,0.98);
box-shadow: 0 0 16px rgba(212,168,67,0.13), 0 0 18px rgba(255,45,85,0.11);
}
.aka-wallet-control.aka-status-classified-recoverer .aka-wallet-icon-wrap {
background: linear-gradient(135deg, rgba(212,168,67,0.16), rgba(255,45,85,0.14), rgba(45,212,191,0.10));
color: rgba(255,232,167,1);
box-shadow: 0 0 20px rgba(212,168,67,0.18), 0 0 20px rgba(255,45,85,0.13), 0 0 16px rgba(45,212,191,0.10);
}
.aka-wallet-control.aka-status-final-witness .aka-wallet-icon-wrap {
background: linear-gradient(135deg, rgba(212,168,67,0.15), rgba(74,168,255,0.16));
color: rgba(255,236,178,0.98);
box-shadow: 0 0 22px rgba(212,168,67,0.18), 0 0 24px rgba(74,168,255,0.16);
}
.aka-wallet-control.aka-status-legend {
border-color: rgba(212,168,67,0.60);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.08),
0 0 22px rgba(212,168,67,0.18),
0 0 18px rgba(74,168,255,0.08),
0 10px 28px rgba(0,0,0,0.34);
}
.aka-wallet-control.aka-status-legend .aka-wallet-icon-wrap {
background: linear-gradient(135deg, rgba(212,168,67,0.18), rgba(74,168,255,0.12));
color: rgba(255,236,174,1);
box-shadow: 0 0 22px rgba(212,168,67,0.22), 0 0 18px rgba(74,168,255,0.10);
}
.aka-wallet-control-mobile {
width: 100%;
max-width: none;
margin-top: 0.4rem;
}
.aka-mobile-identity-panel {
border: 1px solid var(--aka-identity-border, rgba(212,168,67,0.30));
background:
radial-gradient(circle at 100% 0%, var(--aka-identity-wash-a, rgba(212,168,67,0.115)), transparent 36%),
radial-gradient(circle at 0% 100%, var(--aka-identity-wash-b, rgba(139,0,0,0.11)), transparent 34%),
linear-gradient(180deg, rgba(13,11,9,0.985), rgba(5,5,5,0.985));
box-shadow:
0 0 0 1px rgba(0,0,0,0.78),
0 0 24px rgba(212,168,67,0.11),
0 18px 42px rgba(0,0,0,0.44),
inset 0 1px 0 rgba(255,255,255,0.065);
padding: 0.75rem;
border-radius: 8px;
width: 100%;
min-width: 0;
box-sizing: border-box;
}
.aka-wallet-control-menu {
width: 100% !important;
min-width: 100% !important;
max-width: 100% !important;
min-height: 4.8rem;
padding: 0.84rem 0.88rem;
justify-content: flex-start;
align-items: center;
gap: 0.68rem;
box-sizing: border-box;
overflow: visible;
}
.aka-wallet-control-menu .aka-wallet-icon-wrap {
width: 2.35rem;
height: 2.35rem;
flex: 0 0 auto;
}
.aka-wallet-control-menu .aka-wallet-copy {
width: 100%;
min-width: 0;
max-width: none;
gap: 0.12rem;
line-height: 1.08;
overflow: visible;
}
.aka-wallet-control-menu .aka-wallet-copy span {
max-width: 100%;
overflow: visible;
text-overflow: clip;
white-space: normal;
}
.aka-wallet-control-menu #mobileWalletStatusTitle {
font-size: 1.05rem;
line-height: 1.05;
}
.aka-wallet-control-menu #mobileWalletStatusText {
font-size: 0.82rem;
line-height: 1.08;
max-width: none;
}
.aka-wallet-control-menu #mobileWalletIdentityStatus {
font-size: 0.68rem;
line-height: 1.14;
max-width: none;
position: relative;
top: 0;
}
.aka-mobile-menu-metrics {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.55rem;
margin-top: 0.68rem;
overflow: visible;
}
.aka-mobile-menu-metrics .aka-mobile-chip {
width: 100%;
min-width: 0;
min-height: 2.7rem;
height: auto;
padding-top: 0.42rem;
padding-bottom: 0.42rem;
align-items: center;
justify-content: center;
line-height: 1.15;
overflow: visible;
}
.aka-mobile-menu-metrics .aka-mobile-chip i {
flex: 0 0 auto;
}
.aka-mobile-menu-metrics .aka-mobile-chip span {
display: inline-flex;
align-items: center;
min-width: 0;
line-height: 1.15;
overflow: visible;
text-overflow: clip;
}
.aka-mobile-menu-metrics .aka-reward-chip {
min-width: 0;
}
.aka-mobile-menu-metrics .aka-classified-chip {
min-width: 0;
}
@keyframes akaRewardPulse {
0%, 100% { filter: brightness(1); }
50% { filter: brightness(1.16); }
}
@keyframes akaClassifiedPulse {
0%, 100% { filter: brightness(1); }
50% { filter: brightness(1.14); }
}
.aka-wallet-control-mobile-top {
min-width: 5.8rem;
max-width: 6.35rem;
min-height: 2.24rem;
padding: 0.22rem 0.42rem;
gap: 0.36rem;
justify-content: flex-start;
}
.aka-wallet-control-mobile-top .aka-wallet-icon-wrap {
width: 1.48rem;
height: 1.48rem;
border-radius: 7px;
}
.aka-wallet-control-mobile-top .aka-wallet-copy {
display: grid;
gap: 0.04rem;
}
.aka-wallet-control-mobile-top #mobileWalletStatusTitle {
display: none;
}
.aka-wallet-control-mobile-top #mobileWalletStatusText {
font-size: 0.62rem;
max-width: 3.9rem;
}
.aka-wallet-control-mobile-top #mobileWalletIdentityStatus {
font-size: 0.43rem;
letter-spacing: 0.04em;
max-width: 3.9rem;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
@media (max-width: 1220px) {
#navbar .hidden.md\:flex {
gap: 0.72rem !important;
}
#navbar .hidden.md\:flex > a {
font-size: 0.78rem !important;
}
.aka-nav-cinema-segment {
gap: 0.72rem;
padding-left: 0.7rem;
padding-right: 0.58rem;
}
.aka-chip-label,
#topbarRewardText {
display: none;
}
.aka-topbar-chip {
min-width: 2.45rem;
}
.aka-holders-chip {
min-width: 5.2rem;
}
.aka-wallet-control {
min-width: 8.8rem;
max-width: 9.4rem;
}
}
@media (max-width: 900px) {
#navbar .hidden.md\:flex > a {
font-size: 0.68rem !important;
}
#navbar .hidden.md\:flex > .aka-topbar-actions .aka-wallet-control {
min-width: 3rem;
max-width: 3rem;
padding: 0.35rem;
}
#navbar .hidden.md\:flex > .aka-topbar-actions .aka-wallet-control .aka-wallet-copy {
display: none;
}
}
@media (max-width: 767px) {
#mobileMenu {
max-height: calc(100vh - 4rem);
max-height: calc(100svh - 4rem);
max-height: calc(100dvh - 4rem);
overflow-y: auto;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
scroll-padding-bottom: calc(2.75rem + env(safe-area-inset-bottom));
}
#mobileMenu > div {
padding-bottom: calc(2.75rem + env(safe-area-inset-bottom)) !important;
}
body.mobile-menu-open {
overflow: hidden;
}
.aka-logo-holders {
display: none !important;
}
.aka-mobile-chip {
min-width: 2.1rem;
min-height: 2.1rem;
height: auto;
font-size: 0.62rem;
line-height: 1.15;
overflow: visible;
}
#mobileTopbarHoldersCount {
max-width: 3.8rem;
}
.aka-wallet-control-mobile-top {
min-width: 5.8rem;
max-width: 6.35rem;
}
}
@media (max-width: 374px) {
.aka-mobile-chip {
min-width: 1.95rem;
min-height: 2.2rem;
height: auto;
padding: 0.34rem 0.38rem;
line-height: 1.14;
overflow: visible;
}
#mobileTopbarHoldersCount {
max-width: 2.9rem;
}
.aka-wallet-control-mobile-top {
min-width: 5.35rem;
max-width: 5.35rem;
}
.aka-wallet-control-mobile-top #mobileWalletStatusText,
.aka-wallet-control-mobile-top #mobileWalletIdentityStatus {
max-width: 3.25rem;
}
}
@media (min-width: 768px) {
#navbar #navbar #mobileTopbarHolders,
#navbar #mobileTopbarReward,
#navbar #mobileTopbarClassified {
display: none !important;
visibility: hidden !important;
width: 0 !important;
height: 0 !important;
min-width: 0 !important;
max-width: 0 !important;
padding: 0 !important;
margin: 0 !important;
overflow: hidden !important;
pointer-events: none !important;
}
}
/* ===== WALLET DROPDOWN PREMIUM AURA ===== */
@media (min-width: 769px) {
#navbar .hidden.md\:flex {
gap: 1.02rem !important;
}
.aka-topbar-actions {
gap: 0.28rem !important;
margin-left: 0.18rem !important;
}
.aka-wallet-desktop-shell {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
}
#navbar .aka-topbar-actions .aka-wallet-control {
--aka-wallet-aura: rgba(255,45,85,0.34);
--aka-wallet-aura-soft: rgba(139,0,0,0.22);
--aka-wallet-border: rgba(255,45,85,0.34);
min-width: 2.38rem !important;
max-width: 2.38rem !important;
width: 2.38rem !important;
min-height: 2.38rem !important;
height: 2.38rem !important;
padding: 0 !important;
border: 0 !important;
border-radius: 999px !important;
background: transparent !important;
box-shadow: none !important;
overflow: visible !important;
justify-content: center !important;
}
#navbar .aka-topbar-actions .aka-wallet-control .aka-wallet-copy {
display: none !important;
}
#navbar .aka-topbar-actions .aka-wallet-icon-wrap {
position: relative;
width: 2.08rem !important;
height: 2.08rem !important;
border-radius: 999px !important;
color: rgba(255,185,160,0.96) !important;
background:
radial-gradient(circle at 50% 40%, rgba(95,0,22,0.96), rgba(34,0,12,0.98) 58%, rgba(7,0,4,1) 100%) !important;
border:2px solid var(--aka-wallet-border) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.08),
inset 0 -12px 22px rgba(0,0,0,0.56),
0 0 0 1px rgba(0,0,0,0.48) !important;
isolation: isolate;
overflow: visible;
transition:
color 0.36s ease,
border-color 0.36s ease,
background 0.36s ease,
filter 0.36s ease;
}
#navbar .aka-topbar-actions .aka-wallet-icon-wrap::before {
content: '';
position: absolute;
inset: -13px;
border-radius: inherit;
background: radial-gradient(circle, var(--aka-wallet-aura) 0%, var(--aka-wallet-aura-soft) 35%, transparent 68%);
opacity: 0.34;
filter: blur(9px);
transform: translateZ(0);
z-index: -2;
pointer-events: none;
transition: opacity 0.38s ease, filter 0.38s ease;
}
#navbar .aka-topbar-actions .aka-wallet-icon-wrap::after {
content: '';
position: absolute;
inset: -4px;
border-radius: inherit;
border: 1px solid color-mix(in srgb, var(--aka-wallet-aura) 65%, transparent);
opacity: 0.26;
filter: blur(0.2px);
z-index: -1;
pointer-events: none;
}
#navbar .aka-topbar-actions .aka-wallet-icon-wrap svg {
position: relative;
z-index: 3;
filter: drop-shadow(0 0 5px rgba(255,45,85,0.18));
}
#navbar .aka-topbar-actions .aka-wallet-control:hover .aka-wallet-icon-wrap::before {
opacity: 0.58;
filter: blur(11px);
}
#navbar .aka-topbar-actions .aka-wallet-control.is-reward-pending .aka-wallet-icon-wrap::before {
opacity: 0.82;
animation: akaWalletAuraSignal 2.35s ease-in-out infinite;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-reward-pending.is-classified-active .aka-wallet-icon-wrap::before {
opacity: 0.96;
animation-duration: 1.9s;
}
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-no-id,
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-outsider {
--aka-wallet-aura: rgba(255,45,85,0.30);
--aka-wallet-aura-soft: rgba(139,0,0,0.18);
--aka-wallet-border: rgba(255,45,85,0.30);
}
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-initiated,
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-origin-witness,
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-origin-survivor {
--aka-wallet-aura: rgba(212,168,67,0.52);
--aka-wallet-aura-soft: rgba(255,45,85,0.22);
--aka-wallet-border: rgba(212,168,67,0.42);
}
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-ascendant,
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-rise-transcended {
--aka-wallet-aura: rgba(74,168,255,0.46);
--aka-wallet-aura-soft: rgba(212,168,67,0.24);
--aka-wallet-border: rgba(116,190,255,0.38);
}
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-dominion-holder {
--aka-wallet-aura: rgba(255,45,85,0.56);
--aka-wallet-aura-soft: rgba(74,168,255,0.20);
--aka-wallet-border: rgba(255,91,124,0.42);
}
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-night-witness,
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-night-survivor {
--aka-wallet-aura: rgba(165,28,65,0.58);
--aka-wallet-aura-soft: rgba(15,22,42,0.30);
--aka-wallet-border: rgba(255,73,112,0.36);
}
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-archive-seeker,
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-classified-recoverer {
--aka-wallet-aura: rgba(45,212,191,0.50);
--aka-wallet-aura-soft: rgba(212,168,67,0.18);
--aka-wallet-border: rgba(91,255,231,0.36);
}
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-final-witness,
#navbar .aka-topbar-actions .aka-wallet-control.aka-status-legend {
--aka-wallet-aura: rgba(255,219,136,0.72);
--aka-wallet-aura-soft: rgba(74,168,255,0.28);
--aka-wallet-border: rgba(255,226,151,0.56);
}
@keyframes akaWalletAuraSignal {
0%, 100% { opacity: 0.54; filter: blur(9px); }
45% { opacity: 1; filter: blur(13px); }
67% { opacity: 0.70; filter: blur(10px); }
}
.aka-wallet-dropdown {
position: absolute;
top: calc(100% + 0.72rem);
right: 0;
width: 17.2rem;
padding: 0.82rem 0.86rem 0.9rem;
border: 1px solid rgba(212,168,67,0.22);
background:
radial-gradient(circle at 9% -7%, rgba(66, 151, 112, 0.18), transparent 39%),
radial-gradient(circle at 101% 3%, rgba(184, 124, 55, 0.085), transparent 33%),
radial-gradient(circle at 84% 104%, rgba(255, 45, 85, 0.035), transparent 34%),
linear-gradient(145deg, rgba(8, 27, 22, 0.985), rgba(4, 15, 13, 0.992) 54%, rgba(2, 8, 8, 0.997));
box-shadow:
0 0 28px rgba(0,0,0,0.75),
0 18px 60px rgba(0,0,0,0.70),
inset 0 1px 0 rgba(255,255,255,0.055),
inset 0 0 42px rgba(35, 104, 78, 0.045);
backdrop-filter: blur(18px);
-webkit-backdrop-filter: blur(18px);
z-index: 10020;
transform-origin: top right;
animation: akaWalletDropdownIn 0.22s ease both;
}
@keyframes akaWalletDropdownIn {
from { opacity: 0; transform: translateY(-5px) scale(0.985); }
to { opacity: 1; transform: translateY(0) scale(1); }
}
.aka-wallet-dropdown-actions {
position: absolute;
top: 0.68rem;
right: 0.72rem;
display: flex;
align-items: center;
gap: 0.42rem;
}
.aka-wallet-mini-action {
width: 1.85rem;
height: 1.85rem;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid rgba(212,168,67,0.20);
background: rgba(8,8,8,0.72);
color: rgba(232,213,183,0.56);
transition: border-color 0.24s ease, color 0.24s ease, box-shadow 0.24s ease, transform 0.24s ease;
}
.aka-wallet-mini-action:hover {
transform: translateY(-1px);
}
.aka-wallet-mini-action.is-ready,
.aka-wallet-mini-action.is-claimable,
.aka-wallet-mini-action.is-active {
border-color: rgba(212,168,67,0.58);
color: rgba(255,226,151,0.98);
box-shadow: 0 0 16px rgba(212,168,67,0.34), inset 0 0 10px rgba(212,168,67,0.08);
}
.aka-wallet-classified-action.is-active {
border-color: rgba(45,212,191,0.54);
color: rgba(174,255,241,0.98);
box-shadow: 0 0 16px rgba(45,212,191,0.28), inset 0 0 10px rgba(45,212,191,0.06);
}
.aka-wallet-dropdown-kicker {
padding-right: 4.8rem;
font-family: 'Special Elite', monospace;
font-size: 0.58rem;
letter-spacing: 0.28em;
color: rgba(212,168,67,0.55);
margin-bottom: 0.38rem;
}
.aka-wallet-dropdown-address {
padding-right: 4.8rem;
font-family: 'Space Grotesk', sans-serif;
font-size: 0.78rem;
color: rgba(232,213,183,0.76);
margin-bottom: 0.75rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.aka-wallet-dropdown-holders {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.7rem;
margin: 0 0 0.58rem;
padding: 0.46rem 0.52rem;
border: 1px solid rgba(212,168,67,0.12);
background: rgba(212,168,67,0.035);
color: rgba(232,213,183,0.48);
font-family: 'Special Elite', monospace;
font-size: 0.56rem;
letter-spacing: 0.14em;
}
.aka-wallet-dropdown-holders-label {
display: inline-flex;
align-items: center;
gap: 0.38rem;
min-width: 0;
}
.aka-wallet-dropdown-holders-label svg {
color: rgba(212,168,67,0.72);
}
#walletDropdownHoldersCount {
font-weight: 400;
color: rgba(255,226,151,0.92);
text-shadow: 0 0 10px rgba(212,168,67,0.14);
}
.aka-wallet-dropdown-section {
padding: 0.64rem 0 0.68rem;
border-top: 1px solid rgba(212,168,67,0.12);
border-bottom: 1px solid rgba(212,168,67,0.10);
}
.aka-wallet-dropdown-label {
display: block;
font-family: 'Special Elite', monospace;
font-size: 0.54rem;
letter-spacing: 0.23em;
color: rgba(232,213,183,0.36);
margin-bottom: 0.24rem;
}
.aka-wallet-dropdown-title {
display: block;
font-family: 'Special Elite', monospace;
font-size: 0.76rem;
letter-spacing: 0.16em;
font-weight: 400;
color: rgba(255,238,196,0.94);
text-shadow: 0 0 1px rgba(255,255,255,0.30), 0 0 10px rgba(212,168,67,0.16);
}
.aka-wallet-dropdown-signals {
display: grid;
gap: 0.36rem;
padding: 0.72rem 0 0.74rem;
}
.aka-wallet-signal-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.8rem;
font-family: 'Special Elite', monospace;
font-size: 0.58rem;
letter-spacing: 0.12em;
color: rgba(232,213,183,0.38);
}
.aka-wallet-signal-row strong {
font-weight: 400;
color: rgba(232,213,183,0.66);
}
.aka-wallet-signal-row.is-live strong {
color: rgba(255,226,151,0.96);
}
.aka-wallet-signal-row.is-classified-live strong {
color: rgba(170,255,241,0.96);
}
.aka-wallet-disconnect-action {
width: 100%;
margin-top: 0.18rem;
padding: 0.62rem 0.8rem;
border: 1px solid rgba(255,45,85,0.24);
background: rgba(55,0,14,0.34);
color: rgba(255,119,145,0.82);
font-family: 'Special Elite', monospace;
font-size: 0.62rem;
letter-spacing: 0.20em;
transition: border-color 0.24s ease, color 0.24s ease, box-shadow 0.24s ease, background 0.24s ease;
}
.aka-wallet-disconnect-action:hover {
border-color: rgba(255,45,85,0.52);
color: rgba(255,190,202,0.96);
background: rgba(80,0,20,0.44);
box-shadow: 0 0 16px rgba(255,45,85,0.20);
}
}
#walletIcon,
#walletIconWrap,
#walletIconWrap svg {
pointer-events: none;
}
/* ===== AKA CLAIM / CLASSIFIED SIGNAL: STRONG ORB BREATH VERSION ===== */
@keyframes akaWalletStrongOrbBreath {
0%, 100% {
opacity: 0.62;
filter: blur(8px);
transform: scale(1);
}
50% {
opacity: 1;
filter: blur(16px);
transform: scale(1.32);
}
}
@keyframes akaWalletStrongRingBreath {
0%, 100% {
opacity: 0.34;
transform: scale(1);
box-shadow:
0 0 8px rgba(212,168,67,0.22),
0 0 16px rgba(212,168,67,0.10);
}
50% {
opacity: 0.9;
transform: scale(1.22);
box-shadow:
0 0 16px rgba(212,168,67,0.68),
0 0 34px rgba(212,168,67,0.30);
}
}
@keyframes akaWalletIconBreathGlow {
0%, 100% {
filter:
drop-shadow(0 0 5px rgba(212,168,67,0.34))
drop-shadow(0 0 10px rgba(212,168,67,0.14));
}
50% {
filter:
drop-shadow(0 0 10px rgba(255,226,151,0.92))
drop-shadow(0 0 24px rgba(212,168,67,0.46))
drop-shadow(0 0 38px rgba(255,45,85,0.18));
}
}
@keyframes akaMiniSignalBreathGold {
0%, 100% {
transform: scale(1);
filter: brightness(1);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.06),
0 0 10px rgba(212,168,67,0.18);
}
50% {
transform: scale(1.045);
filter: brightness(1.28);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.12),
0 0 16px rgba(212,168,67,0.62),
0 0 34px rgba(212,168,67,0.26),
0 0 46px rgba(255,45,85,0.12);
}
}
@keyframes akaMiniSignalBreathBlue {
0%, 100% {
transform: scale(1);
filter: brightness(1);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.06),
0 0 10px rgba(45,212,191,0.16);
}
50% {
transform: scale(1.045);
filter: brightness(1.26);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.12),
0 0 16px rgba(45,212,191,0.58),
0 0 34px rgba(74,168,255,0.24),
0 0 46px rgba(45,212,191,0.12);
}
}
@keyframes akaMiniIconBreathGold {
0%, 100% {
filter:
drop-shadow(0 0 4px rgba(212,168,67,0.35))
drop-shadow(0 0 8px rgba(212,168,67,0.16));
}
50% {
filter:
drop-shadow(0 0 8px rgba(255,226,151,0.95))
drop-shadow(0 0 18px rgba(212,168,67,0.46));
}
}
@keyframes akaMiniIconBreathBlue {
0%, 100% {
filter:
drop-shadow(0 0 4px rgba(45,212,191,0.32))
drop-shadow(0 0 8px rgba(74,168,255,0.14));
}
50% {
filter:
drop-shadow(0 0 8px rgba(159,255,236,0.92))
drop-shadow(0 0 18px rgba(74,168,255,0.44));
}
}
/* Main wallet reward signal: stronger gold orb */
.aka-wallet-control.is-reward-pending {
--aka-wallet-aura: rgba(255,214,118,0.98);
--aka-wallet-aura-soft: rgba(255,45,85,0.34);
--aka-wallet-border: rgba(255,226,151,0.82);
}
.aka-wallet-control.is-reward-pending .aka-wallet-icon-wrap::before {
opacity: 1 !important;
filter: blur(14px) !important;
animation: akaWalletStrongOrbBreath 1.85s ease-in-out infinite !important;
}
.aka-wallet-control.is-reward-pending .aka-wallet-icon-wrap::after {
opacity: 0.82 !important;
border-color: rgba(255,226,151,0.88) !important;
animation: akaWalletStrongRingBreath 1.85s ease-in-out infinite !important;
}
.aka-wallet-control.is-reward-pending .aka-wallet-icon-wrap svg {
color: rgba(255,236,184,1) !important;
animation: akaWalletIconBreathGlow 1.85s ease-in-out infinite !important;
}
.aka-wallet-control.is-classified-active .aka-wallet-icon-wrap svg {
color: #00D4FF !important;
filter:
drop-shadow(0 0 6px rgba(0,212,255,0.75))
drop-shadow(0 0 12px rgba(56,189,248,0.42)) !important;
animation: akaWalletClassifiedIconPulse 2.15s ease-in-out infinite !important;
}
/* Reward + classified together keeps the reward aura while the icon carries the classified signal. */
.aka-wallet-control.is-reward-pending.is-classified-active {
--aka-wallet-aura: rgba(255,226,151,1);
--aka-wallet-aura-soft: rgba(68,255,224,0.42);
--aka-wallet-border: rgba(255,236,184,0.92);
}
.aka-wallet-control.is-reward-pending.is-classified-active .aka-wallet-icon-wrap::before {
opacity: 1 !important;
filter: blur(17px) !important;
animation: akaWalletStrongOrbBreath 1.55s ease-in-out infinite !important;
}
.aka-wallet-control.is-reward-pending.is-classified-active .aka-wallet-icon-wrap::after {
opacity: 0.95 !important;
}
/* Remove old heartbeat / tick movement */
.aka-wallet-control.aka-wallet-signal-burst-reward .aka-wallet-icon-wrap,
.aka-wallet-control.aka-wallet-signal-burst-classified .aka-wallet-icon-wrap,
.aka-wallet-control.aka-wallet-signal-burst-double .aka-wallet-icon-wrap,
.aka-wallet-control.aka-wallet-signal-burst-status .aka-wallet-icon-wrap {
animation: none !important;
transform: none !important;
}
/* Burst only brightens the orb */
.aka-wallet-control.aka-wallet-signal-burst-reward .aka-wallet-icon-wrap::before,
.aka-wallet-control.aka-wallet-signal-burst-classified .aka-wallet-icon-wrap::before,
.aka-wallet-control.aka-wallet-signal-burst-double .aka-wallet-icon-wrap::before,
.aka-wallet-control.aka-wallet-signal-burst-status .aka-wallet-icon-wrap::before {
animation: akaWalletStrongOrbBreath 0.78s ease-in-out 3 !important;
opacity: 1 !important;
filter: blur(17px) !important;
}
/* Dropdown gift button: breathing gold light when claimable */
.aka-wallet-mini-action.aka-wallet-reward-action.is-claimable,
.aka-wallet-mini-action.aka-wallet-reward-action.is-ready {
color: rgba(255,236,184,1) !important;
border-color: rgba(255,226,151,0.72) !important;
background:
radial-gradient(circle at 50% 35%, rgba(255,226,151,0.18), transparent 58%),
linear-gradient(180deg, rgba(212,168,67,0.13), rgba(10,10,10,0.92)) !important;
animation: akaMiniSignalBreathGold 1.9s ease-in-out infinite !important;
}
.aka-wallet-mini-action.aka-wallet-reward-action.is-claimable svg,
.aka-wallet-mini-action.aka-wallet-reward-action.is-ready svg {
animation: akaMiniIconBreathGold 1.9s ease-in-out infinite !important;
}
/* Dropdown radar button: breathing blue/teal light when classified active */
.aka-wallet-mini-action.aka-wallet-classified-action.is-active,
.aka-wallet-mini-action.aka-wallet-classified-action.is-ready {
color: rgba(182,255,241,1) !important;
border-color: rgba(135,255,235,0.66) !important;
background:
radial-gradient(circle at 50% 35%, rgba(68,255,224,0.16), transparent 58%),
linear-gradient(180deg, rgba(74,168,255,0.12), rgba(10,10,10,0.92)) !important;
animation: akaMiniSignalBreathBlue 1.8s ease-in-out infinite !important;
}
.aka-wallet-mini-action.aka-wallet-classified-action.is-active svg,
.aka-wallet-mini-action.aka-wallet-classified-action.is-ready svg {
animation: akaMiniIconBreathBlue 1.8s ease-in-out infinite !important;
}
/* Hover inside dropdown: light breath gets a little stronger */
.aka-wallet-mini-action.aka-wallet-reward-action.is-claimable:hover,
.aka-wallet-mini-action.aka-wallet-reward-action.is-ready:hover {
transform: scale(1.08) !important;
box-shadow:
0 0 20px rgba(255,226,151,0.82),
0 0 42px rgba(212,168,67,0.34),
0 0 62px rgba(255,45,85,0.16) !important;
}
.aka-wallet-mini-action.aka-wallet-classified-action.is-active:hover,
.aka-wallet-mini-action.aka-wallet-classified-action.is-ready:hover {
transform: scale(1.08) !important;
box-shadow:
0 0 20px rgba(135,255,235,0.78),
0 0 42px rgba(74,168,255,0.32),
0 0 62px rgba(45,212,191,0.14) !important;
}
/* Mobile menu button: no dot, only glow */
#mobileMenuBtn {
position: relative;
}
#mobileMenuBtn.has-archive-signal {
color: rgba(255,236,184,1);
filter:
drop-shadow(0 0 8px rgba(255,226,151,0.78))
drop-shadow(0 0 22px rgba(212,168,67,0.34))
drop-shadow(0 0 34px rgba(255,45,85,0.16));
}
#mobileMenuBtn.has-archive-signal::after,
#mobileMenuBtn.has-classified-signal::after {
content: none !important;
display: none !important;
}
#mobileMenuBtn.aka-wallet-signal-burst-reward,
#mobileMenuBtn.aka-wallet-signal-burst-classified,
#mobileMenuBtn.aka-wallet-signal-burst-double,
#mobileMenuBtn.aka-wallet-signal-burst-status {
animation: none !important;
transform: none !important;
filter:
drop-shadow(0 0 11px rgba(255,226,151,0.88))
drop-shadow(0 0 28px rgba(212,168,67,0.40))
drop-shadow(0 0 44px rgba(255,45,85,0.18));
}
/* Small cinematic notice */
.aka-signal-notice {
position: fixed;
top: 5.25rem;
right: 1rem;
z-index: 10050;
display: flex;
align-items: center;
gap: 0.72rem;
max-width: min(21rem, calc(100vw - 2rem));
padding: 0.72rem 0.9rem;
border: 1px solid rgba(212,168,67,0.32);
background:
radial-gradient(circle at 100% 0%, rgba(255,45,85,0.12), transparent 34%),
linear-gradient(180deg, rgba(14,14,14,0.96), rgba(5,5,5,0.96));
box-shadow:
0 0 26px rgba(0,0,0,0.78),
0 0 26px rgba(212,168,67,0.14),
inset 0 1px 0 rgba(255,255,255,0.06);
opacity: 0;
pointer-events: none;
transform: translateY(-10px) scale(0.98);
transition:
opacity 0.28s ease,
transform 0.28s ease;
}
.aka-signal-notice.is-visible {
opacity: 1;
transform: translateY(0) scale(1);
}
.aka-signal-notice-icon {
width: 2rem;
height: 2rem;
border-radius: 999px;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
border: 1px solid rgba(212,168,67,0.34);
color: rgba(255,226,151,0.98);
box-shadow: 0 0 16px rgba(212,168,67,0.22);
}
.aka-signal-notice-kicker {
display: block;
font-family: 'Special Elite', monospace;
font-size: 0.56rem;
letter-spacing: 0.24em;
color: rgba(212,168,67,0.58);
margin-bottom: 0.18rem;
}
.aka-signal-notice strong {
display: block;
font-family: 'Bebas Neue', sans-serif;
font-size: 1.05rem;
letter-spacing: 0.08em;
color: rgba(255,246,220,0.96);
font-weight: 400;
line-height: 1;
}
.aka-signal-notice.is-classified .aka-signal-notice-icon {
border-color: rgba(45,212,191,0.40);
color: rgba(159,255,236,0.98);
box-shadow: 0 0 16px rgba(45,212,191,0.24);
}
.aka-signal-notice.is-double .aka-signal-notice-icon {
border-color: rgba(255,226,151,0.52);
color: rgba(255,246,220,1);
box-shadow:
0 0 16px rgba(212,168,67,0.28),
0 0 20px rgba(45,212,191,0.18);
}
@media (max-width: 768px) {
.aka-signal-notice {
top: 4.65rem;
right: 0.75rem;
left: 0.75rem;
max-width: none;
}
}
/* ===== WALLET CONNECT FEEDBACK: CLEAN RED CONNECTING STATE ===== */
@keyframes akaWalletConnectedBurstIcon {
0% {
transform: scale(1);
filter:
drop-shadow(0 0 4px rgba(74,222,128,0.30))
drop-shadow(0 0 8px rgba(74,222,128,0.12));
}
28% {
transform: scale(1.18);
filter:
drop-shadow(0 0 12px rgba(134,239,172,1))
drop-shadow(0 0 28px rgba(74,222,128,0.70))
drop-shadow(0 0 46px rgba(34,197,94,0.28));
}
100% {
transform: scale(1);
filter:
drop-shadow(0 0 5px rgba(74,222,128,0.38))
drop-shadow(0 0 12px rgba(74,222,128,0.18));
}
}
@keyframes akaWalletConnectingRedIconPulse {
0%, 100% {
color: rgba(255,82,102,0.96);
filter:
drop-shadow(0 0 5px rgba(255,0,61,0.52))
drop-shadow(0 0 12px rgba(139,0,0,0.24));
}
50% {
color: rgba(255,164,178,1);
filter:
drop-shadow(0 0 10px rgba(255,0,61,0.92))
drop-shadow(0 0 24px rgba(255,45,85,0.48))
drop-shadow(0 0 36px rgba(139,0,0,0.25));
}
}
@keyframes akaWalletConnectingRedRingPulse {
0%, 100% {
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.09),
inset 0 -12px 22px rgba(0,0,0,0.58),
0 0 10px rgba(150,0,20,0.30),
0 0 24px rgba(90,0,12,0.16),
0 0 0 1px rgba(0,0,0,0.52);
}
50% {
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.13),
inset 0 -12px 22px rgba(0,0,0,0.56),
0 0 17px rgba(255,0,61,0.62),
0 0 34px rgba(255,45,85,0.24),
0 0 0 1px rgba(0,0,0,0.52);
}
}
.aka-wallet-control.is-wallet-connected-burst .aka-wallet-icon-wrap svg {
color: rgba(134,239,172,1) !important;
animation: akaWalletConnectedBurstIcon 1.05s ease-out 1 !important;
}
@media (min-width: 769px) {
#navbar .aka-topbar-actions .aka-wallet-control.is-wallet-connecting {
border-color: rgba(255,45,85,0.42) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-wallet-connecting .aka-wallet-icon-wrap {
color: rgba(255,116,98,0.98) !important;
background:
radial-gradient(circle at 50% 38%, rgba(135,0,28,0.98), rgba(58,0,16,0.99) 58%, rgba(10,0,4,1) 100%) !important;
border-color: rgba(230,36,58,0.78) !important;
animation: akaWalletConnectingRedRingPulse 1.08s ease-in-out infinite !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-wallet-connecting .aka-wallet-icon-wrap::before {
opacity: 0.92 !important;
filter: blur(13px) !important;
background:
radial-gradient(circle, rgba(255,0,61,0.78) 0%, rgba(255,45,85,0.28) 42%, transparent 74%) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-wallet-connecting .aka-wallet-icon-wrap::after {
opacity: 0.86 !important;
border: 2px solid rgba(255,45,85,0.76) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-wallet-connecting .aka-wallet-icon-wrap svg {
animation: akaWalletConnectingRedIconPulse 1.08s ease-in-out infinite !important;
}
}
.aka-wallet-control-menu.is-wallet-connecting {
border-width: 2px !important;
border-color: rgba(255,45,85,0.70) !important;
background:
radial-gradient(circle at 15% 50%, rgba(255,45,85,0.18), transparent 36%),
linear-gradient(180deg, rgba(112,0,26,0.30), rgba(8,8,8,0.90)) !important;
box-shadow:
0 0 18px rgba(255,0,61,0.28),
0 0 32px rgba(255,45,85,0.12),
inset 0 1px 0 rgba(255,255,255,0.10) !important;
}
.aka-wallet-control-menu.is-wallet-connecting .aka-wallet-icon-wrap {
border-color: rgba(255,45,85,0.80) !important;
}
.aka-wallet-control-menu.is-wallet-connecting .aka-wallet-icon-wrap svg {
animation: akaWalletConnectingRedIconPulse 1.08s ease-in-out infinite !important;
}
/* ===== WALLET CONNECTED GREEN: MATCH PRE-LAUNCH ===== */
@keyframes akaWalletConnectedPrelaunchPulse {
0%, 100% {
color: #4ADE80;
filter:
drop-shadow(0 0 5px rgba(74,222,128,0.46))
drop-shadow(0 0 12px rgba(34,197,94,0.22));
}
50% {
color: #BBF7D0;
filter:
drop-shadow(0 0 10px rgba(74,222,128,0.90))
drop-shadow(0 0 22px rgba(34,197,94,0.48))
drop-shadow(0 0 34px rgba(22,163,74,0.24));
}
}
@media (min-width: 769px) {
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-icon-wrap {
border-color: rgba(74,222,128,0.92) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.10),
inset 0 -12px 22px rgba(0,0,0,0.54),
0 0 10px rgba(74,222,128,0.46),
0 0 22px rgba(34,197,94,0.24),
0 0 0 1px rgba(0,0,0,0.50) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-icon-wrap::after {
opacity: 0.86 !important;
border: 2px solid rgba(74,222,128,0.80) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-icon-wrap::before {
opacity: 0.58 !important;
filter: blur(11px) !important;
background:
radial-gradient(
circle,
rgba(74,222,128,0.66) 0%,
rgba(34,197,94,0.24) 42%,
transparent 74%
) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected:not(.is-reward-pending):not(.is-classified-active) .aka-wallet-icon-wrap svg {
animation: none !important;
}
}
.aka-wallet-control-menu.is-connected {
border-color: rgba(74,222,128,0.72) !important;
background:
radial-gradient(circle at 15% 50%, rgba(74,222,128,0.16), transparent 36%),
linear-gradient(180deg, rgba(22,101,52,0.30), rgba(8,8,8,0.90)) !important;
box-shadow:
0 0 16px rgba(74,222,128,0.28),
0 0 30px rgba(34,197,94,0.16),
inset 0 1px 0 rgba(255,255,255,0.09) !important;
}
.aka-wallet-control-menu.is-connected .aka-wallet-icon-wrap {
border-color: rgba(74,222,128,0.84) !important;
}
.aka-wallet-control-menu.is-connected:not(.is-reward-pending):not(.is-classified-active) .aka-wallet-icon-wrap svg {
animation: none !important;
}
@keyframes akaWalletChampagneAuraBreath {
0%, 100% {
opacity: 0.54;
filter: blur(11px);
transform: scale(1);
}
50% {
opacity: 0.96;
filter: blur(19px);
transform: scale(1.32);
}
}
@keyframes akaWalletChampagneRingBreath {
0%, 100% {
opacity: 0.46;
transform: scale(1);
box-shadow:
0 0 10px rgba(236,202,132,0.22),
0 0 18px rgba(180,124,42,0.10);
}
50% {
opacity: 0.92;
transform: scale(1.18);
box-shadow:
0 0 18px rgba(236,202,132,0.60),
0 0 38px rgba(212,168,67,0.28),
0 0 56px rgba(180,124,42,0.14);
}
}
@keyframes akaWalletChampagneRingBreathTighter {
0%, 100% {
opacity: 0.42;
transform: scale(0.92);
box-shadow:
0 0 8px rgba(236,202,132,0.18),
0 0 14px rgba(180,124,42,0.08);
}
50% {
opacity: 0.78;
transform: scale(1.20);
box-shadow:
0 0 14px rgba(236,202,132,0.48),
0 0 30px rgba(212,168,67,0.22),
0 0 45px rgba(180,124,42,0.11);
}
}
@keyframes akaWalletClassifiedIconPulse {
0%, 100% {
color: #00D4FF;
filter:
drop-shadow(0 0 6px rgba(0,212,255,0.75))
drop-shadow(0 0 12px rgba(56,189,248,0.42));
}
50% {
color: #00D4FF;
filter:
drop-shadow(0 0 9px rgba(0,212,255,0.88))
drop-shadow(0 0 20px rgba(56,189,248,0.52));
}
}
@media (min-width: 769px) {
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-icon-wrap {
color: #4ADE80 !important;
background:
radial-gradient(circle at 50% 40%, rgba(22,163,74,0.96), rgba(10,72,38,0.98) 58%, rgba(3,18,10,1) 100%) !important;
border-color: rgba(74,222,128,0.92) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.10),
inset 0 -12px 22px rgba(0,0,0,0.54),
0 0 10px rgba(74,222,128,0.46),
0 0 22px rgba(34,197,94,0.24),
0 0 0 1px rgba(0,0,0,0.50) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-icon-wrap::before {
opacity: 0.58 !important;
filter: blur(11px) !important;
background:
radial-gradient(
circle,
rgba(74,222,128,0.66) 0%,
rgba(34,197,94,0.24) 42%,
transparent 74%
) !important;
animation: none !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-icon-wrap::after {
opacity: 0.86 !important;
border: 2px solid rgba(74,222,128,0.80) !important;
box-shadow: none !important;
animation: none !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-icon-wrap svg {
color: #4ADE80 !important;
filter:
drop-shadow(0 0 6px rgba(74,222,128,0.70))
drop-shadow(0 0 12px rgba(34,197,94,0.38)) !important;
animation: none !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending .aka-wallet-icon-wrap::before {
opacity: 0.72 !important;
filter: blur(13px) !important;
background:
radial-gradient(
circle,
rgba(236,202,132,0.76) 0%,
rgba(212,168,67,0.34) 40%,
rgba(180,124,42,0.14) 62%,
transparent 76%
) !important;
animation: akaWalletChampagneAuraBreath 2.45s ease-in-out infinite !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending .aka-wallet-icon-wrap::after {
opacity: 0.70 !important;
border-color: rgba(236,202,132,0.72) !important;
box-shadow:
0 0 12px rgba(236,202,132,0.34),
0 0 28px rgba(212,168,67,0.20),
0 0 42px rgba(180,124,42,0.12) !important;
animation: akaWalletChampagneRingBreathTighter 2.45s ease-in-out infinite !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending .aka-wallet-icon-wrap svg {
color: #4ADE80 !important;
filter:
drop-shadow(0 0 6px rgba(74,222,128,0.70))
drop-shadow(0 0 12px rgba(34,197,94,0.38)) !important;
animation: none !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-classified-active .aka-wallet-icon-wrap svg {
color: #00D4FF !important;
filter:
drop-shadow(0 0 6px rgba(0,212,255,0.75))
drop-shadow(0 0 12px rgba(56,189,248,0.42)) !important;
animation: akaWalletClassifiedIconPulse 2.15s ease-in-out infinite !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending.is-classified-active .aka-wallet-icon-wrap::before {
opacity: 0.72 !important;
filter: blur(13px) !important;
background:
radial-gradient(
circle,
rgba(236,202,132,0.76) 0%,
rgba(212,168,67,0.34) 40%,
rgba(180,124,42,0.14) 62%,
transparent 76%
) !important;
animation: akaWalletChampagneAuraBreath 2.35s ease-in-out infinite !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending.is-classified-active .aka-wallet-icon-wrap::after {
opacity: 0.72 !important;
border-color: rgba(236,202,132,0.72) !important;
box-shadow:
0 0 12px rgba(236,202,132,0.34),
0 0 28px rgba(212,168,67,0.20),
0 0 42px rgba(180,124,42,0.12) !important;
animation: akaWalletChampagneRingBreathTighter 2.35s ease-in-out infinite !important;
}
}
.aka-wallet-control-menu.is-connected .aka-wallet-icon-wrap {
color: #4ADE80 !important;
background:
radial-gradient(circle at 50% 40%, rgba(22,163,74,0.82), rgba(10,72,38,0.88) 58%, rgba(3,18,10,0.96) 100%) !important;
border-color: rgba(74,222,128,0.84) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.09),
inset 0 -10px 18px rgba(0,0,0,0.42),
0 0 12px rgba(74,222,128,0.26) !important;
}
.aka-wallet-control-menu.is-connected .aka-wallet-icon-wrap svg,
.aka-wallet-control-menu.is-connected.is-reward-pending .aka-wallet-icon-wrap svg {
color: #4ADE80 !important;
filter:
drop-shadow(0 0 6px rgba(74,222,128,0.70))
drop-shadow(0 0 12px rgba(34,197,94,0.38)) !important;
animation: none !important;
}
.aka-wallet-control-menu.is-connected.is-classified-active .aka-wallet-icon-wrap svg {
color: #00D4FF !important;
filter:
drop-shadow(0 0 6px rgba(0,212,255,0.75))
drop-shadow(0 0 12px rgba(56,189,248,0.42)) !important;
animation: akaWalletClassifiedIconPulse 2.15s ease-in-out infinite !important;
}
.aka-wallet-control.is-connected.is-wallet-connected-burst:not(.is-reward-pending):not(.is-classified-active),
.aka-wallet-control.is-connected.is-wallet-connected-burst:not(.is-reward-pending):not(.is-classified-active) .aka-wallet-icon-wrap svg {
animation: none !important;
}
.aka-wallet-control-menu.is-connected.is-reward-pending.is-classified-active .aka-wallet-icon-wrap {
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.09),
inset 0 -10px 18px rgba(0,0,0,0.42),
0 0 12px rgba(74,222,128,0.24),
0 0 22px rgba(212,168,67,0.14) !important;
}
/* ===== LOCKED TRAILER BUTTON ===== */
@keyframes akaTrailerLockBreath {
0%, 100% {
filter:
drop-shadow(0 0 5px rgba(71,188,255,0.58))
drop-shadow(0 0 11px rgba(26,105,210,0.30));
}
50% {
filter:
drop-shadow(0 0 10px rgba(71,188,255,1))
drop-shadow(0 0 22px rgba(55,174,255,0.48))
drop-shadow(0 0 34px rgba(26,105,210,0.30));
}
}
.aka-trailer-locked-btn {
position: relative;
overflow: hidden;
box-shadow:
0 0 14px rgba(71,188,255,0.15),
inset 0 0 10px rgba(71,188,255,0.045);
}
.aka-trailer-locked-btn::before {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(
110deg,
transparent,
rgba(71,188,255,0.15),
transparent
);
transform: translateX(-130%);
transition: transform 0.7s ease;
pointer-events: none;
}
.aka-trailer-locked-btn:hover {
transform: translateY(-1.05px) scale(1.007);
box-shadow:
0 0 22px rgba(71,188,255,0.40),
0 0 46px rgba(26,105,210,0.20),
0 14px 34px rgba(0,0,0,0.34),
inset 0 0 15px rgba(71,188,255,0.09);
filter: brightness(1.055) saturate(1.03);
}
.aka-trailer-locked-btn:hover::before {
transform: translateX(130%);
}
.aka-trailer-lock-icon {
color: #47bcff;
animation: akaTrailerLockBreath 2.1s ease-in-out infinite;
}
.aka-trailer-locked-btn .aka-trailer-lock-icon {
position:absolute;
left:50%;
top:50%;
z-index:2;
width:1.46rem !important;
height:1.46rem !important;
transform:translate(-50%,-50%);
stroke-width:1.9;
}
.aka-trailer-locked-btn .aka-trailer-cta-copy {
position:relative;
z-index:1;
opacity:.34;
filter:blur(.18px);
}
.aka-trailer-locked-btn:hover .aka-trailer-lock-icon {
transform: translate(-50%,-50%) scale(1.07);
}
.aka-trailer-unlocked-btn {
position: relative;
overflow: hidden;
border-color: rgba(74,222,128,0.48) !important;
color: rgba(190,255,214,0.96) !important;
background:
radial-gradient(circle at 50% 0%, rgba(74,222,128,0.14), transparent 58%),
linear-gradient(180deg, rgba(22,101,52,0.20), rgba(8,8,8,0.50)) !important;
box-shadow:
0 0 16px rgba(74,222,128,0.22),
0 0 34px rgba(34,197,94,0.12),
inset 0 0 12px rgba(74,222,128,0.05) !important;
}
.aka-trailer-unlocked-btn::before {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(
110deg,
transparent,
rgba(74,222,128,0.14),
rgba(212,168,67,0.10),
transparent
);
transform: translateX(-130%);
transition: transform 0.7s ease;
pointer-events: none;
}
.aka-trailer-unlocked-btn:hover {
border-color: rgba(182,255,241,0.76) !important;
transform: translateY(-1.05px) scale(1.007);
box-shadow:
0 0 22px rgba(74,222,128,0.30),
0 0 46px rgba(94,234,212,0.16),
0 14px 34px rgba(0,0,0,0.34),
inset 0 0 15px rgba(74,222,128,0.09);
filter: brightness(1.055) saturate(1.03);
}
.aka-trailer-unlocked-btn:hover::before {
transform: translateX(130%);
}
.aka-trailer-unlocked-icon {
color: rgba(134,239,172,1) !important;
filter:
drop-shadow(0 0 8px rgba(74,222,128,0.62))
drop-shadow(0 0 18px rgba(34,197,94,0.26)) !important;
animation: akaTrailerUnlockedBreath 2.4s ease-in-out infinite;
}
.aka-trailer-unlocked-btn .aka-trailer-cta-copy { opacity:1;filter:none; }
@keyframes akaTrailerUnlockedBreath {
0%, 100% {
transform: scale(1);
filter:
drop-shadow(0 0 6px rgba(74,222,128,0.42))
drop-shadow(0 0 12px rgba(34,197,94,0.18));
}
50% {
transform: scale(1.08);
filter:
drop-shadow(0 0 10px rgba(134,239,172,0.90))
drop-shadow(0 0 22px rgba(74,222,128,0.36));
}
}
.aka-trailer-locked-btn:active {
transform: translateY(0.45px) scale(0.992);
box-shadow:
0 0 18px rgba(71,188,255,0.34),
0 0 38px rgba(26,105,210,0.17);
filter: brightness(0.98);
}
/* Only for very narrow preview widths around 300px. Normal phones stay unchanged. */
@media (max-width: 320px) {
.aka-trailer-locked-btn {
padding-left: 1.25rem !important;
padding-right: 1.25rem !important;
font-size: 1rem !important;
letter-spacing: 0.10em !important;
}
.aka-trailer-lock-icon {
width: 1rem !important;
height: 1rem !important;
}
}
/* ===== VAULT MODAL LAYOUT ===== */
.aka-language-button {
position: relative;
width: 2.08rem;
height: 2.08rem;
border: 1px solid rgba(212,168,67,0.16);
border-radius: 4px;
background:
linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.008)),
rgba(8,8,8,0.28);
color: rgba(232,213,183,0.82);
overflow: hidden;
transition:
transform 0.54s cubic-bezier(0.22, 1, 0.36, 1),
border-color 0.52s ease,
background 0.52s ease,
box-shadow 0.54s ease,
color 0.50s ease,
filter 0.50s ease;
}
.aka-language-button svg {
position: relative;
z-index: 1;
color: currentColor !important;
transition: filter 0.28s ease, transform 0.28s ease;
}
.aka-language-button:hover,
.aka-language-button.is-open {
transform: translateY(-0.25px) scale(1.006);
border-color: rgba(212,168,67,0.44);
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.16), transparent 62%),
linear-gradient(180deg, rgba(255,45,85,0.10), rgba(8,8,8,0.34));
color: rgba(255,236,190,0.98);
box-shadow:
0 0 13px rgba(212,168,67,0.18),
0 0 24px rgba(255,45,85,0.14),
inset 0 1px 0 rgba(255,255,255,0.08);
filter: brightness(1.035);
}
.aka-language-button:hover svg,
.aka-language-button.is-open svg {
filter:
drop-shadow(0 0 8px rgba(212,168,67,0.42))
drop-shadow(0 0 12px rgba(255,45,85,0.16));
}
.aka-language-menu:not(.hidden) {
filter: drop-shadow(0 0 18px rgba(212,168,67,0.18)) drop-shadow(0 16px 30px rgba(0,0,0,0.62));
}
.aka-language-menu :is(a, button) {
position: relative;
border-top: 1px solid rgba(255,255,255,0.035);
box-shadow: inset 0 1px 0 rgba(255,255,255,0.025);
}
.aka-language-menu :is(a, button)::before {
content: '';
position: absolute;
left: 0;
top: 0.48rem;
bottom: 0.48rem;
width: 1px;
background: linear-gradient(to bottom, transparent, rgba(255,45,85,0.72), transparent);
opacity: 0;
transition: opacity 0.24s ease;
}
.aka-language-menu :is(a, button):hover {
color: rgba(255,238,196,0.98) !important;
background:
linear-gradient(90deg, rgba(255,45,85,0.12), rgba(212,168,67,0.075), rgba(8,8,8,0.72)) !important;
border-left-color: rgba(212,168,67,0.72);
border-right-color: rgba(255,45,85,0.22);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.05),
0 0 16px rgba(212,168,67,0.12);
text-shadow:
0 0 10px rgba(212,168,67,0.46),
0 0 16px rgba(255,45,85,0.18);
transform: translateX(-2px) translateY(-1px);
}
.aka-language-menu :is(a, button):hover::before {
opacity: 1;
}
#buyLinkCTA,
#buyLinkHero {
min-height: 3.35rem;
padding: 0.88rem 2.25rem !important;
border: 1px solid rgba(212,168,67,0.44) !important;
border-radius: 4px !important;
background:
linear-gradient(135deg, rgba(139,0,0,1) 0%, rgba(190,13,34,0.98) 48%, rgba(74,0,0,1) 100%) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.12),
inset 0 -14px 24px rgba(0,0,0,0.30),
0 0 18px rgba(255,45,85,0.26),
0 0 32px rgba(212,168,67,0.12),
0 16px 34px rgba(0,0,0,0.40) !important;
align-items: center;
justify-content: center;
gap: 0.72rem;
font-size: 1.25rem !important;
line-height: 1;
text-shadow: 0 0 10px rgba(255,255,255,0.12);
}
#buyLinkCTA:hover,
#buyLinkHero:hover {
transform: translateY(-1.55px) scale(1.006);
border-color: rgba(255,226,151,0.68) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.14),
inset 0 -14px 24px rgba(0,0,0,0.30),
0 0 20px rgba(255,45,85,0.34),
0 0 38px rgba(212,168,67,0.16),
0 14px 36px rgba(0,0,0,0.44) !important;
filter: brightness(1.045) saturate(1.02);
}
.modal-close {
appearance: none;
position: absolute !important;
top: 0.75rem !important;
right: 0.9rem !important;
z-index: 10040 !important;
width: 2rem !important;
height: 2rem !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
padding: 0 !important;
border: 1px solid rgba(212,168,67,0.34) !important;
border-radius: 999px !important;
background: rgba(8,8,8,0.78) !important;
color: rgba(255,238,196,0.96) !important;
box-shadow:
0 0 14px rgba(212,168,67,0.12),
0 8px 22px rgba(0,0,0,0.42) !important;
font-family: 'Space Grotesk', sans-serif !important;
font-size: 1.28rem !important;
font-weight: 400 !important;
line-height: 1 !important;
text-align: center !important;
text-shadow: 0 0 8px rgba(212,168,67,0.26) !important;
cursor: pointer;
transform: none !important;
transition:
border-color 0.50s ease,
box-shadow 0.54s ease,
color 0.48s ease,
filter 0.48s ease,
background 0.50s ease;
}
.modal-close:hover {
transform: none !important;
border-color: rgba(255,226,151,0.66) !important;
color: rgba(255,255,255,0.98) !important;
filter: brightness(1.07) saturate(1.03);
background: rgba(14,12,10,0.88) !important;
box-shadow:
0 0 18px rgba(212,168,67,0.28),
0 0 28px rgba(255,45,85,0.14),
0 8px 22px rgba(0,0,0,0.46) !important;
}
.modal-box.archive-modal-wide .modal-close {
top: 0.75rem !important;
right: 0.9rem !important;
}
.modal-box.archive-modal-wide .aka-vault-topbar {
padding-right: 3.5rem;
}
.aka-vault-state-label {
color: rgba(255,92,125,0.86) !important;
text-shadow: 0 0 12px rgba(255,45,85,0.22);
}
.aka-archive-grid {
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: clamp(0.82rem, 1.35vw, 1.15rem) !important;
width: 100%;
max-width: 100%;
}
.aka-archive-file-card {
position: relative;
display: block !important;
min-height: 0 !important;
aspect-ratio: 2 / 3 !important;
padding: 0 !important;
border-radius: 5px !important;
background:
linear-gradient(180deg, rgba(255,255,255,0.018), rgba(0,0,0,0.24)),
#030303 !important;
overflow: hidden;
}
.aka-archive-file-card img {
position: absolute;
inset: 0;
z-index: 1;
display: block !important;
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
padding: 0.42rem !important;
background: #030303 !important;
}
.aka-archive-file-card .pointer-events-none {
display: block !important;
z-index: 2;
}
.aka-archive-file-card .pointer-events-none.flex {
display: flex !important;
}
.aka-archive-file-id-badge {
position: absolute;
top: 0.52rem;
left: 0.52rem;
z-index: 8;
max-width: calc(100% - 3.55rem);
padding: 0.35rem 0.48rem 0.31rem;
overflow: visible;
border: 1px solid rgba(212,168,67,0.34);
border-radius: 999px;
background: rgba(0,0,0,0.72);
box-shadow:
0 0 8px rgba(212,168,67,0.08),
inset 0 0 8px rgba(212,168,67,0.025);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
pointer-events: none;
}
.aka-archive-file-id-badge span {
display: block;
overflow: visible;
direction: ltr;
unicode-bidi: isolate;
color: rgba(241,202,106,0.96);
font-family: "Special Elite", ui-monospace, monospace;
font-size: 0.57rem;
line-height: 1.28;
letter-spacing: 0.12em;
text-transform: uppercase;
white-space: nowrap;
text-shadow: 0 0 6px rgba(212,168,67,0.18);
}
.aka-archive-file-id-badge.is-classified {
border-color: rgba(182,255,241,0.44);
background:
linear-gradient(180deg, rgba(7,22,27,0.86), rgba(2,10,13,0.84));
box-shadow:
0 0 8px rgba(182,255,241,0.085),
0 0 15px rgba(182,255,241,0.05),
inset 0 0 8px rgba(182,255,241,0.035);
}
.aka-archive-file-id-badge.is-classified span {
color: rgba(182,255,241,0.94);
text-shadow:
0 0 5px rgba(182,255,241,0.18),
0 0 9px rgba(182,255,241,0.07);
}
.aka-archive-test-preview-badge {
position: absolute;
right: 0.52rem;
bottom: 4.55rem;
z-index: 8;
padding: 0.3rem 0.46rem 0.27rem;
border: 1px solid rgba(241,202,106,0.42);
border-radius: 999px;
color: rgba(255,225,151,0.94);
background: rgba(16,10,2,0.88);
box-shadow: 0 0 12px rgba(212,168,67,0.13);
font-family: "Special Elite", ui-monospace, monospace;
font-size: 0.52rem;
line-height: 1;
letter-spacing: 0.12em;
pointer-events: none;
}
.aka-archive-file-card.is-test-preview > img {
opacity: 0.68 !important;
filter: saturate(0.72) contrast(0.92) !important;
}
@media (max-width: 640px) {
.aka-archive-file-id-badge {
top: 0.48rem;
left: 0.48rem;
max-width: calc(100% - 3.18rem);
padding: 0.32rem 0.43rem 0.29rem;
}
.aka-archive-file-id-badge span {
font-size: 0.52rem;
line-height: 1.28;
letter-spacing: 0.105em;
}
}
.aka-archive-file-inner {
position: absolute;
inset: 0;
z-index: 3;
display: flex !important;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.62rem;
width: 100%;
padding: 1.15rem;
text-align: center;
background:
radial-gradient(circle at 50% 45%, rgba(255,45,85,0.16), transparent 44%),
linear-gradient(180deg, rgba(0,0,0,0.10), rgba(0,0,0,0.46));
}
.aka-archive-file-card.is-recovered .aka-archive-file-inner {
display: none !important;
}
.aka-archive-file-icon {
width: 2.25rem;
height: 2.25rem;
color: rgba(255,100,132,0.94);
filter:
drop-shadow(0 0 10px rgba(255,45,85,0.38))
drop-shadow(0 0 18px rgba(212,168,67,0.12));
}
.aka-archive-file-state {
color: rgba(255,232,190,0.94);
font-size: 0.72rem;
letter-spacing: 0.16em;
text-shadow: 0 0 12px rgba(255,45,85,0.20);
}
.aka-archive-file-name {
max-width: 100%;
color: rgba(232,213,183,0.68);
font-size: 0.58rem;
letter-spacing: 0.06em;
overflow-wrap: anywhere;
}
.aka-archive-file-card.is-recovered {
border-color: rgba(74,222,128,0.42) !important;
box-shadow:
0 0 20px rgba(74,222,128,0.20),
inset 0 0 26px rgba(74,222,128,0.055),
0 18px 40px rgba(0,0,0,0.48) !important;
}
.aka-archive-file-card.is-recovered img {
opacity: 1 !important;
filter: none !important;
transform: none !important;
}
.aka-archive-file-card.is-sealed img {
filter: blur(6px) saturate(0.58) brightness(0.62);
}
.aka-archive-file-card.is-sealed > .absolute.inset-x-0.bottom-0 {
position: absolute !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
width: auto !important;
padding: 0.78rem !important;
background: linear-gradient(to top, rgba(0,0,0,0.96), rgba(0,0,0,0.0)) !important;
z-index: 4;
}
.aka-archive-file-card.is-recovered > .absolute.inset-x-0.bottom-0 {
position: absolute !important;
left: 0.58rem !important;
right: auto !important;
bottom: 0.58rem !important;
width: auto !important;
padding: 0 !important;
background: transparent !important;
z-index: 5;
}
.aka-archive-file-card.is-recovered .aka-archive-recover-btn,
.aka-archive-recovered-badge {
min-height: 1.5rem;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0.34rem 0.52rem;
border: 1px solid rgba(74,222,128,0.36);
border-radius: 3px;
background: rgba(5,24,13,0.78);
color: rgba(156,255,195,0.96);
box-shadow:
0 0 12px rgba(74,222,128,0.18),
inset 0 1px 0 rgba(255,255,255,0.05);
font-family: 'Special Elite', monospace;
font-size: 0.54rem !important;
letter-spacing: 0.16em !important;
line-height: 1;
}
.aka-archive-recovered-badge {
position: absolute;
left: 0.58rem;
bottom: 0.58rem;
z-index: 5;
}
@media (max-width: 900px) {
.aka-archive-grid {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
}
@media (max-width: 720px) {
.modal-close {
top: 0.7rem !important;
right: 0.7rem !important;
width: 1.9rem !important;
height: 1.9rem !important;
font-size: 1.18rem !important;
}
.modal-box.archive-modal-wide .aka-vault-topbar {
padding-right: 3rem;
}
.aka-archive-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 0.68rem !important;
}
.aka-archive-file-inner {
padding: 0.82rem;
}
.aka-archive-file-icon {
width: 1.65rem;
height: 1.65rem;
}
.aka-archive-recover-btn {
min-width: 0;
width: 100% !important;
font-size: 0.56rem !important;
letter-spacing: 0.12em !important;
}
}
@media (max-width: 340px) {
.aka-archive-grid {
grid-template-columns: 1fr !important;
}
}
/* ===== CINEMA DENSITY ===== */
#navbar .aka-brand-zone a .rounded-full span {
color: #D4A843 !important;
text-shadow:
0 0 8px rgba(212,168,67,0.44),
0 0 16px rgba(255,45,85,0.10);
}
#token .aka-coin-orb {
color: #D4A843;
background:
radial-gradient(circle at 35% 30%, rgba(255,255,255,0.12), transparent 34%),
linear-gradient(135deg, #8B0000, #4A0000) !important;
border-color: rgba(212,168,67,0.78) !important;
box-shadow:
0 0 10px rgba(212,168,67,0.13),
0 0 22px rgba(139,0,0,0.16),
inset 0 0 10px rgba(0,0,0,0.34) !important;
}
#token .aka-coin-orb span {
color: #D4A843 !important;
line-height: 1;
transform: translateY(0.02rem);
text-shadow:
0 0 5px rgba(212,168,67,0.26),
0 0 12px rgba(139,0,0,0.18);
}
#token [data-i18n="coinLabel"] {
color: rgba(186,172,148,0.58) !important;
text-shadow:
0 0 6px rgba(212,168,67,0.045),
0 0 12px rgba(0,0,0,0.18);
}
#token .aka-coin-name-brand {
color: rgba(232,213,183,0.94) !important;
font-size: clamp(1.05rem, 1.75vw, 1.22rem) !important;
letter-spacing: .075em !important;
white-space: nowrap;
text-shadow:
0 0 4px rgba(232,213,183,0.10),
0 0 11px rgba(212,168,67,0.055),
0 0 18px rgba(0,0,0,0.28);
}
#token .aka-coin-panel {
isolation: isolate;
background:
radial-gradient(circle at 18% 0%, rgba(212,168,67,0.075), transparent 34%),
radial-gradient(circle at 88% 8%, rgba(255,45,85,0.045), transparent 30%),
linear-gradient(135deg, rgba(26,26,26,0.96) 0%, rgba(12,12,12,0.98) 52%, rgba(22,22,22,0.96) 100%) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.055),
inset 0 0 38px rgba(212,168,67,0.035),
0 0 34px rgba(212,168,67,0.10),
0 26px 72px rgba(0,0,0,0.54);
}
#token .aka-coin-panel::before,
#token .aka-coin-panel::after {
content: '';
position: absolute;
inset: 0;
pointer-events: none;
}
#token .aka-coin-panel::before {
z-index: 1;
opacity: 0.055;
background:
repeating-linear-gradient(
0deg,
transparent,
transparent 3px,
rgba(212,168,67,0.10) 4px
),
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.12), transparent 42%);
}
#token .aka-coin-panel::after {
display: none;
}
#token .aka-coin-panel > .p-8 {
position: relative;
z-index: 2;
}
#token .aka-coin-panel > .absolute {
position: absolute;
z-index: 3;
pointer-events: none;
}
#token .aka-coin-info-box,
#token .aka-contract-address-box {
position: relative;
overflow: hidden;
border-color: rgba(212,168,67,0.18) !important;
background:
linear-gradient(180deg, rgba(255,255,255,0.028), rgba(255,255,255,0.006)),
rgba(0,0,0,0.42) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.035),
0 12px 28px rgba(0,0,0,0.22);
transition:
transform 0.34s ease,
border-color 0.34s ease,
box-shadow 0.34s ease,
background 0.34s ease,
filter 0.34s ease;
}
#token .aka-coin-info-box::after,
#token .aka-contract-address-box::after {
content: '';
position: absolute;
left: 0.75rem;
right: 0.75rem;
bottom: 0;
height: 1px;
background: linear-gradient(90deg, transparent, rgba(212,168,67,0.46), rgba(74,222,128,0.22), transparent);
opacity: 0.48;
pointer-events: none;
}
#token .aka-coin-info-box:hover,
#token .aka-contract-address-box:hover {
transform: none;
border-color: rgba(212,168,67,0.18) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.035),
0 12px 28px rgba(0,0,0,0.22);
filter: none;
}
#token .aka-coin-info-box > p[data-i18n],
#token [data-i18n="contractAddressLabel"] {
color: rgba(255,226,151,0.76) !important;
opacity: 1 !important;
text-shadow:
0 0 8px rgba(212,168,67,0.32),
0 0 18px rgba(212,168,67,0.14);
}
#token .aka-coin-plans {
overflow: visible;
}
#token .aka-coin-plan-item {
min-width: 0;
border-radius: 4px;
}
#token .aka-coin-presale-dot {
position: relative !important;
top: -0.08rem !important;
width: 0.82rem !important;
height: 0.82rem !important;
box-shadow: 0 0 15px rgba(255,0,61,0.86) !important;
animation: akaCoinPresalePulse 1.65s ease-in-out infinite !important;
}
#token .aka-coin-presale-label {
font-size: 0.80rem !important;
letter-spacing: 0.16em !important;
text-shadow:
0 0 8px rgba(255,0,61,0.66),
0 0 18px rgba(255,45,85,0.22);
}
@media (min-width: 768px) {
#token .aka-coin-presale-label {
font-size: 0.90rem !important;
}
}
.aka-vault-header {
padding-bottom: 1.55rem !important;
}
.aka-vault-content {
padding-top: 1rem !important;
}
.aka-vault-grid-separator {
display: flex;
align-items: center;
gap: 0.72rem;
margin: 0 0 1rem;
color: rgba(180,255,212,0.72);
font-family: 'Special Elite', monospace;
font-size: 0.58rem;
letter-spacing: 0.24em;
line-height: 1;
text-transform: uppercase;
text-shadow: 0 0 10px rgba(74,222,128,0.18);
}
.aka-vault-grid-separator::before,
.aka-vault-grid-separator::after {
content: '';
height: 1px;
flex: 1 1 auto;
background:
repeating-linear-gradient(90deg, rgba(212,168,67,0.0) 0 8px, rgba(212,168,67,0.34) 8px 16px),
linear-gradient(90deg, transparent, rgba(74,222,128,0.38), rgba(212,168,67,0.28), transparent);
box-shadow: 0 0 10px rgba(74,222,128,0.10);
}
.aka-terminal-live-dot {
background: #4ade80 !important;
box-shadow:
0 0 12px rgba(74,222,128,0.72),
0 0 24px rgba(74,222,128,0.22) !important;
}
.aka-terminal-cell svg,
.aka-terminal-cell i {
color: rgba(212,168,67,0.78);
filter: drop-shadow(0 0 8px rgba(212,168,67,0.18));
flex: 0 0 auto;
transform-origin: center;
}
.aka-terminal-cell-holders svg,
.aka-terminal-cell-holders i {
animation: akaTerminalHolderGlow 4.8s ease-in-out infinite;
}
.aka-terminal-cell-recovered svg,
.aka-terminal-cell-recovered i {
color: rgba(112,255,191,0.88);
animation: akaTerminalVaultGlow 4.2s ease-in-out infinite;
}
.aka-terminal-cell-act svg,
.aka-terminal-cell-act i {
color: rgba(255,105,128,0.92);
animation: akaTerminalBroadcastPulse 2.7s ease-in-out infinite;
}
.aka-terminal-cell-signal svg,
.aka-terminal-cell-signal i {
color: rgba(99,210,255,0.94);
animation: akaTerminalSignalWave 3.2s ease-in-out infinite;
}
.aka-terminal-cell-community svg,
.aka-terminal-cell-community i {
color: rgba(74,222,128,0.90);
animation: akaTerminalHeartbeat 2.8s ease-in-out infinite;
}
.film-strip {
background-position: 0 0;
overflow: hidden;
will-change: background-position;
}
.film-strip.film-strip-in-view {
animation: akaFilmStripRoll 1.75s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes akaCoinPresalePulse {
0%, 100% {
opacity: 0.62;
transform: scale(0.86);
box-shadow: 0 0 12px rgba(255,0,61,0.62), 0 0 24px rgba(255,45,85,0.22);
}
50% {
opacity: 1;
transform: scale(1.08);
box-shadow: 0 0 18px rgba(255,0,61,0.92), 0 0 34px rgba(255,45,85,0.34);
}
}
@keyframes akaTerminalHolderGlow {
0%, 100% { filter: drop-shadow(0 0 7px rgba(212,168,67,0.16)); }
50% { filter: drop-shadow(0 0 12px rgba(212,168,67,0.34)); }
}
@keyframes akaTerminalVaultGlow {
0%, 100% { filter: drop-shadow(0 0 8px rgba(74,222,128,0.22)) drop-shadow(0 0 14px rgba(212,168,67,0.08)); }
50% { filter: drop-shadow(0 0 13px rgba(74,222,128,0.42)) drop-shadow(0 0 20px rgba(212,168,67,0.16)); }
}
@keyframes akaTerminalBroadcastPulse {
0%, 100% { transform: scale(0.98); filter: drop-shadow(0 0 8px rgba(255,45,85,0.20)); }
50% { transform: scale(1.06); filter: drop-shadow(0 0 14px rgba(255,45,85,0.42)); }
}
@keyframes akaTerminalSignalWave {
0%, 100% { opacity: 0.72; transform: translateY(0); filter: drop-shadow(0 0 7px rgba(99,210,255,0.20)); }
50% { opacity: 1; transform: translateY(-1px); filter: drop-shadow(0 0 14px rgba(99,210,255,0.38)); }
}
@keyframes akaTerminalHeartbeat {
0%, 100% { transform: scale(1); filter: drop-shadow(0 0 7px rgba(74,222,128,0.18)); }
12% { transform: scale(1.10); }
22% { transform: scale(0.98); }
36% { transform: scale(1.06); filter: drop-shadow(0 0 14px rgba(74,222,128,0.36)); }
48% { transform: scale(1); }
}
@keyframes akaFilmStripRoll {
0% { background-position: 0 0; filter: brightness(1); }
55% { filter: brightness(1.08); }
100% { background-position: 44px 0; filter: brightness(1); }
}
@media (max-width: 360px) {
#token .aka-coin-info-box > p[data-i18n],
#token [data-i18n="contractAddressLabel"] {
letter-spacing: 0.16em !important;
}
#token .aka-contract-address-box {
max-width: 100%;
}
.aka-vault-grid-separator {
letter-spacing: 0.15em;
}
}
@media (prefers-reduced-motion: reduce) {
#token .aka-coin-presale-dot,
.aka-terminal-live-dot,
.aka-terminal-cell svg,
.aka-terminal-cell i,
.film-strip.film-strip-in-view {
animation: none !important;
}
}
/* ===== TARGETED PRODUCTION RULES ===== */
#navbar .aka-brand-zone a .rounded-full span,
#token .aka-coin-panel .rounded-full span,
footer .inline-flex .rounded-full span {
color: #D4A843 !important;
text-shadow:
0 0 8px rgba(212,168,67,0.44),
0 0 16px rgba(255,45,85,0.10);
}
footer .max-w-3xl > .bg-cinema-darkgray\/50 {
position: relative;
isolation: isolate;
overflow: hidden;
border-color: rgba(212,168,67,0.22) !important;
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.075), transparent 36%),
radial-gradient(circle at 16% 100%, rgba(255,0,61,0.06), transparent 34%),
linear-gradient(180deg, rgba(26,26,26,0.70), rgba(8,8,8,0.88)) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.045),
inset 0 0 38px rgba(212,168,67,0.045),
inset 0 -28px 62px rgba(0,0,0,0.34),
0 0 22px rgba(212,168,67,0.09),
0 0 42px rgba(255,0,61,0.045),
0 26px 76px rgba(0,0,0,0.56);
animation: akaManifestoPanelAura 10s ease-in-out infinite;
}
footer .max-w-3xl > .bg-cinema-darkgray\/50::before,
footer .max-w-3xl > .bg-cinema-darkgray\/50::after {
content: '';
position: absolute;
inset: 0;
border-radius: inherit;
pointer-events: none;
z-index: 0;
}
footer .max-w-3xl > .bg-cinema-darkgray\/50::before {
opacity: 0.22;
background:
repeating-linear-gradient(
0deg,
rgba(255,255,255,0.035) 0,
rgba(255,255,255,0.035) 1px,
transparent 1px,
transparent 5px
),
radial-gradient(circle at 28% 18%, rgba(212,168,67,0.16), transparent 26%),
radial-gradient(circle at 82% 78%, rgba(255,0,61,0.12), transparent 30%);
mix-blend-mode: screen;
}
footer .max-w-3xl > .bg-cinema-darkgray\/50::after {
background:
linear-gradient(180deg, rgba(0,0,0,0.34), transparent 18%, transparent 78%, rgba(0,0,0,0.48)),
linear-gradient(90deg, rgba(0,0,0,0.18), transparent 18%, transparent 82%, rgba(0,0,0,0.20));
box-shadow:
inset 0 0 0 1px rgba(255,215,128,0.035),
inset 0 0 32px rgba(255,0,61,0.028);
}
footer .max-w-3xl > .bg-cinema-darkgray\/50 > * {
position: relative;
z-index: 1;
}
#community .aka-social-card > div:first-child {
transform: translateY(0) scale(1);
transform-origin: center;
transition:
transform 0.46s cubic-bezier(0.22, 1, 0.36, 1),
box-shadow 0.46s cubic-bezier(0.22, 1, 0.36, 1),
background-color 0.46s ease,
filter 0.46s ease;
will-change: transform, filter;
animation: akaSocialIconIdle 5.6s ease-in-out infinite;
}
@media (hover: hover) and (pointer: fine) {
#xLink:hover,
#telegramLink:hover,
#chartLink:hover {
transform: translateY(-0.8px) scale(1.003);
filter: brightness(1.025);
}
}
#community .aka-social-card > div:first-child svg,
#community .aka-social-x > div:first-child span {
transition:
transform 0.46s cubic-bezier(0.22, 1, 0.36, 1),
filter 0.46s ease,
color 0.46s ease,
text-shadow 0.46s ease;
transform-origin: center;
will-change: transform, filter;
}
#community .aka-social-card > div:first-child svg {
animation: akaSocialGlyphIdle 4.8s ease-in-out infinite;
}
#community .aka-social-x > div:first-child {
animation-name: akaSocialXIdleGlow;
}
#community .aka-social-x > div:first-child span {
animation: akaSocialXGlyphIdle 4.4s ease-in-out infinite;
text-shadow:
0 0 8px rgba(232,213,183,0.14),
0 0 16px rgba(29,161,242,0.12);
}
@media (hover: hover) and (pointer: fine) {
#community .aka-social-card:hover > div:first-child {
animation: akaSocialIconBreath 1.8s ease-in-out infinite;
}
#community .aka-social-card:hover > div:first-child svg,
#community .aka-social-x:hover > div:first-child span {
animation: akaSocialGlyphGlow 1.8s ease-in-out infinite;
}
#community .aka-social-x:hover > div:first-child {
box-shadow:
0 0 16px rgba(29,161,242,0.20),
0 0 30px rgba(232,213,183,0.08),
inset 0 0 20px rgba(29,161,242,0.075);
filter: brightness(1.08);
}
#community .aka-social-x:hover > div:first-child span {
text-shadow:
0 0 11px rgba(232,213,183,0.32),
0 0 22px rgba(29,161,242,0.34);
}
#community .aka-social-telegram:hover > div:first-child {
animation: akaSocialTelegramFloat 1.85s ease-in-out infinite;
box-shadow:
0 0 16px rgba(0,136,204,0.20),
inset 0 0 20px rgba(0,136,204,0.075);
}
#community .aka-social-telegram:hover > div:first-child svg {
animation: akaSocialTelegramGlyphFloat 1.85s ease-in-out infinite;
filter:
drop-shadow(0 0 9px rgba(0,136,204,0.48))
drop-shadow(0 0 17px rgba(0,136,204,0.20));
}
#community .aka-social-chart:hover > div:first-child {
animation: akaSocialChartSignalLift 1.55s ease-in-out infinite;
box-shadow:
0 0 16px rgba(74,222,128,0.19),
inset 0 0 20px rgba(74,222,128,0.07);
}
#community .aka-social-chart:hover > div:first-child svg {
animation: akaSocialChartGlyphSignal 1.55s ease-in-out infinite;
filter:
drop-shadow(0 0 9px rgba(74,222,128,0.46))
drop-shadow(0 0 17px rgba(74,222,128,0.18));
}
}
@media (max-width: 767px) {
footer .max-w-3xl > .bg-cinema-darkgray\/50 {
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.04),
inset 0 0 26px rgba(212,168,67,0.035),
0 0 18px rgba(212,168,67,0.07),
0 18px 48px rgba(0,0,0,0.48);
}
footer .max-w-3xl > .bg-cinema-darkgray\/50::before {
opacity: 0.16;
}
}
@keyframes akaManifestoPanelAura {
0%, 100% {
border-color: rgba(212,168,67,0.18);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.045),
inset 0 0 34px rgba(212,168,67,0.038),
inset 0 -28px 62px rgba(0,0,0,0.34),
0 0 20px rgba(212,168,67,0.075),
0 0 38px rgba(255,0,61,0.036),
0 26px 76px rgba(0,0,0,0.56);
}
50% {
border-color: rgba(212,168,67,0.28);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.055),
inset 0 0 44px rgba(212,168,67,0.060),
inset 0 -28px 62px rgba(0,0,0,0.34),
0 0 26px rgba(212,168,67,0.12),
0 0 48px rgba(255,0,61,0.06),
0 26px 76px rgba(0,0,0,0.56);
}
}
@keyframes akaSocialIconIdle {
0%, 100% {
filter: brightness(1);
box-shadow: 0 0 10px rgba(212,168,67,0.045);
}
50% {
filter: brightness(1.035);
box-shadow: 0 0 14px rgba(212,168,67,0.075);
}
}
@keyframes akaSocialXIdleGlow {
0%, 100% {
filter: brightness(1);
box-shadow: 0 0 10px rgba(29,161,242,0.07);
}
50% {
filter: brightness(1.035);
box-shadow: 0 0 15px rgba(29,161,242,0.12), inset 0 0 14px rgba(29,161,242,0.035);
}
}
@keyframes akaSocialGlyphIdle {
0%, 100% {
transform: translateY(0) scale(1);
filter: brightness(1)
drop-shadow(0 0 5px rgba(212,168,67,0.08));
}
50% {
transform: translateY(-0.8px) scale(1.025);
filter: brightness(1.10)
drop-shadow(0 0 9px rgba(212,168,67,0.16));
}
}
@keyframes akaSocialXGlyphIdle {
0%, 100% {
transform: scale(1);
text-shadow:
0 0 8px rgba(232,213,183,0.14),
0 0 16px rgba(29,161,242,0.12);
}
50% {
transform: scale(1.035);
text-shadow:
0 0 11px rgba(232,213,183,0.22),
0 0 22px rgba(29,161,242,0.20);
}
}
@keyframes akaSocialIconBreath {
0%, 100% { transform: translateY(0) scale(1); }
50% { transform: translateY(-0.75px) scale(1.045); }
}
@keyframes akaSocialGlyphGlow {
0%, 100% {
transform: scale(1);
filter: brightness(1);
}
50% {
transform: scale(1.08);
filter: brightness(1.18);
}
}
@keyframes akaSocialTelegramFloat {
0%, 100% { transform: translateY(0) scale(1); }
50% { transform: translateY(-1.6px) scale(1.025); }
}
@keyframes akaSocialTelegramGlyphFloat {
0%, 100% { transform: translateY(0) scale(1); }
50% { transform: translateY(-2px) scale(1.035); }
}
@keyframes akaSocialChartSignalLift {
0%, 100% { transform: translateY(0) scale(1); }
45% { transform: translateY(-1.3px) scale(1.026); }
62% { transform: translateY(-0.4px) scale(1.012); }
}
@keyframes akaSocialChartGlyphSignal {
0%, 100% { transform: translateY(0) scale(1); }
42% { transform: translateY(-2.2px) scale(1.055); }
64% { transform: translateY(-0.6px) scale(1.018); }
}
@media (prefers-reduced-motion: reduce) {
footer .max-w-3xl > .bg-cinema-darkgray\/50,
#community .aka-social-card > div:first-child,
#community .aka-social-card > div:first-child svg,
#community .aka-social-x > div:first-child span,
#community .aka-social-card:hover > div:first-child,
#community .aka-social-card:hover > div:first-child svg,
#community .aka-social-x:hover > div:first-child span {
animation: none !important;
}
}
/* ===== KEYFRAMES ===== */
@keyframes akaTerminalStrokeMove {
0% {
stroke-dashoffset: 0;
}
100% {
stroke-dashoffset: -26;
}
}
@keyframes akaTerminalPeopleMachine {
0% {
transform: translateY(-50%) rotate(0deg);
filter: brightness(0.95);
}
100% {
transform: translateY(-50%) rotate(360deg);
filter: brightness(1.12);
}
}
@keyframes akaTerminalVaultScan {
0% {
background-position: 140% 0;
opacity: 0.25;
}
35% {
opacity: 0.72;
}
100% {
background-position: -120% 0;
opacity: 0.25;
}
}
@keyframes akaTerminalRadarSweep {
0% {
transform: translateY(-50%) rotate(0deg);
}
100% {
transform: translateY(-50%) rotate(360deg);
}
}
@keyframes akaTerminalSignalRun {
0% {
background-position: 150% 0;
opacity: 0.28;
}
50% {
opacity: 0.82;
}
100% {
background-position: -120% 0;
opacity: 0.28;
}
}
@keyframes akaTerminalSignalLines {
0% {
stroke-dashoffset: 0;
}
100% {
stroke-dashoffset: -18;
}
}
@keyframes akaTerminalHeartbeatRun {
0% {
background-position: 120% 0;
opacity: 0.18;
}
35% {
opacity: 0.95;
}
100% {
background-position: -120% 0;
opacity: 0.18;
}
}
@keyframes akaTerminalCommunityLineFlow {
0% {
stroke-dashoffset: 0;
}
100% {
stroke-dashoffset: -22;
}
}
/* Mobile: terminal icons stay in place */
@media (max-width: 767px) {
#community .aka-terminal-cell::before {
left: 0.78rem !important;
}
#community .aka-terminal-cell > svg,
#community .aka-terminal-cell > i {
transform: none !important;
}
}
/* Accessibility */
@media (prefers-reduced-motion: reduce) {
#community .aka-terminal-cell::before,
#community .aka-terminal-cell svg,
#community .aka-terminal-cell i {
animation: none !important;
}
}
/* ===== LIVE CINEMA TERMINAL ICON ACTIONS: CLEAN FIX ===== */
/* Targets ONLY the lower LIVE CINEMA TERMINAL icons.
X / Telegram / Chart cards stay untouched. */
/* Reset wrong social-card icon animations from previous attempts */
#community .aka-social-card > div:first-child,
#community .aka-social-card > div:first-child::after,
#community .aka-social-card > div:first-child svg,
#community .aka-social-x > div:first-child span {
animation: none !important;
transform: none !important;
filter: none !important;
}
/* Terminal icon base: stable, no disappearing, no random glow explosion */
#akaLiveTerminal .aka-terminal-cell svg,
#akaLiveTerminal .aka-terminal-cell i {
opacity: 1 !important;
transform-origin: center !important;
transform-box: fill-box !important;
animation: none !important;
}
/* HOLDERS + VAULTS UNSEALED stay alive visually, but do not move */
#akaLiveTerminal .aka-terminal-cell-holders svg,
#akaLiveTerminal .aka-terminal-cell-holders i,
#akaLiveTerminal .aka-terminal-cell-recovered svg,
#akaLiveTerminal .aka-terminal-cell-recovered i {
animation: none !important;
transform: none !important;
filter:
drop-shadow(0 0 7px rgba(212,168,67,0.16))
drop-shadow(0 0 12px rgba(212,168,67,0.08)) !important;
}
/* CURRENT ACT: radio broadcast breathing, no spinning, no disappearing */
#akaLiveTerminal .aka-terminal-cell-act svg,
#akaLiveTerminal .aka-terminal-cell-act i {
color: rgba(255,105,128,0.96) !important;
animation: akaTerminalRadioBroadcastClean 2.15s ease-in-out infinite !important;
}
@keyframes akaTerminalRadioBroadcastClean {
0%, 100% {
transform: scale(1);
filter:
drop-shadow(0 0 6px rgba(255,45,85,0.22))
drop-shadow(0 0 12px rgba(255,45,85,0.10));
}
35% {
transform: scale(1.08);
filter:
drop-shadow(0 0 10px rgba(255,45,85,0.38))
drop-shadow(0 0 18px rgba(255,45,85,0.18));
}
58% {
transform: scale(1.02);
filter:
drop-shadow(0 0 7px rgba(255,45,85,0.26))
drop-shadow(0 0 14px rgba(255,45,85,0.12));
}
}
/* SIGNAL: replace rotating/waving SVG with real animated signal bars */
#akaLiveTerminal .aka-terminal-cell-signal {
position: relative;
}
/* Custom signal-bars icon */
#akaLiveTerminal .aka-terminal-cell-signal::before {
content: "";
width: 1.25rem;
height: 1.25rem;
flex: 0 0 1.25rem;
display: block;
color: rgba(99,210,255,0.96);
background:
linear-gradient(currentColor 0 0) 0% 100% / 3px 35% no-repeat,
linear-gradient(currentColor 0 0) 33% 100% / 3px 58% no-repeat,
linear-gradient(currentColor 0 0) 66% 100% / 3px 78% no-repeat,
linear-gradient(currentColor 0 0) 100% 100% / 3px 100% no-repeat;
filter:
drop-shadow(0 0 7px rgba(99,210,255,0.28))
drop-shadow(0 0 14px rgba(99,210,255,0.14));
animation: akaTerminalSignalBarsClean 2.4s ease-in-out infinite;
}
/* Bars go from low to high, then change pattern. No rotation, no opacity drop. */
@keyframes akaTerminalSignalBarsClean {
0%, 100% {
background-size:
3px 35%,
3px 58%,
3px 78%,
3px 100%;
}
28% {
background-size:
3px 55%,
3px 78%,
3px 100%,
3px 72%;
}
55% {
background-size:
3px 78%,
3px 100%,
3px 56%,
3px 84%;
}
78% {
background-size:
3px 48%,
3px 88%,
3px 68%,
3px 100%;
}
}
/* COMMUNITY STATUS: heartbeat action, no disappearing, no half-broken glow */
#akaLiveTerminal .aka-terminal-cell-community svg,
#akaLiveTerminal .aka-terminal-cell-community i {
color: rgba(74,222,128,0.94) !important;
animation: akaTerminalHeartbeatClean 2.25s ease-in-out infinite !important;
}
@keyframes akaTerminalHeartbeatClean {
0%, 100% {
transform: scale(1);
filter:
drop-shadow(0 0 6px rgba(74,222,128,0.20))
drop-shadow(0 0 12px rgba(74,222,128,0.08));
}
12% {
transform: scale(1.10);
}
22% {
transform: scale(0.98);
}
34% {
transform: scale(1.07);
filter:
drop-shadow(0 0 9px rgba(74,222,128,0.34))
drop-shadow(0 0 16px rgba(74,222,128,0.14));
}
48% {
transform: scale(1);
}
}
/* Mobile: keep effects calmer */
@media (max-width: 767px) {
#akaLiveTerminal .aka-terminal-cell-act svg,
#akaLiveTerminal .aka-terminal-cell-act i,
#akaLiveTerminal .aka-terminal-cell-community svg,
#akaLiveTerminal .aka-terminal-cell-community i {
animation-duration: 2.8s !important;
}
#akaLiveTerminal .aka-terminal-cell-signal::before {
animation-duration: 3s !important;
}
}
/* Accessibility */
@media (prefers-reduced-motion: reduce) {
#akaLiveTerminal .aka-terminal-cell svg,
#akaLiveTerminal .aka-terminal-cell i,
#akaLiveTerminal .aka-terminal-cell-signal::before {
animation: none !important;
}
}
/* =========================================================
VAULT DEPTH + SEALED FUTURE SECTOR
Legacy modal tuning kept in place because these selectors are tied to
archive modal state and should not be moved during a performance-only pass.
========================================================= */
/* ===== VAULT MODAL: LESS EMPTY, MORE CINEMATIC ===== */
.aka-vault-header {
padding-bottom: 1.25rem !important;
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.10), transparent 42%),
radial-gradient(circle at 18% 12%, rgba(255,45,85,0.06), transparent 34%),
linear-gradient(180deg, rgba(255,255,255,0.022), rgba(0,0,0,0.12)),
rgba(0,0,0,0.20) !important;
}
.aka-vault-header::before {
content: "";
position: absolute;
left: 8%;
right: 8%;
bottom: 0.72rem;
height: 1px;
pointer-events: none;
background:
linear-gradient(
90deg,
transparent,
rgba(255,45,85,0.42),
rgba(212,168,67,0.54),
rgba(74,222,128,0.34),
transparent
);
box-shadow:
0 0 10px rgba(212,168,67,0.20),
0 0 22px rgba(255,45,85,0.10);
opacity: 0.85;
}
.aka-vault-header::after {
content: "";
position: absolute;
left: 50%;
bottom: 0.42rem;
width: min(18rem, 68%);
height: 2.4rem;
transform: translateX(-50%);
pointer-events: none;
opacity: 0.22;
background:
repeating-linear-gradient(
90deg,
transparent 0 8px,
rgba(74,222,128,0.26) 8px 10px,
transparent 10px 18px
);
filter: blur(0.2px) drop-shadow(0 0 10px rgba(74,222,128,0.18));
animation: akaVaultHeaderDataRun 3.8s linear infinite;
}
.aka-vault-content {
padding-top: 0.78rem !important;
}
.aka-vault-grid-separator {
position: relative;
min-height: 2.75rem;
margin: 0 0 1.05rem !important;
padding: 0.68rem 0.85rem;
border: 1px solid rgba(74,222,128,0.18);
background:
radial-gradient(circle at 50% 50%, rgba(74,222,128,0.09), transparent 58%),
linear-gradient(90deg, rgba(255,45,85,0.055), rgba(0,0,0,0.20), rgba(74,222,128,0.055));
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.035),
0 0 18px rgba(74,222,128,0.08),
0 0 24px rgba(255,45,85,0.045);
overflow: hidden;
}
.aka-vault-grid-separator span {
position: relative;
z-index: 2;
color: rgba(196,255,219,0.88);
text-shadow:
0 0 8px rgba(74,222,128,0.30),
0 0 18px rgba(74,222,128,0.14);
}
.aka-vault-grid-separator::before {
content: "";
position: absolute;
inset: 0 auto 0 -36%;
width: 34%;
flex: none;
height: auto;
background:
linear-gradient(
90deg,
transparent,
rgba(74,222,128,0.20),
rgba(212,168,67,0.10),
transparent
);
opacity: 0.9;
transform: skewX(-18deg);
animation: akaVaultGridSweep 2.8s linear infinite;
}
.aka-vault-grid-separator::after {
content: "";
position: absolute;
left: 0.85rem;
right: 0.85rem;
bottom: 0.38rem;
flex: none;
height: 1px;
background:
linear-gradient(
90deg,
transparent,
rgba(255,45,85,0.34),
rgba(212,168,67,0.48),
rgba(74,222,128,0.34),
transparent
);
box-shadow: 0 0 10px rgba(74,222,128,0.18);
}
/* ===== FAN CLUB SOCIAL SOFT HOVER ===== */
@media (hover: hover) and (pointer: fine) {
#xLink:hover,
#telegramLink:hover,
#chartLink:hover {
transform: translateY(-1.55px) scale(1.006) translateZ(0) !important;
filter: brightness(1.045) saturate(1.02) !important;
}
}
#xLink:active,
#telegramLink:active,
#chartLink:active {
transform: translateY(0.35px) scale(0.993) translateZ(0) !important;
filter: brightness(0.98) !important;
transition-duration: 220ms !important;
}
@media (hover: none), (pointer: coarse) {
#xLink:hover,
#telegramLink:hover,
#chartLink:hover {
transform: none !important;
filter: none !important;
}
#community .aka-social-card:hover::after {
left: -45%;
opacity: 0;
}
#community .aka-social-card:hover > div:first-child {
animation: akaSocialIconIdle 5.6s ease-in-out infinite !important;
}
#community .aka-social-x:hover > div:first-child {
animation-name: akaSocialXIdleGlow !important;
}
#community .aka-social-card:hover > div:first-child svg {
animation: akaSocialGlyphIdle 4.8s ease-in-out infinite !important;
}
#community .aka-social-x:hover > div:first-child span {
animation: akaSocialXGlyphIdle 4.4s ease-in-out infinite !important;
}
}
/* ===== KEYFRAMES ===== */
@keyframes akaVaultHeaderDataRun {
0% {
background-position: 0 0;
opacity: 0.12;
}
50% {
opacity: 0.30;
}
100% {
background-position: 7rem 0;
opacity: 0.12;
}
}
@keyframes akaVaultGridSweep {
0% {
left: -36%;
opacity: 0;
}
18% {
opacity: 0.85;
}
100% {
left: 126%;
opacity: 0;
}
}
/* ===== MOBILE VAULT: KEEP IT COMPACT ===== */
@media (max-width: 767px) {
.aka-vault-header {
padding-bottom: 1rem !important;
}
.aka-vault-grid-separator {
min-height: 2.35rem;
padding: 0.58rem 0.65rem;
letter-spacing: 0.12em !important;
}
.aka-vault-grid-separator span {
font-size: 0.52rem;
}
}
/* =========================================================
MOBILE REWARD / CLASSIFIED SIGNALS
========================================================= */
@media (max-width: 767px) {
@keyframes akaMobileRewardChipSoftPulse {
0%, 100% {
filter: brightness(1);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.08),
0 0 14px rgba(236,202,132,0.18),
0 0 28px rgba(212,168,67,0.08),
0 10px 28px rgba(0,0,0,0.30);
}
50% {
filter: brightness(1.045);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.10),
0 0 20px rgba(236,202,132,0.34),
0 0 42px rgba(212,168,67,0.16),
0 10px 28px rgba(0,0,0,0.30);
}
}
@keyframes akaMobileClassifiedChipSoftPulse {
0%, 100% {
filter: brightness(1);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.08),
0 0 14px rgba(94,234,212,0.16),
0 0 28px rgba(74,168,255,0.08),
0 10px 28px rgba(0,0,0,0.30);
}
50% {
filter: brightness(1.045);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.10),
0 0 20px rgba(94,234,212,0.30),
0 0 42px rgba(74,168,255,0.15),
0 10px 28px rgba(0,0,0,0.30);
}
}
#mobileTopbarReward,
#mobileTopbarClassified,
#mobileMenu .aka-reward-chip,
#mobileMenu .aka-classified-chip,
#mobileMenu .aka-wallet-reward-action,
#mobileMenu .aka-wallet-classified-action {
transition:
transform 90ms ease,
filter 90ms ease,
box-shadow 220ms ease !important;
transform-origin: center;
}
#mobileTopbarReward.is-claimable,
#mobileTopbarReward.is-ready,
#mobileMenu .aka-reward-chip.is-claimable,
#mobileMenu .aka-reward-chip.is-ready,
#mobileMenu .aka-wallet-reward-action.is-claimable,
#mobileMenu .aka-wallet-reward-action.is-ready {
border-color: rgba(236,202,132,0.48) !important;
animation: akaMobileRewardChipSoftPulse 2.55s ease-in-out infinite !important;
}
#mobileTopbarClassified.is-active,
#mobileTopbarClassified.is-ready,
#mobileMenu .aka-classified-chip.is-active,
#mobileMenu .aka-classified-chip.is-ready,
#mobileMenu .aka-wallet-classified-action.is-active,
#mobileMenu .aka-wallet-classified-action.is-ready {
border-color: rgba(94,234,212,0.46) !important;
animation: akaMobileClassifiedChipSoftPulse 2.65s ease-in-out infinite !important;
}
#mobileTopbarReward:active,
#mobileTopbarClassified:active,
#mobileMenu .aka-reward-chip:active,
#mobileMenu .aka-classified-chip:active,
#mobileMenu .aka-wallet-reward-action:active,
#mobileMenu .aka-wallet-classified-action:active {
transform: scale(0.995) !important;
filter: brightness(0.985) !important;
transition-duration: 90ms !important;
}
}
/* ===== TARGETED PREMIUM CONTROL MOTION ===== */
/* Clean replacement for interactive control motion. No stacked override layer. */
:root {
--aka-control-ease: cubic-bezier(0.20, 0.90, 0.24, 1);
--aka-control-hover-y: -1.55px;
--aka-control-hover-scale: 1.006;
--aka-control-press-y: 0.35px;
--aka-control-press-scale: 0.993;
--aka-menu-hover-x: -1.4px;
--aka-nav-label-hover-y: -0.55px;
--aka-nav-label-hover-scale: 1.001;
/* Language is the canonical physical press model for SEALED controls. */
--aka-premium-press-rest: translateY(0) scale(1) translateZ(0);
--aka-premium-press-hover: translateY(-0.95px) scale(1.007) translateZ(0);
--aka-premium-press-down: translateY(0.35px) scale(0.994) translateZ(0);
--aka-premium-press-ease: var(--aka-control-ease);
--aka-premium-press-motion-ms: 640ms;
--aka-premium-press-down-ms: 220ms;
--aka-sealed-glow-in-ms: 120ms;
--aka-sealed-glow-out-ms: 820ms;
}
#buyLinkCTA,
#buyLinkHero,
#watchTrailerBtn,
#whitepaperLink,
#hero a[href="#gallery"],
#hero a[href="#story"],
#walletConnectBtn,
#walletDropdownRewardBtn,
#walletDropdownClassifiedBtn,
#walletDropdownDisconnectBtn,
#mobileMenuBtn,
#mobileMenu a[data-mobile-menu-close],
#mobileMenu button[data-mobile-menu-close],
[data-staging-modal-close],
[data-scroll-to-archives],
.aka-wallet-gate-action,
.aka-file-requirement-close,
#gallery .poster-card[data-archive] .archive-access-cta {
transform: translateY(0) scale(1) translateZ(0);
transform-origin: center;
will-change: transform, filter;
transition:
transform 520ms cubic-bezier(0.22, 1, 0.36, 1),
filter 520ms ease,
box-shadow 600ms ease,
border-color 560ms ease,
background 560ms ease,
color 500ms ease,
text-shadow 540ms ease;
}
.modal-close {
transform: none !important;
will-change: filter, border-color, box-shadow;
}
#navbar .aka-language-button {
transform-origin: center;
will-change: transform, filter;
}
#navbar .aka-language-button {
transition:
transform 640ms var(--aka-control-ease),
filter 560ms ease,
box-shadow 620ms ease,
border-color 580ms ease,
background 580ms ease,
color 520ms ease;
}
#languageMenu button {
transform-origin: center left;
transition:
transform 420ms var(--aka-control-ease),
filter 380ms ease,
color 380ms ease,
background 380ms ease;
}
@media (any-hover: hover) {
#buyLinkCTA:hover,
#buyLinkHero:hover,
#watchTrailerBtn:hover,
#whitepaperLink:hover,
#hero a[href="#gallery"]:hover,
#hero a[href="#story"]:hover,
#walletConnectBtn:hover,
#walletDropdownRewardBtn:hover,
#walletDropdownClassifiedBtn:hover,
#walletDropdownDisconnectBtn:hover,
#mobileMenuBtn:hover,
#mobileMenu a[data-mobile-menu-close]:hover,
#mobileMenu button[data-mobile-menu-close]:hover,
[data-staging-modal-close]:hover,
[data-scroll-to-archives]:hover,
.aka-wallet-gate-action:hover,
.aka-file-requirement-close:hover,
#gallery .poster-card[data-archive] .archive-access-cta:hover {
transform: translateY(var(--aka-control-hover-y)) scale(var(--aka-control-hover-scale)) translateZ(0) !important;
filter: brightness(1.045) saturate(1.02) !important;
}
#buyLinkCTA:hover,
#buyLinkHero:hover,
#watchTrailerBtn:hover,
.aka-wallet-gate-action:hover,
.aka-file-requirement-close:hover,
[data-staging-modal-close]:hover {
box-shadow:
0 0 16px rgba(212,168,67,0.22),
0 0 30px rgba(255,45,85,0.14),
0 14px 36px rgba(0,0,0,0.44) !important;
}
[data-staging-modal-close]:hover,
[data-scroll-to-archives]:hover {
border-color: rgba(212,168,67,0.78) !important;
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.16), transparent 62%),
linear-gradient(180deg, rgba(212,168,67,0.13), rgba(8,8,8,0.28)) !important;
}
.modal-close:hover {
transform: none !important;
}
#navbar .aka-language-button:hover,
#navbar .aka-language-button.is-open {
transform: translateY(-0.95px) scale(1.007) translateZ(0) !important;
filter: brightness(1.05) !important;
}
#languageMenu button:hover {
transform: translateX(var(--aka-menu-hover-x)) translateY(-0.6px) scale(1.004) translateZ(0) !important;
filter: brightness(1.045) !important;
}
#gallery .poster-card[data-archive]:hover .archive-access-cta {
transform: translateY(0) scale(1) translateZ(0) !important;
filter: brightness(1.012) !important;
}
#gallery .poster-card[data-archive] .archive-access-cta:hover {
transform: translateY(var(--aka-control-hover-y)) scale(var(--aka-control-hover-scale)) translateZ(0) !important;
filter: brightness(1.045) saturate(1.02) !important;
}
}
#buyLinkCTA:active,
#buyLinkHero:active,
#watchTrailerBtn:active,
#whitepaperLink:active,
#hero a[href="#gallery"]:active,
#hero a[href="#story"]:active,
#walletConnectBtn:active,
#walletDropdownRewardBtn:active,
#walletDropdownClassifiedBtn:active,
#walletDropdownDisconnectBtn:active,
#mobileMenuBtn:active,
#mobileMenu a[data-mobile-menu-close]:active,
#mobileMenu button[data-mobile-menu-close]:active,
[data-staging-modal-close]:active,
[data-scroll-to-archives]:active,
.aka-wallet-gate-action:active,
.aka-file-requirement-close:active,
#gallery .poster-card[data-archive] .archive-access-cta:active,
#gallery .poster-card[data-archive] .archive-access-cta.archive-press {
transform: translateY(var(--aka-control-press-y)) scale(var(--aka-control-press-scale)) translateZ(0) !important;
filter: brightness(0.982) saturate(0.992) !important;
transition-duration: 220ms !important;
transition-timing-function: var(--aka-control-ease) !important;
}
.modal-close:active {
transform: none !important;
filter: brightness(1.02) saturate(1.01) !important;
transition-duration: 220ms !important;
}
#navbar .aka-language-button:active,
#languageMenu button:active {
transform: translateY(0.35px) scale(0.994) translateZ(0) !important;
filter: brightness(0.986) !important;
transition-duration: 220ms !important;
}
#gallery .poster-card[data-archive] .archive-access-cta.archive-release {
transform: translateY(0) scale(1) translateZ(0) !important;
filter: brightness(1.01) !important;
transition-duration: 360ms !important;
transition-timing-function: var(--aka-control-ease) !important;
}
@media (hover: none), (pointer: coarse) {
#buyLinkCTA,
#buyLinkHero,
#watchTrailerBtn,
#whitepaperLink,
#hero a[href="#gallery"],
#hero a[href="#story"],
#navbar .aka-nav-cinema-segment > a,
#navbar .aka-language-button,
#languageMenu button,
#walletConnectBtn,
#walletDropdownRewardBtn,
#walletDropdownClassifiedBtn,
#walletDropdownDisconnectBtn,
#mobileMenuBtn,
#mobileMenu a[data-mobile-menu-close],
#mobileMenu button[data-mobile-menu-close],
[data-staging-modal-close],
[data-scroll-to-archives],
.aka-wallet-gate-action,
.aka-file-requirement-close,
#gallery .poster-card[data-archive] .archive-access-cta {
transition-duration: 330ms !important;
}
.modal-close {
transform: none !important;
transition-duration: 320ms !important;
}
#buyLinkCTA:active,
#buyLinkHero:active,
#watchTrailerBtn:active,
#whitepaperLink:active,
#hero a[href="#gallery"]:active,
#hero a[href="#story"]:active,
#navbar .aka-language-button:active,
#languageMenu button:active,
#walletConnectBtn:active,
#walletDropdownRewardBtn:active,
#walletDropdownClassifiedBtn:active,
#walletDropdownDisconnectBtn:active,
#mobileMenuBtn:active,
#mobileMenu a[data-mobile-menu-close]:active,
#mobileMenu button[data-mobile-menu-close]:active,
[data-staging-modal-close]:active,
[data-scroll-to-archives]:active,
.aka-wallet-gate-action:active,
.aka-file-requirement-close:active,
#gallery .poster-card[data-archive] .archive-access-cta:active,
#gallery .poster-card[data-archive] .archive-access-cta.archive-press {
transform: translateY(0.35px) scale(0.994) translateZ(0) !important;
filter: brightness(0.986) !important;
transition-duration: 220ms !important;
}
.modal-close:active {
transform: none !important;
filter: brightness(1.02) !important;
}
}
button:disabled,
button.is-done,
.is-done,
.cursor-default {
transform: none !important;
filter: none !important;
}
/* X close buttons glow only. They must not lift, shrink, or rotate. */
.modal-close,
.modal-close:hover,
.modal-close:active,
.modal-close:focus-visible,
#modalContent .modal-close,
#modalContent .modal-close:hover,
#modalContent .modal-close:active,
#modalContent .modal-close:focus-visible {
transform: none !important;
}
/* ===== WALLET MINI ACTION DELAY PRESS HOLD ===== */
#walletDropdownRewardBtn.aka-wallet-mini-action-wait,
#walletDropdownClassifiedBtn.aka-wallet-mini-action-wait {
transform: translateY(0) scale(0.972) translateZ(0) !important;
filter: brightness(0.965) saturate(0.98) !important;
transition-duration: 140ms !important;
}
/* =========================================================
NIGHT OF THE KAKA: OLD CINEMA ARCHIVE
Header status under Chapter IV + one-shot hero-style film reel.
========================================================= */
.night-kaka-cinematic-archive {
position: relative;
isolation: isolate;
overflow-x: hidden;
overflow-y: auto;
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.055), transparent 34%),
radial-gradient(circle at 18% 28%, rgba(139,0,0,0.18), transparent 32%),
linear-gradient(180deg, #050202 0%, #090404 42%, #050202 100%) !important;
}
.night-kaka-cinematic-bg {
position: absolute;
left: 0;
right: 0;
top: 43px;
height: 326px;
z-index: 0;
pointer-events: none;
overflow: hidden;
}
.night-kaka-cinematic-bg::before {
content: "";
position: absolute;
inset: 0;
background-image:
var(--archive-hero-image),
var(--archive-hero-fallback-image),
url("../images/ui/night-mullero-cinematic-bg.webp");
background-size: 84% auto;
background-position: center top;
background-repeat: no-repeat;
opacity: 0.94;
filter: brightness(1.08) contrast(1.06) saturate(1.08);
}
.night-kaka-cinematic-bg::after {
content: "";
position: absolute;
inset: 0;
background:
linear-gradient(180deg, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.08) 43%, rgba(5,2,2,0.89) 100%),
linear-gradient(90deg, rgba(0,0,0,0.52) 0%, transparent 18%, transparent 82%, rgba(0,0,0,0.52) 100%);
}
.night-kaka-cinematic-archive > :not(.night-kaka-cinematic-bg) {
position: relative;
z-index: 2;
}
.night-kaka-cinematic-archive::before,
.night-kaka-cinematic-archive::after {
content: none !important;
display: none !important;
animation: none !important;
}
.night-kaka-cinematic-archive .aka-vault-topbar {
background:
linear-gradient(180deg, rgba(0,0,0,0.94), rgba(5,2,2,0.88)) !important;
border-bottom-color: rgba(212,168,67,0.24) !important;
box-shadow:
0 1px 0 rgba(255,232,176,0.035),
0 12px 28px rgba(0,0,0,0.42) !important;
}
.night-kaka-cinematic-archive .aka-vault-topbar-left,
.night-kaka-cinematic-archive .aka-vault-topbar-right {
color: rgba(255,232,176,0.66) !important;
text-shadow: 0 0 8px rgba(212,168,67,0.11) !important;
}
.night-kaka-cinematic-archive .aka-vault-topbar-right {
letter-spacing: 0.24em !important;
}
.night-kaka-cinematic-archive .aka-vault-header {
min-height: 326px;
padding-bottom: 3.15rem !important;
background:
linear-gradient(180deg, rgba(0,0,0,0.07) 0%, rgba(0,0,0,0.16) 48%, rgba(5,2,2,0.83) 100%) !important;
border-bottom-color: rgba(212,168,67,0.16) !important;
}
.night-kaka-cinematic-archive .aka-vault-header::before,
.night-kaka-cinematic-archive .aka-vault-header::after {
content: none !important;
display: none !important;
animation: none !important;
}
.night-kaka-cinematic-archive .aka-vault-header > .relative.z-10 {
z-index: 3;
}
.night-kaka-cinematic-archive .aka-vault-verified {
color: rgba(255,232,176,0.86) !important;
text-shadow:
0 0 8px rgba(0,0,0,0.88),
0 0 10px rgba(212,168,67,0.16) !important;
}
.night-kaka-cinematic-archive .aka-vault-title {
text-shadow:
0 0 12px rgba(0,0,0,0.96),
0 0 22px rgba(0,0,0,0.72),
0 0 18px rgba(212,168,67,0.12) !important;
}
.night-kaka-cinematic-archive .aka-vault-chapter {
color: rgba(255,232,176,0.66) !important;
text-shadow:
0 0 8px rgba(0,0,0,0.92),
0 0 11px rgba(212,168,67,0.12) !important;
}
/* Recovery count now lives centered under CHAPTER IV: no icon, no hard box. */
.night-kaka-cinematic-archive .aka-vault-counter-under-chapter {
display: inline-flex;
align-items: center;
justify-content: center;
margin: 1rem auto 0;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
font-family: 'Special Elite', monospace;
font-size: clamp(0.68rem, 0.78vw, 0.84rem) !important;
letter-spacing: 0.18em !important;
line-height: 1.35;
color: rgba(255,232,176,0.86) !important;
text-align: center;
text-transform: uppercase;
text-shadow:
0 0 8px rgba(0,0,0,0.96),
0 0 14px rgba(212,168,67,0.18) !important;
}
.night-kaka-cinematic-archive .aka-vault-counter-under-chapter svg,
.night-kaka-cinematic-archive .aka-vault-counter-under-chapter i {
display: none !important;
}
/* Fallback: if older Night markup still creates a corner counter, make it behave like the centered version. */
.night-kaka-cinematic-archive .aka-vault-counter-corner {
position: relative !important;
right: auto !important;
bottom: auto !important;
z-index: 5;
display: inline-flex;
align-items: center;
justify-content: center;
max-width: 100%;
margin: 1rem auto 0;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: rgba(255,232,176,0.86) !important;
text-align: center;
text-shadow:
0 0 8px rgba(0,0,0,0.96),
0 0 14px rgba(212,168,67,0.18) !important;
}
.night-kaka-cinematic-archive .aka-vault-counter-corner svg {
display: none !important;
}
/* Old-cinema summary: less sci-fi blue, more dusty projector archive. */
.night-kaka-cinematic-archive .aka-vault-content {
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.040), transparent 38%),
linear-gradient(180deg, rgba(5,2,2,0.94), rgba(5,5,5,0.98)) !important;
}
.night-kaka-cinematic-archive .aka-vault-summary {
margin-bottom: 1.05rem !important;
padding: 0.85rem 1rem;
border: 1px solid rgba(212,168,67,0.11);
background:
linear-gradient(180deg, rgba(212,168,67,0.025), rgba(0,0,0,0.12)),
rgba(5,5,5,0.46);
box-shadow:
inset 0 1px 0 rgba(255,232,176,0.025),
0 14px 34px rgba(0,0,0,0.20);
}
.night-kaka-cinematic-archive .aka-vault-summary .aka-vault-chip {
color: rgba(255,232,176,0.84) !important;
border-color: rgba(212,168,67,0.20) !important;
background: rgba(212,168,67,0.055) !important;
box-shadow: 0 0 12px rgba(212,168,67,0.10) !important;
}
.night-kaka-cinematic-archive .aka-vault-summary p,
.night-kaka-cinematic-archive #archiveCompletionCountMeta {
color: rgba(255,232,176,0.47) !important;
text-shadow: 0 0 8px rgba(0,0,0,0.70) !important;
}
/* Hero-style film strip: same base classes, one quick roll, then it stands still. */
.night-kaka-cinematic-archive .aka-vault-grid-film-reel {
position: relative;
margin: 0 0 1.35rem;
overflow: hidden;
border: 1px solid rgba(212,168,67,0.15);
border-left-color: rgba(139,0,0,0.28);
border-right-color: rgba(139,0,0,0.28);
background: rgba(0,0,0,0.88);
box-shadow:
inset 0 1px 0 rgba(255,232,176,0.035),
inset 0 -1px 0 rgba(139,0,0,0.16),
0 0 22px rgba(0,0,0,0.30);
transform: translateZ(0);
contain: paint;
}
.night-kaka-cinematic-archive .aka-vault-grid-film-reel::before,
.night-kaka-cinematic-archive .aka-vault-grid-film-reel::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
z-index: 2;
width: 18%;
pointer-events: none;
}
.night-kaka-cinematic-archive .aka-vault-grid-film-reel::before {
left: 0;
background: linear-gradient(90deg, rgba(5,2,2,0.98), transparent);
}
.night-kaka-cinematic-archive .aka-vault-grid-film-reel::after {
right: 0;
background: linear-gradient(270deg, rgba(5,2,2,0.98), transparent);
}
.night-kaka-cinematic-archive .aka-vault-grid-film-reel .film-strip-holes {
height: 11px;
opacity: 0.76;
background-color: #050202 !important;
filter: brightness(0.92) contrast(1.08);
}
.night-kaka-cinematic-archive .aka-vault-grid-film-reel .film-strip {
height: 27px;
background-color: #050202 !important;
background-position: 0 0;
filter: brightness(0.92) contrast(1.08);
will-change: background-position, filter;
animation: akaFilmStripRoll 1.75s cubic-bezier(0.22, 1, 0.36, 1) both !important;
}
/* Keep old separator invisible in Night if browser cache still has older JS. */
.night-kaka-cinematic-archive .aka-vault-grid-separator {
display: none !important;
}
.night-kaka-cinematic-archive .aka-archive-grid {
padding-top: 0.25rem;
}
.night-kaka-cinematic-archive .aka-archive-file-card {
border-color: rgba(212,168,67,0.28) !important;
border-radius: 18px !important;
background:
linear-gradient(180deg, rgba(212,168,67,0.025), rgba(0,0,0,0.22)),
rgba(5,5,5,0.92) !important;
box-shadow:
0 18px 42px rgba(0,0,0,0.58) !important;
overflow: hidden;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card img {
border-radius: 14px !important;
background: #050202 !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card:hover {
border-color: rgba(212,168,67,0.52) !important;
box-shadow:
0 0 18px rgba(212,168,67,0.16),
0 0 28px rgba(139,0,0,0.24),
0 20px 54px rgba(0,0,0,0.72) !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-recovered {
border-color: rgba(212,168,67,0.44) !important;
background:
linear-gradient(180deg, rgba(212,168,67,0.035), rgba(0,0,0,0.22)),
rgba(5,5,5,0.90) !important;
box-shadow:
0 0 14px rgba(212,168,67,0.12),
0 18px 42px rgba(0,0,0,0.58) !important;
}
.night-kaka-cinematic-archive .aka-archive-recovered-badge {
border-color: rgba(212,168,67,0.42) !important;
background: rgba(212,168,67,0.10) !important;
box-shadow:
0 0 10px rgba(212,168,67,0.16) !important;
border-radius: 10px !important;
}
.night-kaka-cinematic-archive .aka-archive-recovered-badge span {
color: rgba(255,232,176,0.96) !important;
text-shadow: 0 0 8px rgba(212,168,67,0.28) !important;
}
.night-kaka-cinematic-archive .aka-archive-recover-btn.is-done {
border-color: rgba(212,168,67,0.42) !important;
background: rgba(212,168,67,0.10) !important;
color: rgba(255,232,176,0.96) !important;
box-shadow: 0 0 10px rgba(212,168,67,0.16) !important;
filter: none !important;
border-radius: 12px !important;
}
/* ===== NIGHT SEALED POSTER OVERLAY: FILM REEL LOCK ===== */
.night-kaka-cinematic-archive .aka-vault-state-label {
color: #FF2D55 !important;
opacity: 1 !important;
text-shadow:
0 0 5px rgba(255,45,85,0.76),
0 0 12px rgba(255,45,85,0.44),
0 0 24px rgba(139,0,0,0.36),
0 0 40px rgba(139,0,0,0.20) !important;
}
.night-kaka-cinematic-archive .aka-vault-summary .aka-vault-chip {
color: rgba(255,232,176,0.90) !important;
border-color: rgba(212,168,67,0.26) !important;
background:
linear-gradient(180deg, rgba(212,168,67,0.075), rgba(60,32,12,0.16)) !important;
box-shadow:
inset 0 0 12px rgba(212,168,67,0.035),
0 0 10px rgba(212,168,67,0.10) !important;
text-shadow: 0 0 8px rgba(212,168,67,0.20) !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed {
border-color: rgba(212,168,67,0.34) !important;
box-shadow:
inset 0 0 0 1px rgba(255,232,176,0.018),
0 0 14px rgba(139,0,0,0.20),
0 18px 46px rgba(0,0,0,0.68) !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:hover {
border-color: rgba(255,190,96,0.52) !important;
box-shadow:
0 0 16px rgba(255,45,85,0.18),
0 0 30px rgba(212,168,67,0.12),
0 20px 56px rgba(0,0,0,0.76) !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed img {
filter: blur(5px) saturate(0.42) brightness(0.62) contrast(1.12) sepia(0.10);
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-sealed-poster-veil {
background:
radial-gradient(circle at 50% 42%, rgba(255,45,85,0.105), transparent 34%),
linear-gradient(180deg, rgba(0,0,0,0.58), rgba(5,2,2,0.44) 48%, rgba(0,0,0,0.90)) !important;
}
.night-kaka-cinematic-archive .aka-archive-file-inner {
position: relative;
z-index: 6;
gap: 0.46rem;
padding: 0.78rem 0.72rem;
width: auto;
min-width: 8.35rem;
border: 1px solid rgba(212,168,67,0.22);
border-radius: 14px;
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.08), transparent 48%),
linear-gradient(180deg, rgba(11,6,4,0.72), rgba(0,0,0,0.52));
box-shadow:
0 0 15px rgba(255,45,85,0.10),
0 0 24px rgba(212,168,67,0.07),
inset 0 0 16px rgba(0,0,0,0.44);
}
.night-kaka-cinematic-archive .aka-archive-file-state {
color: #FF2D55 !important;
font-size: 0.80rem;
letter-spacing: 0.13em;
text-shadow:
0 0 5px rgba(255,45,85,0.70),
0 0 14px rgba(255,45,85,0.34),
0 0 26px rgba(139,0,0,0.28) !important;
}
.night-kaka-cinematic-archive .aka-archive-file-name {
color: rgba(255,232,176,0.74) !important;
letter-spacing: 0.07em;
text-shadow: 0 0 8px rgba(212,168,67,0.14) !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-classified .aka-archive-file-icon {
color: rgba(212,168,67,0.92) !important;
filter:
drop-shadow(0 0 7px rgba(212,168,67,0.24))
drop-shadow(0 0 14px rgba(139,0,0,0.16)) !important;
}
.night-kaka-cinematic-archive .aka-recovery-required-badge {
border-color: rgba(255,45,85,0.58) !important;
border-radius: 12px !important;
background:
linear-gradient(180deg, rgba(255,45,85,0.16), rgba(55,5,8,0.22)) !important;
box-shadow:
0 0 10px rgba(255,45,85,0.34),
0 0 24px rgba(139,0,0,0.32),
inset 0 0 14px rgba(255,45,85,0.045) !important;
backdrop-filter: blur(1px);
-webkit-backdrop-filter: blur(1px);
}
.night-kaka-cinematic-archive .aka-recovery-required-badge span {
color: #FF2D55 !important;
opacity: 1 !important;
font-size: 0.72rem !important;
letter-spacing: 0.34em !important;
text-shadow:
0 0 5px rgba(255,45,85,0.78),
0 0 13px rgba(255,45,85,0.42),
0 0 24px rgba(139,0,0,0.30) !important;
}
.night-kaka-cinematic-archive .aka-archive-recover-btn {
border-color: rgba(255,45,85,0.46) !important;
background:
linear-gradient(180deg, rgba(255,45,85,0.13), rgba(35,3,6,0.32)) !important;
color: rgba(255,238,224,0.94) !important;
box-shadow:
0 0 10px rgba(255,45,85,0.16),
inset 0 0 10px rgba(255,45,85,0.035) !important;
}
.night-kaka-cinematic-archive .aka-archive-recover-btn:hover {
border-color: rgba(255,45,85,0.68) !important;
background:
linear-gradient(180deg, rgba(255,45,85,0.20), rgba(50,4,8,0.38)) !important;
box-shadow:
0 0 14px rgba(255,45,85,0.27),
0 0 24px rgba(139,0,0,0.20) !important;
}
/* ===== NIGHT SEALED POSTER OVERLAY: CENTERED REEL ===== */
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-file-inner {
position: absolute !important;
inset: 0 !important;
z-index: 6 !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
gap: 0.38rem !important;
width: 100% !important;
min-width: 0 !important;
padding: 2.65rem 0.78rem 3.1rem !important;
border: 0 !important;
border-radius: 0 !important;
background:
radial-gradient(circle at 50% 47%, rgba(255,45,85,0.16), transparent 34%),
radial-gradient(circle at 50% 47%, rgba(212,168,67,0.10), transparent 48%),
linear-gradient(180deg, rgba(0,0,0,0.06), rgba(0,0,0,0.42)) !important;
box-shadow: none !important;
pointer-events: none !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-file-state {
font-size: 0.72rem !important;
letter-spacing: 0.18em !important;
line-height: 1 !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-file-name {
max-width: 92% !important;
font-size: 0.54rem !important;
letter-spacing: 0.06em !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-sealed-poster-veil {
z-index: 2 !important;
background:
radial-gradient(circle at 50% 48%, rgba(255,45,85,0.12), transparent 36%),
linear-gradient(180deg, rgba(0,0,0,0.50), rgba(5,2,2,0.40) 48%, rgba(0,0,0,0.84)) !important;
}
.night-kaka-cinematic-archive .aka-recovery-required-badge {
display: none !important;
}
.night-kaka-cinematic-archive .aka-archive-recovered-badge {
left: 0.52rem !important;
bottom: 0.52rem !important;
min-height: 1.28rem !important;
padding: 0.26rem 0.42rem !important;
border-radius: 9px !important;
max-width: calc(100% - 1.04rem) !important;
}
.night-kaka-cinematic-archive .aka-archive-recovered-badge span {
font-size: inherit !important;
letter-spacing: inherit !important;
line-height: inherit !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed > .absolute.inset-x-0.bottom-0 {
left: 0.52rem !important;
right: auto !important;
bottom: 0.52rem !important;
width: auto !important;
padding: 0 !important;
background: transparent !important;
z-index: 7 !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn {
width: auto !important;
min-height: 1.34rem !important;
padding: 0.28rem 0.52rem !important;
border-radius: 7px !important;
font-size: 0.48rem !important;
letter-spacing: 0.13em !important;
line-height: 1 !important;
background:
linear-gradient(180deg, rgba(255,45,85,0.10), rgba(35,3,6,0.22)) !important;
box-shadow:
0 0 7px rgba(255,45,85,0.13),
inset 0 0 8px rgba(255,45,85,0.025) !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn:hover {
transform: translateY(-1px) !important;
box-shadow:
0 0 10px rgba(255,45,85,0.20),
0 0 18px rgba(139,0,0,0.14) !important;
}
@media (max-width: 768px) {
.night-kaka-cinematic-bg {
display: block !important;
top: 38px !important;
height: clamp(250px, 82vw, 320px) !important;
opacity: 1 !important;
}
.night-kaka-cinematic-archive {
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.055), transparent 32%),
linear-gradient(180deg, #050202 0%, #0A0A0A 52%, #050202 100%) !important;
}
.night-kaka-cinematic-archive .aka-vault-topbar {
gap: 0.8rem;
}
.night-kaka-cinematic-archive .aka-vault-topbar-right {
letter-spacing: 0.14em !important;
text-align: right;
}
.night-kaka-cinematic-archive .aka-vault-header {
min-height: clamp(250px, 82vw, 320px);
padding: 2.65rem 1rem 2.15rem !important;
background:
linear-gradient(180deg, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0.16) 46%, rgba(5,2,2,0.84) 100%) !important;
}
.night-kaka-cinematic-archive .aka-archive-hero-img,
.aka-cinematic-archive:not(.is-night-reference) .aka-archive-hero-img {
top: 0 !important;
left: 50% !important;
width: 100% !important;
height: 100% !important;
max-width: none !important;
max-height: none !important;
transform: translateX(-50%) !important;
object-fit: cover !important;
object-position: center 18% !important;
opacity: 0.90 !important;
filter: brightness(1.08) contrast(1.05) saturate(1.04) !important;
}
.night-kaka-cinematic-bg::after,
.aka-cinematic-archive:not(.is-night-reference) .night-kaka-cinematic-bg::after {
background:
linear-gradient(180deg, rgba(0,0,0,0.06) 0%, rgba(0,0,0,0.12) 38%, rgba(5,2,2,0.86) 100%),
linear-gradient(90deg, rgba(0,0,0,0.26) 0%, transparent 20%, transparent 80%, rgba(0,0,0,0.26) 100%) !important;
}
.night-kaka-cinematic-archive .aka-vault-counter-under-chapter,
.night-kaka-cinematic-archive .aka-vault-counter-corner {
max-width: 100%;
justify-content: center;
margin-top: 0.85rem;
font-size: 0.66rem !important;
letter-spacing: 0.12em !important;
text-align: center;
}
.night-kaka-cinematic-archive .aka-vault-summary {
padding: 0.75rem;
margin-bottom: 0.95rem !important;
}
.night-kaka-cinematic-archive .aka-vault-grid-film-reel {
margin-bottom: 1.15rem;
}
.night-kaka-cinematic-archive .aka-vault-grid-film-reel .film-strip-holes {
height: 9px;
}
.night-kaka-cinematic-archive .aka-vault-grid-film-reel .film-strip {
height: 24px;
}
.night-kaka-cinematic-archive .aka-archive-file-inner {
min-width: 7.55rem;
padding: 0.66rem 0.58rem;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-file-inner {
padding: 2.25rem 0.58rem 2.6rem !important;
gap: 0.30rem !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-file-state {
font-size: 0.62rem !important;
}
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-file-name {
font-size: 0.46rem !important;
}
.night-kaka-cinematic-archive .aka-archive-recovered-badge,
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed > .absolute.inset-x-0.bottom-0 {
left: 0.44rem !important;
bottom: 0.44rem !important;
}
.night-kaka-cinematic-archive .aka-vault-topbar,
.night-kaka-cinematic-archive .aka-vault-content,
.night-kaka-cinematic-archive .aka-archive-file-card {
background-color: rgba(5,5,5,0.94) !important;
}
}
/* ===== NIGHT ARCHIVE SIGNAL: PREMIUM EMBER RED ===== */
.night-kaka-cinematic-archive .aka-vault-state-label {
position: relative !important;
z-index: 50 !important;
color: #d8432e !important;
opacity: 1 !important;
font-size: 11px !important;
line-height: 1.28 !important;
font-weight: 800 !important;
letter-spacing: 0.34em !important;
text-shadow:
0 1px 0 rgba(0, 0, 0, 1),
0 0 1px rgba(255, 214, 160, 0.35),
0 0 2px rgba(216, 67, 46, 0.78),
0 0 4px rgba(120, 12, 8, 0.42) !important;
filter: none !important;
mix-blend-mode: normal !important;
-webkit-font-smoothing: antialiased !important;
text-rendering: geometricPrecision !important;
}
.night-kaka-cinematic-archive .aka-vault-state-label::before {
content: "";
position: absolute;
left: 50%;
top: 50%;
z-index: -1;
width: 116%;
height: 135%;
transform: translate(-50%, -50%);
background:
radial-gradient(
ellipse at center,
rgba(120, 20, 8, 0.18),
rgba(60, 8, 4, 0.08) 48%,
transparent 74%
);
pointer-events: none;
}
/* ===== NIGHT ARCHIVE BOTTOM UNLOCK CARDS EDGE FILL ===== */
/* Keeps the small cards centered, only stretches the poster image inside */
.night-kaka-cinematic-archive .aka-archive-reel-grid .aka-archive-file-card,
.night-kaka-cinematic-archive .aka-archive-files-grid .aka-archive-file-card,
.night-kaka-cinematic-archive .aka-archive-posters-grid .aka-archive-file-card {
width: 100% !important;
margin: 0 !important;
aspect-ratio: 2 / 3 !important;
border-radius: 18px !important;
overflow: hidden !important;
padding: 0 !important;
background: #050202 !important;
}
.night-kaka-cinematic-archive.is-night-reference .aka-archive-reel-grid .aka-archive-file-card img,
.night-kaka-cinematic-archive.is-night-reference .aka-archive-files-grid .aka-archive-file-card img,
.night-kaka-cinematic-archive.is-night-reference .aka-archive-posters-grid .aka-archive-file-card img {
position: absolute !important;
top: 50% !important;
left: 50% !important;
width: 106% !important;
height: 106% !important;
transform: translate(-50%, -50%) !important;
padding: 0 !important;
margin: 0 !important;
object-fit: cover !important;
object-position: center center !important;
border-radius: inherit !important;
background: #050202 !important;
}
/* Normal sealed files stay ember red */
.night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified) .aka-archive-file-state {
color: #d8432e !important;
text-shadow:
0 0 2px rgba(216, 67, 46, 0.75),
0 0 6px rgba(120, 12, 8, 0.42) !important;
}
/* Classified / secret sealed files use the same cyan-teal family as wallet classified signal */
.night-kaka-cinematic-archive .aka-archive-file-card.is-classified.is-sealed .aka-archive-file-state {
color: rgba(182, 255, 241, 1) !important;
text-shadow:
0 0 2px rgba(182, 255, 241, 0.82),
0 0 7px rgba(68, 255, 224, 0.46),
0 0 14px rgba(74, 168, 255, 0.24) !important;
}
/* ===== NIGHT ARCHIVE BOTTOM POSTER IMAGE FILL: LEGACY MODAL PATCH ===== */
/* Kept in place to avoid changing night archive modal card layering during this pass. */
.night-kaka-cinematic-archive .aka-archive-file-card {
position: relative !important;
overflow: hidden !important;
padding: 0 !important;
border-radius: 18px !important;
background: #050202 !important;
}
.night-kaka-cinematic-archive.is-night-reference .aka-archive-file-card > img,
.night-kaka-cinematic-archive.is-night-reference .aka-archive-file-card picture > img {
position: absolute !important;
top: 50% !important;
left: 50% !important;
width: 100% !important;
height: 100% !important;
transform: translate(-50%, -50%) scale(1.08) !important;
transform-origin: center center !important;
object-fit: cover !important;
object-position: center center !important;
display: block !important;
padding: 0 !important;
margin: 0 !important;
border-radius: inherit !important;
}
/* ===== GLOBAL CINEMATIC ARCHIVE MODAL DESIGN ===== */
/* Other archive chapters reuse Night's proven modal pass with their own poster art. */
.aka-cinematic-archive:not(.is-night-reference) .night-kaka-cinematic-bg::before {
background-size: cover;
background-position: center 34%;
opacity: 0.62;
filter: brightness(0.68) contrast(1.08) saturate(0.88);
}
.aka-cinematic-archive:not(.is-night-reference) .night-kaka-cinematic-bg::after {
background:
linear-gradient(180deg, rgba(0,0,0,0.16) 0%, rgba(0,0,0,0.28) 45%, rgba(5,2,2,0.92) 100%),
linear-gradient(90deg, rgba(0,0,0,0.58) 0%, transparent 20%, transparent 80%, rgba(0,0,0,0.58) 100%);
}
/* ===== ARCHIVE HERO POSTER BALANCE: LESS ZOOM, LESS DARK ===== */
/* Unifies all archive hero posters and pulls Night poster farther back */
/* Base hero image for Night + all other archives */
.night-kaka-cinematic-bg::before {
background-image:
var(--archive-hero-image),
var(--archive-hero-fallback-image),
url("../images/ui/night-mullero-cinematic-bg.webp") !important;
background-size: 85% auto !important;
background-position: center top !important;
background-repeat: no-repeat !important;
opacity: 0.90 !important;
filter: brightness(1.16) contrast(1.05) saturate(1.02) !important;
}
/* Make other archives match Night brightness instead of being too dark */
.aka-cinematic-archive:not(.is-night-reference) .night-kaka-cinematic-bg::before {
background-size: 85% auto !important;
background-position: center top !important;
opacity: 0.90 !important;
filter: brightness(1.16) contrast(1.05) saturate(1.02) !important;
}
/* Softer cinematic overlay for Night + all archives */
.night-kaka-cinematic-bg::after,
.aka-cinematic-archive:not(.is-night-reference) .night-kaka-cinematic-bg::after {
background:
linear-gradient(
180deg,
rgba(0,0,0,0.04) 0%,
rgba(0,0,0,0.12) 46%,
rgba(5,2,2,0.76) 100%
),
linear-gradient(
90deg,
rgba(0,0,0,0.34) 0%,
transparent 22%,
transparent 78%,
rgba(0,0,0,0.34) 100%
) !important;
}
/* Mobile: still visible, but not over-zoomed */
@media (max-width: 768px) {
.night-kaka-cinematic-bg::before,
.aka-cinematic-archive:not(.is-night-reference) .night-kaka-cinematic-bg::before {
background-size: 78% auto !important;
background-position: center top !important;
opacity: 0.88 !important;
filter: brightness(1.15) contrast(1.04) saturate(1.02) !important;
}
}
/* ===== PER-ARCHIVE HERO IMAGE ===== */
/* Uses only the active archive hero image.
JS loads a safe fallback first, then swaps to the custom image only if that file exists. */
.night-kaka-cinematic-bg {
display: block !important;
position: absolute !important;
pointer-events: none !important;
}
.night-kaka-cinematic-bg::before,
.aka-cinematic-archive:not(.is-night-reference) .night-kaka-cinematic-bg::before {
content: "" !important;
background-image: var(--archive-hero-image) !important;
background-size: 85% auto !important;
background-position: center top !important;
background-repeat: no-repeat !important;
opacity: 0.90 !important;
filter: brightness(1.16) contrast(1.05) saturate(1.02) !important;
}
.night-kaka-cinematic-bg::after,
.aka-cinematic-archive:not(.is-night-reference) .night-kaka-cinematic-bg::after {
content: "" !important;
background:
linear-gradient(180deg, rgba(0,0,0,0.04) 0%, rgba(0,0,0,0.12) 46%, rgba(5,2,2,0.76) 100%),
linear-gradient(90deg, rgba(0,0,0,0.34) 0%, transparent 22%, transparent 78%, rgba(0,0,0,0.34) 100%) !important;
}
@media (max-width: 768px) {
.night-kaka-cinematic-bg {
display: block !important;
top: 38px !important;
height: 255px !important;
opacity: 1 !important;
}
.night-kaka-cinematic-bg::before,
.aka-cinematic-archive:not(.is-night-reference) .night-kaka-cinematic-bg::before {
background-image: var(--archive-hero-image) !important;
background-size: 78% auto !important;
background-position: center top !important;
background-repeat: no-repeat !important;
opacity: 0.88 !important;
filter: brightness(1.15) contrast(1.04) saturate(1.02) !important;
}
}
/* ===== ARCHIVE HERO IMAGE HARD FIX: REAL IMG, NOT CSS BACKGROUND ===== */
/* The archive hero poster is now a real ![]()
inside .night-kaka-cinematic-bg.
This avoids broken CSS variable/background-layer fallback problems and guarantees each archive can show its own hero image. */
.night-kaka-cinematic-bg {
display: block !important;
position: absolute !important;
left: 0 !important;
right: 0 !important;
top: 43px !important;
height: 326px !important;
z-index: 0 !important;
pointer-events: none !important;
overflow: hidden !important;
}
/* Disable the old pseudo-background system so it cannot hide or override the real image. */
.night-kaka-cinematic-bg::before {
content: none !important;
display: none !important;
background-image: none !important;
}
.aka-archive-hero-img {
position: absolute !important;
top: 0 !important;
left: 50% !important;
width: 85% !important;
height: auto !important;
max-width: none !important;
max-height: none !important;
transform: translateX(-50%) !important;
object-fit: contain !important;
object-position: center top !important;
display: block !important;
opacity: 0.92 !important;
filter: brightness(1.16) contrast(1.05) saturate(1.02) !important;
pointer-events: none !important;
user-select: none !important;
}
/* Other archive chapters use the same visible balance as Night, but each one receives its own src from JS. */
.aka-cinematic-archive:not(.is-night-reference) .aka-archive-hero-img {
width: 85% !important;
opacity: 0.92 !important;
filter: brightness(1.16) contrast(1.05) saturate(1.02) !important;
}
.night-kaka-cinematic-bg::after,
.aka-cinematic-archive:not(.is-night-reference) .night-kaka-cinematic-bg::after {
content: "" !important;
display: block !important;
background:
linear-gradient(180deg, rgba(0,0,0,0.04) 0%, rgba(0,0,0,0.12) 46%, rgba(5,2,2,0.76) 100%),
linear-gradient(90deg, rgba(0,0,0,0.34) 0%, transparent 22%, transparent 78%, rgba(0,0,0,0.34) 100%) !important;
}
/* ===== DOMINION HERO IMAGE DISTANCE + POSITION: REAL IMG SYSTEM ===== */
@media (min-width: 769px) {
#modalContent .aka-cinematic-archive.aka-archive-dominion .aka-archive-hero-img {
width: 80% !important;
top: 0 !important;
left: 50% !important;
transform: translate(-50%, -78px) !important;
object-fit: contain !important;
object-position: center top !important;
}
}
/* ===== ORIGIN HERO IMAGE FULL POSITION: REAL IMG SYSTEM ===== */
@media (min-width: 769px) {
#modalContent .aka-cinematic-archive.aka-archive-origin .aka-archive-hero-img {
width: 85% !important;
top: 0 !important;
left: 50% !important;
transform: translate(-50%, 1px) !important;
/* -50% = centras horizontaliai
40px lowers the photo slightly
*/
object-fit: contain !important;
object-position: center top !important;
}
}
/* =========================================================
ALL ARCHIVE HERO TEXT SYSTEM
Unifies title, archive status, signal, chapter and recovered text.
========================================================= */
@media (min-width: 769px) {
/* Main archive title: cinematic semi-outline */
#modalContent .aka-cinematic-archive .aka-vault-title,
#modalContent .aka-cinematic-archive h2 {
color: rgba(255, 245, 220, 0.22) !important;
-webkit-text-stroke: 1.15px rgba(255, 245, 220, 0.92) !important;
text-stroke: 1.15px rgba(255, 245, 220, 0.92) !important;
text-shadow:
0 2px 3px rgba(0, 0, 0, 0.95),
0 0 10px rgba(255, 245, 220, 0.22),
0 0 24px rgba(212, 168, 67, 0.14),
0 10px 24px rgba(0, 0, 0, 0.82) !important;
letter-spacing: 0.075em !important;
transform: scaleX(1.04) translateY(4px) !important;
transform-origin: center center !important;
}
/* Small top archive status text */
#modalContent .aka-cinematic-archive .aka-vault-kicker,
#modalContent .aka-cinematic-archive .aka-vault-status,
#modalContent .aka-cinematic-archive [class*="kicker"],
#modalContent .aka-cinematic-archive [class*="status"] {
color: rgba(230, 201, 122, 0.88) !important;
letter-spacing: 0.38em !important;
text-shadow:
0 0 6px rgba(212, 168, 67, 0.28),
0 0 14px rgba(212, 168, 67, 0.14),
0 2px 6px rgba(0, 0, 0, 0.85) !important;
}
/* Red / classified signal text */
#modalContent .aka-cinematic-archive .aka-classified-signal,
#modalContent .aka-cinematic-archive [class*="classified"],
#modalContent .aka-cinematic-archive [class*="signal"] {
color: rgba(255, 70, 70, 0.88) !important;
letter-spacing: 0.34em !important;
text-shadow:
0 0 5px rgba(255, 45, 85, 0.28),
0 0 12px rgba(255, 45, 85, 0.14),
0 2px 6px rgba(0, 0, 0, 0.86) !important;
}
/* Chapter + recovered counter */
#modalContent .aka-cinematic-archive .aka-vault-chapter,
#modalContent .aka-cinematic-archive .aka-vault-recovered,
#modalContent .aka-cinematic-archive [class*="chapter"],
#modalContent .aka-cinematic-archive [class*="recovered"] {
color: rgba(230, 201, 122, 0.92) !important;
letter-spacing: 0.24em !important;
text-shadow:
0 0 5px rgba(212, 168, 67, 0.26),
0 0 12px rgba(212, 168, 67, 0.12),
0 2px 8px rgba(0, 0, 0, 0.86) !important;
}
}
/* =========================================================
ARCHIVE REEL ADVANCE: ONE FRAME ROLL
Real film-strip movement, not a light sweep.
Used when an archive opens and when a new poster is recovered.
========================================================= */
#modalContent .aka-vault-grid-film-reel {
position: relative !important;
overflow: hidden !important;
transform: translateZ(0);
contain: paint;
}
/* Keep cinematic dark reel edges only. No moving light streak. */
#modalContent .aka-vault-grid-film-reel::before,
#modalContent .aka-vault-grid-film-reel::after {
content: "" !important;
position: absolute !important;
top: 0 !important;
bottom: 0 !important;
width: 18% !important;
z-index: 5 !important;
pointer-events: none !important;
}
#modalContent .aka-vault-grid-film-reel::before {
left: 0 !important;
background: linear-gradient(90deg, rgba(5,2,2,0.97), transparent) !important;
}
#modalContent .aka-vault-grid-film-reel::after {
right: 0 !important;
background: linear-gradient(270deg, rgba(5,2,2,0.97), transparent) !important;
}
#modalContent .aka-vault-grid-film-reel .film-strip,
#modalContent .aka-vault-grid-film-reel .film-strip-holes {
background-position: 0 0;
will-change: background-position, filter;
transform: translateZ(0);
}
/* One full pattern step forward.
Strip repeats every 44px; holes repeat every 32px.
When the class is removed it visually lands on the same frame, so there is no visible rewind. */
#modalContent .aka-vault-grid-film-reel .film-strip {
--aka-reel-frame-distance: -44px;
}
#modalContent .aka-vault-grid-film-reel .film-strip-holes {
--aka-reel-frame-distance: -32px;
}
@keyframes akaArchiveReelOneFrameRoll {
0% {
background-position: 0 0;
filter: brightness(0.88) contrast(1.08);
}
12% {
filter: brightness(1.10) contrast(1.12);
}
58% {
filter: brightness(1.00) contrast(1.10);
}
100% {
background-position: var(--aka-reel-frame-distance) 0;
filter: brightness(0.88) contrast(1.08);
}
}
#modalContent .aka-vault-grid-film-reel.is-reel-advancing .film-strip,
#modalContent .aka-vault-grid-film-reel.is-reel-advancing .film-strip-holes {
animation: akaArchiveReelOneFrameRoll 0.76s steps(8, end) both !important;
}
@media (prefers-reduced-motion: reduce) {
#modalContent .aka-vault-grid-film-reel.is-reel-advancing .film-strip,
#modalContent .aka-vault-grid-film-reel.is-reel-advancing .film-strip-holes {
animation: none !important;
}
}
/* ===== DESKTOP BRAND LOGO SPACING: SOFT SEPARATION ===== */
@media (min-width: 769px) {
#navbar a[href="#hero"] {
gap: 0.88rem !important;
}
}
/* =========================================================
WATCH TRAILER LOCKED MODAL: FULL WALLPAPER CONTROL
Legacy wallpaper control kept near the trailer modal rules; moving it risks
changing locked trailer and archive-progression modal layering.
========================================================= */
#modalContent .aka-trailer-locked-modal {
position: relative !important;
overflow: hidden !important;
isolation: isolate !important;
background: #0A0A0A !important;
/* Photo brightness */
--trailer-bg-opacity: 0.70;
--trailer-bg-brightness: 0.92;
--trailer-bg-contrast: 1.04;
--trailer-bg-saturation: 0.96;
/* FOTO DYDIS */
--trailer-bg-scale: 1.15;
/* REALUS FOTO JUDINIMAS */
--trailer-bg-move-x: 0px;
--trailer-bg-move-y: -34px;
/* TAMSINIMAS TEKSTUI */
--trailer-dark-overlay: 0.42;
}
#modalContent .aka-trailer-locked-bg[hidden] {
display: none !important;
}
/* Keep a simple dark layer for text */
#modalContent .aka-trailer-locked-modal::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
z-index: 1 !important;
pointer-events: none !important;
background: rgba(0, 0, 0, var(--trailer-dark-overlay)) !important;
}
/* =========================================================
WATCH TRAILER LOCKED MODAL: AAA CINEMATIC FINISH
Full-bleed poster, dark cinema edges, stronger archive warning.
========================================================= */
#modalContent .aka-trailer-locked-modal {
position: relative !important;
overflow: hidden !important;
isolation: isolate !important;
background: #0A0A0A !important;
/* Wallpaper control */
--trailer-bg-opacity: 0.74;
--trailer-bg-brightness: 0.90;
--trailer-bg-contrast: 1.08;
--trailer-bg-saturation: 0.98;
--trailer-bg-scale: 1.08;
--trailer-bg-move-x: 0px;
--trailer-bg-move-y: -18px;
/* Overall darkness */
--trailer-center-darkness: 0.24;
}
#modalContent .aka-trailer-locked-bg {
position: absolute !important;
inset: 0 !important;
z-index: 0 !important;
display: block !important;
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
object-position: center center !important;
opacity: var(--trailer-bg-opacity) !important;
filter:
brightness(var(--trailer-bg-brightness))
contrast(var(--trailer-bg-contrast))
saturate(var(--trailer-bg-saturation)) !important;
transform:
translate(
var(--trailer-bg-move-x),
var(--trailer-bg-move-y)
)
scale(var(--trailer-bg-scale)) !important;
transform-origin: center center !important;
pointer-events: none !important;
user-select: none !important;
}
/* Remove old glow layer */
#modalContent .aka-trailer-locked-modal::after {
content: none !important;
display: none !important;
}
/* Dark cinema matte, not glow */
#modalContent .aka-trailer-locked-modal::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
z-index: 1 !important;
pointer-events: none !important;
background:
radial-gradient(
ellipse at center,
rgba(0,0,0,var(--trailer-center-darkness)) 0%,
rgba(0,0,0,0.34) 46%,
rgba(0,0,0,0.76) 100%
),
linear-gradient(
90deg,
rgba(0,0,0,0.82) 0%,
rgba(0,0,0,0.25) 22%,
rgba(0,0,0,0.18) 50%,
rgba(0,0,0,0.25) 78%,
rgba(0,0,0,0.82) 100%
),
linear-gradient(
180deg,
rgba(0,0,0,0.66) 0%,
transparent 28%,
transparent 62%,
rgba(0,0,0,0.72) 100%
) !important;
}
#modalContent .aka-trailer-locked-modal > .relative {
position: relative !important;
z-index: 5 !important;
}
/* Stronger but premium archive warning */
#modalContent .aka-trailer-locked-modal .inline-flex {
border-color: rgba(255, 45, 85, 0.68) !important;
background: rgba(20, 0, 8, 0.56) !important;
box-shadow:
0 0 10px rgba(255, 45, 85, 0.28),
0 0 22px rgba(255, 45, 85, 0.18),
inset 0 0 14px rgba(255, 45, 85, 0.08) !important;
backdrop-filter: blur(3px) !important;
}
#modalContent .aka-trailer-locked-modal .inline-flex i {
color: #FF2D55 !important;
filter:
drop-shadow(0 0 5px rgba(255,45,85,0.85))
drop-shadow(0 0 12px rgba(255,45,85,0.45)) !important;
}
#modalContent .aka-trailer-locked-modal .inline-flex span {
color: rgba(255, 80, 115, 0.96) !important;
text-shadow:
0 0 4px rgba(255,45,85,0.75),
0 0 12px rgba(255,45,85,0.38),
0 0 22px rgba(255,45,85,0.18) !important;
}
#modalContent .aka-trailer-locked-modal .inline-flex:not([data-staging-modal-close]):not([data-scroll-to-archives]) {
transform: translateY(6px) !important;
}
#modalContent .aka-trailer-locked-modal [data-staging-modal-close],
#modalContent .aka-trailer-locked-modal [data-scroll-to-archives] {
transform: translateY(6px) scale(1) translateZ(0) !important;
transform-origin: center !important;
will-change: transform, filter, box-shadow !important;
transition:
transform 520ms cubic-bezier(0.22, 1, 0.36, 1),
filter 460ms ease,
box-shadow 520ms ease,
border-color 500ms ease,
background 500ms ease !important;
}
@media (any-hover: hover) {
#modalContent .aka-trailer-locked-modal [data-staging-modal-close]:hover,
#modalContent .aka-trailer-locked-modal [data-scroll-to-archives]:hover {
transform: translateY(4.45px) scale(1.006) translateZ(0) !important;
filter: brightness(1.045) saturate(1.02) !important;
box-shadow:
0 0 16px rgba(255,45,85,0.25),
0 0 30px rgba(212,168,67,0.13),
0 14px 34px rgba(0,0,0,0.44),
inset 0 0 14px rgba(255,45,85,0.07) !important;
}
}
#modalContent .aka-trailer-locked-modal [data-staging-modal-close]:active,
#modalContent .aka-trailer-locked-modal [data-scroll-to-archives]:active {
transform: translateY(6.35px) scale(0.993) translateZ(0) !important;
filter: brightness(0.98) saturate(0.996) !important;
transition-duration: 220ms !important;
}
/* =========================================================
ARCHIVE SLOT REVEAL ENGINE: SEALED COVER / BONUS SIGNAL
Unrecovered cards show the archive cover only.
Real normal/bonus/secret poster appears only after RECOVER.
========================================================= */
#modalContent .aka-archive-file-card.is-sealed img.aka-archive-sealed-cover {
filter:
blur(12px)
brightness(0.58)
contrast(1.16)
saturate(0.66) !important;
opacity: 0.42 !important;
transform: scale(1.10) !important;
}
#modalContent .aka-archive-file-card.is-sealed::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
z-index: 4 !important;
pointer-events: none !important;
background:
radial-gradient(ellipse at center, rgba(255,45,85,0.08), transparent 48%),
linear-gradient(180deg, rgba(0,0,0,0.18), rgba(0,0,0,0.72)) !important;
}
#modalContent .aka-archive-file-card.is-recovered img.aka-archive-revealed-poster {
filter: none !important;
opacity: 1 !important;
transform: scale(1) !important;
}
#modalContent .aka-archive-file-card.is-bonus-recovered {
border-color: rgba(212,168,67,0.62) !important;
box-shadow:
0 0 18px rgba(212,168,67,0.24),
0 0 38px rgba(255,45,85,0.13),
0 22px 70px rgba(0,0,0,0.86) !important;
}
#modalContent .aka-archive-file-card.is-bonus-recovered .aka-archive-recovered-badge {
border-color: rgba(212,168,67,0.72) !important;
background: rgba(36,22,4,0.86) !important;
box-shadow:
0 0 12px rgba(212,168,67,0.35),
inset 0 0 12px rgba(212,168,67,0.08) !important;
}
#modalContent .aka-archive-file-card.is-bonus-recovered .aka-archive-recovered-badge span {
color: #D4A843 !important;
text-shadow:
0 0 5px rgba(212,168,67,0.62),
0 0 14px rgba(212,168,67,0.28) !important;
}
.aka-archive-bonus-signal {
position: fixed;
left: 50%;
top: 18%;
z-index: 12050;
min-width: min(90vw, 420px);
transform: translate(-50%, -10px);
padding: 18px 22px;
text-align: center;
border: 1px solid rgba(212,168,67,0.55);
background:
radial-gradient(ellipse at center, rgba(212,168,67,0.12), transparent 64%),
rgba(7,5,3,0.94);
box-shadow:
0 0 22px rgba(212,168,67,0.28),
0 0 42px rgba(255,45,85,0.12),
inset 0 0 20px rgba(212,168,67,0.05);
backdrop-filter: blur(8px);
pointer-events: none;
opacity: 0;
animation: akaBonusSignalIn 0.42s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
.aka-archive-bonus-signal.is-leaving {
animation: akaBonusSignalOut 0.42s ease forwards;
}
.aka-archive-bonus-signal span,
.aka-archive-bonus-signal strong {
display: block;
font-family: 'Special Elite', monospace;
letter-spacing: 0.26em;
text-transform: uppercase;
}
.aka-archive-bonus-signal .aka-archive-bonus-signal-kicker {
margin-bottom: 8px;
font-size: 9px;
color: rgba(212,168,67,0.72);
}
.aka-archive-bonus-signal strong {
margin-bottom: 9px;
font-size: 13px;
color: rgba(255,245,220,0.96);
text-shadow:
0 0 7px rgba(212,168,67,0.50),
0 0 18px rgba(212,168,67,0.22);
}
.aka-archive-bonus-signal span:last-child {
font-size: 9px;
color: rgba(255,45,85,0.76);
text-shadow: 0 0 8px rgba(255,45,85,0.34);
}
@keyframes akaBonusSignalIn {
0% {
opacity: 0;
transform: translate(-50%, -18px) scale(0.96);
}
100% {
opacity: 1;
transform: translate(-50%, 0) scale(1);
}
}
@keyframes akaBonusSignalOut {
0% {
opacity: 1;
transform: translate(-50%, 0) scale(1);
}
100% {
opacity: 0;
transform: translate(-50%, -12px) scale(0.98);
}
}
/* Champagne reward burst on wallet after bonus reveal */
.aka-wallet-control.is-reward-burst {
box-shadow:
0 0 0 1px rgba(212,168,67,0.35),
0 0 18px rgba(212,168,67,0.30),
0 0 34px rgba(255,241,190,0.16),
inset 0 0 18px rgba(212,168,67,0.08) !important;
animation: akaWalletRewardBurst 1.65s ease both !important;
}
@keyframes akaWalletRewardBurst {
0%, 100% {
transform: translateZ(0);
}
30% {
transform: translateY(-1px) scale(1.018);
}
62% {
transform: translateY(0) scale(1);
}
}
@media (max-width: 768px) {
.aka-archive-bonus-signal {
top: 14%;
min-width: min(92vw, 340px);
padding: 15px 16px;
}
.aka-archive-bonus-signal strong {
font-size: 11px;
}
}
/* =========================================================
ARCHIVE SLOT REVEAL ENGINE: VISIBILITY / FIT
Fixes old Night poster-force rules from cropping revealed cards.
Sealed slots show the archive cover as mystery atmosphere.
Recovered slots show the real poster cleanly.
========================================================= */
#modalContent .aka-archive-file-card.is-sealed img.aka-archive-sealed-cover {
position: absolute !important;
top: 50% !important;
left: 50% !important;
width: 114% !important;
height: 114% !important;
object-fit: cover !important;
object-position: center center !important;
transform: translate(-50%, -50%) scale(1.02) !important;
transform-origin: center center !important;
padding: 0 !important;
margin: 0 !important;
opacity: 0.58 !important;
filter:
blur(10px)
brightness(0.74)
contrast(1.14)
saturate(0.72) !important;
display: block !important;
border-radius: inherit !important;
background: #050202 !important;
}
#modalContent .aka-archive-file-card.is-recovered img.aka-archive-revealed-poster {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
object-position: center center !important;
transform: none !important;
transform-origin: center center !important;
padding: 0.42rem !important;
margin: 0 !important;
opacity: 1 !important;
filter: none !important;
display: block !important;
border-radius: inherit !important;
background: #050202 !important;
}
#modalContent .aka-archive-file-card.is-sealed .aka-sealed-poster-veil {
background:
radial-gradient(circle at 50% 42%, rgba(255,45,85,0.10), transparent 36%),
linear-gradient(180deg, rgba(0,0,0,0.34), rgba(5,2,2,0.30) 46%, rgba(0,0,0,0.78)) !important;
}
#modalContent .aka-archive-file-card.is-sealed .aka-archive-file-inner {
background:
radial-gradient(circle at 50% 45%, rgba(255,45,85,0.12), transparent 42%),
linear-gradient(180deg, rgba(0,0,0,0.06), rgba(0,0,0,0.36)) !important;
}
#modalContent .aka-archive-file-card.is-recovered.is-bonus-recovered img.aka-archive-revealed-poster {
object-fit: contain !important;
padding: 0.36rem !important;
background: #050202 !important;
}
/* =========================================================
ARCHIVE REQUIREMENT: PREMIUM INLINE WARNING
Small sealed-card overlay that keeps the archive modal open.
========================================================= */
.aka-file-requirement-warning {
position: fixed;
inset: 0;
z-index: 12100;
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
background:
radial-gradient(ellipse at center, rgba(255,45,85,0.10), transparent 44%),
rgba(0,0,0,0.26);
backdrop-filter: blur(2px);
opacity: 0;
animation: akaFileRequirementIn 0.28s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
.aka-file-requirement-warning.is-leaving {
animation: akaFileRequirementOut 0.24s ease forwards;
}
.aka-file-requirement-card {
position: relative;
width: min(90vw, 455px);
padding: 28px 26px 26px;
text-align: center;
overflow: hidden;
isolation: isolate;
border: 1px solid rgba(255,45,85,0.42);
border-radius: 6px;
background:
radial-gradient(ellipse at 50% 0%, rgba(255,45,85,0.13), transparent 48%),
linear-gradient(180deg, rgba(20,4,7,0.96), rgba(5,5,5,0.96));
box-shadow:
0 0 18px rgba(255,45,85,0.22),
0 0 42px rgba(0,0,0,0.75),
inset 0 0 24px rgba(255,45,85,0.055);
}
.aka-file-requirement-card::before {
content: "";
position: absolute;
inset: 0;
z-index: -1;
pointer-events: none;
background:
linear-gradient(90deg, rgba(0,0,0,0.58), transparent 24%, transparent 76%, rgba(0,0,0,0.58)),
repeating-linear-gradient(0deg, rgba(255,255,255,0.025) 0 1px, transparent 1px 4px);
}
.aka-file-requirement-close {
position: absolute;
top: 12px;
right: 14px;
z-index: 3;
border: 0;
background: transparent;
color: rgba(212,168,67,0.78);
font-family: 'Bebas Neue', sans-serif;
font-size: 20px;
line-height: 1;
cursor: pointer;
transition: color 0.25s ease, transform 0.25s ease, text-shadow 0.25s ease;
}
.aka-file-requirement-close:hover,
.aka-file-requirement-close:focus-visible {
color: #D4A843;
transform: translateY(-1px) scale(1.03);
text-shadow: 0 0 9px rgba(212,168,67,0.38);
}
.aka-file-requirement-icon {
width: 46px;
height: 46px;
margin: 0 auto 14px;
display: grid;
place-items: center;
color: #FF2D55;
border: 1px solid rgba(255,45,85,0.34);
background: rgba(255,45,85,0.08);
box-shadow:
0 0 12px rgba(255,45,85,0.34),
inset 0 0 14px rgba(255,45,85,0.08);
}
.aka-file-requirement-kicker {
margin-bottom: 14px;
font-family: 'Special Elite', monospace;
font-size: 9px;
letter-spacing: 0.34em;
color: rgba(212,168,67,0.70);
text-transform: uppercase;
}
.aka-file-requirement-card h2 {
margin: 0 0 13px;
font-family: 'Bebas Neue', sans-serif;
font-size: clamp(2.15rem, 5vw, 3.65rem);
line-height: 0.9;
letter-spacing: 0.08em;
color: rgba(232,213,183,0.96);
text-shadow:
0 0 8px rgba(255,45,85,0.20),
0 0 18px rgba(212,168,67,0.10);
}
.aka-file-requirement-copy {
margin: 0 auto;
max-width: 360px;
font-family: 'Special Elite', monospace;
font-size: 12px;
line-height: 1.75;
letter-spacing: 0.08em;
color: rgba(232,213,183,0.66);
}
.aka-file-requirement-copy span {
display: block;
}
.aka-file-requirement-copy span + span {
margin-top: 4px;
color: rgba(232,213,183,0.78);
}
.aka-prototype-mission-card {
border-style: dashed;
}
.aka-prototype-mission-complete {
display: inline-flex;
align-items: center;
justify-content: center;
width: min(100%, 20rem);
min-height: 2.72rem;
margin: 1.05rem auto 0;
padding: 0.72rem 1rem;
border: 1px solid rgba(126,220,255,0.42);
border-radius: 0.38rem;
background: linear-gradient(180deg, rgba(27,70,82,0.72), rgba(7,14,17,0.96));
color: rgba(218,247,255,0.96);
font-size: 0.68rem;
font-weight: 800;
letter-spacing: 0.12em;
text-transform: uppercase;
box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
cursor: pointer;
transition: transform 105ms cubic-bezier(.2,.78,.3,1), opacity 105ms ease;
}
.aka-prototype-mission-complete:hover,
.aka-prototype-mission-complete:focus-visible {
transform: none;
outline: none;
opacity: 0.94;
}
.aka-prototype-mission-complete:active {
transform: scale(0.975);
opacity: 0.88;
}
@media (prefers-reduced-motion: reduce) {
.aka-prototype-mission-complete { transition-duration: 1ms; }
.aka-prototype-mission-complete:active { transform: scale(0.99); }
}
/* Informational side-quest panels must not look like sealed access. */
.aka-file-requirement-warning.is-magnifier {
background: radial-gradient(ellipse at center, rgba(72,190,220,0.09), transparent 44%), rgba(0,0,0,0.26);
}
.aka-file-requirement-warning.is-magnifier .aka-file-requirement-card {
border-color: rgba(83,201,235,0.38);
background: radial-gradient(ellipse at 50% 0%, rgba(72,190,220,0.12), transparent 48%), linear-gradient(180deg, rgba(12,16,18,0.97), rgba(5,5,5,0.97));
box-shadow: 0 0 18px rgba(72,190,220,0.17), 0 0 42px rgba(0,0,0,0.75), inset 0 0 24px rgba(184,126,74,0.05);
}
.aka-file-requirement-warning.is-magnifier .aka-file-requirement-icon {
color: rgb(196,139,86);
border-color: rgba(83,201,235,0.38);
background: radial-gradient(circle,rgba(72,205,235,0.16),rgba(184,126,74,0.07));
box-shadow: 0 0 13px rgba(72,190,220,0.28), inset 0 0 12px rgba(184,126,74,0.08);
}
.aka-file-requirement-warning.is-diamond {
background: radial-gradient(ellipse at center, rgba(139,5,115,0.10), transparent 44%), rgba(0,0,0,0.26);
}
.aka-file-requirement-warning.is-diamond .aka-file-requirement-card {
border-color: rgba(201,67,187,0.50);
background: radial-gradient(ellipse at 50% 0%, rgba(139,5,115,0.14), transparent 48%), linear-gradient(180deg, rgba(32,1,34,0.97), rgba(5,3,6,0.97));
box-shadow: 0 0 15px rgba(139,5,115,0.17), 0 0 42px rgba(0,0,0,0.75), inset 0 0 20px rgba(69,2,59,0.12);
}
.aka-file-requirement-warning.is-diamond .aka-file-requirement-icon {
color: #c943bb;
border-color: rgba(139,5,115,0.58);
background: radial-gradient(circle,rgba(69,2,59,0.54),rgba(32,1,34,0.94));
box-shadow: 0 0 10px rgba(139,5,115,0.18), inset 0 0 10px rgba(69,2,59,0.16);
}
.aka-file-requirement-warning.is-bonus {
background: radial-gradient(ellipse at center, rgba(212,168,67,0.09), transparent 44%), rgba(0,0,0,0.26);
}
.aka-file-requirement-warning.is-bonus .aka-file-requirement-card {
border-color: rgba(212,168,67,0.38);
background: radial-gradient(ellipse at 50% 0%, rgba(212,168,67,0.12), transparent 48%), linear-gradient(180deg, rgba(18,13,5,0.97), rgba(5,5,5,0.97));
}
.aka-file-requirement-warning.is-bonus .aka-file-requirement-icon {
color: #e6b953;
border-color: rgba(212,168,67,0.40);
background: rgba(212,168,67,0.08);
box-shadow: 0 0 13px rgba(212,168,67,0.25), inset 0 0 12px rgba(212,168,67,0.07);
}
@keyframes akaFileRequirementIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes akaFileRequirementOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@media (max-width: 768px) {
.aka-file-requirement-warning {
padding: 18px;
}
.aka-file-requirement-card {
width: min(92vw, 390px);
padding: 26px 18px 22px;
}
.aka-file-requirement-card h2 {
font-size: 2.15rem;
}
.aka-file-requirement-copy {
font-size: 10px;
letter-spacing: 0.055em;
}
}
/* =========================================================
WALLET GATE MODAL: CINEMA FULL POSTER
Shows the full AKA popcorn poster without cutting top/bottom text.
Scoped only to the disconnected wallet modal.
========================================================= */
.aka-wallet-gate-modal,
.aka-bonus-claim-modal {
position: relative;
isolation: isolate;
overflow: hidden;
}
/* Shared poster background base */
.aka-wallet-gate-modal .aka-modal-poster-bg,
.aka-bonus-claim-modal .aka-modal-poster-bg {
position: absolute;
inset: 0;
z-index: -4;
display: block;
width: 100%;
height: 100%;
object-position: center center;
pointer-events: none;
user-select: none;
}
/* Hide broken background cleanly */
.aka-wallet-gate-modal .aka-modal-poster-bg[hidden],
.aka-bonus-claim-modal .aka-modal-poster-bg[hidden] {
display: none;
}
/* Wallet gate: keep the current UI, but frame the full cinematic poster. */
.aka-wallet-gate-modal {
--aka-wallet-bg-opacity: 0.78;
--aka-wallet-bg-brightness: 1.04;
--aka-wallet-bg-contrast: 1.04;
--aka-wallet-bg-saturation: 1.07;
aspect-ratio: 3 / 2;
min-height: min(78vh, 430px);
padding: clamp(38px, 4vw, 56px) 1.5rem !important;
display: flex;
align-items: center;
justify-content: center;
background:
radial-gradient(circle at 50% 48%, rgba(255,45,85,0.06), transparent 44%),
#050202 !important;
}
/* Full background poster view: no scale tricks, no top/bottom cutting. */
.aka-wallet-gate-modal .aka-modal-poster-bg {
object-fit: contain !important;
object-position: center center !important;
opacity: var(--aka-wallet-bg-opacity) !important;
filter:
brightness(var(--aka-wallet-bg-brightness))
contrast(var(--aka-wallet-bg-contrast))
saturate(var(--aka-wallet-bg-saturation)) !important;
transform: none !important;
transform-origin: center center !important;
}
/* Shared overlay layers */
.aka-wallet-gate-modal::before,
.aka-bonus-claim-modal::before,
.aka-wallet-gate-modal::after,
.aka-bonus-claim-modal::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
}
/* Dark center shield: protects CONNECT WALLET while letting poster credits breathe. */
.aka-wallet-gate-modal::before {
z-index: -3;
background:
radial-gradient(
ellipse at 50% 52%,
rgba(0,0,0,0.78) 0%,
rgba(0,0,0,0.61) 27%,
rgba(0,0,0,0.30) 48%,
rgba(0,0,0,0.08) 67%,
transparent 83%
),
linear-gradient(
180deg,
rgba(0,0,0,0.00) 0%,
rgba(0,0,0,0.08) 17%,
rgba(0,0,0,0.26) 48%,
rgba(0,0,0,0.18) 78%,
rgba(0,0,0,0.03) 100%
),
linear-gradient(
90deg,
rgba(0,0,0,0.16) 0%,
rgba(0,0,0,0.03) 24%,
rgba(0,0,0,0.10) 56%,
rgba(0,0,0,0.34) 100%
) !important;
}
/* Subtle projector warmth, not a neon wash. */
.aka-wallet-gate-modal::after {
z-index: -2;
background:
radial-gradient(ellipse at 50% 96%, rgba(212,168,67,0.20), transparent 50%),
radial-gradient(ellipse at 50% 9%, rgba(212,168,67,0.12), transparent 44%),
radial-gradient(ellipse at 50% 60%, rgba(255,45,85,0.045), transparent 43%),
linear-gradient(180deg, transparent 0%, rgba(255,255,255,0.026) 52%, transparent 100%) !important;
mix-blend-mode: screen;
}
/* Content panel: invisible premium focus, not a box. */
.aka-wallet-gate-content {
padding: 0;
text-shadow:
0 0 8px rgba(0,0,0,0.98),
0 0 18px rgba(0,0,0,0.88),
0 0 34px rgba(0,0,0,0.70);
}
/* Softer wallet icon: premium, not overpowered. */
.aka-wallet-gate-icon {
width: 4.3rem;
height: 4.3rem;
margin: 0 auto 1.05rem;
display: inline-flex;
align-items: center;
justify-content: center;
color: rgba(255,45,85,0.86);
border: 1px solid rgba(255,45,85,0.28);
border-radius: 14px;
background:
radial-gradient(circle at 50% 35%, rgba(255,45,85,0.13), transparent 58%),
rgba(10,10,10,0.46);
box-shadow:
0 0 10px rgba(255,45,85,0.18),
0 0 22px rgba(255,45,85,0.09),
inset 0 0 18px rgba(255,45,85,0.05);
filter:
drop-shadow(0 0 6px rgba(255,45,85,0.26))
drop-shadow(0 0 14px rgba(255,45,85,0.12));
}
.aka-wallet-gate-kicker {
color: rgba(212,168,67,0.86);
text-shadow:
0 0 7px rgba(212,168,67,0.24),
0 0 18px rgba(0,0,0,0.88);
}
.aka-wallet-gate-title {
color: rgba(232,213,183,0.99);
text-shadow:
0 0 8px rgba(232,213,183,0.18),
0 0 18px rgba(212,168,67,0.12),
0 0 38px rgba(0,0,0,0.96);
}
.aka-wallet-gate-copy {
color: rgba(232,213,183,0.64);
margin-bottom: 1.25rem;
}
/* Real action inside the modal */
.aka-wallet-gate-action {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.55rem;
margin-top: 0.15rem;
padding: 0.78rem 1.15rem;
border: 1px solid rgba(212,168,67,0.38);
border-radius: 6px;
background:
linear-gradient(180deg, rgba(212,168,67,0.13), rgba(139,0,0,0.10)),
rgba(7,7,7,0.72);
color: rgba(255,244,214,0.92);
font-family: 'Bebas Neue', sans-serif;
font-size: 1.05rem;
letter-spacing: 0.12em;
box-shadow:
0 0 18px rgba(212,168,67,0.18),
0 0 34px rgba(255,45,85,0.07),
inset 0 1px 0 rgba(255,255,255,0.09),
inset 0 -10px 24px rgba(0,0,0,0.26);
transition:
transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
filter 0.40s ease,
border-color 0.42s ease,
box-shadow 0.44s ease,
background 0.42s ease;
}
.aka-wallet-gate-action:hover {
transform: translateY(-0.6px) scale(1.003);
filter: brightness(1.025);
border-color: rgba(212,168,67,0.62);
box-shadow:
0 0 18px rgba(212,168,67,0.22),
0 0 38px rgba(255,45,85,0.10),
inset 0 1px 0 rgba(255,255,255,0.10);
}
.aka-wallet-gate-action:active {
transform: translateY(0.15px) scale(0.998);
filter: brightness(0.993);
}
.aka-wallet-gate-action svg {
color: rgba(212,168,67,0.88);
filter: drop-shadow(0 0 8px rgba(212,168,67,0.34));
}
.aka-wallet-gate-hint {
margin-top: 0.9rem;
color: rgba(232,213,183,0.42);
text-shadow:
0 0 6px rgba(212,168,67,0.12),
0 0 16px rgba(0,0,0,0.90);
}
/* Mobile: preserve readability and avoid a tiny contained poster. */
@media (max-width: 640px) {
.aka-wallet-gate-modal {
--aka-wallet-bg-opacity: 0.60;
--aka-wallet-bg-brightness: 0.92;
--aka-wallet-bg-contrast: 1.02;
--aka-wallet-bg-saturation: 1.03;
aspect-ratio: auto;
min-height: 360px;
padding: 34px 1rem 24px !important;
}
.aka-wallet-gate-modal .aka-modal-poster-bg {
object-fit: cover !important;
object-position: center center !important;
}
.aka-wallet-gate-icon {
width: 3.35rem;
height: 3.35rem;
margin-bottom: 0.75rem;
border-radius: 11px;
}
.aka-wallet-gate-title {
font-size: 2.25rem !important;
line-height: 0.92 !important;
margin-bottom: 0.55rem !important;
}
.aka-wallet-gate-copy {
font-size: 0.78rem !important;
line-height: 1.55 !important;
margin-bottom: 0.9rem !important;
}
.aka-wallet-gate-action {
width: min(100%, 290px);
padding: 0.72rem 0.9rem;
font-size: 0.98rem;
}
.aka-wallet-gate-hint {
font-size: 8px !important;
letter-spacing: 0.18em !important;
}
}
/* =========================================================
BONUS CLAIM MODAL: POSTER VISIBILITY
Scoped only to bonus claim/reward modal.
========================================================= */
.aka-bonus-claim-modal .aka-modal-poster-bg {
opacity: 0.64 !important;
filter:
brightness(0.94)
contrast(1.14)
saturate(1.04) !important;
object-position: center 48% !important;
transform: scale(1.04) translateY(4px) !important;
transform-origin: center center !important;
}
.aka-bonus-claim-modal::before {
background:
radial-gradient(
ellipse at 50% 52%,
rgba(0,0,0,0.78) 0%,
rgba(0,0,0,0.62) 30%,
rgba(0,0,0,0.30) 56%,
transparent 76%
),
linear-gradient(
180deg,
rgba(0,0,0,0.38) 0%,
rgba(0,0,0,0.42) 42%,
rgba(0,0,0,0.82) 100%
),
linear-gradient(
90deg,
rgba(0,0,0,0.62) 0%,
rgba(0,0,0,0.22) 28%,
transparent 50%,
rgba(0,0,0,0.22) 72%,
rgba(0,0,0,0.62) 100%
) !important;
}
.aka-bonus-claim-modal::after {
background:
radial-gradient(ellipse at 50% 18%, rgba(212,168,67,0.15), transparent 42%),
radial-gradient(ellipse at 50% 100%, rgba(255,45,85,0.10), transparent 58%) !important;
}
.aka-bonus-claim-modal h2,
.aka-bonus-claim-modal p,
.aka-bonus-claim-modal .font-elite {
text-shadow:
0 0 8px rgba(0,0,0,0.98),
0 0 18px rgba(0,0,0,0.86),
0 0 32px rgba(0,0,0,0.62) !important;
}
/* ===== WALLET GATE OUTER CIRCLE ===== */
.aka-wallet-gate-modal .aka-wallet-gate-icon {
width: 5.15rem !important;
height: 5.15rem !important;
min-width: 5.15rem !important;
min-height: 5.15rem !important;
}
/* =========================================================
WALLET IDENTITY RANK SYSTEM
Scope: topbar wallet + wallet dropdown only.
No archive layout, poster size, reward state, or storage logic changes.
========================================================= */
@media (min-width: 769px) {
#navbar .aka-topbar-actions .aka-wallet-icon-wrap {
width: 2.14rem !important;
height: 2.14rem !important;
min-width: 2.14rem !important;
min-height: 2.14rem !important;
}
#navbar .aka-topbar-actions .aka-wallet-icon-wrap svg {
width: 1.04rem !important;
height: 1.04rem !important;
}
#navbar .aka-topbar-actions .aka-wallet-control:not(.is-connected):not(.is-wallet-connecting).aka-status-no-id .aka-wallet-icon-wrap,
#navbar .aka-topbar-actions .aka-wallet-control:not(.is-connected):not(.is-wallet-connecting).aka-status-outsider .aka-wallet-icon-wrap {
color: rgba(255,116,98,0.98) !important;
background:
radial-gradient(circle at 50% 38%, rgba(135,0,28,0.96), rgba(58,0,16,0.98) 58%, rgba(10,0,4,1) 100%) !important;
border-color: rgba(210,26,48,0.62) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.08),
inset 0 -12px 22px rgba(0,0,0,0.58),
0 0 10px rgba(150,0,20,0.30),
0 0 24px rgba(90,0,12,0.16),
0 0 0 1px rgba(0,0,0,0.52) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control:not(.is-connected):not(.is-wallet-connecting).aka-status-no-id .aka-wallet-icon-wrap::before,
#navbar .aka-topbar-actions .aka-wallet-control:not(.is-connected):not(.is-wallet-connecting).aka-status-outsider .aka-wallet-icon-wrap::before {
opacity: 0.46 !important;
background:
radial-gradient(circle, rgba(220,20,42,0.36) 0%, rgba(120,0,18,0.18) 40%, transparent 72%) !important;
filter: blur(10px) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control:not(.is-connected):not(.is-wallet-connecting).aka-status-no-id .aka-wallet-icon-wrap::after,
#navbar .aka-topbar-actions .aka-wallet-control:not(.is-connected):not(.is-wallet-connecting).aka-status-outsider .aka-wallet-icon-wrap::after {
border-color: rgba(210,26,48,0.44) !important;
opacity: 0.54 !important;
}
#navbar .aka-topbar-actions .aka-wallet-control:not(.is-connected):not(.is-wallet-connecting).aka-status-no-id .aka-wallet-icon-wrap svg,
#navbar .aka-topbar-actions .aka-wallet-control:not(.is-connected):not(.is-wallet-connecting).aka-status-outsider .aka-wallet-icon-wrap svg {
color: rgba(255,116,98,0.98) !important;
filter:
drop-shadow(0 0 5px rgba(255,77,77,0.30))
drop-shadow(0 0 10px rgba(139,0,0,0.18)) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending .aka-wallet-icon-wrap::before,
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending.is-classified-active .aka-wallet-icon-wrap::before {
inset: -16px !important;
opacity: 0.84 !important;
filter: blur(14px) !important;
background:
radial-gradient(
circle,
rgba(245,218,158,0.88) 0%,
rgba(212,168,67,0.40) 38%,
rgba(139,95,28,0.15) 62%,
transparent 78%
) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending .aka-wallet-icon-wrap::after,
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending.is-classified-active .aka-wallet-icon-wrap::after {
inset: -4.5px !important;
border: 1.6px solid rgba(245,218,158,0.76) !important;
box-shadow:
0 0 10px rgba(245,218,158,0.30),
0 0 24px rgba(212,168,67,0.18),
0 0 36px rgba(120,78,24,0.10) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending .aka-wallet-icon-wrap::after {
animation: akaWalletChampagneRingBreathTighter 2.45s ease-in-out infinite !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending.is-classified-active .aka-wallet-icon-wrap::after {
animation: akaWalletChampagneRingBreathTighter 2.35s ease-in-out infinite !important;
}
}
.aka-wallet-dropdown {
width: 17.6rem !important;
padding: 0.92rem 0.94rem 0.98rem !important;
border-color: rgba(212,168,67,0.30) !important;
background:
radial-gradient(circle at 100% 0%, rgba(212,168,67,0.115), transparent 34%),
radial-gradient(circle at 0% 100%, rgba(139,0,0,0.11), transparent 34%),
linear-gradient(180deg, rgba(13,11,9,0.985), rgba(5,5,5,0.985)) !important;
box-shadow:
0 0 0 1px rgba(0,0,0,0.78),
0 0 24px rgba(212,168,67,0.11),
0 18px 64px rgba(0,0,0,0.76),
inset 0 1px 0 rgba(255,255,255,0.065) !important;
}
.aka-wallet-dropdown::before {
content: '';
position: absolute;
left: 0.9rem;
right: 0.9rem;
top: 0.42rem;
height: 1px;
background: linear-gradient(90deg, transparent, rgba(212,168,67,0.42), transparent);
opacity: 0.72;
pointer-events: none;
}
.aka-wallet-dropdown-kicker {
color: rgba(212,168,67,0.72) !important;
text-shadow: 0 0 10px rgba(212,168,67,0.16) !important;
}
.aka-wallet-dropdown-address {
color: rgba(232,213,183,0.84) !important;
}
.aka-wallet-dropdown-label {
color: rgba(232,213,183,0.48) !important;
}
.aka-wallet-dropdown-section {
padding: 0.72rem 0 0.76rem !important;
border-top-color: rgba(212,168,67,0.16) !important;
border-bottom-color: rgba(212,168,67,0.14) !important;
}
.aka-wallet-dropdown-title {
font-size: 0.84rem !important;
letter-spacing: 0.18em !important;
color: rgba(255,238,196,0.96) !important;
text-shadow:
0 0 1px rgba(255,255,255,0.32),
0 0 10px rgba(212,168,67,0.18),
0 0 22px rgba(0,0,0,0.92) !important;
}
.aka-wallet-dropdown-title.aka-status-initiated,
.aka-wallet-dropdown-title.aka-status-origin-witness,
.aka-wallet-dropdown-title.aka-status-origin-survivor {
color: rgba(255,215,139,0.98) !important;
text-shadow: 0 0 8px rgba(212,168,67,0.34), 0 0 20px rgba(99,63,18,0.20) !important;
}
.aka-wallet-dropdown-title.aka-status-ascendant,
.aka-wallet-dropdown-title.aka-status-rise-transcended {
color: rgba(154,255,174,0.98) !important;
text-shadow: 0 0 8px rgba(74,222,128,0.30), 0 0 18px rgba(212,168,67,0.14) !important;
}
.aka-wallet-dropdown-title.aka-status-dominion-holder {
color: rgba(255,190,105,0.98) !important;
text-shadow: 0 0 8px rgba(212,168,67,0.26), 0 0 18px rgba(139,0,0,0.28) !important;
}
.aka-wallet-dropdown-title.aka-status-night-witness,
.aka-wallet-dropdown-title.aka-status-night-survivor {
color: rgba(255,82,91,0.98) !important;
text-shadow:
0 0 7px rgba(255,45,55,0.36),
0 0 18px rgba(72,0,35,0.42),
0 0 26px rgba(0,0,0,0.92) !important;
}
.aka-wallet-dropdown-title.aka-status-archive-seeker,
.aka-wallet-dropdown-title.aka-status-classified-recoverer {
color: rgba(139,255,227,0.98) !important;
text-shadow: 0 0 8px rgba(45,212,191,0.30), 0 0 20px rgba(0,0,0,0.92) !important;
}
.aka-wallet-dropdown-title.aka-status-final-witness {
color: rgba(255,240,196,0.99) !important;
text-shadow: 0 0 10px rgba(255,231,179,0.30), 0 0 24px rgba(212,168,67,0.14) !important;
}
.aka-wallet-dropdown-title.aka-status-legend {
color: rgba(255,232,162,1) !important;
text-shadow:
0 0 8px rgba(255,232,162,0.42),
0 0 20px rgba(74,222,128,0.18),
0 0 30px rgba(212,168,67,0.18) !important;
}
.aka-wallet-dropdown.aka-status-night-witness,
.aka-wallet-dropdown.aka-status-night-survivor {
border-color: rgba(190,27,55,0.42) !important;
background:
radial-gradient(circle at 100% 0%, rgba(120,0,48,0.18), transparent 36%),
radial-gradient(circle at 0% 100%, rgba(139,0,0,0.13), transparent 34%),
linear-gradient(180deg, rgba(13,8,10,0.99), rgba(5,4,5,0.99)) !important;
}
.aka-wallet-dropdown.aka-status-dominion-holder {
border-color: rgba(212,168,67,0.36) !important;
background:
radial-gradient(circle at 100% 0%, rgba(212,168,67,0.14), transparent 36%),
radial-gradient(circle at 0% 100%, rgba(139,0,0,0.15), transparent 34%),
linear-gradient(180deg, rgba(14,9,7,0.99), rgba(5,4,4,0.99)) !important;
}
.aka-wallet-dropdown.aka-status-archive-seeker,
.aka-wallet-dropdown.aka-status-classified-recoverer {
border-color: rgba(45,212,191,0.30) !important;
background:
radial-gradient(circle at 100% 0%, rgba(45,212,191,0.12), transparent 36%),
radial-gradient(circle at 0% 100%, rgba(212,168,67,0.08), transparent 34%),
linear-gradient(180deg, rgba(7,12,12,0.99), rgba(4,5,5,0.99)) !important;
}
.aka-wallet-mini-action {
border-radius: 5px !important;
}
.aka-wallet-reward-action.is-ready,
.aka-wallet-reward-action.is-claimable {
border-color: rgba(245,218,158,0.78) !important;
color: rgba(255,237,190,1) !important;
background:
radial-gradient(circle at 50% 35%, rgba(245,218,158,0.18), transparent 58%),
rgba(22,16,7,0.84) !important;
box-shadow:
0 0 14px rgba(245,218,158,0.34),
0 0 30px rgba(212,168,67,0.18),
inset 0 0 12px rgba(245,218,158,0.08) !important;
}
.aka-wallet-classified-action.is-active {
border-color: rgba(91,255,231,0.64) !important;
color: rgba(195,255,245,1) !important;
background:
radial-gradient(circle at 50% 35%, rgba(91,255,231,0.16), transparent 58%),
rgba(5,20,20,0.84) !important;
box-shadow:
0 0 14px rgba(91,255,231,0.26),
0 0 28px rgba(45,212,191,0.12),
inset 0 0 12px rgba(91,255,231,0.06) !important;
}
.aka-wallet-signal-row {
color: rgba(232,213,183,0.48) !important;
}
.aka-wallet-signal-row strong {
font-size: 0.62rem !important;
color: rgba(232,213,183,0.78) !important;
text-shadow: 0 0 10px rgba(0,0,0,0.92) !important;
}
.aka-wallet-signal-row.is-live strong {
color: rgba(255,232,166,0.98) !important;
text-shadow: 0 0 10px rgba(212,168,67,0.34), 0 0 20px rgba(0,0,0,0.88) !important;
}
.aka-wallet-signal-row.is-classified-live strong {
color: rgba(166,255,239,0.98) !important;
text-shadow: 0 0 10px rgba(45,212,191,0.32), 0 0 20px rgba(0,0,0,0.88) !important;
}
/* =========================================================
WALLET IDENTITY CORE SYSTEM
Purpose:
1) Main wallet core stays clean: disconnected = deep archive red, connected = emerald.
2) Identity title color lives in dropdown/panel through ARCHIVE_IDENTITY_THEMES.
3) Chapter colors become semantic: Origin red/gold, Rise gold/champagne, Dominion cyan/gold,
Night horror crimson/violet, Lost dusty teal/cyan, Final champagne, Legend gold/red/cyan.
========================================================= */
.aka-wallet-dropdown {
border-color: var(--aka-identity-border, rgba(212,168,67,0.30)) !important;
background:
radial-gradient(circle at 100% 0%, var(--aka-identity-wash-a, rgba(212,168,67,0.115)), transparent 36%),
radial-gradient(circle at 0% 100%, var(--aka-identity-wash-b, rgba(139,0,0,0.11)), transparent 34%),
linear-gradient(180deg, rgba(13,11,9,0.985), rgba(5,5,5,0.985)) !important;
}
.aka-wallet-dropdown::before {
background:
linear-gradient(
90deg,
transparent,
color-mix(in srgb, var(--aka-identity-border, rgba(212,168,67,0.42)) 78%, transparent),
transparent
) !important;
}
.aka-wallet-dropdown-title {
color: var(--aka-identity-title-color, rgba(255,238,196,0.96)) !important;
text-shadow: var(
--aka-identity-title-glow,
0 0 1px rgba(255,255,255,0.32),
0 0 10px rgba(212,168,67,0.18),
0 0 22px rgba(0,0,0,0.92)
) !important;
}
/* Keep the visible topbar wallet core from being recolored by rank/title classes. */
@media (min-width: 769px) {
#navbar .aka-topbar-actions .aka-wallet-control:not(.is-connected):not(.is-wallet-connecting) {
--aka-wallet-aura: rgba(166,0,34,0.34) !important;
--aka-wallet-aura-soft: rgba(80,0,18,0.22) !important;
--aka-wallet-border: rgba(176,21,38,0.42) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control:not(.is-connected):not(.is-wallet-connecting) .aka-wallet-icon-wrap {
color: rgba(255,116,98,0.96) !important;
background:
radial-gradient(circle at 50% 38%, rgba(112,0,24,0.96), rgba(45,0,14,0.98) 58%, rgba(8,0,4,1) 100%) !important;
border-color: rgba(176,21,38,0.58) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.07),
inset 0 -12px 22px rgba(0,0,0,0.60),
0 0 10px rgba(120,0,20,0.28),
0 0 24px rgba(70,0,12,0.14),
0 0 0 1px rgba(0,0,0,0.52) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected {
--aka-wallet-aura: rgba(74,222,128,0.66) !important;
--aka-wallet-aura-soft: rgba(34,197,94,0.24) !important;
--aka-wallet-border: rgba(74,222,128,0.72) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-icon-wrap {
color: #4ADE80 !important;
background:
radial-gradient(circle at 50% 38%, rgba(22,163,74,0.96), rgba(7,84,45,0.98) 58%, rgba(3,24,14,1) 100%) !important;
border-color: rgba(74,222,128,0.86) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.10),
inset 0 -12px 22px rgba(0,0,0,0.54),
0 0 10px rgba(74,222,128,0.42),
0 0 22px rgba(34,197,94,0.22),
0 0 0 1px rgba(0,0,0,0.50) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-icon-wrap svg {
color: #4ADE80 !important;
filter:
drop-shadow(0 0 6px rgba(74,222,128,0.70))
drop-shadow(0 0 12px rgba(34,197,94,0.38)) !important;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-classified-active .aka-wallet-icon-wrap svg {
color: #00D4FF !important;
filter:
drop-shadow(0 0 6px rgba(0,212,255,0.75))
drop-shadow(0 0 12px rgba(56,189,248,0.42)) !important;
}
}
/* Mobile menu panel keeps the same hierarchy: red when disconnected, emerald when connected. */
.aka-wallet-control-menu:not(.is-connected):not(.is-wallet-connecting) .aka-wallet-icon-wrap {
color: rgba(255,116,98,0.96) !important;
background:
radial-gradient(circle at 50% 38%, rgba(112,0,24,0.96), rgba(45,0,14,0.98) 58%, rgba(8,0,4,1) 100%) !important;
border-color: rgba(176,21,38,0.56) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.07),
inset 0 -12px 22px rgba(0,0,0,0.60),
0 0 12px rgba(120,0,20,0.20) !important;
}
.aka-wallet-control-menu.is-connected .aka-wallet-icon-wrap {
color: #4ADE80 !important;
background:
radial-gradient(circle at 50% 38%, rgba(22,163,74,0.96), rgba(7,84,45,0.98) 58%, rgba(3,24,14,1) 100%) !important;
border-color: rgba(74,222,128,0.84) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.10),
inset 0 -12px 22px rgba(0,0,0,0.54),
0 0 14px rgba(74,222,128,0.28),
0 0 28px rgba(34,197,94,0.14) !important;
}
/* Mobile/panel text may show the title, but the wallet orb remains controlled by connection state. */
.aka-wallet-control-menu #mobileWalletIdentityStatus {
color: var(--aka-identity-title-color, rgba(232,213,183,0.58)) !important;
text-shadow: var(--aka-identity-title-glow, 0 0 10px rgba(0,0,0,0.88)) !important;
}
/* ===== OUTSIDER TITLE: NEUTRAL GRAY =====
Only the OUTSIDER / NO ID title and dropdown identity tint are neutralized.
Disconnected wallet core stays deep red; Night status keeps its own red/violet identity. */
.aka-wallet-dropdown.aka-status-no-id,
.aka-wallet-dropdown.aka-status-outsider,
.aka-wallet-dropdown-title.aka-status-no-id,
.aka-wallet-dropdown-title.aka-status-outsider {
--aka-identity-title-color: rgba(176,178,174,0.82) !important;
--aka-identity-title-glow: 0 0 6px rgba(190,190,180,0.14), 0 0 18px rgba(0,0,0,0.92) !important;
--aka-identity-border: rgba(170,170,160,0.18) !important;
--aka-identity-wash-a: rgba(180,180,170,0.045) !important;
--aka-identity-wash-b: rgba(120,120,115,0.035) !important;
}
.aka-wallet-dropdown-title.aka-status-no-id,
.aka-wallet-dropdown-title.aka-status-outsider {
color: rgba(176,178,174,0.82) !important;
text-shadow: 0 0 6px rgba(190,190,180,0.14), 0 0 18px rgba(0,0,0,0.92) !important;
}
.aka-wallet-control-menu.aka-status-no-id #mobileWalletIdentityStatus,
.aka-wallet-control-menu.aka-status-outsider #mobileWalletIdentityStatus,
.aka-wallet-control.aka-status-no-id #walletIdentityStatus,
.aka-wallet-control.aka-status-outsider #walletIdentityStatus {
color: rgba(176,178,174,0.72) !important;
text-shadow: 0 0 5px rgba(190,190,180,0.10), 0 0 14px rgba(0,0,0,0.88) !important;
}
/* ===== WALLET DROPDOWN READABILITY + PREMIUM SIGNAL ===== */
/* Only wallet dropdown text polish. Does NOT touch CA / contract address. */
/* ARCHIVE ID / ARCHIVE ID CONNECTED */
#walletDropdownState {
color: rgba(255,226,151,0.78) !important;
letter-spacing: 0.34em !important;
text-shadow:
0 0 1px rgba(255,255,255,0.14),
0 0 7px rgba(212,168,67,0.14),
0 0 13px rgba(74,222,128,0.045) !important;
}
/* Wallet address only: soft CA-like clean signal, but not neon */
#walletDropdownAddress {
color: rgba(205,232,235,0.82) !important;
text-shadow:
0 0 1px rgba(255,255,255,0.12),
0 0 6px rgba(0,212,255,0.12),
0 0 12px rgba(74,222,128,0.05) !important;
}
/* HOLDERS label */
.aka-wallet-dropdown-holders-label {
color: rgba(232,213,183,0.56) !important;
text-shadow:
0 0 1px rgba(255,255,255,0.10),
0 0 6px rgba(212,168,67,0.07) !important;
}
/* Holders icon */
.aka-wallet-dropdown-holders-label svg {
color: rgba(212,168,67,0.78) !important;
filter:
drop-shadow(0 0 4px rgba(212,168,67,0.12)) !important;
}
/* HOLDERS number / SOON */
#walletDropdownHoldersCount {
color: rgba(255,232,170,0.84) !important;
text-shadow:
0 0 1px rgba(255,255,255,0.12),
0 0 7px rgba(212,168,67,0.12) !important;
}
/* TITLE label */
.aka-wallet-dropdown-label {
color: rgba(232,213,183,0.56) !important;
text-shadow:
0 0 1px rgba(255,255,255,0.10),
0 0 6px rgba(212,168,67,0.07) !important;
}
/* =========================================================
ROADMAP: CLEAN AAA STATE SYSTEM
One source of truth for sleeping / active / completed.
No spine breathing, no travelling beams, no node breathing.
Green is used only for the small active status lamp.
========================================================= */
#roadmap {
position: relative;
isolation: isolate;
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.105), transparent 36%),
radial-gradient(circle at 18% 33%, rgba(255,45,85,0.060), transparent 38%),
radial-gradient(circle at 82% 55%, rgba(0,212,255,0.036), transparent 40%),
radial-gradient(ellipse at 50% 54%, rgba(212,168,67,0.026), transparent 58%),
linear-gradient(180deg, #050505 0%, #0A0506 48%, #050505 100%) !important;
}
#roadmap::before {
content: "";
position: absolute;
inset: 0;
z-index: 0;
pointer-events: none;
background:
linear-gradient(90deg, rgba(0,0,0,0.80), transparent 19%, transparent 81%, rgba(0,0,0,0.80)),
radial-gradient(ellipse at 50% 15%, rgba(212,168,67,0.060), transparent 48%),
radial-gradient(ellipse at 50% 72%, rgba(139,0,0,0.030), transparent 52%),
repeating-linear-gradient(0deg, rgba(255,255,255,0.014) 0 1px, transparent 1px 5px);
opacity: 0.84;
}
#roadmap::after {
content: "";
position: absolute;
left: 50%;
top: 14%;
bottom: 13%;
width: 104px;
transform: translateX(-50%);
z-index: 0;
pointer-events: none;
background:
radial-gradient(ellipse at center, rgba(212,168,67,0.060), transparent 72%);
filter: blur(24px);
opacity: 0.22;
}
body.roadmap-mode-sleeping #roadmap::after {
opacity: 0.12;
}
body.roadmap-mode-active #roadmap::after {
opacity: 0.28;
}
body.roadmap-mode-completed #roadmap::after {
opacity: 0.37;
}
@media (min-width: 1024px) {
#roadmap .max-w-5xl {
max-width: 64rem;
}
#roadmap .md\:w-1\/2 > div {
max-width: 30rem;
}
#roadmap .md\:text-right > div {
margin-left: auto;
}
#roadmap .md\:pl-12 > div {
margin-right: auto;
}
#roadmap h3 {
font-size: 2.25rem;
}
#roadmap li span {
font-size: 0.98rem;
}
}
@media (min-width: 768px) {
#roadmap .timeline-line {
position: absolute !important;
left: 50% !important;
top: 3.5% !important;
bottom: 4% !important;
width: 2px !important;
transform: translateX(-50%) !important;
z-index: 0 !important;
pointer-events: none !important;
overflow: visible !important;
border-radius: 999px !important;
background:
linear-gradient(
180deg,
transparent 0%,
rgba(255,45,85,0.40) 15%,
rgba(212,168,67,0.56) 49%,
rgba(88,178,199,0.30) 80%,
transparent 100%
) !important;
box-shadow:
0 0 7px rgba(212,168,67,0.10),
0 0 16px rgba(255,45,85,0.045),
0 0 20px rgba(88,178,199,0.030) !important;
transition:
background 0.55s ease,
box-shadow 0.55s ease,
opacity 0.55s ease,
filter 0.55s ease !important;
}
#roadmap .timeline-line::before,
#roadmap .timeline-line::after {
content: none !important;
display: none !important;
}
body.roadmap-mode-sleeping #roadmap .timeline-line {
opacity: 0.60 !important;
filter: saturate(0.76) brightness(0.82) !important;
background:
linear-gradient(
180deg,
transparent 0%,
rgba(112,12,26,0.48) 18%,
rgba(92,58,20,0.42) 50%,
rgba(35,48,55,0.31) 79%,
transparent 100%
) !important;
box-shadow:
0 0 7px rgba(255,0,61,0.060),
0 0 14px rgba(212,168,67,0.046) !important;
}
body.roadmap-mode-active #roadmap .timeline-line {
opacity: 0.90 !important;
filter: saturate(1.04) brightness(1.04) !important;
background:
linear-gradient(
180deg,
transparent 0%,
rgba(255,45,85,0.54) 16%,
rgba(212,168,67,0.84) 49%,
rgba(88,178,199,0.42) 80%,
transparent 100%
) !important;
box-shadow:
0 0 10px rgba(212,168,67,0.24),
0 0 22px rgba(212,168,67,0.095),
0 0 28px rgba(255,45,85,0.060),
0 0 26px rgba(88,178,199,0.040) !important;
}
body.roadmap-mode-completed #roadmap .timeline-line {
opacity: 0.98 !important;
filter: saturate(1.10) brightness(1.08) !important;
background:
linear-gradient(
180deg,
transparent 0%,
rgba(255,45,85,0.70) 16%,
rgba(255,220,137,0.92) 49%,
rgba(100,190,210,0.54) 80%,
transparent 100%
) !important;
box-shadow:
0 0 12px rgba(212,168,67,0.34),
0 0 28px rgba(212,168,67,0.14),
0 0 34px rgba(255,45,85,0.090),
0 0 32px rgba(100,190,210,0.055) !important;
}
}
#roadmap .roadmap-card {
position: relative;
isolation: isolate;
border-radius: 18px !important;
border: 1px solid rgba(212,168,67,0.24) !important;
overflow: hidden !important;
background:
linear-gradient(135deg, rgba(255,255,255,0.050), rgba(255,255,255,0.016)),
radial-gradient(circle at 18% 0%, rgba(212,168,67,0.070), transparent 36%),
rgba(12,12,12,0.92) !important;
backdrop-filter: none;
-webkit-backdrop-filter: none;
box-shadow:
0 20px 44px rgba(0,0,0,0.76),
0 0 0 1px rgba(212,168,67,0.10),
inset 0 0 0 1px rgba(255,255,255,0.040),
inset 0 1px 0 rgba(255,255,255,0.075),
inset 0 -1px 0 rgba(0,0,0,0.58) !important;
transform: translateZ(0);
transition:
opacity 0.55s ease,
transform 0.55s cubic-bezier(0.23, 1, 0.32, 1),
border-color 0.55s ease,
box-shadow 0.55s ease !important;
}
#roadmap .roadmap-card::before {
content: "";
position: absolute;
inset: 0;
z-index: -1;
pointer-events: none;
border-radius: inherit;
background:
linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.105) 42%, transparent 64%);
transform: translateX(-135%);
opacity: 0;
transition:
transform 0.85s cubic-bezier(0.23, 1, 0.32, 1),
opacity 0.42s ease;
}
#roadmap .roadmap-card::after {
content: "";
position: absolute;
top: 50%;
width: 5.7rem;
height: 2px;
pointer-events: none;
transform: translateY(-50%);
opacity: 0.18;
filter: blur(0.18px);
transition:
opacity 0.55s ease,
box-shadow 0.55s ease,
background 0.55s ease;
}
#roadmap .roadmap-act-one::after,
#roadmap .roadmap-act-three::after { right: -5.7rem; }
#roadmap .roadmap-act-two::after { left: -5.7rem; }
#roadmap .roadmap-act-one::after {
background: linear-gradient(90deg, rgba(255,45,85,0.62), rgba(212,168,67,0.30), transparent);
box-shadow: 0 0 12px rgba(255,45,85,0.14), 0 0 20px rgba(212,168,67,0.08);
}
#roadmap .roadmap-act-two::after {
background: linear-gradient(270deg, rgba(212,168,67,0.70), rgba(255,231,179,0.22), transparent);
box-shadow: 0 0 12px rgba(212,168,67,0.16), 0 0 24px rgba(212,168,67,0.08);
}
#roadmap .roadmap-act-three::after {
background: linear-gradient(90deg, rgba(95,190,210,0.36), rgba(212,168,67,0.28), transparent);
box-shadow: 0 0 10px rgba(95,190,210,0.08), 0 0 20px rgba(212,168,67,0.09);
}
#roadmap .roadmap-card:hover {
transform: translateY(-2px);
}
#roadmap .roadmap-card:hover::before {
transform: translateX(135%);
opacity: 1;
}
#roadmap .roadmap-card.roadmap-state-sleeping {
opacity: 0.92 !important;
filter: none !important;
border-color: rgba(255,45,85,0.18) !important;
background:
linear-gradient(135deg, rgba(255,255,255,0.032), rgba(255,255,255,0.010)),
radial-gradient(circle at 18% 0%, rgba(139,0,0,0.050), transparent 34%),
rgba(9,8,8,0.91) !important;
box-shadow:
0 18px 40px rgba(0,0,0,0.74),
0 0 0 1px rgba(212,168,67,0.055),
0 0 16px rgba(255,45,85,0.035),
inset 0 0 0 1px rgba(255,255,255,0.032),
inset 0 1px 0 rgba(255,255,255,0.055),
inset 0 0 18px rgba(139,0,0,0.040) !important;
}
#roadmap .roadmap-card.roadmap-state-sleeping::after {
opacity: 0.12;
}
#roadmap .roadmap-card.roadmap-state-active {
opacity: 1 !important;
filter: none !important;
border-color: rgba(255,191,116,0.46) !important;
background:
linear-gradient(135deg, rgba(255,255,255,0.055), rgba(255,255,255,0.018)),
radial-gradient(circle at 18% 0%, rgba(212,168,67,0.082), transparent 36%),
rgba(12,11,10,0.95) !important;
box-shadow:
0 22px 50px rgba(0,0,0,0.80),
0 0 0 1px rgba(255,231,179,0.12),
0 0 20px rgba(212,168,67,0.12),
inset 0 0 0 1px rgba(255,255,255,0.045),
inset 0 1px 0 rgba(255,255,255,0.100),
inset 0 -1px 0 rgba(0,0,0,0.64) !important;
}
#roadmap .roadmap-card.roadmap-state-active::after {
opacity: 0.58;
}
#roadmap .roadmap-card.roadmap-state-completed {
opacity: 1 !important;
filter: none !important;
border-color: rgba(255,236,196,0.72) !important;
background:
linear-gradient(135deg, rgba(255,255,255,0.064), rgba(255,255,255,0.020)),
radial-gradient(circle at 18% 0%, rgba(255,231,179,0.105), transparent 36%),
rgba(13,12,10,0.965) !important;
box-shadow:
0 26px 60px rgba(0,0,0,0.88),
0 0 0 1px rgba(255,231,179,0.18),
0 0 24px rgba(212,168,67,0.21),
0 0 42px rgba(255,231,179,0.075),
inset 0 0 0 1px rgba(255,255,255,0.052),
inset 0 1px 0 rgba(255,236,196,0.150),
inset 0 -1px 0 rgba(0,0,0,0.70) !important;
}
#roadmap .roadmap-card.roadmap-state-completed::after {
opacity: 0.88;
}
#roadmap .roadmap-act-one.roadmap-state-active {
border-color: rgba(255,191,116,0.50) !important;
box-shadow:
0 0 18px rgba(212,168,67,0.14),
0 0 24px rgba(255,45,85,0.075),
0 22px 52px rgba(0,0,0,0.80),
inset 0 0 0 1px rgba(255,255,255,0.045),
inset 0 1px 0 rgba(255,255,255,0.100) !important;
}
#roadmap .roadmap-act-one.roadmap-state-completed {
border-color: rgba(255,202,132,0.66) !important;
box-shadow:
0 0 22px rgba(212,168,67,0.22),
0 0 36px rgba(255,45,85,0.105),
0 0 54px rgba(139,0,0,0.045),
0 24px 56px rgba(0,0,0,0.84),
inset 0 0 0 1px rgba(255,255,255,0.050),
inset 0 0 18px rgba(212,168,67,0.055) !important;
}
#roadmap .roadmap-act-two.roadmap-state-active {
border-color: rgba(255,231,179,0.64) !important;
background:
linear-gradient(135deg, rgba(255,255,255,0.042), rgba(255,255,255,0.012)),
radial-gradient(circle at 18% 0%, rgba(255,231,179,0.070), transparent 34%),
rgba(10,9,8,0.96) !important;
box-shadow:
0 0 0 1px rgba(255,231,179,0.13),
0 0 18px rgba(212,168,67,0.15),
0 0 30px rgba(255,231,179,0.060),
0 26px 58px rgba(0,0,0,0.88),
inset 0 0 0 1px rgba(255,255,255,0.046),
inset 0 1px 0 rgba(255,231,179,0.135),
inset 0 -1px 0 rgba(0,0,0,0.68) !important;
}
#roadmap .roadmap-act-two.roadmap-state-completed {
border-color: rgba(255,236,196,0.76) !important;
background:
linear-gradient(135deg, rgba(255,255,255,0.046), rgba(255,255,255,0.014)),
radial-gradient(circle at 18% 0%, rgba(255,231,179,0.085), transparent 34%),
rgba(10,9,8,0.965) !important;
box-shadow:
0 0 0 1px rgba(255,231,179,0.16),
0 0 22px rgba(212,168,67,0.21),
0 0 38px rgba(255,231,179,0.075),
0 28px 62px rgba(0,0,0,0.90),
inset 0 0 0 1px rgba(255,255,255,0.052),
inset 0 1px 0 rgba(255,236,196,0.145),
inset 0 -1px 0 rgba(0,0,0,0.70) !important;
}
#roadmap .roadmap-act-three.roadmap-state-active {
border-color: rgba(172,214,210,0.38) !important;
box-shadow:
0 0 18px rgba(212,168,67,0.15),
0 0 20px rgba(95,190,210,0.040),
0 22px 52px rgba(0,0,0,0.80),
inset 0 0 0 1px rgba(255,255,255,0.045),
inset 0 1px 0 rgba(255,255,255,0.100) !important;
}
#roadmap .roadmap-act-three.roadmap-state-completed {
border-color: rgba(186,222,214,0.48) !important;
box-shadow:
0 0 23px rgba(212,168,67,0.22),
0 0 25px rgba(95,190,210,0.048),
0 0 42px rgba(95,190,210,0.016),
0 24px 56px rgba(0,0,0,0.84),
inset 0 0 0 1px rgba(255,255,255,0.050),
inset 0 0 18px rgba(212,168,67,0.058) !important;
}
#roadmap .roadmap-card > span:first-of-type {
border: 1px solid rgba(212,168,67,0.18);
box-shadow:
0 0 16px rgba(212,168,67,0.075),
inset 0 0 12px rgba(212,168,67,0.035);
}
#roadmap .roadmap-status-row {
display: inline-flex;
align-items: center;
gap: 0.46rem;
margin: 0 0 0.9rem;
padding: 0.40rem 0.58rem;
border-radius: 5px;
border: 1px solid rgba(212,168,67,0.22);
background: rgba(0,0,0,0.38);
box-shadow:
inset 0 0 0 1px rgba(255,255,255,0.025),
inset 0 0 10px rgba(212,168,67,0.026),
0 0 12px rgba(0,0,0,0.38);
font-family: 'Special Elite', monospace;
font-size: 0.58rem;
letter-spacing: 0.18em;
line-height: 1;
text-transform: uppercase;
color: rgba(232,213,183,0.68);
}
#roadmap .roadmap-status-text {
opacity: 1;
}
#roadmap .roadmap-status-dot {
width: 0.46rem;
height: 0.46rem;
flex: 0 0 auto;
border-radius: 999px;
background: #ff003d;
box-shadow:
0 0 9px rgba(255,0,61,0.52),
0 0 19px rgba(139,0,0,0.24);
}
#roadmap .roadmap-state-sleeping .roadmap-status-row {
border-color: rgba(255,0,61,0.24) !important;
background:
radial-gradient(circle at 0% 50%, rgba(255,0,61,0.070), transparent 44%),
linear-gradient(180deg, rgba(139,0,0,0.075), rgba(0,0,0,0.32)) !important;
color: rgba(255,186,198,0.72) !important;
box-shadow:
inset 0 0 12px rgba(255,0,61,0.026),
0 0 12px rgba(255,0,61,0.052) !important;
}
#roadmap .roadmap-state-sleeping .roadmap-status-text {
color: rgba(255,186,198,0.76) !important;
text-shadow: 0 0 6px rgba(255,0,61,0.16) !important;
}
#roadmap .roadmap-state-sleeping .roadmap-status-dot {
background: #ff003d !important;
box-shadow:
0 0 8px rgba(255,0,61,0.46),
0 0 18px rgba(255,0,61,0.20),
0 0 28px rgba(139,0,0,0.12) !important;
animation: akaRoadmapSleepingLamp 1.85s ease-in-out infinite !important;
}
#roadmap .roadmap-state-active .roadmap-status-row {
border-color: rgba(212,168,67,0.36) !important;
background:
radial-gradient(circle at 0% 50%, rgba(74,222,128,0.055), transparent 44%),
linear-gradient(180deg, rgba(212,168,67,0.075), rgba(0,0,0,0.30)) !important;
color: rgba(255,232,170,0.86) !important;
box-shadow:
inset 0 0 0 1px rgba(255,255,255,0.030),
inset 0 0 11px rgba(212,168,67,0.040),
0 0 14px rgba(212,168,67,0.085) !important;
}
#roadmap .roadmap-state-active .roadmap-status-dot {
background: #4ade80 !important;
box-shadow:
0 0 11px rgba(74,222,128,0.74),
0 0 24px rgba(74,222,128,0.28),
0 0 38px rgba(74,222,128,0.10) !important;
animation: akaRoadmapActiveLamp 2s ease-in-out infinite !important;
}
#roadmap .roadmap-state-completed .roadmap-status-row {
border-color: rgba(255,231,179,0.50) !important;
background:
radial-gradient(circle at 0% 50%, rgba(212,168,67,0.12), transparent 44%),
linear-gradient(180deg, rgba(212,168,67,0.085), rgba(0,0,0,0.30)) !important;
color: rgba(255,232,170,0.92) !important;
box-shadow:
inset 0 0 0 1px rgba(255,255,255,0.035),
inset 0 0 11px rgba(212,168,67,0.058),
0 0 15px rgba(212,168,67,0.125) !important;
}
#roadmap .roadmap-state-completed .roadmap-status-dot {
background: #ffe7b3 !important;
box-shadow:
0 0 10px rgba(255,231,179,0.62),
0 0 22px rgba(212,168,67,0.30),
0 0 34px rgba(212,168,67,0.12) !important;
animation: none !important;
}
@media (min-width: 768px) {
#roadmap .reveal:has(> .roadmap-node)::before {
content: "" !important;
position: absolute !important;
top: 50% !important;
left: 50% !important;
width: 54px !important;
height: 54px !important;
border-radius: 9999px !important;
transform: translate(-50%, -50%) !important;
z-index: 40 !important;
pointer-events: none !important;
background: #0A0A0A !important;
box-shadow: 0 0 0 1px rgba(10,10,10,0.98) !important;
}
#roadmap .roadmap-node {
position: absolute !important;
top: 50% !important;
left: 50% !important;
width: 48px !important;
min-width: 48px !important;
max-width: 48px !important;
height: 48px !important;
min-height: 48px !important;
max-height: 48px !important;
aspect-ratio: 1 / 1 !important;
border-radius: 9999px !important;
transform: translate(-50%, -50%) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex: none !important;
padding: 0 !important;
margin: 0 !important;
line-height: 1 !important;
box-sizing: border-box !important;
z-index: 50 !important;
isolation: isolate !important;
overflow: visible !important;
background-clip: padding-box !important;
transition:
opacity 0.55s ease,
filter 0.55s ease,
border-color 0.55s ease,
box-shadow 0.55s ease !important;
animation: none !important;
}
#roadmap .roadmap-node::before {
content: "" !important;
position: absolute !important;
inset: 0 !important;
border-radius: inherit !important;
z-index: 0 !important;
pointer-events: none !important;
background: inherit !important;
}
#roadmap .roadmap-node::after {
content: "" !important;
position: absolute !important;
top: 50% !important;
left: 50% !important;
width: calc(100% + 0.92rem) !important;
height: calc(100% + 0.92rem) !important;
transform: translate(-50%, -50%) !important;
border-radius: 9999px !important;
z-index: 1 !important;
pointer-events: none !important;
opacity: 0.22 !important;
border: 1px solid rgba(212,168,67,0.18) !important;
box-shadow: 0 0 16px rgba(212,168,67,0.12) !important;
animation: none !important;
}
#roadmap .roadmap-node > span {
position: relative !important;
z-index: 5 !important;
width: 100% !important;
min-width: 100% !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
text-align: center !important;
line-height: 1 !important;
transform: none !important;
}
#roadmap .roadmap-node-one {
background:
radial-gradient(circle at 35% 28%, rgba(255,255,255,0.16), transparent 26%),
linear-gradient(145deg, #8B0000, #310000) !important;
border-color: rgba(212,168,67,0.54) !important;
color: #D4A843 !important;
}
#roadmap .roadmap-node-two {
background:
radial-gradient(circle at 35% 28%, rgba(255,255,255,0.15), transparent 26%),
linear-gradient(145deg, #9B7B2F, #35230A) !important;
border-color: rgba(212,168,67,0.56) !important;
color: #E8D5B7 !important;
}
#roadmap .roadmap-node-three {
background:
radial-gradient(circle at 35% 28%, rgba(255,255,255,0.14), transparent 26%),
linear-gradient(145deg, #0B3550, #07131E) !important;
border-color: rgba(0,212,255,0.50) !important;
color: #00D4FF !important;
}
#roadmap .roadmap-node.roadmap-state-sleeping {
opacity: 0.74 !important;
filter: saturate(0.76) brightness(0.82) !important;
box-shadow:
0 0 0 1px rgba(255,255,255,0.055),
0 0 16px rgba(255,0,61,0.10),
0 0 28px rgba(0,0,0,0.82),
inset 0 0 10px rgba(0,0,0,0.35) !important;
}
#roadmap .roadmap-node.roadmap-state-active {
opacity: 1 !important;
filter: saturate(1.08) brightness(1.04) !important;
box-shadow:
0 0 0 1px rgba(255,231,179,0.24),
0 0 20px rgba(212,168,67,0.28),
0 0 46px rgba(212,168,67,0.12),
inset 0 0 14px rgba(255,255,255,0.07) !important;
}
#roadmap .roadmap-node.roadmap-state-active::after {
opacity: 0.52 !important;
border-color: rgba(255,231,179,0.30) !important;
box-shadow: 0 0 22px rgba(212,168,67,0.22) !important;
}
#roadmap .roadmap-node.roadmap-state-completed {
opacity: 1 !important;
filter: saturate(1.14) brightness(1.10) !important;
box-shadow:
0 0 0 1px rgba(255,231,179,0.30),
0 0 24px rgba(212,168,67,0.34),
0 0 58px rgba(212,168,67,0.18),
inset 0 0 16px rgba(255,255,255,0.08) !important;
}
#roadmap .roadmap-node.roadmap-state-completed::after {
opacity: 0.70 !important;
border-color: rgba(255,231,179,0.40) !important;
box-shadow: 0 0 28px rgba(212,168,67,0.30), 0 0 58px rgba(212,168,67,0.12) !important;
}
}
#roadmap h3 {
text-shadow: 0 1px 0 rgba(0,0,0,0.85);
}
#roadmap .roadmap-card li {
text-align: left !important;
}
#roadmap .roadmap-card li span {
display: block;
text-align: left !important;
line-height: 1.42;
text-shadow: 0 1px 0 rgba(0,0,0,0.85);
}
#roadmap .roadmap-card li span.text-cinema-cream\/60 {
color: rgba(232,213,183,0.74) !important;
}
@media (min-width: 768px) {
#roadmap .roadmap-act-one [data-i18n="genesisTask4"] {
white-space: nowrap;
font-size: 0.88rem !important;
letter-spacing: 0;
}
}
@media (min-width: 1280px) {
#roadmap .roadmap-act-one [data-i18n="genesisTask4"] {
font-size: 0.92rem !important;
letter-spacing: 0;
}
}
@keyframes akaRoadmapSleepingLamp {
0%, 100% {
opacity: 0.48;
transform: scale(0.82);
}
50% {
opacity: 1;
transform: scale(1.10);
}
}
@keyframes akaRoadmapActiveLamp {
0%, 100% {
opacity: 0.70;
transform: scale(0.90);
}
50% {
opacity: 1;
transform: scale(1.10);
}
}
@media (max-width: 767px) {
#roadmap {
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.085), transparent 34%),
linear-gradient(180deg, #050505 0%, #0A0506 100%) !important;
}
#roadmap::after,
#roadmap .timeline-line,
#roadmap .timeline-line::before,
#roadmap .timeline-line::after,
#roadmap .roadmap-node,
#roadmap .roadmap-card::after {
display: none !important;
}
#roadmap .roadmap-card {
border-radius: 16px !important;
transform: none !important;
}
#roadmap .roadmap-card:hover {
transform: none !important;
}
#roadmap .roadmap-status-row {
display: flex;
width: max-content;
max-width: 100%;
white-space: normal;
letter-spacing: 0.12em;
}
#roadmap .roadmap-card.roadmap-state-sleeping {
opacity: 0.92 !important;
}
}
body.roadmap-mode-completed #roadmap .roadmap-card {
background:
linear-gradient(135deg, rgba(255,255,255,0.055), rgba(255,255,255,0.018)),
radial-gradient(circle at 18% 0%, rgba(212,168,67,0.090), transparent 38%),
rgba(12,12,12,0.93) !important;
}
@media (prefers-reduced-motion: reduce) {
#roadmap .roadmap-status-dot,
#roadmap .roadmap-card::before {
animation: none !important;
transition: none !important;
}
}
/* =========================================================
WALLET IDENTITY TITLE SYSTEM: ROADMAP COLOR LOGIC
Final override only: does not recolor the connected/disconnected wallet core.
Origin = red/gold, Rise = gold/champagne, Dominion = cyan/gold,
Night = crimson/violet, Lost = dusty teal/cyan, Final = ivory/champagne,
Legend = elegant gold + red + cyan.
========================================================= */
.aka-wallet-dropdown.aka-status-initiated,
.aka-wallet-dropdown.aka-status-origin-witness,
.aka-wallet-dropdown.aka-status-origin-survivor {
border-color: rgba(255,155,92,0.34) !important;
background:
radial-gradient(circle at 100% 0%, rgba(212,168,67,0.12), transparent 36%),
radial-gradient(circle at 0% 100%, rgba(139,0,0,0.14), transparent 34%),
linear-gradient(180deg, rgba(14,8,6,0.99), rgba(5,4,4,0.99)) !important;
}
.aka-wallet-dropdown.aka-status-ascendant,
.aka-wallet-dropdown.aka-status-rise-transcended {
border-color: rgba(255,231,179,0.36) !important;
background:
radial-gradient(circle at 100% 0%, rgba(255,231,179,0.13), transparent 36%),
radial-gradient(circle at 0% 100%, rgba(212,168,67,0.10), transparent 34%),
linear-gradient(180deg, rgba(15,12,7,0.99), rgba(5,5,4,0.99)) !important;
}
.aka-wallet-dropdown.aka-status-dominion-holder {
border-color: rgba(0,212,255,0.36) !important;
background:
radial-gradient(circle at 100% 0%, rgba(0,212,255,0.12), transparent 36%),
radial-gradient(circle at 0% 100%, rgba(212,168,67,0.09), transparent 34%),
radial-gradient(circle at 50% 100%, rgba(139,0,0,0.055), transparent 42%),
linear-gradient(180deg, rgba(6,11,14,0.99), rgba(4,4,5,0.99)) !important;
}
.aka-wallet-dropdown.aka-status-night-witness,
.aka-wallet-dropdown.aka-status-night-survivor {
border-color: rgba(214,32,82,0.46) !important;
background:
radial-gradient(circle at 100% 0%, rgba(120,0,72,0.20), transparent 36%),
radial-gradient(circle at 0% 100%, rgba(139,0,0,0.16), transparent 34%),
linear-gradient(180deg, rgba(13,7,11,0.99), rgba(5,4,5,0.99)) !important;
}
.aka-wallet-dropdown.aka-status-archive-seeker,
.aka-wallet-dropdown.aka-status-classified-recoverer {
border-color: rgba(45,212,191,0.32) !important;
background:
radial-gradient(circle at 100% 0%, rgba(45,212,191,0.12), transparent 36%),
radial-gradient(circle at 0% 100%, rgba(132,105,62,0.08), transparent 34%),
linear-gradient(180deg, rgba(7,12,12,0.99), rgba(4,5,5,0.99)) !important;
}
.aka-wallet-dropdown.aka-status-final-witness {
border-color: rgba(255,231,179,0.38) !important;
background:
radial-gradient(circle at 100% 0%, rgba(255,231,179,0.13), transparent 36%),
radial-gradient(circle at 0% 100%, rgba(212,168,67,0.08), transparent 34%),
linear-gradient(180deg, rgba(15,13,9,0.99), rgba(5,5,4,0.99)) !important;
}
.aka-wallet-dropdown.aka-status-legend {
border-color: rgba(255,232,162,0.48) !important;
background:
radial-gradient(circle at 100% 0%, rgba(255,232,162,0.13), transparent 35%),
radial-gradient(circle at 0% 100%, rgba(0,212,255,0.08), transparent 34%),
radial-gradient(circle at 50% 0%, rgba(255,45,85,0.07), transparent 42%),
linear-gradient(180deg, rgba(15,11,7,0.99), rgba(4,5,6,0.99)) !important;
}
/* Dropdown title text: each rank family gets its own identity. */
.aka-wallet-dropdown-title.aka-status-initiated {
color: rgba(255,205,116,0.98) !important;
text-shadow:
0 0 7px rgba(212,168,67,0.30),
0 0 16px rgba(255,45,85,0.13),
0 0 24px rgba(0,0,0,0.90) !important;
}
.aka-wallet-dropdown-title.aka-status-origin-witness {
color: rgba(255,196,112,0.99) !important;
text-shadow:
0 0 7px rgba(255,185,90,0.34),
0 0 18px rgba(255,45,85,0.20),
0 0 24px rgba(0,0,0,0.90) !important;
}
.aka-wallet-dropdown-title.aka-status-origin-survivor {
color: rgba(255,176,96,1) !important;
text-shadow:
0 0 8px rgba(255,190,96,0.38),
0 0 21px rgba(255,45,85,0.28),
0 0 30px rgba(139,0,0,0.16) !important;
}
.aka-wallet-dropdown-title.aka-status-ascendant {
color: rgba(255,226,151,0.99) !important;
text-shadow:
0 0 8px rgba(255,220,140,0.34),
0 0 18px rgba(212,168,67,0.18),
0 0 24px rgba(0,0,0,0.90) !important;
}
.aka-wallet-dropdown-title.aka-status-rise-transcended {
color: rgba(255,238,190,1) !important;
text-shadow:
0 0 9px rgba(255,232,170,0.42),
0 0 22px rgba(212,168,67,0.22),
0 0 30px rgba(255,255,255,0.06) !important;
}
.aka-wallet-dropdown-title.aka-status-dominion-holder {
color: rgba(156,233,255,0.99) !important;
text-shadow:
0 0 8px rgba(0,212,255,0.32),
0 0 18px rgba(212,168,67,0.16),
0 0 24px rgba(0,0,0,0.92) !important;
}
.aka-wallet-dropdown-title.aka-status-night-witness {
color: rgba(255,82,104,0.98) !important;
text-shadow:
0 0 7px rgba(255,45,85,0.36),
0 0 18px rgba(72,0,60,0.42),
0 0 26px rgba(0,0,0,0.92) !important;
}
.aka-wallet-dropdown-title.aka-status-night-survivor {
color: rgba(255,99,118,1) !important;
text-shadow:
0 0 8px rgba(255,45,85,0.44),
0 0 21px rgba(72,0,60,0.48),
0 0 30px rgba(0,0,0,0.92) !important;
}
.aka-wallet-dropdown-title.aka-status-archive-seeker {
color: rgba(133,218,202,0.96) !important;
text-shadow:
0 0 7px rgba(45,212,191,0.22),
0 0 18px rgba(132,105,62,0.10),
0 0 22px rgba(0,0,0,0.92) !important;
}
.aka-wallet-dropdown-title.aka-status-classified-recoverer {
color: rgba(151,255,232,0.99) !important;
text-shadow:
0 0 9px rgba(45,212,191,0.34),
0 0 22px rgba(0,212,255,0.14),
0 0 26px rgba(0,0,0,0.92) !important;
}
.aka-wallet-dropdown-title.aka-status-final-witness {
color: rgba(255,242,207,0.99) !important;
text-shadow:
0 0 9px rgba(255,231,179,0.34),
0 0 22px rgba(212,168,67,0.16),
0 0 30px rgba(255,255,255,0.05) !important;
}
.aka-wallet-dropdown-title.aka-status-legend {
color: rgba(255,232,162,1) !important;
text-shadow:
0 0 8px rgba(255,232,162,0.46),
0 0 18px rgba(255,45,85,0.20),
0 0 26px rgba(0,212,255,0.18) !important;
}
/* Mobile menu identity title follows rank color, but the wallet orb remains red/green by connection state. */
.aka-wallet-control-menu.aka-status-initiated #mobileWalletIdentityStatus,
.aka-wallet-control-menu.aka-status-origin-witness #mobileWalletIdentityStatus,
.aka-wallet-control-menu.aka-status-origin-survivor #mobileWalletIdentityStatus {
color: rgba(255,196,112,0.92) !important;
text-shadow: 0 0 7px rgba(255,45,85,0.14), 0 0 12px rgba(212,168,67,0.12) !important;
}
.aka-wallet-control-menu.aka-status-ascendant #mobileWalletIdentityStatus,
.aka-wallet-control-menu.aka-status-rise-transcended #mobileWalletIdentityStatus {
color: rgba(255,232,170,0.94) !important;
text-shadow: 0 0 8px rgba(212,168,67,0.18), 0 0 14px rgba(255,231,179,0.08) !important;
}
.aka-wallet-control-menu.aka-status-dominion-holder #mobileWalletIdentityStatus {
color: rgba(166,235,255,0.94) !important;
text-shadow: 0 0 8px rgba(0,212,255,0.18), 0 0 14px rgba(212,168,67,0.08) !important;
}
.aka-wallet-control-menu.aka-status-night-witness #mobileWalletIdentityStatus,
.aka-wallet-control-menu.aka-status-night-survivor #mobileWalletIdentityStatus {
color: rgba(255,99,118,0.94) !important;
text-shadow: 0 0 8px rgba(255,45,85,0.22), 0 0 14px rgba(72,0,60,0.18) !important;
}
.aka-wallet-control-menu.aka-status-archive-seeker #mobileWalletIdentityStatus,
.aka-wallet-control-menu.aka-status-classified-recoverer #mobileWalletIdentityStatus {
color: rgba(151,255,232,0.94) !important;
text-shadow: 0 0 8px rgba(45,212,191,0.20), 0 0 14px rgba(0,212,255,0.08) !important;
}
.aka-wallet-control-menu.aka-status-final-witness #mobileWalletIdentityStatus {
color: rgba(255,242,207,0.94) !important;
text-shadow: 0 0 8px rgba(255,231,179,0.18), 0 0 14px rgba(212,168,67,0.08) !important;
}
.aka-wallet-control-menu.aka-status-legend #mobileWalletIdentityStatus {
color: rgba(255,232,162,0.96) !important;
text-shadow:
0 0 8px rgba(255,232,162,0.24),
0 0 15px rgba(255,45,85,0.12),
0 0 18px rgba(0,212,255,0.10) !important;
}
/* =========================================================
FAN CLUB AAA POLISH: CINEMATIC ACCESS NETWORK
Targeted section polish only. No layout rewrite.
========================================================= */
#community {
isolation: isolate;
}
#community::before,
#community::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
z-index: 0;
}
#community::before {
background:
radial-gradient(ellipse at 50% 15%, rgba(212,168,67,0.075), transparent 42%),
radial-gradient(ellipse at 18% 38%, rgba(139,0,0,0.18), transparent 34%),
radial-gradient(ellipse at 82% 48%, rgba(212,168,67,0.055), transparent 36%);
opacity: 0.95;
}
#community::after {
background:
linear-gradient(90deg, rgba(0,0,0,0.50), transparent 20%, transparent 80%, rgba(0,0,0,0.50)),
repeating-linear-gradient(0deg, rgba(255,255,255,0.018) 0 1px, transparent 1px 5px);
mix-blend-mode: screen;
opacity: 0.18;
}
#community > .relative.z-10 {
position: relative;
z-index: 2;
}
/* Social cards become cinematic access passes, not generic dashboard tiles. */
#community .aka-social-card {
position: relative;
min-height: 5.55rem;
border-radius: 14px !important;
border-color: rgba(212,168,67,0.18) !important;
background:
linear-gradient(135deg, rgba(255,255,255,0.045), rgba(255,255,255,0.012) 38%, rgba(0,0,0,0.20)),
radial-gradient(circle at 12% 20%, rgba(212,168,67,0.080), transparent 34%),
rgba(11,11,11,0.58) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.055),
inset 0 0 24px rgba(212,168,67,0.030),
0 18px 46px rgba(0,0,0,0.45),
0 0 20px rgba(212,168,67,0.030);
backdrop-filter: blur(10px) saturate(1.08);
-webkit-backdrop-filter: blur(10px) saturate(1.08);
}
#community .aka-social-card::before {
content: "ACCESS PASS";
position: absolute;
top: 0.72rem;
right: 0.82rem;
z-index: 2;
font-family: 'Special Elite', monospace;
font-size: 0.47rem;
letter-spacing: 0.26em;
color: rgba(212,168,67,0.35);
text-shadow: 0 0 8px rgba(212,168,67,0.12);
}
#community .aka-social-card::after {
inset: 0 auto 0 -50%;
width: 42%;
background: linear-gradient(90deg, transparent, rgba(212,168,67,0.115), transparent);
opacity: 0;
}
#community .aka-social-orb {
background:
radial-gradient(circle at 35% 25%, rgba(255,255,255,0.12), transparent 26%),
rgba(212,168,67,0.075) !important;
border: 1px solid rgba(212,168,67,0.18);
box-shadow:
inset 0 0 18px rgba(212,168,67,0.050),
0 0 16px rgba(212,168,67,0.055);
}
#community .aka-social-card p.font-bebas {
color: rgba(232,213,183,0.92) !important;
letter-spacing: 0.075em;
text-shadow: 0 0 10px rgba(212,168,67,0.08);
}
#community .aka-social-card p.font-elite {
color: rgba(232,213,183,0.54) !important;
letter-spacing: 0.035em;
}
#community .aka-social-x .aka-social-glyph-x {
color: rgba(212,168,67,0.82) !important;
filter: drop-shadow(0 0 8px rgba(212,168,67,0.13)) !important;
text-shadow: none !important;
}
#community .aka-social-telegram .aka-social-glyph-telegram,
#community .aka-social-chart .aka-social-glyph-chart {
color: rgba(212,168,67,0.82) !important;
filter: drop-shadow(0 0 8px rgba(212,168,67,0.13)) !important;
}
@media (hover: hover) and (pointer: fine) {
#community .aka-social-card:hover {
transform: translateY(-4px) scale(1.01);
border-color: rgba(212,168,67,0.36) !important;
background:
linear-gradient(135deg, rgba(255,255,255,0.062), rgba(255,255,255,0.015) 42%, rgba(0,0,0,0.22)),
radial-gradient(circle at 12% 20%, rgba(212,168,67,0.120), transparent 34%),
rgba(14,13,12,0.72) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.075),
inset 0 0 30px rgba(212,168,67,0.052),
0 0 22px rgba(212,168,67,0.11),
0 22px 62px rgba(0,0,0,0.58);
}
#community .aka-social-card:hover::after {
left: 118%;
opacity: 1;
}
#community .aka-social-card:hover .aka-social-orb {
border-color: rgba(212,168,67,0.34);
box-shadow:
inset 0 0 20px rgba(212,168,67,0.085),
0 0 16px rgba(212,168,67,0.13),
0 0 28px rgba(139,0,0,0.10);
}
#community .aka-social-telegram:hover .aka-social-glyph-telegram {
color: rgba(130,210,255,0.90) !important;
filter: drop-shadow(0 0 10px rgba(130,210,255,0.20)) !important;
}
#community .aka-social-chart:hover .aka-social-glyph-chart {
color: rgba(116,235,166,0.88) !important;
filter: drop-shadow(0 0 10px rgba(116,235,166,0.18)) !important;
}
#community .aka-social-x:hover .aka-social-glyph-x {
color: rgba(232,213,183,0.92) !important;
filter:
drop-shadow(0 0 8px rgba(232,213,183,0.22))
drop-shadow(0 0 14px rgba(212,168,67,0.10)) !important;
text-shadow:
0 0 8px rgba(232,213,183,0.20),
0 0 14px rgba(212,168,67,0.10) !important;
}
}
@media (hover: none), (pointer: coarse) {
#xLink,
#telegramLink,
#chartLink {
-webkit-tap-highlight-color: transparent;
touch-action: manipulation;
}
#xLink:hover,
#xLink:focus,
#xLink:active,
#telegramLink:hover,
#telegramLink:focus,
#telegramLink:active,
#chartLink:hover,
#chartLink:focus,
#chartLink:active {
transform: translateY(0) scale(1) translateZ(0) !important;
filter: none !important;
}
#community .aka-social-card:hover,
#community .aka-social-card:focus,
#community .aka-social-card:active {
border-color: rgba(212,168,67,0.10) !important;
}
#community .aka-social-card:hover::after,
#community .aka-social-card:focus::after,
#community .aka-social-card:active::after {
left: -50%;
opacity: 0;
}
#community .aka-social-card:hover .aka-social-orb,
#community .aka-social-card:focus .aka-social-orb,
#community .aka-social-card:active .aka-social-orb {
border-color: rgba(212,168,67,0.18);
box-shadow:
inset 0 0 18px rgba(212,168,67,0.050),
0 0 16px rgba(212,168,67,0.055);
}
#community .aka-social-telegram:hover .aka-social-glyph-telegram,
#community .aka-social-telegram:focus .aka-social-glyph-telegram,
#community .aka-social-telegram:active .aka-social-glyph-telegram,
#community .aka-social-chart:hover .aka-social-glyph-chart,
#community .aka-social-chart:focus .aka-social-glyph-chart,
#community .aka-social-chart:active .aka-social-glyph-chart {
color: rgba(212,168,67,0.82) !important;
filter: drop-shadow(0 0 8px rgba(212,168,67,0.13)) !important;
}
#community .aka-social-x:hover .aka-social-glyph-x,
#community .aka-social-x:focus .aka-social-glyph-x,
#community .aka-social-x:active .aka-social-glyph-x {
color: rgba(212,168,67,0.82) !important;
filter: drop-shadow(0 0 8px rgba(212,168,67,0.13)) !important;
text-shadow: none !important;
}
}
/* Archive network terminal: calmer, more cinematic, less sci-fi. */
#akaLiveTerminal.aka-live-terminal {
border-radius: 12px;
border-color: rgba(212,168,67,0.24);
background:
linear-gradient(180deg, rgba(18,16,13,0.64), rgba(7,7,7,0.82)),
radial-gradient(ellipse at 18% 0%, rgba(139,0,0,0.16), transparent 45%),
rgba(4,4,4,0.72);
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.052),
inset 0 0 42px rgba(212,168,67,0.035),
0 0 26px rgba(212,168,67,0.065),
0 22px 68px rgba(0,0,0,0.52);
backdrop-filter: blur(8px) saturate(1.05);
-webkit-backdrop-filter: blur(8px) saturate(1.05);
}
#akaLiveTerminal.aka-live-terminal::before {
opacity: 0.10;
background:
repeating-linear-gradient(0deg, transparent 0 3px, rgba(212,168,67,0.10) 4px),
linear-gradient(90deg, rgba(139,0,0,0.12), transparent 26%, transparent 74%, rgba(212,168,67,0.08));
}
#akaLiveTerminal .aka-terminal-header {
border-bottom-color: rgba(212,168,67,0.20);
background: linear-gradient(90deg, rgba(212,168,67,0.035), transparent 44%, rgba(139,0,0,0.065));
}
#akaLiveTerminal .aka-terminal-title,
#akaLiveTerminal .aka-terminal-subtitle {
color: rgba(232,213,183,0.74);
text-shadow: 0 0 10px rgba(212,168,67,0.10);
}
#akaLiveTerminal .aka-terminal-cell {
border-right-color: rgba(212,168,67,0.13);
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.030), transparent 44%),
rgba(0,0,0,0.11);
}
#akaLiveTerminal .aka-terminal-label {
color: rgba(232,213,183,0.46);
}
#akaLiveTerminal .aka-terminal-value {
color: rgba(232,213,183,0.86);
text-shadow: 0 0 10px rgba(212,168,67,0.10);
}
#akaLiveTerminal .aka-terminal-cell-signal .aka-terminal-value {
color: rgba(224,195,126,0.94) !important;
text-shadow:
0 0 10px rgba(212,168,67,0.18),
0 0 20px rgba(139,0,0,0.08) !important;
}
/* Replace the old bright cyan classified look with a sober archive beacon. */
#akaLiveTerminal .aka-terminal-cell-signal::before {
color: rgba(224,195,126,0.92) !important;
background:
linear-gradient(currentColor 0 0) 0% 100% / 3px 36% no-repeat,
linear-gradient(currentColor 0 0) 33% 100% / 3px 56% no-repeat,
linear-gradient(currentColor 0 0) 66% 100% / 3px 76% no-repeat,
linear-gradient(currentColor 0 0) 100% 100% / 3px 94% no-repeat !important;
filter:
drop-shadow(0 0 7px rgba(212,168,67,0.22))
drop-shadow(0 0 14px rgba(139,0,0,0.10)) !important;
animation: akaTerminalArchiveSignalCalm 3.2s ease-in-out infinite !important;
}
@keyframes akaTerminalArchiveSignalCalm {
0%, 100% {
opacity: 0.78;
background-size: 3px 36%, 3px 56%, 3px 76%, 3px 94%;
}
48% {
opacity: 1;
background-size: 3px 50%, 3px 70%, 3px 92%, 3px 74%;
}
}
/* Invitation card: make the Fan Club CTA feel like a cinema invitation, not a plain red box. */
#community .aka-fanclub-invitation {
position: relative;
isolation: isolate;
overflow: hidden;
border-radius: 16px !important;
border-color: rgba(212,168,67,0.30) !important;
background:
radial-gradient(ellipse at 50% 0%, rgba(212,168,67,0.13), transparent 42%),
radial-gradient(ellipse at 14% 18%, rgba(255,45,85,0.16), transparent 38%),
linear-gradient(135deg, rgba(139,0,0,0.34), rgba(38,8,8,0.38) 46%, rgba(7,7,7,0.74)) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.07),
inset 0 0 48px rgba(212,168,67,0.050),
0 0 34px rgba(139,0,0,0.16),
0 24px 72px rgba(0,0,0,0.55);
}
#community .aka-fanclub-invitation::before {
content: "ARCHIVE INVITATION";
position: absolute;
top: 1rem;
left: 1.1rem;
z-index: 1;
font-family: 'Special Elite', monospace;
font-size: 0.55rem;
letter-spacing: 0.30em;
color: rgba(212,168,67,0.32);
}
#community .aka-fanclub-invitation::after {
content: "";
position: absolute;
inset: 0;
z-index: -1;
pointer-events: none;
background:
linear-gradient(120deg, transparent, rgba(212,168,67,0.075), transparent 62%),
repeating-linear-gradient(90deg, transparent 0 18px, rgba(212,168,67,0.035) 18px 19px, transparent 19px 38px);
opacity: 0.48;
}
#community .aka-fanclub-invitation > i,
#community .aka-fanclub-invitation > svg {
filter:
drop-shadow(0 0 10px rgba(212,168,67,0.30))
drop-shadow(0 0 20px rgba(139,0,0,0.18));
}
#community .aka-fanclub-invitation h3 {
text-shadow:
0 0 12px rgba(212,168,67,0.12),
0 0 24px rgba(139,0,0,0.10);
}
#community .aka-fanclub-invitation p {
color: rgba(232,213,183,0.62) !important;
}
@media (max-width: 767px) {
#community .aka-social-card::before,
#community .aka-fanclub-invitation::before {
display: none;
}
#akaLiveTerminal .aka-terminal-grid {
grid-template-columns: 1fr;
}
#akaLiveTerminal .aka-terminal-cell {
border-right: 0;
border-bottom: 1px solid rgba(212,168,67,0.12);
}
#akaLiveTerminal .aka-terminal-cell:last-child {
border-bottom: 0;
}
}
/* ===== AAA LIVE CINEMA TERMINAL: CONTEXT SWEEP + CLEAR ICON PURPOSE ===== */
/* Fix: the light sweep must belong to the whole terminal, not only two cells.
Signal keeps living bars. Community returns to a clear underground pulse icon. */
#akaLiveTerminal.aka-live-terminal {
position: relative;
}
#akaLiveTerminal.aka-live-terminal::after {
content: "";
position: absolute;
z-index: 2;
top: 0;
bottom: 0;
left: -34%;
width: 28%;
pointer-events: none;
background:
linear-gradient(90deg,
transparent,
rgba(212,168,67,0.052),
rgba(255,45,85,0.026),
rgba(212,168,67,0.040),
transparent
);
opacity: 0;
transform: skewX(-18deg) translateX(0);
mix-blend-mode: screen;
animation: akaTerminalFullProjectorSweep 8.8s ease-in-out infinite;
}
#akaLiveTerminal .aka-terminal-header,
#akaLiveTerminal .aka-terminal-grid {
position: relative;
z-index: 3;
}
#akaLiveTerminal .aka-terminal-cell-signal,
#akaLiveTerminal .aka-terminal-cell-community {
position: relative;
overflow: hidden;
isolation: isolate;
}
#akaLiveTerminal .aka-terminal-cell-signal > *,
#akaLiveTerminal .aka-terminal-cell-community > * {
position: relative;
z-index: 2;
}
#akaLiveTerminal .aka-terminal-cell-signal svg,
#akaLiveTerminal .aka-terminal-cell-signal i {
display: none !important;
}
/* Remove the isolated glass sweep from only NETWORK SIGNAL + COMMUNITY STATUS. */
#akaLiveTerminal .aka-terminal-cell-signal::after,
#akaLiveTerminal .aka-terminal-cell-community::after {
content: none !important;
display: none !important;
animation: none !important;
opacity: 0 !important;
}
/* NETWORK SIGNAL: keep as real living bars, but make the bar movement more readable. */
#akaLiveTerminal .aka-terminal-cell-signal::before {
width: 1.42rem !important;
height: 1.22rem !important;
flex-basis: 1.42rem !important;
color: rgba(230,202,137,0.98) !important;
background:
linear-gradient(currentColor 0 0) 0% 100% / 3px 36% no-repeat,
linear-gradient(currentColor 0 0) 32% 100% / 3px 60% no-repeat,
linear-gradient(currentColor 0 0) 64% 100% / 3px 82% no-repeat,
linear-gradient(currentColor 0 0) 96% 100% / 3px 98% no-repeat !important;
filter:
drop-shadow(0 0 8px rgba(212,168,67,0.30))
drop-shadow(0 0 16px rgba(139,0,0,0.15)) !important;
animation: akaArchiveSignalBarsContext 3.05s cubic-bezier(0.45, 0, 0.25, 1) infinite !important;
}
/* COMMUNITY STATUS: restore a recognizable pulse-line icon and animate the line itself. */
#akaLiveTerminal .aka-terminal-cell-community::before {
content: none !important;
display: none !important;
animation: none !important;
}
#akaLiveTerminal .aka-terminal-cell-community svg,
#akaLiveTerminal .aka-terminal-cell-community i {
display: block !important;
color: rgba(92,232,154,0.82) !important;
filter:
drop-shadow(0 0 7px rgba(92,232,154,0.18))
drop-shadow(0 0 14px rgba(212,168,67,0.07)) !important;
animation: akaUndergroundPulseIconContext 4.2s ease-in-out infinite !important;
}
#akaLiveTerminal .aka-terminal-cell-community svg path,
#akaLiveTerminal .aka-terminal-cell-community svg polyline,
#akaLiveTerminal .aka-terminal-cell-community svg line {
stroke-dasharray: 28 10;
stroke-dashoffset: 0;
animation: akaUndergroundPulseLineContext 4.2s ease-in-out infinite !important;
}
#akaLiveTerminal .aka-terminal-cell-community .aka-terminal-value {
color: rgba(232,213,183,0.93) !important;
text-shadow:
0 0 7px rgba(92,232,154,0.09),
0 0 16px rgba(212,168,67,0.075) !important;
}
@keyframes akaTerminalFullProjectorSweep {
0%, 66%, 100% {
opacity: 0;
transform: skewX(-18deg) translateX(0);
}
72% {
opacity: 0.45;
}
88% {
opacity: 0.18;
transform: skewX(-18deg) translateX(480%);
}
}
@keyframes akaArchiveSignalBarsContext {
0%, 100% {
opacity: 0.84;
transform: translateY(0);
background-size: 3px 36%, 3px 60%, 3px 82%, 3px 98%;
}
22% {
opacity: 0.96;
background-size: 3px 54%, 3px 78%, 3px 98%, 3px 70%;
}
46% {
opacity: 1;
transform: translateY(-1px);
background-size: 3px 78%, 3px 98%, 3px 60%, 3px 88%;
}
72% {
opacity: 0.90;
background-size: 3px 44%, 3px 88%, 3px 70%, 3px 100%;
}
}
@keyframes akaUndergroundPulseIconContext {
0%, 100% {
opacity: 0.72;
transform: translateY(0) scale(1);
}
30% {
opacity: 0.94;
transform: translateY(-1px) scale(1.04);
}
52% {
opacity: 1;
filter:
drop-shadow(0 0 9px rgba(92,232,154,0.27))
drop-shadow(0 0 16px rgba(212,168,67,0.10)) !important;
}
76% {
opacity: 0.82;
transform: translateY(0) scale(0.995);
}
}
@keyframes akaUndergroundPulseLineContext {
0%, 100% {
stroke-dashoffset: 0;
}
46% {
stroke-dashoffset: -18;
}
72% {
stroke-dashoffset: -28;
}
}
@media (max-width: 767px) {
#akaLiveTerminal.aka-live-terminal::after {
animation-duration: 10s;
}
}
@media (prefers-reduced-motion: reduce) {
#akaLiveTerminal.aka-live-terminal::after,
#akaLiveTerminal .aka-terminal-cell-signal::before,
#akaLiveTerminal .aka-terminal-cell-community svg,
#akaLiveTerminal .aka-terminal-cell-community svg path,
#akaLiveTerminal .aka-terminal-cell-community svg polyline,
#akaLiveTerminal .aka-terminal-cell-community svg line {
animation: none !important;
}
}
/* ===== END AAA LIVE CINEMA TERMINAL: CONTEXT SWEEP + CLEAR ICON PURPOSE ===== */
/* ===== ARCHIVE ENTRY CANONICAL VISUAL STATE =====
Single final override for archive card state before backend work.
- unlocked: no lock residue, clean CTA
- locked: lock layer above CTA, CTA still clickable through pointer-events
*/
#gallery .poster-card[data-archive] .poster-lock-overlay {
pointer-events: none !important;
}
#gallery .poster-card[data-archive].is-archive-entry-unlocked .poster-lock-overlay,
#gallery .poster-card[data-archive].is-archive-entry-unlocked .poster-lock-overlay *,
#gallery .poster-card[data-archive].unlocked .poster-lock-overlay,
#gallery .poster-card[data-archive].unlocked .poster-lock-overlay * {
display: none !important;
visibility: hidden !important;
opacity: 0 !important;
filter: none !important;
box-shadow: none !important;
text-shadow: none !important;
}
#gallery .poster-card[data-archive].is-archive-entry-locked .poster-lock-overlay {
display: flex !important;
visibility: visible !important;
opacity: 1 !important;
z-index: 60 !important;
pointer-events: none !important;
}
#gallery .poster-card[data-archive].is-archive-entry-locked .poster-lock-overlay > span {
display: none !important;
}
#gallery .poster-card[data-archive].is-archive-entry-locked .poster-lock-overlay .lock-neon {
display: block !important;
visibility: visible !important;
opacity: 1 !important;
z-index: 65 !important;
transform: translateY(0) scale(1) translateZ(0) !important;
}
#gallery .poster-card[data-archive] [data-archive-access] {
pointer-events: auto !important;
cursor: pointer !important;
}
#gallery .poster-card[data-archive] [data-archive-entry-unlocked="true"] {
z-index: 70 !important;
}
#gallery .poster-card[data-archive] [data-archive-entry-unlocked="false"] {
z-index: 45 !important;
}
#gallery .poster-card[data-archive].is-archive-entry-locked .archive-access-cta {
opacity: 0.58 !important;
filter: brightness(0.78) saturate(0.92) !important;
transform: translateY(0) scale(1) translateZ(0) !important;
}
#gallery .poster-card[data-archive].is-archive-entry-locked .archive-access-cta:hover,
#gallery .poster-card[data-archive].is-archive-entry-locked .archive-access-cta.archive-release {
opacity: 0.74 !important;
filter: brightness(0.9) saturate(0.96) !important;
transform: translateY(0) scale(1.0004) translateZ(0) !important;
}
#gallery .poster-card[data-archive].is-archive-entry-unlocked .archive-access-cta,
#gallery .poster-card[data-archive].unlocked .archive-access-cta {
opacity: 1 !important;
filter: none !important;
}
@keyframes akaArchiveAvailableSecretPulse {
0%, 100% {
filter:
drop-shadow(0 0 6px rgba(34,197,94,0.15))
drop-shadow(0 0 14px rgba(16,185,129,0.08));
}
50% {
filter:
drop-shadow(0 0 12px rgba(34,197,94,0.27))
drop-shadow(0 0 27px rgba(16,185,129,0.14));
}
}
@keyframes akaArchiveAvailableSecretPulseHover {
0%, 100% {
filter:
drop-shadow(0 0 10px rgba(34,197,94,0.24))
drop-shadow(0 0 24px rgba(16,185,129,0.14));
}
50% {
filter:
drop-shadow(0 0 16px rgba(34,197,94,0.35))
drop-shadow(0 0 36px rgba(16,185,129,0.20));
}
}
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret {
animation: akaArchiveAvailableSecretPulse 3.20s ease-in-out infinite;
will-change: filter;
}
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret:hover,
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret.active-touch {
animation: akaArchiveAvailableSecretPulseHover 2.95s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret,
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret:hover,
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret.active-touch {
animation: none;
filter:
drop-shadow(0 0 9px rgba(34,197,94,0.20))
drop-shadow(0 0 22px rgba(16,185,129,0.11));
}
}
/* =========================================================
ROADMAP COMPLETED STATE: AAA LEGEND GLOW OVERRIDE
Makes completed state clearly stronger than active.
Active = alive / transmission.
Completed = sealed legend / finished chapter.
========================================================= */
#roadmap .roadmap-card.roadmap-state-completed {
border-color: rgba(255, 236, 196, 0.92) !important;
background:
radial-gradient(circle at 18% 0%, rgba(255, 231, 179, 0.20), transparent 38%),
radial-gradient(circle at 88% 18%, rgba(74, 222, 128, 0.08), transparent 32%),
radial-gradient(circle at 50% 100%, rgba(255, 45, 85, 0.10), transparent 46%),
linear-gradient(135deg, rgba(255,255,255,0.075), rgba(255,255,255,0.018)),
rgba(14, 12, 9, 0.975) !important;
box-shadow:
0 0 0 1px rgba(255, 236, 196, 0.28),
0 0 18px rgba(255, 231, 179, 0.26),
0 0 42px rgba(212, 168, 67, 0.22),
0 0 72px rgba(255, 45, 85, 0.10),
0 28px 70px rgba(0, 0, 0, 0.90),
inset 0 0 0 1px rgba(255,255,255,0.070),
inset 0 1px 0 rgba(255, 236, 196, 0.22),
inset 0 0 28px rgba(212, 168, 67, 0.075) !important;
}
#roadmap .roadmap-card.roadmap-state-completed::before {
opacity: 1 !important;
background:
linear-gradient(
120deg,
transparent 0%,
rgba(255, 236, 196, 0.16) 42%,
rgba(212, 168, 67, 0.10) 52%,
transparent 68%
) !important;
animation: akaRoadmapCompletedSweep 4.8s ease-in-out infinite !important;
}
#roadmap .roadmap-card.roadmap-state-completed::after {
opacity: 1 !important;
height: 3px !important;
filter: blur(0.12px) !important;
box-shadow:
0 0 14px rgba(255, 231, 179, 0.38),
0 0 34px rgba(212, 168, 67, 0.22),
0 0 58px rgba(255, 45, 85, 0.08) !important;
}
#roadmap .roadmap-node.roadmap-state-completed {
transform: translate(-50%, -50%) scale(1.06) !important;
opacity: 1 !important;
filter: saturate(1.22) brightness(1.18) !important;
box-shadow:
0 0 0 1px rgba(255, 236, 196, 0.42),
0 0 18px rgba(255, 231, 179, 0.42),
0 0 44px rgba(212, 168, 67, 0.30),
0 0 74px rgba(255, 45, 85, 0.12),
inset 0 0 18px rgba(255,255,255,0.10) !important;
}
#roadmap .roadmap-node.roadmap-state-completed::after {
width: calc(100% + 1.35rem) !important;
height: calc(100% + 1.35rem) !important;
opacity: 0.92 !important;
border-color: rgba(255, 236, 196, 0.58) !important;
box-shadow:
0 0 18px rgba(255, 231, 179, 0.42),
0 0 42px rgba(212, 168, 67, 0.26),
0 0 76px rgba(255, 45, 85, 0.10) !important;
animation: akaRoadmapCompletedPulse 2.8s ease-in-out infinite !important;
}
#roadmap .roadmap-state-completed .roadmap-status-row {
border-color: rgba(255, 236, 196, 0.74) !important;
background:
radial-gradient(circle at 0% 50%, rgba(255, 231, 179, 0.20), transparent 48%),
linear-gradient(180deg, rgba(212,168,67,0.14), rgba(0,0,0,0.34)) !important;
color: rgba(255, 239, 204, 0.98) !important;
box-shadow:
inset 0 0 0 1px rgba(255,255,255,0.055),
inset 0 0 14px rgba(212,168,67,0.080),
0 0 18px rgba(255,231,179,0.20),
0 0 34px rgba(212,168,67,0.10) !important;
}
#roadmap .roadmap-state-completed .roadmap-status-dot {
background: #fff0c7 !important;
box-shadow:
0 0 10px rgba(255, 240, 199, 0.90),
0 0 24px rgba(212, 168, 67, 0.46),
0 0 42px rgba(255, 45, 85, 0.12) !important;
animation: akaRoadmapCompletedDot 2.6s ease-in-out infinite !important;
}
body.roadmap-mode-completed #roadmap .timeline-line {
opacity: 1 !important;
filter: saturate(1.22) brightness(1.16) !important;
box-shadow:
0 0 12px rgba(255, 231, 179, 0.46),
0 0 34px rgba(212, 168, 67, 0.28),
0 0 58px rgba(255, 45, 85, 0.10),
0 0 62px rgba(100,190,210,0.08) !important;
}
body.roadmap-mode-completed #roadmap::after {
opacity: 0.56 !important;
filter: blur(28px) saturate(1.14) !important;
}
@keyframes akaRoadmapCompletedPulse {
0%, 100% {
transform: translate(-50%, -50%) scale(0.96);
opacity: 0.66;
}
50% {
transform: translate(-50%, -50%) scale(1.08);
opacity: 1;
}
}
@keyframes akaRoadmapCompletedDot {
0%, 100% {
opacity: 0.78;
transform: scale(0.92);
}
50% {
opacity: 1;
transform: scale(1.14);
}
}
@keyframes akaRoadmapCompletedSweep {
0% {
transform: translateX(-140%);
opacity: 0;
}
18% {
opacity: 1;
}
48% {
transform: translateX(140%);
opacity: 0.9;
}
100% {
transform: translateX(140%);
opacity: 0;
}
}
/* =========================================================
ROADMAP MILESTONE ICON STATE POLISH
Bound milestone rows only. Spine / timeline-line untouched.
========================================================= */
#roadmap [data-roadmap-milestone] {
transition:
color 0.35s ease,
opacity 0.35s ease,
text-shadow 0.35s ease,
transform 0.35s ease;
}
#roadmap [data-roadmap-milestone].is-roadmap-milestone-sleeping {
opacity: 0.54;
}
#roadmap [data-roadmap-milestone].is-roadmap-milestone-sleeping span {
color: rgba(232, 213, 183, 0.48) !important;
}
#roadmap [data-roadmap-milestone].is-roadmap-milestone-active-pending {
opacity: 0.86;
}
#roadmap [data-roadmap-milestone].is-roadmap-milestone-active-pending span {
color: rgba(232, 213, 183, 0.78) !important;
text-shadow:
0 0 6px rgba(212, 168, 67, 0.10) !important;
}
#roadmap [data-roadmap-milestone].is-roadmap-milestone-complete span {
color: rgba(232, 213, 183, 0.88) !important;
text-shadow:
0 0 6px rgba(74, 222, 128, 0.15),
0 0 14px rgba(212, 168, 67, 0.06) !important;
}
#roadmap .roadmap-state-completed [data-roadmap-milestone].is-roadmap-milestone-complete span {
color: rgba(255, 239, 204, 0.96) !important;
text-shadow:
0 0 6px rgba(255, 236, 196, 0.24),
0 0 16px rgba(212, 168, 67, 0.16),
0 0 28px rgba(255, 45, 85, 0.04) !important;
}
#roadmap .aka-roadmap-icon-dormant {
opacity: 0.52;
filter:
drop-shadow(0 0 2px rgba(139, 0, 0, 0.26));
}
#roadmap .aka-roadmap-check-green {
filter:
drop-shadow(0 0 5px rgba(74, 222, 128, 0.32))
drop-shadow(0 0 12px rgba(74, 222, 128, 0.14));
}
#roadmap .aka-roadmap-check-gold {
color: rgba(255, 236, 196, 0.98) !important;
filter:
drop-shadow(0 0 5px rgba(255, 236, 196, 0.42))
drop-shadow(0 0 14px rgba(212, 168, 67, 0.24))
drop-shadow(0 0 28px rgba(255, 45, 85, 0.06));
}
#roadmap .roadmap-state-sleeping [data-roadmap-milestone] [data-lucide].animate-spin,
#roadmap .roadmap-state-completed [data-roadmap-milestone] [data-lucide].animate-spin {
animation: none !important;
}
#roadmap .roadmap-state-completed [data-roadmap-milestone] .aka-roadmap-check-green {
color: rgba(255, 236, 196, 0.98) !important;
filter:
drop-shadow(0 0 5px rgba(255, 236, 196, 0.42))
drop-shadow(0 0 14px rgba(212, 168, 67, 0.24))
drop-shadow(0 0 28px rgba(255, 45, 85, 0.06)) !important;
}
#roadmap .roadmap-state-completed .roadmap-status-dot {
background: #fff0c7 !important;
box-shadow:
0 0 10px rgba(255, 240, 199, 0.88),
0 0 24px rgba(212, 168, 67, 0.44),
0 0 42px rgba(255, 45, 85, 0.08) !important;
}
#roadmap .roadmap-state-completed .roadmap-status-row {
color: rgba(255, 239, 204, 0.98) !important;
text-shadow:
0 0 6px rgba(255, 236, 196, 0.16),
0 0 18px rgba(212, 168, 67, 0.10) !important;
}
/* Archive protocol: one instrument, guide and signal terminal. */
.elm-protocol {
position: fixed;
inset: 0;
z-index: 10020;
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
background: radial-gradient(ellipse at 50% 42%, rgba(57, 34, 23, .16), transparent 70%), rgba(0, 0, 0, .72);
-webkit-backdrop-filter: blur(7px);
backdrop-filter: blur(7px);
color: #e8dcc8;
font-family: 'Space Grotesk', sans-serif;
text-align: left;
isolation: isolate;
opacity: 0;
transition: opacity 220ms ease;
}
.elm-protocol.is-open {
opacity: 1;
}
.elm-protocol.is-leaving {
opacity: 0;
pointer-events: none;
}
.elm-protocol.hidden,
.elm-protocol [hidden],
.elm-protocol .hidden {
display: none !important;
}
.elm-protocol__panel {
--protocol-cream: #e8dcc8;
--protocol-bronze: #b4996b;
--protocol-line: rgba(189, 159, 109, .22);
position: relative;
display: flex;
flex-direction: column;
width: min(860px, 100%);
max-height: calc(100dvh - 48px);
min-width: 0;
padding: 24px;
border: 1px solid rgba(167, 143, 106, .42);
border-radius: 16px;
background:
radial-gradient(ellipse at 15% 0%, rgba(116, 75, 42, .10), transparent 55%),
linear-gradient(145deg, #20201e, #101213 40%, #0e0f10 75%, #151514);
box-shadow:
0 30px 100px rgba(0, 0, 0, .76),
0 0 0 4px rgba(0, 0, 0, .42),
inset 0 1px 0 rgba(255, 245, 220, .09),
inset 0 -1px 0 rgba(0, 0, 0, .85);
outline: none;
transform: translateY(9px);
transition: width 320ms cubic-bezier(.22, 1, .36, 1), transform 260ms cubic-bezier(.22, 1, .36, 1);
}
.elm-protocol.is-open .elm-protocol__panel {
transform: translateY(0);
}
.elm-protocol__panel::before {
content: '';
position: absolute;
pointer-events: none;
inset: 5px;
border: 1px solid rgba(197, 168, 120, .07);
border-radius: 11px;
}
.elm-protocol__panel[data-protocol-view='terminal'] {
width: min(390px, 100%);
padding: 16px;
}
.elm-protocol__header {
position: relative;
z-index: 3;
display: flex;
flex: 0 0 auto;
align-items: center;
gap: 13px;
min-width: 0;
padding-bottom: 19px;
border-bottom: 1px solid var(--protocol-line);
}
/* Neutral hit target: the approved seal artwork and its original rules are unchanged. */
.elm-protocol__mode {
appearance: none;
display: grid;
place-items: center;
flex: 0 0 44px;
width: 44px;
height: 44px;
margin: 0;
padding: 0;
border: 0;
background: transparent;
box-shadow: none;
color: inherit;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
touch-action: manipulation;
}
.elm-protocol__heading {
flex: 1 1 auto;
min-width: 0;
}
.elm-protocol__title {
margin: 0;
color: #efe2ca;
font-family: 'Bebas Neue', sans-serif;
font-size: 28px;
font-weight: 400;
letter-spacing: .07em;
line-height: 1;
}
.elm-protocol__subtitle {
margin: 7px 0 0;
color: #b49b75;
font-size: 10px;
font-weight: 500;
letter-spacing: .16em;
line-height: 1.25;
text-transform: uppercase;
}
.elm-protocol__actions {
display: flex;
flex: 0 0 auto;
align-items: center;
gap: 2px;
margin-right: -8px;
}
.elm-protocol__icon {
appearance: none;
display: grid;
place-items: center;
width: 40px;
height: 44px;
padding: 0;
border: 1px solid transparent;
border-radius: 7px;
background: transparent;
color: #a59478;
cursor: pointer;
transition: color 160ms ease, background 160ms ease;
-webkit-tap-highlight-color: transparent;
touch-action: manipulation;
}
.elm-protocol__icon svg {
width: 17px;
height: 17px;
stroke-width: 1.6;
}
.elm-protocol__icon:hover,
.elm-protocol__icon[aria-expanded='true'] {
color: #eee0c6;
background: rgba(212, 181, 127, .06);
}
.elm-protocol button:focus-visible {
outline: 2px solid #c4a371;
outline-offset: 3px;
}
.elm-protocol__mode:focus-visible {
border-radius: 50%;
}
.elm-protocol__language {
position: relative;
}
.elm-protocol__language-menu {
position: absolute;
top: calc(100% + 6px);
right: 0;
z-index: 10;
width: 140px;
padding: 6px;
border: 1px solid rgba(176, 151, 110, .35);
border-radius: 9px;
background: #181817;
box-shadow: 0 14px 38px rgba(0, 0, 0, .65), inset 0 1px 0 rgba(245, 233, 209, .06);
}
.elm-protocol__language-menu button {
display: block;
width: 100%;
min-height: 40px;
padding: 7px 12px;
border: 0;
border-radius: 4px;
background: transparent;
color: #c8bdab;
font: 500 13px/1.35 'Space Grotesk', sans-serif;
text-align: start;
cursor: pointer;
}
.elm-protocol__language-menu button:hover,
.elm-protocol__language-menu button[aria-current='true'] {
background: rgba(174, 143, 93, .12);
color: #f0ddba;
}
.elm-protocol__guide,
.elm-protocol__terminal {
min-height: 0;
overflow-y: auto;
overscroll-behavior: contain;
scrollbar-width: thin;
scrollbar-color: #655644 transparent;
scrollbar-gutter: stable;
}
.elm-protocol__guide {
padding: 19px 1px 2px;
}
.elm-protocol__directives {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
align-items: start;
gap: 9px 12px;
margin: 0;
padding: 0;
list-style: none;
}
.elm-protocol__directive {
min-width: 0;
overflow: hidden;
border: 1px solid rgba(171, 146, 108, .15);
border-radius: 8px;
background: linear-gradient(115deg, rgba(255, 240, 210, .026), rgba(0, 0, 0, .14));
box-shadow: inset 0 1px 0 rgba(255, 239, 208, .025);
transition: border-color 180ms ease, background 180ms ease;
}
.elm-protocol__directive:has([aria-expanded='true']) {
border-color: rgba(192, 156, 101, .41);
background: linear-gradient(115deg, rgba(190, 145, 79, .065), rgba(0, 0, 0, .13));
}
.elm-protocol__directive-toggle {
appearance: none;
display: flex;
align-items: center;
gap: 12px;
width: 100%;
min-height: 57px;
padding: 10px 13px;
border: 0;
background: transparent;
color: var(--protocol-cream);
text-align: start;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
.elm-protocol__directive-toggle:hover {
background: rgba(226, 191, 136, .04);
}
.elm-protocol__directive-toggle:focus-visible {
outline-offset: -3px !important;
}
.elm-protocol__number {
display: grid;
place-items: center;
flex: 0 0 28px;
height: 32px;
border: 1px solid rgba(176, 149, 103, .21);
border-radius: 5px;
background: linear-gradient(155deg, rgba(158, 123, 69, .13), rgba(0, 0, 0, .22));
box-shadow: inset 0 1px 0 rgba(255, 240, 203, .045);
color: #d0b582;
font-family: 'Bebas Neue', sans-serif;
font-size: 22px;
line-height: 1;
}
.elm-protocol__directive-label {
flex: 1 1 auto;
min-width: 0;
color: #d9cdb9;
font-size: 13px;
font-weight: 500;
line-height: 1.45;
}
.elm-protocol__chevron {
flex: 0 0 14px;
width: 14px;
height: 14px;
color: #8e7e64;
stroke-width: 1.5;
transition: transform 200ms ease, color 160ms ease;
}
.elm-protocol__directive-toggle[aria-expanded='true'] .elm-protocol__chevron {
color: #d7b576;
transform: rotate(180deg);
}
.elm-protocol__detail {
animation: elmProtocolDetailIn 200ms ease both;
}
.elm-protocol__detail-inner {
margin: 0 15px 15px 53px;
padding-top: 11px;
border-top: 1px solid rgba(192, 156, 101, .16);
}
.elm-protocol__detail-title {
margin: 0 0 7px;
color: #d7b987;
font-size: 11px;
font-weight: 500;
letter-spacing: .08em;
line-height: 1.4;
text-transform: uppercase;
}
.elm-protocol__detail-body {
margin: 0;
color: #b9b3a9;
font-size: 13px;
font-weight: 400;
line-height: 1.65;
}
.elm-protocol__terminal {
padding: 15px 1px 2px;
}
.elm-protocol__screen {
--protocol-signal: 164, 206, 216;
position: relative;
min-height: 122px;
padding: 14px;
border: 1px solid rgba(121, 157, 166, .27);
border-radius: 8px;
background:
radial-gradient(ellipse at 45% 0%, rgba(76, 128, 141, .065), transparent 90%),
linear-gradient(180deg, #080e10, #0b1214);
box-shadow: inset 0 2px 7px rgba(0, 0, 0, .6), 0 1px 0 rgba(255, 247, 220, .055);
transition: border-color 180ms ease;
}
.elm-protocol__status {
display: flex;
align-items: center;
gap: 8px;
color: rgb(var(--protocol-signal));
font-size: 10px;
font-weight: 500;
letter-spacing: .1em;
line-height: 1.45;
text-transform: uppercase;
}
.elm-protocol__status-light {
flex: 0 0 4px;
width: 4px;
height: 4px;
border-radius: 50%;
background: rgb(var(--protocol-signal));
box-shadow: 0 0 6px rgba(var(--protocol-signal), .32);
}
.elm-protocol__sequence {
display: flex;
align-items: center;
min-height: 48px;
margin-top: 7px;
overflow-wrap: anywhere;
}
.elm-protocol__sequence strong {
display: flex;
align-items: baseline;
min-width: 0;
max-width: 100%;
color: #daedf0;
font-family: ui-monospace, 'SFMono-Regular', Consolas, monospace;
font-size: 23px;
font-weight: 400;
letter-spacing: .06em;
line-height: 1.35;
text-shadow: 0 0 14px rgba(143, 204, 220, .09);
}
.elm-protocol__digits {
min-width: 0;
overflow-wrap: anywhere;
}
.elm-protocol__cursor {
margin-left: 2px;
color: #a0c9d3;
font-weight: 300;
animation: elmProtocolCursor 1.2s step-end infinite;
}
.elm-protocol__message {
min-height: 18px;
margin: 4px 0 0;
color: #92a7ab;
font-size: 12px;
line-height: 1.55;
}
.elm-protocol__result {
margin-top: 13px;
padding-top: 12px;
border-top: 1px solid rgba(var(--protocol-signal), .17);
}
.elm-protocol__result > span {
display: block;
color: #91afa3;
font-size: 10px;
letter-spacing: .11em;
line-height: 1.4;
}
.elm-protocol__result > strong {
display: block;
margin-top: 5px;
color: #d3e7d8;
font-size: 13px;
font-weight: 500;
line-height: 1.55;
}
.elm-protocol__terminal:is([data-secret-signal-state='accepted'], [data-secret-signal-state='dossier-accepted']) .elm-protocol__screen {
--protocol-signal: 156, 213, 174;
border-color: rgba(131, 187, 151, .48);
}
.elm-protocol__terminal[data-secret-signal-state='rejected'] .elm-protocol__screen {
--protocol-signal: 229, 149, 142;
border-color: rgba(203, 100, 92, .52);
animation: elmProtocolReject 240ms ease both;
}
.elm-protocol__terminal:is([data-secret-signal-state='locked'], [data-secret-signal-state='limit']) .elm-protocol__screen {
--protocol-signal: 220, 187, 123;
border-color: rgba(194, 158, 97, .46);
}
.elm-protocol__keypad {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 6px;
margin-top: 17px;
}
.elm-protocol__key,
.elm-protocol__submit {
appearance: none;
position: relative;
display: flex;
align-items: center;
justify-content: center;
min-width: 0;
min-height: 44px;
margin: 0;
padding: 9px 8px;
border: 1px solid rgba(158, 145, 122, .22);
border-radius: 6px;
background: linear-gradient(180deg, #242524, #191b1b);
color: #e8e2d6;
box-shadow: inset 0 1px 0 rgba(255, 248, 227, .07), 0 2px 2px rgba(0, 0, 0, .3);
font-family: 'Space Grotesk', sans-serif;
font-size: 21px;
font-weight: 400;
line-height: 1;
cursor: pointer;
user-select: none;
-webkit-tap-highlight-color: transparent;
touch-action: manipulation;
transition: border-color 140ms ease, background 140ms ease, color 140ms ease, transform 90ms ease, box-shadow 90ms ease;
}
.elm-protocol__key:hover {
border-color: rgba(181, 164, 135, .44);
background: linear-gradient(180deg, #2c2d2b, #1e201f);
color: #fff4df;
}
.elm-protocol__key:active,
.elm-protocol__key.is-pressed,
.elm-protocol__submit:active,
.elm-protocol__submit.is-pressed {
transform: translateY(1px);
box-shadow: inset 0 2px 4px rgba(0, 0, 0, .45), 0 1px 0 rgba(255, 238, 207, .035);
background: #141717;
}
.elm-protocol__key.is-utility {
color: #a89d87;
font-size: 10px;
font-weight: 500;
letter-spacing: .08em;
}
.elm-protocol__key svg {
width: 18px;
height: 18px;
stroke-width: 1.6;
}
.elm-protocol__submit {
justify-content: space-between;
width: 100%;
min-height: 44px;
margin-top: 10px;
padding: 12px 15px;
border-color: rgba(185, 152, 97, .4);
background: linear-gradient(180deg, #332d22, #25231d);
color: #e3c893;
font-size: 11px;
font-weight: 500;
letter-spacing: .14em;
}
.elm-protocol__submit svg {
width: 18px;
height: 18px;
stroke-width: 1.5;
}
.elm-protocol__submit:hover {
border-color: rgba(215, 179, 115, .63);
background: linear-gradient(180deg, #403727, #2b281f);
color: #f4ddad;
}
.elm-protocol__footer {
flex: 0 0 auto;
margin-top: 17px;
padding-top: 13px;
border-top: 1px solid rgba(165, 147, 111, .13);
color: #948978;
font-size: 11px;
line-height: 1.5;
}
.elm-protocol__panel[data-protocol-view='terminal'] .elm-protocol__footer {
margin-top: 14px;
}
.elm-protocol__panel[data-protocol-view='terminal'] .elm-protocol__header {
gap: 9px;
padding-bottom: 15px;
}
.elm-protocol__panel[data-protocol-view='terminal'] .elm-protocol__title {
font-size: 22px;
letter-spacing: .055em;
}
.elm-protocol__panel[data-protocol-view='terminal'] .elm-protocol__subtitle {
font-size: 10px;
letter-spacing: .1em;
}
.elm-protocol__panel.is-switching .elm-protocol__guide,
.elm-protocol__panel.is-switching .elm-protocol__terminal {
animation: elmProtocolViewIn 320ms cubic-bezier(.22, 1, .36, 1) both;
}
@keyframes elmProtocolViewIn {
0%, 28% { opacity: 0; transform: translateY(5px); }
100% { opacity: 1; transform: translateY(0); }
}
@keyframes elmProtocolDetailIn {
from { opacity: 0; transform: translateY(-3px); }
to { opacity: 1; transform: translateY(0); }
}
@keyframes elmProtocolCursor {
0%, 100% { opacity: 1; }
50% { opacity: .15; }
}
@keyframes elmProtocolReject {
0%, 100% { transform: translateX(0); }
30% { transform: translateX(-2px); }
65% { transform: translateX(2px); }
}
@media (max-width: 640px) {
.elm-protocol {
padding: 16px;
}
.elm-protocol__panel,
.elm-protocol__panel[data-protocol-view='terminal'] {
max-height: calc(100dvh - 32px);
padding: 18px;
border-radius: 13px;
}
.elm-protocol__header {
gap: 10px;
padding-bottom: 16px;
}
.elm-protocol__title {
font-size: 24px;
letter-spacing: .05em;
}
.elm-protocol__subtitle {
letter-spacing: .1em;
}
.elm-protocol__actions {
gap: 0;
}
.elm-protocol__icon {
width: 36px;
}
.elm-protocol__guide {
padding-top: 15px;
}
.elm-protocol__directives {
grid-template-columns: minmax(0, 1fr);
gap: 7px;
}
.elm-protocol__directive-toggle {
min-height: 53px;
gap: 11px;
padding: 9px 11px;
}
.elm-protocol__detail-inner {
margin-left: 50px;
}
.elm-protocol__footer {
margin-top: 14px;
padding-top: 11px;
}
}
@media (max-width: 359px) {
.elm-protocol {
padding: 12px;
}
.elm-protocol__panel,
.elm-protocol__panel[data-protocol-view='terminal'] {
max-height: calc(100dvh - 24px);
padding: 14px;
}
.elm-protocol__header,
.elm-protocol__panel[data-protocol-view='terminal'] .elm-protocol__header {
gap: 6px;
}
.elm-protocol__title,
.elm-protocol__panel[data-protocol-view='terminal'] .elm-protocol__title {
font-size: 20px;
}
.elm-protocol__actions {
margin-right: -5px;
}
.elm-protocol__icon {
width: 32px;
}
.elm-protocol__screen {
padding: 13px;
}
.elm-protocol__sequence strong {
font-size: 19px;
letter-spacing: .015em;
}
.elm-protocol__detail-inner {
margin-left: 13px;
}
}
@media (prefers-reduced-motion: reduce) {
.elm-protocol,
.elm-protocol *,
.elm-protocol *::before,
.elm-protocol *::after {
animation: none !important;
transition: none !important;
scroll-behavior: auto !important;
}
}
.aka-archive-guide-shell {
position: relative;
display: inline-flex;
justify-content: center;
align-items: center;
isolation: isolate;
}
.aka-archive-guide-trigger {
position: relative;
width: 2.28rem;
height: 2.28rem;
border-radius: 999px;
border: 1px solid rgba(212,168,67,0.32);
background:
radial-gradient(circle at 50% 20%, rgba(212,168,67,0.18), transparent 52%),
radial-gradient(circle at 50% 82%, rgba(139,0,0,0.30), transparent 60%),
linear-gradient(180deg, rgba(38,12,12,0.92), rgba(8,8,8,0.96));
color: rgba(212,168,67,0.86);
display: inline-flex;
align-items: center;
justify-content: center;
cursor: pointer;
overflow: hidden;
box-shadow:
0 0 12px rgba(212,168,67,0.13),
0 0 24px rgba(139,0,0,0.16),
inset 0 0 14px rgba(212,168,67,0.030);
transition:
color 0.32s ease,
border-color 0.32s ease,
background 0.32s ease,
box-shadow 0.32s ease,
transform 0.32s cubic-bezier(0.23, 1, 0.32, 1);
}
.aka-archive-guide-trigger svg {
position: relative;
z-index: 2;
filter:
drop-shadow(0 0 5px rgba(212,168,67,0.18))
drop-shadow(0 0 12px rgba(139,0,0,0.10));
}
.aka-archive-guide-trigger-sheen {
position: absolute;
inset: -40%;
z-index: 1;
background: linear-gradient(120deg, transparent 30%, rgba(212,168,67,0.12), transparent 70%);
transform: translateX(-125%) rotate(16deg);
transition: transform 0.72s ease;
}
.aka-archive-guide-trigger:hover,
.aka-archive-guide-trigger.is-open {
color: rgba(212,168,67,0.96);
border-color: rgba(212,168,67,0.52);
background:
radial-gradient(circle at 50% 20%, rgba(212,168,67,0.24), transparent 56%),
radial-gradient(circle at 50% 86%, rgba(139,0,0,0.36), transparent 62%),
linear-gradient(180deg, rgba(45,14,10,0.96), rgba(8,8,8,0.98));
box-shadow:
0 0 17px rgba(212,168,67,0.20),
0 0 36px rgba(139,0,0,0.23),
inset 0 0 17px rgba(212,168,67,0.045);
transform: translateY(-1px);
}
.aka-archive-guide-trigger:hover .aka-archive-guide-trigger-sheen,
.aka-archive-guide-trigger.is-open .aka-archive-guide-trigger-sheen {
transform: translateX(125%) rotate(16deg);
}
@media (max-width: 640px) {
.aka-archive-guide-trigger {
width: 2.36rem;
height: 2.36rem;
}
}
.aka-legend-phrase-secret {
appearance: none;
border: 0;
background: transparent;
padding: 0;
margin: 0;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
transition:
color 1.15s ease,
text-shadow 1.15s ease,
filter 1.15s ease,
transform 0.22s cubic-bezier(0.23, 1, 0.32, 1);
}
.aka-legend-phrase-secret:hover,
.aka-legend-phrase-secret:focus-visible {
color: rgba(160,211,255,0.98);
text-shadow:
0 0 8px rgba(77,163,255,0.42),
0 0 22px rgba(212,168,67,0.12),
0 0 36px rgba(139,0,0,0.11);
filter: drop-shadow(0 0 10px rgba(77,163,255,0.12));
}
.aka-legend-phrase-secret.is-pressed {
color: rgba(255,250,238,0.98);
text-shadow:
0 0 6px rgba(255,255,255,0.58),
0 0 16px rgba(232,213,183,0.34),
0 0 28px rgba(77,163,255,0.26),
0 0 48px rgba(255,45,85,0.12);
filter:
brightness(1.12)
drop-shadow(0 0 10px rgba(255,255,255,0.18))
drop-shadow(0 0 22px rgba(77,163,255,0.15));
transform: translateY(-0.5px);
}
.aka-legend-phrase-secret:focus-visible {
outline: 1px solid rgba(212,168,67,0.30);
outline-offset: 0.42rem;
}
/* ===== CINEMATIC SIGNAL HOTSPOTS: CLEAN BACKEND READY SIGNAL LAYER ===== */
.aka-cinematic-signal-hotspot,
.aka-brand-home-link[data-cinematic-signal-trigger],
.aka-story-synopsis-reveal-trigger {
-webkit-tap-highlight-color: transparent;
touch-action: manipulation;
user-select: none;
}
button.aka-cinematic-signal-hotspot,
.aka-story-synopsis-reveal-trigger {
appearance: none;
-webkit-appearance: none;
font: inherit;
line-height: 1;
}
[data-cinematic-signal-group] {
--aka-signal-icon-rgb: 212,168,67;
--aka-signal-text-rgb: 232,213,183;
--aka-signal-text-active-alpha: 0.86;
--aka-signal-active-filter: brightness(1.055);
}
[data-cinematic-signal-group="top-brand"],
[data-cinematic-signal-group="coin-plans"],
[data-cinematic-signal-group="footer-legend"] {
--aka-signal-icon-rgb: 212,168,67;
--aka-signal-text-rgb: 232,213,183;
}
[data-cinematic-signal-group="coin-identity"] {
--aka-signal-icon-rgb: 0,212,255;
--aka-signal-text-rgb: 212,168,67;
}
[data-cinematic-signal-group="coin-plans-missions"],
#token .aka-coin-plan-item--missions {
--aka-signal-icon-rgb: 212,168,67;
--aka-signal-text-rgb: 232,213,183;
}
[data-cinematic-signal-group="coin-plans-governance"],
#token .aka-coin-plan-item--governance {
--aka-signal-icon-rgb: 0,212,255;
--aka-signal-text-rgb: 0,212,255;
}
[data-cinematic-signal-group="coin-plans-collections"],
#token .aka-coin-plan-item--collections {
--aka-signal-icon-rgb: 139,5,115;
--aka-signal-text-rgb: 178,119,168;
}
[data-cinematic-signal-group="story-defi"] {
--aka-signal-icon-rgb: 74,168,255;
--aka-signal-text-rgb: 74,168,255;
}
[data-cinematic-signal-group="story-timeless"],
[data-cinematic-signal-group="story-synopsis"] {
--aka-signal-icon-rgb: 212,168,67;
--aka-signal-text-rgb: 212,168,67;
}
[data-cinematic-signal-group="story-legendary"] {
--aka-signal-icon-rgb: 255,45,85;
--aka-signal-text-rgb: 255,125,145;
}
[data-cinematic-signal-group="story-synopsis-body"] {
--aka-signal-icon-rgb: 232,213,183;
--aka-signal-text-rgb: 232,213,183;
--aka-signal-text-active-alpha: 0.92;
}
.aka-signal-pair {
min-width: 0;
transform: none;
}
.aka-signal-pair,
#token .aka-coin-label-signal,
#token .aka-coin-plans-kicker,
.aka-story-synopsis-body-line,
.aka-studio-subtitle,
[data-cinematic-signal-group][data-signal-light="text"] {
transition:
color 1800ms cubic-bezier(0.22, 1, 0.36, 1),
filter 1800ms cubic-bezier(0.22, 1, 0.36, 1),
text-shadow 1800ms cubic-bezier(0.22, 1, 0.36, 1),
opacity 1800ms cubic-bezier(0.22, 1, 0.36, 1);
}
[data-signal-light="icon"],
[data-signal-light="text"] {
transition:
color 1800ms cubic-bezier(0.22, 1, 0.36, 1),
filter 1800ms cubic-bezier(0.22, 1, 0.36, 1),
text-shadow 1800ms cubic-bezier(0.22, 1, 0.36, 1),
opacity 1800ms cubic-bezier(0.22, 1, 0.36, 1);
}
.aka-signal-pair [data-signal-light="icon"],
.aka-signal-pair [data-signal-light="text"],
[data-cinematic-signal-group][data-signal-light="text"] {
transform: none;
animation: none;
}
/* Story feature base signal: same filter structure as active state to avoid snap. */
.story-icon-blue,
.story-icon-gold,
.story-icon-red,
.aka-story-signal-row [data-signal-light="icon"] {
filter:
brightness(1)
drop-shadow(0 0 2px rgba(var(--aka-signal-icon-rgb),0.24))
drop-shadow(0 0 7px rgba(var(--aka-signal-icon-rgb),0.105))
drop-shadow(0 0 14px rgba(var(--aka-signal-icon-rgb),0.045));
}
.story-text-blue {
text-shadow:
0 0 5px rgba(74,168,255,0.16),
0 0 13px rgba(74,168,255,0.065),
0 0 22px rgba(74,168,255,0.025);
}
.story-text-gold {
text-shadow:
0 0 5px rgba(212,168,67,0.16),
0 0 13px rgba(212,168,67,0.065),
0 0 22px rgba(212,168,67,0.025);
}
.story-text-red {
text-shadow:
0 0 5px rgba(255,45,85,0.15),
0 0 13px rgba(255,45,85,0.06),
0 0 22px rgba(255,45,85,0.024);
}
.aka-story-signal-trigger {
width: 1.48rem;
height: 1.48rem;
padding: 0;
margin: 0;
display: inline-grid;
place-items: center;
border: 0;
border-radius: 999px;
color: inherit;
background: transparent;
cursor: pointer;
transform: translateZ(0);
transition:
transform 130ms cubic-bezier(0.2, 0.8, 0.22, 1),
filter 180ms ease,
opacity 180ms ease;
will-change: transform;
}
.aka-story-signal-trigger:hover,
.aka-story-signal-trigger:focus-visible {
transform: translateZ(0);
filter: none;
}
.aka-story-signal-trigger:active,
.aka-story-signal-trigger.is-pressed {
transform: scale(0.986) translateZ(0);
filter:
brightness(1.035)
drop-shadow(0 0 4px rgba(232,213,183,0.07));
}
.aka-story-signal-trigger:focus-visible,
.aka-coin-orb.aka-cinematic-signal-hotspot:focus-visible,
.aka-studio-orb.aka-cinematic-signal-hotspot:focus-visible,
.aka-brand-home-link[data-cinematic-signal-trigger]:focus-visible,
.aka-story-synopsis-reveal-trigger.is-unlocked:focus-visible {
outline: 1px solid rgba(212,168,67,0.42);
outline-offset: 0.34rem;
border-radius: 999px;
}
.aka-brand-home-link[data-cinematic-signal-trigger] .aka-brand-orb,
#token .aka-coin-orb.aka-cinematic-signal-hotspot,
.aka-studio-orb.aka-cinematic-signal-hotspot {
transition:
transform 130ms cubic-bezier(0.2, 0.8, 0.22, 1),
box-shadow 180ms ease,
filter 180ms ease;
will-change: transform;
}
.aka-brand-home-link[data-cinematic-signal-trigger].is-pressed .aka-brand-orb {
transform: translateY(0.35px) scale(0.988) translateZ(0);
filter: brightness(1.025);
box-shadow:
inset 0 1px 3px rgba(0,0,0,0.22),
0 0 8px rgba(212,168,67,0.12);
}
#token .aka-coin-orb.aka-cinematic-signal-hotspot {
padding: 0;
margin: 0;
cursor: pointer;
transform: translateZ(0);
}
#token .aka-coin-orb.aka-cinematic-signal-hotspot:hover {
transform: translateZ(0);
filter: none;
}
#token .aka-coin-orb.aka-cinematic-signal-hotspot:active,
#token .aka-coin-orb.aka-cinematic-signal-hotspot.is-pressed {
transform: scale(0.986) translateZ(0);
filter: brightness(1.035);
box-shadow:
inset 0 1px 4px rgba(0,0,0,0.22),
0 0 10px rgba(212,168,67,0.14),
0 0 18px rgba(139,0,0,0.08);
}
.aka-studio-orb.aka-cinematic-signal-hotspot {
padding: 0;
margin: 0;
cursor: pointer;
transform: translateY(-0.30rem) translateZ(0);
}
.aka-studio-orb.aka-cinematic-signal-hotspot:hover {
transform: translateY(-0.30rem) translateZ(0);
filter: none;
}
.aka-studio-orb.aka-cinematic-signal-hotspot:active,
.aka-studio-orb.aka-cinematic-signal-hotspot.is-pressed {
transform: translateY(-0.292rem) scale(0.986) translateZ(0);
filter: brightness(1.035);
box-shadow:
inset 0 1px 4px rgba(0,0,0,0.22),
0 0 10px rgba(212,168,67,0.14),
0 0 18px rgba(139,0,0,0.08);
}
.aka-story-synopsis-reveal-trigger {
width: 1.52rem;
height: 1.52rem;
padding: 0;
margin: 0;
display: inline-grid;
place-items: center;
border: 0;
border-radius: 999px;
color: inherit;
background: transparent;
cursor: default;
transform: translateZ(0);
transition:
transform 130ms cubic-bezier(0.2, 0.8, 0.22, 1),
filter 300ms ease,
opacity 300ms ease;
}
.aka-story-synopsis-reveal-trigger:not(.is-unlocked) {
opacity: 0.78;
}
.aka-story-synopsis-reveal-trigger:not(.is-unlocked) [data-signal-light="icon"] {
filter:
brightness(1)
saturate(0.88)
drop-shadow(0 0 3px rgba(212,168,67,0.14))
drop-shadow(0 0 8px rgba(212,168,67,0.055))
drop-shadow(0 0 14px rgba(212,168,67,0.020));
}
.aka-story-synopsis-reveal-trigger:not(.is-unlocked):hover,
.aka-story-synopsis-reveal-trigger:not(.is-unlocked):active,
.aka-story-synopsis-reveal-trigger:not(.is-unlocked).is-pressed {
transform: translateZ(0);
filter: none;
cursor: default;
}
.aka-story-synopsis-reveal-trigger.is-unlocked {
cursor: pointer;
opacity: 1;
}
.aka-story-synopsis-reveal-trigger.is-unlocked:active,
.aka-story-synopsis-reveal-trigger.is-unlocked.is-pressed {
transform: scale(0.986) translateZ(0);
filter: brightness(1.035);
}
/* Coin future-plan pairs: one parent signal controls icon and text together. */
#token .aka-coin-plan-item {
transform: none;
filter: none;
}
#token .aka-coin-plan-item [data-signal-light="icon"],
#token .aka-coin-plan-item [data-signal-light="text"] {
transition:
color 2800ms cubic-bezier(0.22, 1, 0.36, 1),
filter 2800ms cubic-bezier(0.22, 1, 0.36, 1),
text-shadow 2800ms cubic-bezier(0.22, 1, 0.36, 1),
opacity 2800ms cubic-bezier(0.22, 1, 0.36, 1);
}
#token .aka-coin-plan-item [data-signal-light="icon"] {
animation: none;
color: rgba(var(--aka-signal-icon-rgb),0.78);
filter:
brightness(1)
drop-shadow(0 0 4px rgba(var(--aka-signal-icon-rgb),0.20))
drop-shadow(0 0 10px rgba(var(--aka-signal-icon-rgb),0.075))
drop-shadow(0 0 22px rgba(var(--aka-signal-icon-rgb),0.030));
}
#token .aka-coin-plan-item [data-signal-light="text"] {
color: rgba(232,213,183,0.70);
filter: brightness(1);
text-shadow:
0 0 2px rgba(var(--aka-signal-text-rgb),0.060),
0 0 8px rgba(var(--aka-signal-text-rgb),0.025),
0 0 16px rgba(var(--aka-signal-text-rgb),0.010);
}
#token .aka-coin-plan-item:hover,
#token .aka-coin-plan-item:hover [data-signal-light="text"] {
transform: none;
filter: none;
}
#token .aka-coin-plan-item:hover [data-signal-light="icon"] {
transform: none;
filter:
brightness(1)
drop-shadow(0 0 4px rgba(var(--aka-signal-icon-rgb),0.20))
drop-shadow(0 0 10px rgba(var(--aka-signal-icon-rgb),0.075))
drop-shadow(0 0 22px rgba(var(--aka-signal-icon-rgb),0.030));
}
[data-cinematic-signal-group].is-signal-active [data-signal-light="icon"],
[data-cinematic-signal-group].is-signal-active[data-signal-light="icon"] {
filter:
var(--aka-signal-active-filter)
drop-shadow(0 0 5px rgba(var(--aka-signal-icon-rgb),0.44))
drop-shadow(0 0 13px rgba(var(--aka-signal-icon-rgb),0.18))
drop-shadow(0 0 28px rgba(var(--aka-signal-icon-rgb),0.065));
}
[data-cinematic-signal-group].is-signal-active [data-signal-light="text"],
[data-cinematic-signal-group].is-signal-active[data-signal-light="text"] {
color: rgba(var(--aka-signal-text-rgb),var(--aka-signal-text-active-alpha));
filter: brightness(1.045);
text-shadow:
0 0 4px rgba(var(--aka-signal-text-rgb),0.28),
0 0 12px rgba(var(--aka-signal-text-rgb),0.13),
0 0 26px rgba(var(--aka-signal-text-rgb),0.055);
}
#token .aka-coin-plan-item.is-signal-active [data-signal-light="icon"],
#token .aka-coin-plan-item.is-signal-active [data-signal-light="text"] {
transition-duration: 2800ms;
}
#token .aka-coin-plan-item.is-signal-active [data-signal-light="icon"] {
color: rgba(var(--aka-signal-icon-rgb),0.96);
filter:
brightness(1.085)
drop-shadow(0 0 6px rgba(var(--aka-signal-icon-rgb),0.46))
drop-shadow(0 0 15px rgba(var(--aka-signal-icon-rgb),0.215))
drop-shadow(0 0 32px rgba(var(--aka-signal-icon-rgb),0.085));
}
#token .aka-coin-plan-item.is-signal-active [data-signal-light="text"] {
color: rgba(var(--aka-signal-text-rgb),0.89);
filter: brightness(1.055);
text-shadow:
0 0 4px rgba(var(--aka-signal-text-rgb),0.28),
0 0 13px rgba(var(--aka-signal-text-rgb),0.145),
0 0 28px rgba(var(--aka-signal-text-rgb),0.065);
}
#token .aka-coin-plans-kicker {
filter: brightness(1);
text-shadow:
0 0 2px rgba(212,168,67,0.07),
0 0 7px rgba(212,168,67,0.025),
0 0 16px rgba(212,168,67,0.010);
transition:
color 2700ms cubic-bezier(0.22, 1, 0.36, 1),
filter 2700ms cubic-bezier(0.22, 1, 0.36, 1),
text-shadow 2700ms cubic-bezier(0.22, 1, 0.36, 1),
opacity 2700ms cubic-bezier(0.22, 1, 0.36, 1);
}
#token .aka-coin-plans-kicker.is-signal-active {
color: rgba(255,244,218,0.91);
filter: brightness(1.075);
text-shadow:
0 0 4px rgba(255,244,218,0.24),
0 0 13px rgba(212,168,67,0.36),
0 0 29px rgba(212,168,67,0.16),
0 0 48px rgba(139,0,0,0.065);
}
#token .aka-coin-label-signal.is-signal-active {
color: rgba(255,244,218,0.86);
filter: brightness(1.055);
text-shadow:
0 0 4px rgba(255,244,218,0.16),
0 0 12px rgba(0,212,255,0.14),
0 0 24px rgba(212,168,67,0.11);
}
.aka-story-signal-row [data-signal-light="icon"],
.aka-story-signal-row [data-signal-light="text"] {
transition:
color 2300ms cubic-bezier(0.22, 1, 0.36, 1),
filter 2300ms cubic-bezier(0.22, 1, 0.36, 1),
text-shadow 2300ms cubic-bezier(0.22, 1, 0.36, 1),
opacity 2300ms cubic-bezier(0.22, 1, 0.36, 1);
}
.aka-story-signal-row [data-signal-light="text"] {
filter: brightness(1);
}
.aka-story-signal-row.is-signal-active [data-signal-light="icon"] {
color: rgba(var(--aka-signal-icon-rgb),0.96);
filter:
brightness(1.10)
drop-shadow(0 0 5px rgba(var(--aka-signal-icon-rgb),0.48))
drop-shadow(0 0 14px rgba(var(--aka-signal-icon-rgb),0.225))
drop-shadow(0 0 29px rgba(var(--aka-signal-icon-rgb),0.090));
}
.aka-story-signal-row.is-signal-active [data-signal-light="text"] {
color: rgba(var(--aka-signal-text-rgb),0.88);
filter: brightness(1.07);
text-shadow:
0 0 4px rgba(var(--aka-signal-text-rgb),0.30),
0 0 13px rgba(var(--aka-signal-text-rgb),0.16),
0 0 26px rgba(var(--aka-signal-text-rgb),0.065);
}
.aka-story-synopsis-signal [data-signal-light="icon"],
.aka-story-synopsis-signal [data-signal-light="text"] {
transition:
color 2300ms cubic-bezier(0.22, 1, 0.36, 1),
filter 2300ms cubic-bezier(0.22, 1, 0.36, 1),
text-shadow 2300ms cubic-bezier(0.22, 1, 0.36, 1),
opacity 2300ms cubic-bezier(0.22, 1, 0.36, 1);
}
.aka-story-synopsis-signal.is-signal-active [data-signal-light="icon"] {
color: rgba(255,232,178,1);
filter:
brightness(1.18)
drop-shadow(0 0 7px rgba(255,232,178,0.60))
drop-shadow(0 0 18px rgba(212,168,67,0.34))
drop-shadow(0 0 38px rgba(139,0,0,0.13));
}
.aka-story-synopsis-signal.is-signal-active [data-signal-light="text"] {
color: rgba(255,232,178,0.98);
filter: brightness(1.12);
text-shadow:
0 0 6px rgba(255,232,178,0.42),
0 0 16px rgba(212,168,67,0.32),
0 0 34px rgba(139,0,0,0.13);
}
.aka-story-synopsis-body-line {
transition:
color 2600ms cubic-bezier(0.22, 1, 0.36, 1),
filter 2600ms cubic-bezier(0.22, 1, 0.36, 1),
text-shadow 2600ms cubic-bezier(0.22, 1, 0.36, 1),
opacity 2600ms cubic-bezier(0.22, 1, 0.36, 1);
}
.aka-story-synopsis-body-line.is-signal-active {
color: rgba(248,218,151,0.90);
filter: brightness(1.015) saturate(0.98);
text-shadow:
0 0 3px rgba(248,218,151,0.18),
0 0 10px rgba(212,168,67,0.14),
0 0 22px rgba(139,0,0,0.045);
}
.aka-studio-subtitle.is-signal-active,
[data-cinematic-signal-group="footer-legend"].is-signal-active[data-signal-light="text"] {
color: rgba(232,213,183,0.76);
filter: brightness(1.06);
text-shadow:
0 0 4px rgba(232,213,183,0.18),
0 0 12px rgba(212,168,67,0.10),
0 0 26px rgba(77,163,255,0.045);
}
@media (max-width: 768px) {
.aka-story-signal-trigger,
.aka-story-synopsis-reveal-trigger {
width: 1.72rem;
height: 1.72rem;
}
#token .aka-coin-orb.aka-cinematic-signal-hotspot,
.aka-studio-orb.aka-cinematic-signal-hotspot {
min-width: 2.65rem;
min-height: 2.65rem;
}
}
@media (prefers-reduced-motion: reduce) {
.aka-signal-pair,
.aka-signal-pair [data-signal-light="icon"],
.aka-signal-pair [data-signal-light="text"],
#token .aka-coin-label-signal,
#token .aka-coin-plans-kicker,
.aka-story-synopsis-body-line,
.aka-studio-subtitle,
[data-cinematic-signal-group][data-signal-light="text"] {
transition-duration: 1ms;
}
}
/* ===== SEO / PERFORMANCE LAUNCH PASS ===== */
html.aka-performance-lite .film-grain {
opacity: 0.003;
animation: none;
}
html.aka-performance-lite .aka-nav-cinema-segment,
html.aka-performance-lite .aka-language-menu,
html.aka-performance-lite .aka-wallet-dropdown,
html.aka-performance-lite .modal-overlay.active {
backdrop-filter: blur(2px);
-webkit-backdrop-filter: blur(2px);
}
html.aka-performance-lite .poster-card,
html.aka-performance-lite .aka-cinematic-cta,
html.aka-performance-lite .aka-wallet-control,
html.aka-performance-lite .aka-vault-terminal,
html.aka-performance-lite .aka-roadmap-card {
will-change: auto;
}
html.aka-performance-lite .poster-card:hover,
html.aka-performance-lite .poster-card.unlocked:hover {
transform: translateZ(0);
box-shadow: 0 14px 34px rgba(0, 0, 0, 0.72);
}
/* V0.37.1 runtime lifecycle: pause invisible work without changing visible styling. */
html.aka-page-hidden *,
html.aka-page-hidden *::before,
html.aka-page-hidden *::after,
html.aka-performance-runtime .aka-perf-section.aka-section-offscreen *,
html.aka-performance-runtime .aka-perf-section.aka-section-offscreen *::before,
html.aka-performance-runtime .aka-perf-section.aka-section-offscreen *::after {
animation-play-state: paused !important;
}
/* ===== ROADMAP BADGE STACK FIX =====
Keeps ACT label and status label on separate rows.
Visual-only fix. Does not touch roadmap state, milestone keys, archive unlocks, spine, or completion logic.
*/
#roadmap .roadmap-card > span:first-of-type {
display: block;
width: max-content;
max-width: 100%;
}
#roadmap .roadmap-status-row {
display: flex !important;
width: max-content;
max-width: 100%;
clear: both;
}
@media (max-width: 767px) {
#roadmap .roadmap-card > span:first-of-type,
#roadmap .roadmap-status-row {
width: fit-content;
max-width: 100%;
}
}
/* =========================================================
PHASE 2A — PREMIUM ARCHIVE CARD ACTION STATES
RECOVER = emerald action, LOCKED = sealed red, RECOVERED = gold collectible.
Added as final overrides so existing archive layouts stay intact.
========================================================= */
#modalContent .aka-archive-file-card {
isolation: isolate;
}
#modalContent .aka-archive-file-card.is-sealed > .absolute.inset-x-0.bottom-0 {
z-index: 12 !important;
background:
linear-gradient(to top, rgba(0,0,0,0.98) 0%, rgba(0,0,0,0.86) 42%, rgba(0,0,0,0.34) 72%, rgba(0,0,0,0.0) 100%) !important;
padding: 0.78rem !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
#modalContent .aka-archive-recover-btn {
position: relative !important;
overflow: hidden !important;
min-height: 2.45rem !important;
border-radius: 10px !important;
isolation: isolate !important;
backdrop-filter: blur(10px) saturate(1.08) !important;
-webkit-backdrop-filter: blur(10px) saturate(1.08) !important;
text-shadow: 0 1px 2px rgba(0,0,0,0.82), 0 0 10px rgba(0,0,0,0.72) !important;
transition:
transform 180ms cubic-bezier(0.23, 1, 0.32, 1),
border-color 260ms ease,
background 260ms ease,
box-shadow 260ms ease,
color 260ms ease,
filter 260ms ease !important;
}
#modalContent .aka-archive-recover-btn::before {
content: "";
position: absolute;
inset: 1px;
z-index: -1;
border-radius: inherit;
pointer-events: none;
background:
radial-gradient(ellipse at 50% 0%, rgba(255,255,255,0.10), transparent 60%),
linear-gradient(180deg, rgba(255,255,255,0.055), rgba(0,0,0,0.08));
}
#modalContent .aka-archive-recover-btn::after {
content: "";
position: absolute;
top: -35%;
bottom: -35%;
left: -60%;
width: 42%;
z-index: -1;
pointer-events: none;
transform: rotate(18deg);
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.16), transparent);
opacity: 0;
transition: left 560ms ease, opacity 300ms ease;
}
/* Locked/disabled card action: readable sealed-red state without looking like active RECOVER. */
#modalContent .aka-archive-file-card.is-sealed .aka-archive-recover-btn:disabled,
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn:disabled {
cursor: not-allowed !important;
opacity: 1 !important;
border-color: rgba(255,45,85,0.46) !important;
color: rgba(255,220,224,0.82) !important;
background:
radial-gradient(ellipse at 50% 0%, rgba(255,45,85,0.13), transparent 62%),
linear-gradient(180deg, rgba(75,7,17,0.58), rgba(10,2,4,0.88)) !important;
box-shadow:
0 0 0 1px rgba(255,45,85,0.10),
0 0 10px rgba(255,45,85,0.18),
0 0 22px rgba(139,0,0,0.16),
0 10px 24px rgba(0,0,0,0.52),
inset 0 1px 0 rgba(255,255,255,0.055),
inset 0 0 14px rgba(255,45,85,0.045) !important;
animation: none !important;
filter: saturate(0.92) brightness(0.94) !important;
}
#modalContent .aka-archive-file-card.is-sealed .aka-archive-recover-btn:disabled::after {
display: none !important;
}
#modalContent .aka-archive-recovered-badge::before {
content: "";
position: absolute;
inset: -1px;
border-radius: inherit;
pointer-events: none;
background: linear-gradient(90deg, transparent, rgba(255,236,190,0.13), transparent);
opacity: 0.55;
}
#modalContent .aka-archive-recovered-badge span {
position: relative;
z-index: 1;
font-size: inherit !important;
letter-spacing: inherit !important;
line-height: inherit !important;
}
/* Preserve bonus as stronger gold/reward variant if bonus cards return later. */
#modalContent .aka-archive-file-card.is-bonus-recovered .aka-archive-recovered-badge {
border-color: rgba(212,168,67,0.78) !important;
box-shadow:
0 0 0 1px rgba(212,168,67,0.17),
0 0 16px rgba(212,168,67,0.38),
0 0 32px rgba(255,45,85,0.14),
inset 0 0 16px rgba(212,168,67,0.08) !important;
}
@media (max-width: 768px) {
#modalContent .aka-archive-recover-btn {
min-height: 2.22rem !important;
border-radius: 9px !important;
font-size: 0.50rem !important;
letter-spacing: 0.12em !important;
}
#modalContent .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled) {
animation: none !important;
}
}
@media (prefers-reduced-motion: reduce) {
#modalContent .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled) {
animation: none !important;
}
#modalContent .aka-archive-recover-btn,
#modalContent .aka-archive-recover-btn::after {
transition: none !important;
}
}
/* =========================================================
PHASE 2A.2 — ARCHIVE BADGE SCALE + SEALED CARD PRIVACY FIX
Keeps RECOVER / LOCKED / RECOVERED on the same badge-size system.
Sealed cards no longer show a recognizable blurred poster underneath.
========================================================= */
#modalContent .aka-archive-file-card.is-sealed {
background:
radial-gradient(ellipse at 50% 42%, rgba(33, 42, 54, 0.34), transparent 58%),
radial-gradient(circle at 50% 47%, rgba(255, 45, 85, 0.075), transparent 36%),
linear-gradient(180deg, #07090c 0%, #050404 54%, #020101 100%) !important;
}
#modalContent .aka-archive-file-card.is-sealed img.aka-archive-sealed-cover {
opacity: 0.08 !important;
filter:
blur(24px)
brightness(0.24)
contrast(1.02)
saturate(0.18) !important;
transform: translate(-50%, -50%) scale(1.12) !important;
}
#modalContent .aka-archive-file-card.is-sealed::before {
background:
radial-gradient(circle at 50% 42%, rgba(212, 168, 67, 0.055), transparent 22%),
radial-gradient(circle at 50% 48%, rgba(255, 45, 85, 0.105), transparent 38%),
linear-gradient(180deg, rgba(0,0,0,0.48), rgba(3,2,2,0.56) 46%, rgba(0,0,0,0.86)) !important;
}
#modalContent .aka-archive-file-card.is-sealed .aka-sealed-poster-veil {
background:
radial-gradient(circle at 50% 42%, rgba(255, 45, 85, 0.10), transparent 35%),
linear-gradient(180deg, rgba(0,0,0,0.52), rgba(4,2,2,0.54) 45%, rgba(0,0,0,0.88)) !important;
}
#modalContent .aka-archive-file-card.is-sealed .aka-archive-file-inner {
background:
radial-gradient(circle at 50% 45%, rgba(255,45,85,0.13), transparent 42%),
linear-gradient(180deg, rgba(0,0,0,0.12), rgba(0,0,0,0.46)) !important;
}
#modalContent .aka-archive-file-card.is-sealed > .absolute.inset-x-0.bottom-0,
#modalContent .aka-archive-file-card.is-recovered > .absolute.inset-x-0.bottom-0 {
left: 0.68rem !important;
right: auto !important;
bottom: 0.68rem !important;
width: auto !important;
padding: 0 !important;
background: transparent !important;
z-index: 14 !important;
}
#modalContent .aka-archive-recover-btn,
#modalContent .aka-archive-recovered-badge,
#modalContent .night-kaka-cinematic-archive .aka-archive-recovered-badge,
#modalContent .aka-archive-file-card.is-recovered .aka-archive-recover-btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: auto !important;
min-width: 5.35rem !important;
min-height: 2.02rem !important;
height: 2.02rem !important;
padding: 0 0.72rem !important;
border-radius: 8px !important;
font-size: 0.56rem !important;
line-height: 1 !important;
letter-spacing: 0.145em !important;
white-space: nowrap !important;
}
#modalContent .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled),
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled) {
box-shadow:
0 0 0 1px rgba(74,222,128,0.13),
0 0 10px rgba(74,222,128,0.26),
0 0 22px rgba(16,185,129,0.13),
0 10px 24px rgba(0,0,0,0.58),
inset 0 1px 0 rgba(255,255,255,0.10),
inset 0 0 13px rgba(74,222,128,0.060) !important;
}
#modalContent .aka-archive-file-card.is-sealed .aka-archive-recover-btn:disabled,
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn:disabled {
box-shadow:
0 0 0 1px rgba(255,45,85,0.08),
0 0 8px rgba(255,45,85,0.14),
0 0 18px rgba(139,0,0,0.12),
0 9px 22px rgba(0,0,0,0.54),
inset 0 1px 0 rgba(255,255,255,0.050),
inset 0 0 12px rgba(255,45,85,0.035) !important;
}
#modalContent .aka-archive-recovered-badge {
left: 0.68rem !important;
bottom: 0.68rem !important;
border-radius: 8px !important;
}
@media (max-width: 768px) {
#modalContent .aka-archive-recover-btn,
#modalContent .aka-archive-recovered-badge,
#modalContent .night-kaka-cinematic-archive .aka-archive-recovered-badge,
#modalContent .aka-archive-file-card.is-recovered .aka-archive-recover-btn {
min-width: 4.72rem !important;
min-height: 1.88rem !important;
height: 1.88rem !important;
padding: 0 0.58rem !important;
font-size: 0.50rem !important;
letter-spacing: 0.12em !important;
}
}
/* ===== AKA GAME NOTICE / ACHIEVEMENT SYSTEM: COMPACT AUTO NOTICE ===== */
.aka-game-notice-overlay {
--aka-notice-color: rgba(255,232,162,0.98);
--aka-notice-border: rgba(212,168,67,0.36);
--aka-notice-wash-a: rgba(212,168,67,0.10);
--aka-notice-wash-b: rgba(139,0,0,0.12);
position: fixed;
inset: 0;
z-index: 10050;
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
opacity: 0;
visibility: hidden;
pointer-events: none;
background:
radial-gradient(circle at 50% 38%, var(--aka-notice-wash-a), transparent 34%),
rgba(0,0,0,0.54);
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
transition:
opacity 260ms cubic-bezier(0.23, 1, 0.32, 1),
visibility 260ms ease;
}
.aka-game-notice-overlay.is-visible {
opacity: 1;
visibility: visible;
pointer-events: none;
}
.aka-game-notice-panel {
position: relative;
width: min(465px, 88vw);
overflow: hidden;
padding: 26px 30px 24px;
border: 1px solid var(--aka-notice-border);
text-align: center;
background:
linear-gradient(180deg, rgba(255,238,194,0.038), rgba(0,0,0,0.18)),
radial-gradient(circle at 50% 0%, var(--aka-notice-wash-a), transparent 52%),
radial-gradient(circle at 50% 120%, var(--aka-notice-wash-b), transparent 62%),
rgba(7,6,5,0.90);
box-shadow:
0 0 0 1px rgba(255,238,194,0.035) inset,
0 0 22px color-mix(in srgb, var(--aka-notice-color) 24%, transparent),
0 18px 58px rgba(0,0,0,0.82);
transform: translateY(10px) scale(0.982);
filter: saturate(0.96);
transition:
transform 300ms cubic-bezier(0.23, 1, 0.32, 1),
filter 300ms ease;
}
.aka-game-notice-overlay.is-visible .aka-game-notice-panel {
transform: translateY(0) scale(1);
filter: saturate(1.04);
}
.aka-game-notice-panel::before,
.aka-game-notice-panel::after {
content: '';
position: absolute;
pointer-events: none;
}
.aka-game-notice-panel::before {
inset: 10px;
border: 1px solid color-mix(in srgb, var(--aka-notice-color) 18%, transparent);
box-shadow: inset 0 0 18px color-mix(in srgb, var(--aka-notice-color) 7%, transparent);
}
.aka-game-notice-panel::after {
top: 0;
left: -38%;
width: 34%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255,245,210,0.060), transparent);
transform: skewX(-18deg);
animation: akaGameNoticeSweep 1.55s ease-out 1;
}
@keyframes akaGameNoticeSweep {
from { left: -38%; opacity: 0; }
20% { opacity: 1; }
to { left: 118%; opacity: 0; }
}
.aka-game-notice-orb {
width: 24px;
height: 24px;
margin: 0 auto 14px;
border: 1px solid color-mix(in srgb, var(--aka-notice-color) 64%, transparent);
border-radius: 50%;
background:
radial-gradient(circle at 50% 45%, rgba(255,248,214,0.94) 0 14%, transparent 16%),
radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--aka-notice-color) 24%, transparent), rgba(0,0,0,0.44) 100%);
box-shadow:
0 0 12px color-mix(in srgb, var(--aka-notice-color) 36%, transparent),
0 0 26px color-mix(in srgb, var(--aka-notice-color) 18%, transparent),
inset 0 0 10px rgba(255,238,184,0.10);
animation: akaGameNoticeOrbPulse 1.65s ease-in-out infinite;
}
@keyframes akaGameNoticeOrbPulse {
0%, 100% { transform: scale(1); filter: brightness(1); }
50% { transform: scale(1.055); filter: brightness(1.14); }
}
.aka-game-notice-kicker {
margin-bottom: 10px;
font-family: 'Special Elite', monospace;
font-size: clamp(0.58rem, 1vw, 0.68rem);
letter-spacing: 0.42em;
text-transform: uppercase;
color: color-mix(in srgb, var(--aka-notice-color) 92%, rgba(255,239,207,0.88));
text-shadow:
0 0 8px color-mix(in srgb, var(--aka-notice-color) 28%, transparent),
0 0 16px rgba(0,0,0,0.48);
}
.aka-game-notice-title {
margin: 0 auto;
max-width: 100%;
font-family: 'Bebas Neue', sans-serif;
font-size: clamp(2.05rem, 4.9vw, 3.55rem);
line-height: 0.96;
letter-spacing: 0.082em;
text-transform: uppercase;
color: rgba(255,239,207,0.98);
text-shadow:
0 0 8px rgba(255,245,218,0.16),
0 0 18px color-mix(in srgb, var(--aka-notice-color) 30%, transparent),
0 0 42px color-mix(in srgb, var(--aka-notice-color) 16%, transparent);
}
.aka-game-notice-subtitle {
margin: 13px auto 0;
font-family: 'Special Elite', monospace;
font-size: clamp(0.66rem, 1.25vw, 0.82rem);
line-height: 1.45;
letter-spacing: 0.18em;
text-transform: uppercase;
color: rgba(232,213,183,0.78);
}
.aka-game-notice-footnote,
.aka-game-notice-action {
display: none !important;
}
.aka-game-notice-close {
position: absolute;
top: 0.62rem;
right: 0.66rem;
z-index: 4;
display: inline-flex;
align-items: center;
justify-content: center;
width: 1.78rem;
height: 1.78rem;
padding: 0;
border: 1px solid color-mix(in srgb, var(--aka-notice-color) 30%, transparent);
border-radius: 999px;
background: rgba(4, 3, 3, 0.68);
color: rgba(255, 239, 207, 0.82);
font-family: ui-sans-serif, system-ui, sans-serif;
font-size: 1rem;
line-height: 1;
cursor: pointer;
box-shadow: 0 0 10px color-mix(in srgb, var(--aka-notice-color) 10%, transparent);
transition: border-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}
.aka-game-notice-close:hover,
.aka-game-notice-close:focus-visible {
transform: scale(1.04);
border-color: color-mix(in srgb, var(--aka-notice-color) 58%, transparent);
color: rgba(255, 248, 224, 0.98);
outline: none;
box-shadow: 0 0 14px color-mix(in srgb, var(--aka-notice-color) 24%, transparent);
}
.aka-game-notice-subtitle.is-empty,
.aka-game-notice-footnote.is-empty {
display: none !important;
}
.aka-game-notice-overlay.is-legend,
.aka-game-notice-overlay.is-dominion {
--aka-notice-color: rgba(255,232,162,0.98);
--aka-notice-border: rgba(255,232,162,0.46);
--aka-notice-wash-a: rgba(255,232,162,0.14);
--aka-notice-wash-b: rgba(74,222,128,0.10);
}
.aka-game-notice-overlay.is-dominion {
--aka-notice-color: rgba(74,222,128,0.98);
--aka-notice-border: rgba(74,222,128,0.42);
--aka-notice-wash-a: rgba(74,222,128,0.13);
--aka-notice-wash-b: rgba(255,232,162,0.11);
}
@media (max-width: 768px) {
.aka-game-notice-overlay {
padding: 14px;
backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(3px);
}
.aka-game-notice-panel {
width: min(92vw, 410px);
padding: 23px 18px 22px;
}
.aka-game-notice-panel::before {
inset: 9px;
}
.aka-game-notice-orb {
width: 22px;
height: 22px;
margin-bottom: 12px;
}
.aka-game-notice-kicker {
letter-spacing: 0.30em;
}
.aka-game-notice-title {
font-size: clamp(1.92rem, 9.2vw, 3.15rem);
letter-spacing: 0.055em;
}
.aka-game-notice-subtitle {
letter-spacing: 0.12em;
}
}
@media (prefers-reduced-motion: reduce) {
.aka-game-notice-overlay,
.aka-game-notice-panel,
.aka-game-notice-panel::after,
.aka-game-notice-orb {
animation: none !important;
transition: none !important;
}
}
/* ========================================================================== */
/* ARCHIVE GAME PHASE 1 — QUESTIONS, BONUS, HIDDEN SIGNAL, RECOVERY PENDING */
/* ========================================================================== */
.aka-archive-task-icons {
position: absolute;
top: 2.50rem;
right: 0.52rem;
z-index: 18;
display: flex;
flex-direction: column;
align-items: center;
gap: 0.34rem;
pointer-events: none;
}
.aka-archive-task-icon {
--aka-task-accent: 212, 168, 67;
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
width: 1.74rem;
height: 1.74rem;
flex: 0 0 1.74rem;
padding: 0;
border: 1px solid rgba(var(--aka-task-accent), 0.46);
border-radius: 999px;
background:
radial-gradient(circle at 36% 28%, rgba(255,255,255,0.10), transparent 34%),
linear-gradient(180deg, rgba(var(--aka-task-accent),0.12), rgba(5,3,3,0.96));
color: rgba(var(--aka-task-accent), 0.96);
box-shadow:
0 0 8px rgba(var(--aka-task-accent), 0.18),
inset 0 0 10px rgba(var(--aka-task-accent), 0.05);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
pointer-events: auto;
cursor: pointer;
transition:
transform 180ms cubic-bezier(0.23,1,0.32,1),
border-color 240ms ease,
box-shadow 320ms ease,
filter 240ms ease,
opacity 240ms ease;
}
.aka-archive-task-icon svg {
width: 0.93rem;
height: 0.93rem;
stroke-width: 1.8;
}
.aka-archive-diamond-icon { --aka-task-accent: 139,5,115; }
.aka-archive-magnifier-icon { --aka-task-accent: 74,190,255; }
.aka-archive-bonus-icon { --aka-task-accent: 212,168,67; }
.aka-archive-key-icon.is-standard { --aka-task-accent: 156,105,61; }
.aka-archive-key-icon.is-classified { --aka-task-accent: 226,181,83; }
.aka-archive-key-icon.is-dormant { --aka-task-accent: 118,76,42; opacity: 0.58; filter: saturate(0.80) brightness(0.88); }
.aka-archive-task-icon.is-sealed {
opacity: 0.78;
filter: saturate(0.78) brightness(0.84);
}
.aka-archive-task-icon.is-key-ready,
.aka-archive-task-icon.is-active {
opacity: 1;
filter: none;
}
.aka-archive-task-lock {
position: absolute;
right: -0.23rem;
bottom: -0.22rem;
width: 0.72rem;
height: 0.72rem;
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid rgba(186,177,163,0.40);
border-radius: 999px;
background: #090806;
color: rgba(196,188,176,0.74);
box-shadow: 0 0 6px rgba(0,0,0,0.62);
}
.aka-archive-task-lock svg { width: 0.43rem; height: 0.43rem; stroke-width: 2.1; }
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock {
border-color: rgba(245,198,92,0.94);
color: #f4cf75;
background:#130e05;
box-shadow: 0 0 8px rgba(245,198,92,0.68), 0 0 18px rgba(212,168,67,0.28);
animation: akaMazeLockSignal 2.45s ease-in-out infinite;
}
button.aka-archive-task-icon:hover,
button.aka-archive-task-icon:focus-visible {
transform: translateY(-1px) scale(1.05);
outline: none;
border-color: rgba(var(--aka-task-accent), 0.90);
box-shadow:
0 0 11px rgba(var(--aka-task-accent), 0.40),
0 0 24px rgba(var(--aka-task-accent), 0.18),
inset 0 0 10px rgba(var(--aka-task-accent), 0.08);
}
.aka-archive-task-icon.is-complete {
animation: none;
opacity: 0.98;
/* Preserve the mechanism identity in the center (DIA / MAG / KEY / BONUS). */
color: rgba(var(--aka-task-accent), 0.98);
border-color: rgba(var(--aka-task-accent), 0.60);
box-shadow:
0 0 0 2px rgba(74,222,128,0.68),
0 0 11px rgba(74,222,128,0.28),
inset 0 0 10px rgba(var(--aka-task-accent),0.06);
}
button.aka-archive-task-icon.is-complete { cursor: default; pointer-events: none; }
.aka-archive-task-check {
position: absolute;
right: -0.14rem;
bottom: -0.14rem;
display: none;
align-items: center;
justify-content: center;
width: 0.70rem;
height: 0.70rem;
border: 1px solid rgba(126,240,155,0.88);
border-radius: 999px;
background: #06150b;
color: #8df2a6;
box-shadow: 0 0 8px rgba(74,222,128,0.46);
}
.aka-archive-task-icon.is-complete .aka-archive-task-check { display: inline-flex; }
.aka-archive-task-check svg {
width: 0.45rem !important;
height: 0.45rem !important;
stroke-width: 3.1 !important;
transform: none !important;
filter: drop-shadow(0 0 3px rgba(126,240,155,0.72));
}
.aka-archive-file-card.is-maze-focus {
border-color: rgba(212,168,67,0.92) !important;
box-shadow: 0 0 16px rgba(212,168,67,0.34), 0 0 42px rgba(212,168,67,0.15) !important;
}
.aka-archive-task-icon.is-maze-focus-target {
transform: scale(1.12);
box-shadow: 0 0 14px rgba(var(--aka-task-accent),0.72), 0 0 32px rgba(var(--aka-task-accent),0.30);
}
.aka-archive-file-card.is-recovery-pending {
border-color: rgba(212, 168, 67, 0.38) !important;
box-shadow:
0 0 12px rgba(212, 168, 67, 0.10),
inset 0 0 18px rgba(212, 168, 67, 0.025) !important;
}
.aka-archive-recovered-badge.is-pending {
min-width: 7.35rem !important;
font-size: inherit !important;
letter-spacing: 0.10em !important;
border-color: rgba(212, 168, 67, 0.44) !important;
background:
linear-gradient(180deg, rgba(64, 40, 10, 0.90), rgba(10, 6, 2, 0.94)) !important;
color: rgba(255, 222, 143, 0.96) !important;
box-shadow:
0 0 8px rgba(212, 168, 67, 0.22),
inset 0 0 10px rgba(212, 168, 67, 0.05) !important;
}
.aka-archive-recovered-badge.is-pending span {
color: rgba(255, 222, 143, 0.96) !important;
text-shadow: 0 0 8px rgba(212, 168, 67, 0.30) !important;
}
@keyframes akaArchiveBonusPulse {
0%, 100% {
filter: drop-shadow(0 0 2px rgba(212, 168, 67, 0.28));
box-shadow:
0 0 8px rgba(212, 168, 67, 0.24),
0 0 18px rgba(212, 168, 67, 0.09),
inset 0 0 10px rgba(212, 168, 67, 0.06);
}
50% {
filter: drop-shadow(0 0 5px rgba(255, 222, 137, 0.56));
box-shadow:
0 0 13px rgba(255, 222, 137, 0.44),
0 0 30px rgba(212, 168, 67, 0.19),
inset 0 0 14px rgba(255, 232, 174, 0.10);
}
}
@keyframes akaArchiveSignalPulse {
0%, 100% {
filter: drop-shadow(0 0 2px rgba(255, 45, 85, 0.30));
box-shadow:
0 0 8px rgba(255, 45, 85, 0.25),
0 0 18px rgba(255, 45, 85, 0.10),
inset 0 0 10px rgba(255, 45, 85, 0.07);
}
50% {
filter: drop-shadow(0 0 5px rgba(255, 45, 85, 0.62));
box-shadow:
0 0 13px rgba(255, 45, 85, 0.50),
0 0 30px rgba(255, 45, 85, 0.22),
inset 0 0 14px rgba(255, 45, 85, 0.11);
}
}
.aka-archive-question-modal {
position: fixed;
inset: 0;
z-index: 10040;
display: grid;
place-items: center;
padding: 1.1rem;
background:
radial-gradient(circle at 50% 38%, rgba(202, 151, 80, 0.10), transparent 34%),
radial-gradient(circle at 50% 52%, rgba(123, 20, 35, 0.08), transparent 48%),
rgba(0, 0, 0, 0.82);
backdrop-filter: blur(9px);
-webkit-backdrop-filter: blur(9px);
animation: akaArchiveQuestionIn 180ms ease-out both;
}
.aka-archive-question-modal.is-leaving {
animation: akaArchiveQuestionOut 180ms ease-in both;
}
.aka-archive-question-card {
position: relative;
width: min(31rem, 100%);
padding: 2.05rem 1.55rem 1.55rem;
overflow: hidden;
border: 1px solid rgba(214, 171, 99, 0.46);
border-radius: 12px;
background:
linear-gradient(112deg, transparent 0 28%, rgba(255, 231, 183, 0.025) 43%, transparent 58%),
radial-gradient(circle at 50% -12%, rgba(231, 190, 117, 0.17), transparent 42%),
radial-gradient(circle at 100% 0%, rgba(132, 29, 37, 0.12), transparent 34%),
linear-gradient(155deg, rgba(34, 19, 13, 0.985), rgba(16, 9, 8, 0.992) 48%, rgba(5, 5, 5, 0.997));
box-shadow:
0 0 0 1px rgba(255, 45, 85, 0.055),
0 24px 70px rgba(0, 0, 0, 0.70),
0 0 34px rgba(197, 143, 72, 0.11),
0 0 58px rgba(111, 15, 30, 0.075),
inset 0 1px 0 rgba(255, 240, 205, 0.055),
inset 0 0 46px rgba(0, 0, 0, 0.42);
text-align: center;
}
.aka-archive-question-card::before {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
background:
linear-gradient(90deg, transparent 0 7%, rgba(226, 184, 108, 0.065) 7.18%, transparent 7.36% 92.64%, rgba(226, 184, 108, 0.065) 92.82%, transparent 93%),
repeating-linear-gradient(0deg, rgba(255,255,255,0.014) 0 1px, transparent 1px 4px);
opacity: 0.76;
}
.aka-archive-question-card::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
border-radius: inherit;
background:
linear-gradient(118deg, transparent 0 34%, rgba(255, 237, 199, 0.035) 45%, transparent 56%),
linear-gradient(180deg, rgba(255, 224, 165, 0.035), transparent 18%);
mix-blend-mode: screen;
opacity: 0.62;
}
.aka-archive-question-close {
position: absolute;
top: 0.62rem;
right: 0.66rem;
z-index: 2;
display: inline-flex;
align-items: center;
justify-content: center;
width: 1.8rem;
height: 1.8rem;
border: 1px solid rgba(212, 168, 67, 0.28);
border-radius: 999px;
background: rgba(8, 5, 4, 0.82);
color: rgba(255, 226, 159, 0.82);
font-size: 1rem;
line-height: 1;
cursor: pointer;
}
.aka-archive-question-emblem {
position: relative;
z-index: 1;
display: inline-flex;
align-items: center;
justify-content: center;
width: 3rem;
height: 3rem;
margin-bottom: 0.82rem;
border: 1px solid rgba(255,45,85,0.44);
border-radius: 999px;
background:
radial-gradient(circle at 50% 48%, rgba(255,45,85,0.15), transparent 62%),
rgba(14,3,6,0.68);
box-shadow:
0 0 8px rgba(255,45,85,0.28),
0 0 20px rgba(255,45,85,0.18),
0 0 34px rgba(139,0,0,0.12);
}
.aka-archive-question-kicker,
.aka-archive-question-progress,
.aka-archive-question-source,
.aka-archive-question-error,
.aka-archive-question-submit,
.aka-archive-question-card input {
font-family: "Special Elite", ui-monospace, monospace;
}
.aka-archive-question-kicker {
position: relative;
z-index: 1;
margin: 0;
color: rgba(242, 188, 104, 0.94);
font-size: 0.77rem;
letter-spacing: 0.20em;
text-shadow: 0 0 10px rgba(204, 137, 61, 0.22);
}
/* NIGHT ENGINE — universal multi-question, purchase gate, symbol mission UI */
.aka-archive-question-card.is-multi-question {
width: min(33rem, 100%);
}
.aka-archive-question-progress.is-multi {
color: rgba(241, 202, 106, 0.90);
}
.aka-archive-question-tabs {
position: relative;
z-index: 1;
margin: 0.72rem auto 1.05rem;
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0.48rem;
}
.aka-archive-question-tab {
appearance: none;
-webkit-appearance: none;
min-width: 3.35rem;
padding: 0.42rem 0.66rem 0.38rem;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.34rem;
border: 1px solid rgba(212, 168, 67, 0.26);
border-radius: 999px;
background: rgba(4, 3, 2, 0.76);
color: rgba(244, 231, 198, 0.68);
font-family: "Special Elite", ui-monospace, monospace;
font-size: 0.68rem;
letter-spacing: 0.13em;
cursor: pointer;
transition: border-color 160ms ease, color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}
.aka-archive-question-tab:hover,
.aka-archive-question-tab:focus-visible,
.aka-archive-question-tab.is-active {
border-color: rgba(241, 202, 106, 0.62);
color: rgba(255, 236, 190, 0.96);
background: rgba(36, 22, 5, 0.72);
box-shadow: 0 0 10px rgba(212, 168, 67, 0.12);
outline: none;
}
.aka-archive-question-tab.is-verified {
border-color: rgba(74, 222, 128, 0.48);
color: rgba(177, 255, 204, 0.92);
background: rgba(4, 28, 14, 0.72);
box-shadow: 0 0 10px rgba(74, 222, 128, 0.10);
}
.aka-archive-question-tab-check {
color: rgba(126, 240, 155, 0.96);
font-family: ui-sans-serif, system-ui, sans-serif;
font-size: 0.62rem;
font-weight: 800;
letter-spacing: 0;
}
/* Solved questions are immutable progress markers.
They stay green, cannot be pressed, and do not reopen a duplicate verified form. */
.aka-archive-question-tab.is-verified:disabled,
.aka-archive-question-tab.is-verified[aria-disabled="true"] {
cursor: default !important;
pointer-events: none !important;
opacity: 1 !important;
border-color: rgba(74, 222, 128, 0.48) !important;
color: rgba(177, 255, 204, 0.92) !important;
background: rgba(4, 28, 14, 0.72) !important;
box-shadow: 0 0 10px rgba(74, 222, 128, 0.10) !important;
transform: none !important;
}
.aka-archive-question-verified-status {
position: relative;
z-index: 1;
width: 100%;
min-height: 3.05rem;
margin-top: 1.02rem;
display: flex;
align-items: center;
justify-content: center;
gap: 0.55rem;
border: 1px solid rgba(74, 222, 128, 0.40);
border-radius: 9px;
background:
radial-gradient(ellipse at 50% 0%, rgba(74,222,128,0.08), transparent 68%),
rgba(4, 28, 14, 0.46);
color: rgba(177, 255, 204, 0.90);
box-shadow:
0 0 12px rgba(74,222,128,0.10),
inset 0 0 12px rgba(74,222,128,0.025);
font-family: "Special Elite", ui-monospace, monospace;
font-size: 0.66rem;
line-height: 1;
letter-spacing: 0.18em;
text-transform: uppercase;
pointer-events: none;
user-select: none;
}
.aka-archive-question-verified-check {
color: rgba(126, 240, 155, 0.98);
font-family: ui-sans-serif, system-ui, sans-serif;
font-size: 0.82rem;
font-weight: 900;
line-height: 1;
letter-spacing: 0;
text-shadow: 0 0 7px rgba(74,222,128,0.24);
}
@media (max-width: 640px) {
.aka-archive-question-verified-status {
min-height: 2.82rem;
margin-top: 0.88rem;
gap: 0.46rem;
font-size: 0.60rem;
letter-spacing: 0.15em;
}
}
.aka-archive-question-submit.is-verified {
border-color: rgba(74, 222, 128, 0.38);
color: rgba(177, 255, 204, 0.80);
background: rgba(4, 28, 14, 0.48);
cursor: default;
}
.aka-archive-purchase-card {
max-width: 29rem;
}
.aka-archive-purchase-card .aka-archive-question-kicker {
margin-bottom: 0.58rem;
}
.aka-archive-purchase-icon {
width: 2.8rem;
height: 2.8rem;
margin: 0 auto 0.95rem;
display: grid;
place-items: center;
border: 1px solid rgba(255, 45, 85, 0.46);
border-radius: 999px;
color: rgba(255, 105, 132, 0.96);
background: radial-gradient(circle, rgba(255, 45, 85, 0.18), rgba(10, 2, 4, 0.90) 68%);
box-shadow: 0 0 18px rgba(255, 45, 85, 0.20);
}
.aka-archive-purchase-icon svg {
width: 1.2rem;
height: 1.2rem;
}
.aka-archive-purchase-body {
max-width: 23rem;
margin: 0.85rem auto 1.15rem;
color: rgba(248, 239, 213, 0.82);
font-family: "Special Elite", ui-monospace, monospace;
font-size: 0.76rem;
line-height: 1.7;
}
.aka-archive-purchase-submit {
width: 100%;
}
.aka-archive-purchase-unavailable {
margin: 1rem 0 0;
color: rgba(255, 135, 154, 0.78);
font-family: "Special Elite", ui-monospace, monospace;
font-size: 0.58rem;
letter-spacing: 0.12em;
line-height: 1.6;
}
@media (max-width: 640px) {
.aka-archive-question-tabs {
margin-top: 0.62rem;
gap: 0.4rem;
}
.aka-archive-question-tab {
min-width: 3rem;
padding: 0.40rem 0.56rem 0.36rem;
font-size: 0.63rem;
}
.aka-archive-question-source {
width: min(100%, 20rem);
gap: 0.56rem;
padding: 0.50rem 0.62rem 0.46rem;
}
.aka-archive-question-source-name {
font-size: 0.61rem;
}
.aka-archive-question-answer-source {
margin-top: 0.72rem;
margin-bottom: 0.76rem;
gap: 0.32rem;
font-size: 0.70rem;
letter-spacing: 0.065em;
}
.aka-archive-question-answer-source-icon svg {
width: 0.90rem;
height: 0.90rem;
}
}
.aka-archive-question-progress {
position: relative;
z-index: 1;
margin: 0.42rem 0 1rem;
color: rgba(231, 190, 91, 0.86);
font-size: 0.70rem;
letter-spacing: 0.16em;
}
.aka-archive-question-card h2 {
position: relative;
z-index: 1;
margin: 0;
color: #F8E9D0;
text-shadow:
0 1px 0 rgba(0, 0, 0, 0.65),
0 0 12px rgba(212, 168, 67, 0.10);
font-family: "Bebas Neue", sans-serif;
font-size: clamp(1.52rem, 4vw, 2.05rem);
font-weight: 400;
letter-spacing: 0.055em;
line-height: 1.12;
}
.aka-archive-question-source {
position: relative;
z-index: 1;
width: min(100%, 23rem);
margin: 0.82rem auto 1.18rem;
padding: 0.54rem 0.78rem 0.50rem;
display: grid;
grid-template-columns: minmax(0, 1fr);
align-items: center;
gap: 0.72rem;
border: 1px solid rgba(212, 168, 67, 0.25);
border-radius: 0.62rem;
background:
linear-gradient(180deg, rgba(212, 168, 67, 0.055), rgba(0, 0, 0, 0.15)),
rgba(6, 4, 3, 0.52);
box-shadow:
0 0 11px rgba(212, 168, 67, 0.075),
inset 0 0 11px rgba(212, 168, 67, 0.025);
text-transform: uppercase;
}
.aka-archive-question-source-archive {
min-width: 0;
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0.18rem;
text-align: left;
}
.aka-archive-question-source-label {
color: rgba(255, 242, 215, 0.60);
font-size: 0.56rem;
line-height: 1;
letter-spacing: 0.15em;
}
.aka-archive-question-source-name {
max-width: 100%;
overflow: hidden;
color: rgba(245, 225, 181, 0.83);
font-size: 0.67rem;
font-weight: 400;
line-height: 1.15;
letter-spacing: 0.105em;
text-overflow: ellipsis;
white-space: nowrap;
}
.aka-archive-question-source.is-archive-only,
.aka-archive-question-source.is-linked-file {
grid-template-columns: minmax(0, 1fr);
margin-top: 0;
}
.aka-archive-question-source.is-linked-file .aka-archive-question-source-name {
color: rgba(245, 225, 181, 0.90);
}
.aka-archive-question-answer-source {
position: relative;
z-index: 1;
width: fit-content;
max-width: min(100%, 22rem);
margin: 0.78rem auto 0.82rem;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
gap: 0.38rem;
border: 0;
background: transparent;
color: rgba(255, 241, 207, 0.95);
font-family: var(--font-elite, "Special Elite", ui-monospace, monospace);
font-size: 0.73rem;
line-height: 1;
letter-spacing: 0.075em;
text-transform: uppercase;
box-shadow: none;
}
.aka-archive-question-answer-source-label,
.aka-archive-question-answer-source-divider,
.aka-archive-question-answer-source strong {
display: inline-flex;
align-items: center;
min-height: 1rem;
line-height: 1;
transform: none;
}
.aka-archive-question-answer-source-icon {
display: inline-flex;
align-items: center;
justify-content: center;
color: rgba(246, 207, 112, 0.98);
font-family: ui-monospace, monospace;
font-size: 0.84rem;
line-height: 1;
}
.aka-archive-question-answer-source-icon svg {
width: 0.94rem;
height: 0.94rem;
stroke-width: 1.85;
display: block;
transform: translateY(-0.025rem);
}
.aka-archive-question-answer-source-divider {
color: rgba(224, 184, 84, 0.50);
}
.aka-archive-question-answer-source strong {
color: rgba(255, 239, 201, 0.96);
font-weight: 400;
}
.aka-archive-question-card.is-identity-question:not(.has-source-lock) > h2 {
margin-bottom: 0.22rem;
}
.aka-archive-question-card.is-identity-question:not(.has-source-lock) .aka-archive-question-answer-source {
margin-bottom: 1.08rem;
}
.aka-archive-question-card form {
position: relative;
z-index: 1;
}
.aka-archive-question-card input {
display: block;
width: 100%;
min-height: 3rem;
padding: 0.85rem 1rem;
border: 1px solid rgba(222, 177, 99, 0.34);
border-radius: 9px;
outline: none;
background:
radial-gradient(circle at 50% 0%, rgba(222, 177, 99, 0.055), transparent 68%),
rgba(4, 4, 4, 0.68);
color: rgba(255, 244, 221, 0.98);
font-size: 0.90rem;
letter-spacing: 0.10em;
text-align: center;
text-transform: uppercase;
box-shadow:
inset 0 1px 0 rgba(255, 236, 198, 0.025),
inset 0 0 16px rgba(0, 0, 0, 0.58),
0 0 14px rgba(191, 130, 62, 0.045);
}
.aka-archive-question-card input::placeholder {
color: rgba(238, 198, 130, 0.78);
opacity: 1;
text-shadow: 0 0 8px rgba(202, 142, 68, 0.18);
}
.aka-archive-question-card input:focus {
border-color: rgba(230, 181, 96, 0.64);
box-shadow:
0 0 0 2px rgba(230, 181, 96, 0.075),
0 0 20px rgba(204, 137, 61, 0.16),
inset 0 0 14px rgba(0, 0, 0, 0.55);
}
.aka-archive-question-error {
min-height: 1rem;
margin: 0.52rem 0 0.30rem;
color: transparent;
font-size: 0.58rem;
letter-spacing: 0.15em;
}
.aka-archive-question-error.is-visible {
color: #ff5b78;
text-shadow: 0 0 8px rgba(255, 45, 85, 0.34);
}
.aka-archive-question-submit {
width: 100%;
min-height: 2.82rem;
margin-top: 0.28rem;
border: 1px solid rgba(181, 73, 74, 0.52);
border-radius: 9px;
background:
linear-gradient(110deg, transparent, rgba(255, 224, 173, 0.035), transparent),
linear-gradient(180deg, rgba(124, 28, 36, 0.34), rgba(42, 8, 12, 0.62));
color: rgba(255, 246, 226, 0.99);
font-size: 0.78rem;
letter-spacing: 0.13em;
cursor: pointer;
box-shadow:
0 0 14px rgba(132, 29, 37, 0.14),
inset 0 1px 0 rgba(255, 219, 168, 0.045);
transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.aka-archive-question-submit:hover,
.aka-archive-question-submit:focus-visible {
transform: translateY(-1px);
border-color: rgba(232, 181, 95, 0.66);
outline: none;
box-shadow: 0 0 20px rgba(188, 89, 67, 0.22), 0 0 36px rgba(212, 168, 67, 0.08);
}
@keyframes akaArchiveQuestionIn {
from { opacity: 0; }
to { opacity: 1; }
}
@keyframes akaArchiveQuestionOut {
from { opacity: 1; }
to { opacity: 0; }
}
@media (max-width: 640px) {
.aka-archive-task-icons {
top: 2.18rem;
right: 0.48rem;
gap: 0.27rem;
}
.aka-archive-task-icon {
width: 1.38rem;
height: 1.38rem;
flex-basis: 1.38rem;
}
.aka-archive-task-icon svg {
width: 0.76rem;
height: 0.76rem;
}
.aka-archive-question-modal {
padding:
max(0.72rem, env(safe-area-inset-top, 0px))
0.72rem
max(0.72rem, env(safe-area-inset-bottom, 0px));
overflow-y: auto;
overflow-x: hidden;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
touch-action: pan-y;
}
.aka-archive-question-card {
width: min(100%, 31rem);
max-height: calc(100dvh - 1.44rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
padding: 1.72rem 1.05rem 1.15rem;
overflow-y: auto;
overflow-x: hidden;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
touch-action: pan-y;
scroll-padding-block: 1rem 4.5rem;
border-radius: 13px;
}
.aka-archive-question-modal,
.aka-archive-question-card,
.night-kaka-cinematic-archive {
scrollbar-width: thin;
scrollbar-color: rgba(212, 168, 67, 0.48) transparent;
}
.aka-archive-question-modal::-webkit-scrollbar,
.aka-archive-question-card::-webkit-scrollbar,
.night-kaka-cinematic-archive::-webkit-scrollbar {
width: 4px;
}
.aka-archive-question-modal::-webkit-scrollbar-track,
.aka-archive-question-card::-webkit-scrollbar-track,
.night-kaka-cinematic-archive::-webkit-scrollbar-track {
background: transparent;
}
.aka-archive-question-modal::-webkit-scrollbar-thumb,
.aka-archive-question-card::-webkit-scrollbar-thumb,
.night-kaka-cinematic-archive::-webkit-scrollbar-thumb {
min-height: 34px;
border: 0;
border-radius: 999px;
background:
linear-gradient(
180deg,
rgba(210, 47, 37, 0.62) 0%,
rgba(212, 168, 67, 0.72) 100%
);
box-shadow: 0 0 5px rgba(212, 168, 67, 0.12);
}
.aka-archive-question-modal::-webkit-scrollbar-thumb:hover,
.aka-archive-question-card::-webkit-scrollbar-thumb:hover,
.night-kaka-cinematic-archive::-webkit-scrollbar-thumb:hover {
background:
linear-gradient(
180deg,
rgba(210, 47, 37, 0.68) 0%,
rgba(212, 168, 67, 0.78) 100%
);
}
.aka-archive-question-card h2 {
font-size: clamp(1.30rem, 6.5vw, 1.52rem);
}
.aka-archive-question-card.is-identity-question:not(.has-source-lock) > h2 {
margin-bottom: 0.18rem;
}
.aka-archive-question-card form,
.aka-archive-question-submit {
scroll-margin-bottom: 1rem;
}
}
@media (max-width: 359px) {
.aka-archive-question-modal {
padding-left: 0.55rem;
padding-right: 0.55rem;
}
.aka-archive-question-card {
padding-left: 0.88rem;
padding-right: 0.88rem;
}
.aka-archive-question-kicker {
font-size: 0.70rem;
letter-spacing: 0.17em;
}
.aka-archive-question-progress {
font-size: 0.66rem;
letter-spacing: 0.15em;
}
.aka-archive-question-source {
gap: 0.46rem;
padding-left: 0.54rem;
padding-right: 0.54rem;
}
}
@media (prefers-reduced-motion: reduce) {
.aka-archive-bonus-icon.is-active,
.aka-archive-signal-icon.is-active,
.aka-archive-question-modal {
animation: none !important;
}
}
/* =========================================================
ORIGIN VERIFICATION — CLEAN FINALIZED BASE
- Origin entry shares the recovery-question visual language.
- Origin uses one verification card, without a second outer visual frame.
- RECOVER = gold action, RECOVERED = green completion.
========================================================= */
#modalContent .aka-origin-access-shell {
display: grid;
place-items: center;
min-height: 0;
padding: 0;
background: transparent;
}
#modalContent .aka-origin-question-card {
width: min(31rem, 100%);
}
#modalContent .aka-origin-question-card.is-wrong {
border-color: rgba(255, 45, 85, 0.62);
box-shadow:
0 0 0 1px rgba(255, 45, 85, 0.10),
0 24px 70px rgba(0, 0, 0, 0.70),
0 0 30px rgba(255, 45, 85, 0.18),
inset 0 0 40px rgba(0, 0, 0, 0.40);
}
#modalContent .aka-origin-question-card.is-correct {
border-color: rgba(74, 222, 128, 0.50);
box-shadow:
0 0 0 1px rgba(74, 222, 128, 0.10),
0 24px 70px rgba(0, 0, 0, 0.70),
0 0 30px rgba(74, 222, 128, 0.16),
inset 0 0 40px rgba(0, 0, 0, 0.40);
}
#modalContent .aka-origin-question-card .aka-archive-question-error.is-success {
color: rgba(74, 222, 128, 0.96);
text-shadow: 0 0 8px rgba(74, 222, 128, 0.28);
}
#modalContent .aka-origin-question-card .aka-archive-question-submit:disabled {
cursor: default;
opacity: 0.82;
transform: none;
}
/* Active RECOVER is the gold call-to-action. */
#modalContent .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled),
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled) {
border-color: rgba(212, 168, 67, 0.66) !important;
color: rgba(255, 236, 190, 0.98) !important;
background:
radial-gradient(ellipse at 50% 0%, rgba(212, 168, 67, 0.17), transparent 64%),
linear-gradient(180deg, rgba(57, 36, 7, 0.72), rgba(8, 6, 3, 0.86)) !important;
box-shadow:
0 0 0 1px rgba(212, 168, 67, 0.12),
0 0 12px rgba(212, 168, 67, 0.25),
0 0 24px rgba(155, 123, 47, 0.14),
0 10px 24px rgba(0, 0, 0, 0.58),
inset 0 1px 0 rgba(255, 255, 255, 0.08),
inset 0 0 14px rgba(212, 168, 67, 0.05) !important;
text-shadow: 0 0 7px rgba(212, 168, 67, 0.38) !important;
animation: none !important;
filter: none !important;
}
#modalContent .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled):hover,
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled):hover,
#modalContent .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled):active,
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled):active {
transform: none !important;
border-color: rgba(255, 226, 159, 0.82) !important;
color: rgba(255, 236, 190, 0.98) !important;
background:
radial-gradient(ellipse at 50% 0%, rgba(212, 168, 67, 0.19), transparent 64%),
linear-gradient(180deg, rgba(62, 40, 8, 0.76), rgba(8, 6, 3, 0.88)) !important;
box-shadow:
0 0 0 1px rgba(212, 168, 67, 0.16),
0 0 16px rgba(212, 168, 67, 0.34),
0 0 30px rgba(155, 123, 47, 0.18),
0 10px 24px rgba(0, 0, 0, 0.58),
inset 0 1px 0 rgba(255, 255, 255, 0.10),
inset 0 0 14px rgba(212, 168, 67, 0.06) !important;
text-shadow: 0 0 7px rgba(212, 168, 67, 0.40) !important;
filter: none !important;
}
#modalContent .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled)::after,
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn:not(:disabled)::after {
display: none !important;
}
/* Fully RECOVERED is green. */
#modalContent .aka-archive-file-card.is-recovered:not(.is-recovery-pending) {
border-color: rgba(74, 222, 128, 0.46) !important;
box-shadow:
0 0 0 1px rgba(74, 222, 128, 0.11),
0 0 18px rgba(74, 222, 128, 0.17),
0 0 36px rgba(16, 185, 129, 0.09),
0 18px 42px rgba(0, 0, 0, 0.52),
inset 0 0 22px rgba(74, 222, 128, 0.035) !important;
}
#modalContent .aka-archive-file-card.is-recovered:not(.is-recovery-pending) .aka-archive-recovered-badge,
#modalContent .aka-archive-file-card.is-recovered:not(.is-recovery-pending) .aka-archive-recover-btn,
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-recovered:not(.is-recovery-pending) .aka-archive-recovered-badge {
border-color: rgba(74, 222, 128, 0.62) !important;
color: rgba(190, 255, 211, 0.98) !important;
background:
radial-gradient(ellipse at 50% 0%, rgba(74, 222, 128, 0.14), transparent 64%),
linear-gradient(180deg, rgba(8, 53, 28, 0.76), rgba(3, 13, 8, 0.88)) !important;
box-shadow:
0 0 0 1px rgba(74, 222, 128, 0.11),
0 0 12px rgba(74, 222, 128, 0.24),
0 0 24px rgba(16, 185, 129, 0.13),
inset 0 1px 0 rgba(255, 255, 255, 0.07),
inset 0 0 14px rgba(74, 222, 128, 0.045) !important;
text-shadow: 0 0 7px rgba(74, 222, 128, 0.34) !important;
}
/* Pending remains gold so it cannot be confused with full completion. */
#modalContent .aka-archive-file-card.is-recovery-pending:not(.is-classified) {
/* Core recovered but special/diamond/bonus work remains:
keep the same persistent ACTIVE light until full completion. */
border-color: rgba(255,190,96,0.57) !important;
box-shadow:
0 0 19px rgba(255,45,85,0.22),
0 0 35px rgba(212,168,67,0.145),
0 20px 58px rgba(0,0,0,0.78) !important;
}
#modalContent .aka-archive-file-card.is-recovery-pending .aka-archive-recovered-badge.is-pending {
border-color: rgba(212, 168, 67, 0.68) !important;
color: rgba(255, 236, 190, 0.98) !important;
background:
radial-gradient(ellipse at 50% 0%, rgba(212, 168, 67, 0.18), transparent 64%),
linear-gradient(180deg, rgba(57, 36, 7, 0.78), rgba(8, 6, 3, 0.86)) !important;
}
/* ===== CLASSIFIED / SECRET FILE FRAME SYSTEM =====
Cyan identifies the file class. Recovery badges keep their own status colors.
Ordinary file styling is intentionally untouched. */
#modalContent .aka-archive-file-card.is-classified {
border-color: rgba(182, 255, 241, 0.34) !important;
transition:
transform 0.50s cubic-bezier(0.23, 1, 0.32, 1),
box-shadow 0.48s cubic-bezier(0.23, 1, 0.32, 1),
border-color 0.42s ease !important;
}
/* Secret file still sealed: distinct cyan frame, no outer aura. */
#modalContent .aka-archive-file-card.is-classified.is-sealed {
border-color: rgba(182, 255, 241, 0.34) !important;
box-shadow:
0 0 0 1px rgba(182, 255, 241, 0.035),
0 18px 42px rgba(0, 0, 0, 0.52),
inset 0 0 18px rgba(68, 255, 224, 0.025) !important;
}
/* Secret file opened / fully recovered: same cyan frame, now softly illuminated. */
#modalContent .aka-archive-file-card.is-classified.is-recovered:not(.is-recovery-pending) {
border-color: rgba(182, 255, 241, 0.58) !important;
box-shadow:
0 0 0 1px rgba(182, 255, 241, 0.09),
0 0 18px rgba(68, 255, 224, 0.195),
0 0 38px rgba(74, 168, 255, 0.106),
0 18px 42px rgba(0, 0, 0, 0.54),
inset 0 0 23px rgba(182, 255, 241, 0.041) !important;
}
/* Core recovered but special action still pending: cyan identity remains,
with a quieter classified glow; pending badge stays gold. */
#modalContent .aka-archive-file-card.is-classified.is-recovery-pending {
border-color: rgba(182, 255, 241, 0.48) !important;
box-shadow:
0 0 0 1px rgba(182, 255, 241, 0.06),
0 0 13px rgba(68, 255, 224, 0.12),
0 0 27px rgba(74, 168, 255, 0.064),
0 18px 42px rgba(0, 0, 0, 0.52),
inset 0 0 20px rgba(182, 255, 241, 0.032) !important;
}
/* Hover/touch strengthens only an already opened secret file. */
#modalContent .aka-archive-file-card.is-classified.is-recovered:not(.is-recovery-pending):hover,
#modalContent .aka-archive-file-card.is-classified.is-recovered:not(.is-recovery-pending).active-touch {
border-color: rgba(182, 255, 241, 0.70) !important;
box-shadow:
0 0 0 1px rgba(182, 255, 241, 0.13),
0 0 23px rgba(68, 255, 224, 0.26),
0 0 45px rgba(74, 168, 255, 0.145),
0 20px 48px rgba(0, 0, 0, 0.58),
inset 0 0 25px rgba(182, 255, 241, 0.052) !important;
}
/* Origin access uses the verification card itself as the only visible window. */
.modal-box.aka-origin-access-modal-box {
width: min(31rem, calc(100vw - 2rem));
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
.modal-box.aka-origin-access-modal-box .modal-close {
top: 0.72rem !important;
right: 0.72rem !important;
}
@media (max-width: 640px) {
.modal-box.aka-origin-access-modal-box {
width: min(31rem, calc(100vw - 1.25rem));
margin: auto;
}
#modalContent .aka-origin-access-shell {
min-height: 0;
padding: 0;
}
}
/* ========================================================================== */
/* ORIGIN PHASE 1.5 — SPECIAL TRACE / HOLDER / ARCHIVE UNLOCK NOTICE */
/* ========================================================================== */
.aka-archive-special-hint-modal {
z-index: 10090;
}
.aka-archive-special-hint-card {
position: relative;
max-width: 31rem;
padding-top: 2.35rem;
text-align: center;
}
.aka-archive-special-hint-close,
.aka-archive-unlock-notice-close {
position: absolute;
top: 0.72rem;
right: 0.78rem;
width: 1.9rem;
height: 1.9rem;
border: 0;
border-radius: 999px;
background: rgba(0,0,0,0.28);
color: rgba(255,232,181,0.72);
font: 400 1.25rem/1 ui-sans-serif, system-ui, sans-serif;
cursor: pointer;
transition: color 160ms ease, background 160ms ease, transform 160ms ease;
}
.aka-archive-special-hint-close:hover,
.aka-archive-special-hint-close:focus-visible,
.aka-archive-unlock-notice-close:hover,
.aka-archive-unlock-notice-close:focus-visible {
color: #fff0c4;
background: rgba(212,168,67,0.10);
outline: none;
transform: scale(1.05);
}
.aka-archive-special-hint-icon {
width: 2.6rem;
height: 2.6rem;
margin: 0 auto 1rem;
display: grid;
place-items: center;
border: 1px solid rgba(255,45,149,0.42);
border-radius: 999px;
color: rgba(255,82,172,0.98);
background: radial-gradient(circle, rgba(255,45,149,0.16), rgba(8,2,6,0.86) 68%);
box-shadow: 0 0 17px rgba(255,45,149,0.20), inset 0 0 14px rgba(255,45,149,0.06);
}
.aka-archive-special-hint-icon svg {
width: 1.18rem;
height: 1.18rem;
stroke-width: 1.7;
}
.aka-archive-special-hint-body {
max-width: 25rem;
margin: 0.85rem auto 1.05rem;
color: rgba(248,239,213,0.86);
font-family: 'Special Elite', monospace;
font-size: 0.82rem;
line-height: 1.75;
}
.aka-archive-special-hint-note {
margin: 0;
color: rgba(212,168,67,0.75);
font-family: 'Special Elite', monospace;
font-size: 0.55rem;
letter-spacing: 0.16em;
line-height: 1.55;
}
.aka-archive-unlock-notice {
position: fixed;
inset: 0;
z-index: 10120;
display: grid;
place-items: center;
padding: 1rem;
pointer-events: none;
opacity: 0;
background: radial-gradient(circle at 50% 50%, rgba(122,8,20,0.12), transparent 44%);
transition: opacity 220ms ease;
}
.aka-archive-unlock-notice.is-visible {
opacity: 1;
}
.aka-archive-unlock-notice.is-leaving {
opacity: 0;
}
.aka-archive-unlock-notice-card {
position: relative;
width: min(31rem, calc(100vw - 2rem));
padding: 2.35rem 2rem 2.05rem;
text-align: center;
pointer-events: auto;
border: 1px solid rgba(212,168,67,0.50);
border-radius: 14px;
background:
radial-gradient(circle at 50% 0%, rgba(212,168,67,0.10), transparent 42%),
radial-gradient(circle at 50% 100%, rgba(255,45,85,0.08), transparent 45%),
rgba(5,5,5,0.96);
box-shadow: 0 0 0 1px rgba(255,255,255,0.02), 0 22px 70px rgba(0,0,0,0.72), 0 0 30px rgba(212,168,67,0.10);
transform: translateY(8px) scale(0.985);
transition: transform 220ms ease;
}
.aka-archive-unlock-notice.is-visible .aka-archive-unlock-notice-card {
transform: translateY(0) scale(1);
}
.aka-archive-unlock-notice-kicker {
margin: 0 0 0.72rem;
color: rgba(212,168,67,0.78);
font-family: 'Special Elite', monospace;
font-size: 0.60rem;
letter-spacing: 0.30em;
}
.aka-archive-unlock-notice-card h3 {
margin: 0;
color: rgba(255,240,202,0.98);
font-family: 'Bebas Neue', sans-serif;
font-size: clamp(2rem, 6vw, 3.05rem);
font-weight: 400;
letter-spacing: 0.08em;
line-height: 1;
text-shadow: 0 0 18px rgba(212,168,67,0.22);
}
.aka-archive-unlock-notice-card > p:last-child {
margin: 0.82rem 0 0;
color: rgba(248,239,213,0.58);
font-family: 'Special Elite', monospace;
font-size: 0.68rem;
letter-spacing: 0.13em;
}
@media (max-width: 640px) {
.aka-archive-special-hint-card {
padding: 2.15rem 1.15rem 1.35rem;
}
.aka-archive-unlock-notice-card {
padding: 2.2rem 1.15rem 1.75rem;
}
}
@media (prefers-reduced-motion: reduce) {
.aka-archive-unlock-notice,
.aka-archive-unlock-notice-card {
transition: none !important;
}
}
/* Recovery question fixed-title hint: same visual principle as the Origin trace. */
.aka-archive-question-trace {
position: relative;
z-index: 1;
width: min(20rem, 92%);
margin: 0.95rem auto 1.05rem;
padding: 0.68rem 1rem 0.72rem;
display: grid;
justify-items: center;
gap: 0.16rem;
border-top: 1px solid rgba(212, 168, 67, 0.16);
border-bottom: 1px solid rgba(212, 168, 67, 0.16);
background: linear-gradient(90deg, transparent, rgba(212, 168, 67, 0.035), transparent);
}
.aka-archive-question-trace-label,
.aka-archive-question-trace-instruction {
font-family: "Special Elite", ui-monospace, monospace;
text-transform: uppercase;
text-align: center;
}
.aka-archive-question-trace-label {
color: rgba(212, 168, 67, 0.62);
font-size: 0.56rem;
letter-spacing: 0.22em;
}
.aka-archive-question-trace-value {
display: block;
margin: 0.10rem 0 0.02rem;
font-family: "Bebas Neue", sans-serif;
font-size: clamp(1.48rem, 3.6vw, 1.88rem);
font-weight: 400;
line-height: 0.98;
letter-spacing: 0.08em;
color: #f1ca6a;
text-shadow:
0 0 5px rgba(212, 168, 67, 0.40),
0 0 12px rgba(212, 168, 67, 0.16),
0 0 22px rgba(255, 45, 85, 0.05);
}
.aka-archive-question-trace-instruction {
color: rgba(232, 213, 183, 0.46);
font-size: 0.52rem;
letter-spacing: 0.15em;
}
/* ========================================================================== */
/* PHASE 3.1 — ORIGIN + NIGHT INSPECT / CINEMATIC FILE REVEAL */
/* Bottom action hierarchy: LOCKED -> INSPECT -> RECOVER -> RECOVERED. */
/* Top-right is reserved for DOWNLOAD after inspection. */
/* ========================================================================== */
#modalContent .aka-archive-inspect-btn {
position: relative;
z-index: 1;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.38rem;
width: auto;
min-width: 5.35rem;
min-height: 2.02rem;
height: 2.02rem;
padding: 0 0.72rem;
border: 1px solid rgba(212, 168, 67, 0.66);
border-radius: 8px;
background:
radial-gradient(ellipse at 50% 0%, rgba(255, 228, 158, 0.15), transparent 64%),
linear-gradient(180deg, rgba(58, 37, 8, 0.78), rgba(8, 6, 3, 0.90));
color: rgba(255, 236, 190, 0.98);
box-shadow:
0 0 0 1px rgba(212,168,67,0.11),
0 0 11px rgba(212,168,67,0.24),
0 0 22px rgba(155,123,47,0.12),
0 10px 24px rgba(0,0,0,0.58),
inset 0 1px 0 rgba(255,255,255,0.08);
font-family: var(--font-elite, "Special Elite", ui-monospace, monospace);
font-size: 0.56rem;
line-height: 1;
letter-spacing: 0.145em;
text-transform: uppercase;
white-space: nowrap;
text-shadow: 0 0 7px rgba(212,168,67,0.34);
cursor: pointer;
overflow: hidden;
isolation: isolate;
transition:
transform 190ms cubic-bezier(0.23, 1, 0.32, 1),
border-color 260ms ease,
background 260ms ease,
box-shadow 280ms ease,
color 260ms ease,
opacity 180ms ease;
}
#modalContent .aka-archive-inspect-btn::before {
content: "";
position: absolute;
inset: 1px;
z-index: -1;
border-radius: inherit;
background: linear-gradient(180deg, rgba(255,255,255,0.055), rgba(0,0,0,0.06));
pointer-events: none;
}
#modalContent .aka-archive-inspect-btn span {
display: block;
line-height: 1;
}
#modalContent .aka-archive-inspect-btn svg {
display: block;
width: 0.78rem;
height: 0.78rem;
flex: 0 0 auto;
stroke-width: 1.7;
transform: translateY(-0.02rem);
filter: drop-shadow(0 0 4px rgba(212,168,67,0.28));
}
@media (any-hover: hover) {
#modalContent .aka-archive-inspect-btn:hover,
#modalContent .aka-archive-inspect-btn:focus-visible {
transform: translateY(-1px);
border-color: rgba(255, 226, 159, 0.82);
color: rgba(255, 244, 214, 1);
box-shadow:
0 0 0 1px rgba(212,168,67,0.15),
0 0 15px rgba(212,168,67,0.32),
0 0 28px rgba(155,123,47,0.16),
0 11px 26px rgba(0,0,0,0.60),
inset 0 1px 0 rgba(255,255,255,0.10);
}
}
#modalContent .aka-archive-inspect-btn.is-activating {
opacity: 0.62;
transform: scale(0.97);
pointer-events: none;
}
/* Inspected but not recovered: same final poster geometry as RECOVERED. */
#modalContent .aka-archive-file-card.is-inspected:not(.is-recovered):not(.is-classified) {
/* Persistent ACTIVE glow. Slightly stronger than 3.1f so RECOVER
carries the same satisfying light presence as SEALED hover. */
border-color: rgba(255,190,96,0.57) !important;
box-shadow:
0 0 19px rgba(255,45,85,0.22),
0 0 35px rgba(212,168,67,0.145),
0 20px 58px rgba(0,0,0,0.78) !important;
}
#modalContent .aka-archive-file-card.is-inspected:not(.is-recovered) img.aka-archive-revealed-poster {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
object-position: center center !important;
transform: none !important;
transform-origin: center center !important;
padding: 0.42rem !important;
margin: 0 !important;
opacity: 1 !important;
filter: none !important;
display: block !important;
border-radius: inherit !important;
}
#modalContent .aka-archive-file-card.is-inspected:not(.is-recovered) > .absolute.inset-x-0.bottom-0 {
left: 0.68rem !important;
right: auto !important;
bottom: 0.68rem !important;
width: auto !important;
padding: 0 !important;
background: transparent !important;
z-index: 14 !important;
display: flex !important;
align-items: center !important;
}
/* Inspected progression action must remain visible:
INSPECT -> RECOVER (or LOCKED when a real recovery gate still applies). */
#modalContent .aka-archive-file-card.is-inspected:not(.is-recovered) .aka-archive-recover-btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: auto !important;
min-width: 5.35rem !important;
min-height: 2.02rem !important;
height: 2.02rem !important;
padding: 0 0.76rem !important;
border-radius: 8px !important;
font-size: 0.56rem !important;
line-height: 1 !important;
letter-spacing: 0.145em !important;
white-space: nowrap !important;
}
#modalContent .aka-archive-file-card.is-inspected:not(.is-recovered) .aka-archive-recover-btn:not(:disabled) {
border-color: rgba(212, 168, 67, 0.66) !important;
color: rgba(255, 236, 190, 0.98) !important;
background:
radial-gradient(ellipse at 50% 0%, rgba(212, 168, 67, 0.17), transparent 64%),
linear-gradient(180deg, rgba(57, 36, 7, 0.72), rgba(8, 6, 3, 0.86)) !important;
box-shadow:
0 0 0 1px rgba(212, 168, 67, 0.12),
0 0 12px rgba(212, 168, 67, 0.25),
0 0 24px rgba(155, 123, 47, 0.14),
0 10px 24px rgba(0, 0, 0, 0.58),
inset 0 1px 0 rgba(255,255,255,0.08),
inset 0 0 14px rgba(212,168,67,0.05) !important;
text-shadow: 0 0 7px rgba(212,168,67,0.38) !important;
animation: none !important;
filter: none !important;
}
@media (any-hover: hover) {
#modalContent .aka-archive-file-card.is-inspected:not(.is-recovered) .aka-archive-recover-btn:not(:disabled):hover,
#modalContent .aka-archive-file-card.is-inspected:not(.is-recovered) .aka-archive-recover-btn:not(:disabled):focus-visible {
border-color: rgba(255, 226, 159, 0.82) !important;
box-shadow:
0 0 0 1px rgba(212,168,67,0.16),
0 0 16px rgba(212,168,67,0.34),
0 0 30px rgba(155,123,47,0.18),
0 10px 24px rgba(0,0,0,0.58),
inset 0 1px 0 rgba(255,255,255,0.10),
inset 0 0 14px rgba(212,168,67,0.06) !important;
}
}
/* Classified identity stays cyan after inspection. */
#modalContent .aka-archive-file-card.is-classified.is-inspected:not(.is-recovered) {
border-color: rgba(182, 255, 241, 0.46) !important;
box-shadow:
0 0 0 1px rgba(182,255,241,0.055),
0 0 12px rgba(68,255,224,0.095),
0 18px 42px rgba(0,0,0,0.54),
inset 0 0 18px rgba(182,255,241,0.030) !important;
}
@media (max-width: 640px) {
#modalContent .aka-archive-inspect-btn {
min-width: 4.72rem;
min-height: 1.88rem;
height: 1.88rem;
padding: 0 0.58rem;
gap: 0.30rem;
font-size: 0.50rem;
letter-spacing: 0.12em;
}
#modalContent .aka-archive-inspect-btn svg {
width: 0.70rem;
height: 0.70rem;
transform: translateY(-0.015rem);
}
#modalContent .aka-archive-file-card.is-inspected:not(.is-recovered) > .absolute.inset-x-0.bottom-0 {
left: 0.58rem !important;
bottom: 0.58rem !important;
}
#modalContent .aka-archive-file-card.is-inspected:not(.is-recovered) .aka-archive-recover-btn {
min-width: 4.72rem !important;
min-height: 1.88rem !important;
height: 1.88rem !important;
padding: 0 0.62rem !important;
font-size: 0.50rem !important;
letter-spacing: 0.12em !important;
}
}
@media (prefers-reduced-motion: reduce) {
#modalContent .aka-archive-inspect-btn {
transition: none !important;
}
}
/* =========================================================
PHASE 3.1e — TRUE IN-PLACE INSPECT CROSSFADE
No archive rerender during INSPECT.
The real poster is loaded under the existing sealed layers,
then the layers dissolve inside the same card.
========================================================= */
#modalContent .aka-archive-file-card.is-inspect-transitioning {
overflow: hidden !important;
transform: none !important;
transition:
border-color 520ms ease,
box-shadow 520ms ease !important;
}
/* Preserve the exact sealed composition long enough to dissolve it,
even after the logical card state has already become INSPECTED. */
#modalContent .aka-archive-file-card.is-inspect-transitioning .aka-archive-file-inner {
position: absolute !important;
inset: 0 !important;
z-index: 6 !important;
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
gap: 0.38rem !important;
width: 100% !important;
min-width: 0 !important;
padding: 2.65rem 0.78rem 3.1rem !important;
border: 0 !important;
border-radius: 0 !important;
background:
radial-gradient(circle at 50% 45%, rgba(255,45,85,0.13), transparent 42%),
linear-gradient(180deg, rgba(0,0,0,0.12), rgba(0,0,0,0.46)) !important;
box-shadow: none !important;
opacity: 1;
filter: blur(0);
transform: translateZ(0);
transition:
opacity 360ms cubic-bezier(0.22, 1, 0.36, 1),
filter 440ms ease !important;
pointer-events: none !important;
}
#modalContent .aka-archive-file-card.is-inspect-transitioning .aka-sealed-poster-veil {
display: block !important;
position: absolute !important;
inset: 0 !important;
z-index: 5 !important;
opacity: 1;
background:
radial-gradient(circle at 50% 42%, rgba(255,45,85,0.10), transparent 35%),
linear-gradient(180deg, rgba(0,0,0,0.52), rgba(4,2,2,0.54) 45%, rgba(0,0,0,0.88)) !important;
transition: opacity 500ms cubic-bezier(0.22, 1, 0.36, 1) !important;
pointer-events: none !important;
}
/* Real poster begins already in its FINAL geometry.
Only darkness/focus dissolve — there is no zoom or position jump. */
#modalContent .aka-archive-file-card.is-inspected.is-inspect-transitioning:not(.is-recovered)
img.aka-archive-revealed-poster {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
object-position: center center !important;
transform: none !important;
padding: 0 !important;
margin: 0 !important;
opacity: 0.26 !important;
filter:
brightness(0.52)
saturate(0.72)
contrast(0.96)
blur(1.15px) !important;
transition:
opacity 500ms cubic-bezier(0.22, 1, 0.36, 1),
filter 520ms cubic-bezier(0.22, 1, 0.36, 1) !important;
will-change: opacity, filter;
}
/* Very restrained frame wake-up. No flash. */
@keyframes akaArchiveInspectFrameWake {
0% { opacity: 0; }
38% { opacity: 0.20; }
68% { opacity: 0.30; }
100% { opacity: 0; }
}
#modalContent .aka-archive-file-card.is-inspect-transitioning::before {
content: "";
position: absolute;
inset: 0;
z-index: 18;
pointer-events: none;
border: 1px solid rgba(255,226,159,0.58);
border-radius: inherit;
box-shadow:
inset 0 0 0 1px rgba(212,168,67,0.10),
inset 0 0 11px rgba(255,226,159,0.06),
0 0 11px rgba(212,168,67,0.06);
opacity: 0;
}
#modalContent .aka-archive-file-card.is-inspect-transitioning.is-inspect-revealing::before {
animation: akaArchiveInspectFrameWake 640ms ease-out both;
}
#modalContent .aka-archive-file-card.is-inspect-transitioning.is-inspect-revealing
.aka-archive-file-inner {
opacity: 0 !important;
filter: blur(0.8px) !important;
}
#modalContent .aka-archive-file-card.is-inspect-transitioning.is-inspect-revealing
.aka-sealed-poster-veil {
opacity: 0 !important;
}
#modalContent .aka-archive-file-card.is-inspected.is-inspect-transitioning.is-inspect-revealing:not(.is-recovered)
img.aka-archive-revealed-poster {
opacity: 1 !important;
filter: none !important;
}
/* INSPECT fades out; RECOVER appears in the same physical slot
in the second half of the reveal. */
#modalContent .aka-archive-progression-action.is-inspect-control-swap {
opacity: 0 !important;
transform: translateY(1px);
transition:
opacity 180ms ease,
transform 180ms ease !important;
}
@keyframes akaArchiveInspectControlEnter {
from {
opacity: 0;
transform: translateY(2px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
#modalContent .aka-archive-progression-action.is-inspect-control-ready,
#modalContent .aka-inspect-download-enter {
animation: akaArchiveInspectControlEnter 260ms ease-out both;
}
@media (max-width: 640px) {
#modalContent .aka-archive-file-card.is-inspect-transitioning .aka-archive-file-inner {
padding: 2.25rem 0.58rem 2.6rem !important;
gap: 0.30rem !important;
}
}
@media (prefers-reduced-motion: reduce) {
#modalContent .aka-archive-file-card.is-inspect-transitioning .aka-archive-file-inner,
#modalContent .aka-archive-file-card.is-inspect-transitioning .aka-sealed-poster-veil,
#modalContent .aka-archive-file-card.is-inspect-transitioning img.aka-archive-revealed-poster,
#modalContent .aka-archive-file-card.is-inspect-transitioning::before,
#modalContent .aka-archive-progression-action.is-inspect-control-ready,
#modalContent .aka-inspect-download-enter {
animation: none !important;
transition: none !important;
}
}
/* Question-level source dependency. Each Q can lock independently. */
.aka-archive-question-tab.is-locked {
border-color: rgba(255, 45, 85, 0.30) !important;
color: rgba(255, 205, 211, 0.72) !important;
background:
radial-gradient(circle at 50% 0%, rgba(255,45,85,0.08), transparent 68%),
rgba(18, 5, 8, 0.58) !important;
box-shadow: inset 0 0 12px rgba(255,45,85,0.035) !important;
}
.aka-archive-question-tab.is-locked.is-active {
border-color: rgba(255, 45, 85, 0.52) !important;
color: rgba(255, 226, 230, 0.94) !important;
box-shadow:
0 0 0 1px rgba(255,45,85,0.08),
0 0 14px rgba(255,45,85,0.13),
inset 0 0 12px rgba(255,45,85,0.05) !important;
}
.aka-archive-question-tab-lock {
width: 0.72rem;
height: 0.72rem;
margin-left: 0.30rem;
color: #FF2D55;
stroke-width: 1.8;
opacity: 0.98;
filter:
drop-shadow(0 0 4px rgba(255,45,85,0.58))
drop-shadow(0 0 8px rgba(139,0,0,0.24));
}
.aka-archive-question-source.is-source-locked {
border-color: rgba(255,45,85,0.26);
background:
linear-gradient(90deg, rgba(255,45,85,0.075), rgba(255,45,85,0.015)),
rgba(0,0,0,0.34);
}
.aka-archive-question-source.is-source-locked .aka-archive-question-source-label {
color: rgba(255, 242, 215, 0.74);
font-size: 0.62rem;
letter-spacing: 0.13em;
}
.aka-archive-question-source.is-source-locked .aka-archive-question-source-name {
color: rgba(255, 235, 195, 0.94);
font-size: 0.82rem;
line-height: 1.18;
letter-spacing: 0.085em;
}
.aka-archive-question-locked-title {
color: rgba(255, 225, 229, 0.96) !important;
text-shadow: 0 0 12px rgba(255,45,85,0.14) !important;
}
.aka-archive-question-source-lock-panel {
position: relative;
z-index: 1;
margin-top: 1.05rem;
padding: 1.15rem 1.05rem 1.05rem;
border: 1px solid rgba(255,45,85,0.24);
border-radius: 10px;
background:
radial-gradient(circle at 50% 0%, rgba(255,45,85,0.085), transparent 62%),
linear-gradient(180deg, rgba(26,5,9,0.62), rgba(5,3,4,0.72));
box-shadow:
inset 0 1px 0 rgba(255,255,255,0.04),
inset 0 0 18px rgba(255,45,85,0.025);
text-align: center;
}
.aka-archive-question-source-lock-icon {
width: 1.85rem;
height: 1.85rem;
margin: 0 auto 0.68rem;
display: grid;
place-items: center;
border: 1px solid rgba(255,45,85,0.42);
border-radius: 999px;
color: #FF2D55;
background:
radial-gradient(circle at 50% 42%, rgba(255,45,85,0.11), transparent 68%),
rgba(20,4,7,0.72);
box-shadow:
0 0 8px rgba(255,45,85,0.20),
0 0 15px rgba(139,0,0,0.10);
}
.aka-archive-question-source-lock-icon svg {
width: 0.86rem;
height: 0.86rem;
stroke-width: 1.7;
}
.aka-archive-question-source-lock-body {
margin: 0;
color: rgba(255, 236, 215, 0.94);
font-family: var(--font-elite, monospace);
font-size: 0.79rem;
line-height: 1.52;
letter-spacing: 0.075em;
text-transform: uppercase;
}
.aka-archive-question-source-lock-note {
margin: 0.68rem 0 0;
color: rgba(255, 242, 215, 0.72);
font-family: var(--font-elite, monospace);
font-size: 0.67rem;
line-height: 1.48;
letter-spacing: 0.075em;
text-transform: uppercase;
}
@media (max-width: 640px) {
.aka-archive-question-source-lock-panel {
padding: 1rem 0.82rem 0.92rem;
}
.aka-archive-question-source-lock-body {
font-size: 0.70rem;
letter-spacing: 0.065em;
}
.aka-archive-question-source-lock-note {
font-size: 0.60rem;
letter-spacing: 0.06em;
}
.aka-archive-question-source.is-source-locked .aka-archive-question-source-label {
font-size: 0.58rem;
}
.aka-archive-question-source.is-source-locked .aka-archive-question-source-name {
font-size: 0.74rem;
}
}
/* =========================================================
PHASE 3.1c — FILE STATE MACHINE / TOUCH SAFETY
Preserve the original recovery model; INSPECT is only a new first step.
LOCKED -> INSPECT -> RECOVER -> RECOVERY PENDING -> RECOVERED
========================================================= */
#modalContent .aka-archive-file-card .aka-archive-progression-action {
position: absolute !important;
left: 0.68rem !important;
right: auto !important;
bottom: 0.68rem !important;
width: auto !important;
max-width: calc(100% - 1.36rem) !important;
padding: 0 !important;
margin: 0 !important;
background: transparent !important;
z-index: 20 !important;
display: flex !important;
align-items: center !important;
justify-content: flex-start !important;
/* Only the visible control is interactive.
The action wrapper can never become an invisible click target over the poster. */
pointer-events: none !important;
}
#modalContent .aka-archive-file-card .aka-archive-progression-action > button,
#modalContent .aka-archive-file-card .aka-archive-progression-action > a {
pointer-events: auto !important;
}
#modalContent .aka-archive-file-card .aka-archive-progression-action[data-archive-progression-state="inspect"] .aka-archive-inspect-btn,
#modalContent .aka-archive-file-card .aka-archive-progression-action[data-archive-progression-state="recover"] .aka-archive-recover-btn,
#modalContent .aka-archive-file-card .aka-archive-progression-action[data-archive-progression-state="locked"] .aka-archive-locked-btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: auto !important;
opacity: 1 !important;
visibility: visible !important;
}
/* RECOVER always occupies the same physical slot that INSPECT occupied. */
#modalContent .aka-archive-file-card.is-inspected:not(.is-recovered)
.aka-archive-progression-action[data-archive-progression-state="recover"]
.aka-archive-recover-btn {
min-width: 5.35rem !important;
min-height: 2.02rem !important;
height: 2.02rem !important;
padding: 0 0.76rem !important;
border-radius: 8px !important;
}
/* SEALED uses the same premium archive-lock red language.
Pressing it may acknowledge the seal, but never opens the file. */
#modalContent .aka-archive-file-card .aka-archive-locked-btn,
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card .aka-archive-locked-btn {
cursor: not-allowed !important;
opacity: 1 !important;
min-width: 5.35rem !important;
min-height: 2.02rem !important;
height: 2.02rem !important;
padding: 0 0.72rem !important;
border-radius: 8px !important;
border-color: rgba(255,45,85,0.64) !important;
color: rgba(255,226,231,0.94) !important;
background:
radial-gradient(ellipse at 50% 0%, rgba(255,45,85,0.18), transparent 62%),
linear-gradient(180deg, rgba(88,7,21,0.70), rgba(11,2,5,0.92)) !important;
box-shadow:
0 0 0 1px rgba(255,45,85,0.11),
0 0 9px rgba(255,45,85,0.23),
0 0 19px rgba(139,0,0,0.14),
0 9px 22px rgba(0,0,0,0.54),
inset 0 1px 0 rgba(255,255,255,0.060),
inset 0 0 13px rgba(255,45,85,0.055) !important;
text-shadow:
0 1px 2px rgba(0,0,0,0.86),
0 0 7px rgba(255,45,85,0.38) !important;
transform: none !important;
filter: none !important;
gap: 0.42rem !important;
}
#modalContent .aka-archive-file-card .aka-archive-locked-btn .aka-archive-locked-btn-icon {
width: 0.82rem !important;
height: 0.82rem !important;
flex: 0 0 0.82rem;
color: #ff4265;
stroke-width: 2.45;
filter:
drop-shadow(0 0 4px rgba(255,45,85,0.98))
drop-shadow(0 0 9px rgba(179,0,36,0.72));
}
#modalContent .aka-archive-file-card .aka-archive-locked-btn::after {
display: none !important;
}
/* FILE badge is informational. It must never inherit a hidden action hit-area. */
#modalContent .aka-archive-file-id-badge {
pointer-events: none !important;
transition:
border-color 260ms ease,
box-shadow 300ms ease,
background 260ms ease,
color 260ms ease !important;
}
/* Ordinary FILE badges stay calm and state-neutral.
Progress is communicated by the CARD perimeter, not the identifier badge. */
/* CLASSIFIED keeps cyan identity in every stage. */
#modalContent .aka-archive-file-card.is-classified .aka-archive-file-id-badge {
border-color: rgba(182,255,241,0.48) !important;
box-shadow:
0 0 9px rgba(182,255,241,0.11),
0 0 16px rgba(74,168,255,0.055),
inset 0 0 8px rgba(182,255,241,0.035) !important;
}
#modalContent .aka-archive-file-card.is-classified .aka-archive-file-id-badge span {
color: rgba(182,255,241,0.96) !important;
text-shadow:
0 0 5px rgba(182,255,241,0.20),
0 0 9px rgba(182,255,241,0.08) !important;
}
/* Touch browsers can keep :hover latched after a tap.
Preserve the SAME SEALED frame aura in every touch state instead of
letting it disappear or change. RECOVERED green styling is untouched. */
@media (hover: none), (pointer: coarse) {
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified),
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified):hover,
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified):active,
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified):focus-within {
border-color: rgba(212,168,67,0.34) !important;
box-shadow:
inset 0 0 0 1px rgba(255,232,176,0.018),
0 0 14px rgba(139,0,0,0.20),
0 18px 46px rgba(0,0,0,0.68) !important;
transform: none !important;
}
#modalContent .aka-archive-file-card .aka-archive-locked-btn:hover,
#modalContent .aka-archive-file-card .aka-archive-locked-btn:focus,
#modalContent .aka-archive-file-card .aka-archive-locked-btn:focus-visible,
#modalContent .aka-archive-file-card .aka-archive-locked-btn:active {
border-color: rgba(255,45,85,0.64) !important;
color: rgba(255,226,231,0.94) !important;
background:
radial-gradient(ellipse at 50% 0%, rgba(255,45,85,0.18), transparent 62%),
linear-gradient(180deg, rgba(88,7,21,0.70), rgba(11,2,5,0.92)) !important;
box-shadow:
0 0 0 1px rgba(255,45,85,0.11),
0 0 9px rgba(255,45,85,0.23),
0 0 19px rgba(139,0,0,0.14),
0 9px 22px rgba(0,0,0,0.54),
inset 0 1px 0 rgba(255,255,255,0.060),
inset 0 0 13px rgba(255,45,85,0.055) !important;
transform: none !important;
filter: none !important;
}
}
@media (max-width: 640px) {
#modalContent .aka-archive-file-card .aka-archive-progression-action {
left: 0.58rem !important;
bottom: 0.58rem !important;
max-width: calc(100% - 1.16rem) !important;
}
#modalContent .aka-archive-file-card .aka-archive-locked-btn,
#modalContent .aka-archive-file-card.is-inspected:not(.is-recovered)
.aka-archive-progression-action[data-archive-progression-state="recover"]
.aka-archive-recover-btn {
min-width: 4.72rem !important;
min-height: 1.88rem !important;
height: 1.88rem !important;
padding: 0 0.62rem !important;
font-size: 0.50rem !important;
letter-spacing: 0.12em !important;
}
}
/* ============================================================
CLASSIFIED FILE — UNCOVERED NOTICE
Shared by classified-file numeric signals and poster-bound
web_action / symbol_sequence completions.
============================================================ */
.aka-archive-classified-signal-notice {
position: fixed;
top: max(1rem, env(safe-area-inset-top));
left: 50%;
z-index: 10160;
width: min(31rem, calc(100vw - 2rem));
pointer-events: none;
opacity: 0;
transform: translate(-50%, -9px) scale(0.985);
transition:
opacity 220ms ease,
transform 240ms cubic-bezier(0.2, 0.82, 0.2, 1);
}
.aka-archive-classified-signal-notice.is-visible {
opacity: 1;
transform: translate(-50%, 0) scale(1);
}
.aka-archive-classified-signal-notice.is-leaving {
opacity: 0;
transform: translate(-50%, -5px) scale(0.992);
}
.aka-archive-classified-signal-notice-card {
position: relative;
display: flex;
align-items: center;
gap: 0.95rem;
min-height: 5.15rem;
padding: 1rem 3.25rem 1rem 1.08rem;
overflow: hidden;
pointer-events: auto;
border: 1px solid rgba(120, 229, 232, 0.48);
border-radius: 13px;
background:
radial-gradient(circle at 11% 50%, rgba(120,229,232,0.11), transparent 32%),
radial-gradient(circle at 88% 0%, rgba(70,145,255,0.085), transparent 42%),
linear-gradient(180deg, rgba(6,18,25,0.975), rgba(3,11,16,0.985));
box-shadow:
0 18px 50px rgba(0,0,0,0.56),
0 0 0 1px rgba(255,255,255,0.018),
0 0 26px rgba(120,229,232,0.11),
inset 0 0 22px rgba(120,229,232,0.025);
}
.aka-archive-classified-signal-notice-card::before {
content: "";
position: absolute;
inset: 0 12% auto;
height: 1px;
background: linear-gradient(90deg, transparent, rgba(175,255,255,0.66), transparent);
opacity: 0.72;
pointer-events: none;
}
.aka-archive-classified-signal-notice-icon {
position: relative;
flex: 0 0 auto;
width: 2.82rem;
height: 2.82rem;
display: grid;
place-items: center;
border: 1px solid rgba(120,229,232,0.38);
border-radius: 999px;
color: rgba(183,255,248,0.96);
background:
radial-gradient(circle, rgba(120,229,232,0.12), rgba(7,21,28,0.48) 64%, rgba(2,9,13,0.86));
box-shadow:
0 0 14px rgba(120,229,232,0.11),
inset 0 0 12px rgba(120,229,232,0.045);
}
.aka-archive-classified-signal-notice-icon svg {
width: 1.15rem;
height: 1.15rem;
stroke-width: 1.65;
filter: drop-shadow(0 0 5px rgba(120,229,232,0.24));
}
.aka-archive-classified-signal-notice-copy {
min-width: 0;
flex: 1 1 auto;
display: flex;
align-items: center;
}
.aka-archive-classified-signal-notice-title {
margin: 0;
color: rgba(220,255,252,0.97);
font-family: "Bebas Neue", sans-serif;
font-size: clamp(1.55rem, 4.5vw, 2.05rem);
font-weight: 400;
line-height: 0.98;
letter-spacing: 0.075em;
text-transform: uppercase;
text-shadow:
0 0 12px rgba(120,229,232,0.15),
0 0 24px rgba(70,145,255,0.055);
}
.aka-archive-classified-signal-notice-close {
position: absolute;
top: 0.62rem;
right: 0.66rem;
width: 1.82rem;
height: 1.82rem;
display: grid;
place-items: center;
border: 0;
border-radius: 999px;
background: rgba(7,26,33,0.58);
color: rgba(183,255,248,0.64);
font: 400 1.18rem/1 ui-sans-serif, system-ui, sans-serif;
cursor: pointer;
transition:
color 160ms ease,
background 160ms ease,
box-shadow 160ms ease;
}
.aka-archive-classified-signal-notice-close:hover,
.aka-archive-classified-signal-notice-close:focus-visible {
color: rgba(226,255,253,0.98);
background: rgba(120,229,232,0.08);
box-shadow: 0 0 10px rgba(120,229,232,0.09);
outline: none;
}
@media (max-width: 640px) {
.aka-archive-classified-signal-notice {
top: max(0.72rem, env(safe-area-inset-top));
width: min(28rem, calc(100vw - 1.15rem));
}
.aka-archive-classified-signal-notice-card {
min-height: 4.7rem;
gap: 0.78rem;
padding: 0.88rem 2.9rem 0.88rem 0.88rem;
border-radius: 12px;
}
.aka-archive-classified-signal-notice-icon {
width: 2.45rem;
height: 2.45rem;
}
.aka-archive-classified-signal-notice-title {
font-size: clamp(1.35rem, 6.2vw, 1.72rem);
letter-spacing: 0.065em;
}
}
@media (prefers-reduced-motion: reduce) {
.aka-archive-classified-signal-notice {
transition: opacity 120ms linear !important;
transform: translate(-50%, 0) scale(1) !important;
}
}
/* ============================================================
PREMIUM QUESTION CONSOLE — FINAL POLISH
Stable Q tabs, readable locked-state metadata, centered identity strip,
and balanced FILE REQUIRED presentation. Visual only.
============================================================ */
/* Stable tab geometry: lock/check states never move the Q row. */
.aka-archive-question-tab {
position: relative;
box-sizing: border-box;
width: 3.55rem;
min-width: 3.55rem;
padding-left: 0.54rem;
padding-right: 0.54rem;
}
.aka-archive-question-tab > span:first-child {
position: relative;
z-index: 1;
}
/* Verified state badge stays centered vertically at the right edge. */
.aka-archive-question-tab-check {
position: absolute;
top: 50%;
right: 0.38rem;
margin: 0;
transform: translateY(-50%);
line-height: 1;
pointer-events: none;
}
/* Locked Q keeps its label visible. The lock sits slightly lower while
preserving the established horizontal spacing beside the Q label. */
.aka-archive-question-tab.is-locked > span:first-child {
opacity: 0.80;
}
.aka-archive-question-tab.is-locked .aka-archive-question-tab-lock {
position: absolute;
top: 53%;
right: 0.40rem;
width: 0.68rem;
height: 0.68rem;
margin: 0;
transform: translateY(-50%);
color: rgba(255, 74, 105, 0.98);
filter: drop-shadow(0 0 4px rgba(255,45,85,0.31));
pointer-events: none;
}
/* Identity/source strip: one natural flex group, centered as a whole.
No horizontal nudges or version-specific transforms. */
.aka-archive-question-answer-source {
--aka-question-mode-accent: rgba(165, 199, 231, 0.97);
--aka-question-mode-divider: rgba(135, 177, 218, 0.52);
--aka-question-mode-value: rgba(220, 236, 250, 0.96);
--aka-question-mode-glow: rgba(104, 166, 224, 0.18);
width: max-content;
max-width: calc(100% - 0.8rem);
margin-left: auto;
margin-right: auto;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.29rem;
font-size: 0.74rem;
line-height: 1.08;
text-align: center;
white-space: nowrap;
transform: none;
}
/* Stable visual language for question modes. Color reinforces the label;
the wording remains the primary cue for accessibility. */
.aka-archive-question-answer-source.is-original-film {
--aka-question-mode-accent: rgba(165, 199, 231, 0.97);
--aka-question-mode-divider: rgba(135, 177, 218, 0.52);
--aka-question-mode-value: rgba(220, 236, 250, 0.96);
--aka-question-mode-glow: rgba(104, 166, 224, 0.18);
}
.aka-archive-question-answer-source.is-archive-poster {
--aka-question-mode-accent: rgba(200, 169, 234, 0.97);
--aka-question-mode-divider: rgba(170, 132, 215, 0.52);
--aka-question-mode-value: rgba(235, 220, 249, 0.96);
--aka-question-mode-glow: rgba(166, 116, 220, 0.18);
}
.aka-archive-question-answer-source.is-poster-lore {
--aka-question-mode-accent: rgba(132, 211, 205, 0.98);
--aka-question-mode-divider: rgba(96, 183, 177, 0.54);
--aka-question-mode-value: rgba(211, 243, 239, 0.96);
--aka-question-mode-glow: rgba(76, 182, 174, 0.18);
}
.aka-archive-question-card.is-identity-question .aka-archive-question-answer-source {
--aka-question-mode-accent: rgba(239, 188, 104, 0.98);
--aka-question-mode-divider: rgba(205, 147, 73, 0.52);
--aka-question-mode-value: rgba(255, 233, 191, 0.97);
--aka-question-mode-glow: rgba(205, 140, 68, 0.20);
padding:.48rem .72rem .43rem;
border:1px solid rgba(178, 75, 70, 0.34);
border-radius:7px;
background:
linear-gradient(110deg, transparent, rgba(255, 225, 178, 0.032), transparent),
linear-gradient(180deg, rgba(105, 27, 31, 0.23), rgba(39, 11, 14, 0.34));
box-shadow:
0 0 14px rgba(111, 25, 32, 0.12),
inset 0 1px 0 rgba(255, 225, 180, 0.035);
}
.aka-archive-question-answer-source-icon {
flex: 0 0 0.94rem;
width: 0.94rem;
height: 0.94rem;
display: inline-flex;
align-items: center;
justify-content: center;
}
.aka-archive-question-answer-source-icon svg {
width: 0.88rem;
height: 0.88rem;
display: block;
transform: translateY(0.015rem);
}
.aka-archive-question-answer-source-label,
.aka-archive-question-answer-source-divider,
.aka-archive-question-answer-source strong {
min-height: 0.94rem;
display: inline-flex;
align-items: center;
line-height: 1.08;
}
.aka-archive-question-answer-source-icon,
.aka-archive-question-answer-source-label {
color: var(--aka-question-mode-accent);
text-shadow: 0 0 8px var(--aka-question-mode-glow);
}
.aka-archive-question-answer-source-icon svg {
filter: drop-shadow(0 0 4px var(--aka-question-mode-glow));
}
.aka-archive-question-answer-source-divider {
margin: 0;
color: var(--aka-question-mode-divider);
}
.aka-archive-question-answer-source strong {
color: var(--aka-question-mode-value);
text-shadow: 0 0 7px var(--aka-question-mode-glow);
}
.aka-archive-question-card.is-identity-question:not(.has-source-lock) .aka-archive-question-answer-source {
margin-top: 0.80rem;
margin-bottom: 1.12rem;
}
/* FILE REQUIRED archive plate: compact, cinematic, and readable. */
.aka-archive-question-source.is-source-locked.is-archive-only {
width: min(100%, 16.75rem);
margin-left: auto;
margin-right: auto;
}
.aka-archive-question-source.is-source-locked.is-archive-only .aka-archive-question-source-archive {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 0.20rem;
text-align: left;
}
.aka-archive-question-source.is-source-locked.is-archive-only .aka-archive-question-source-label {
font-size: 0.64rem;
line-height: 1.05;
text-align: left;
}
.aka-archive-question-source.is-source-locked.is-archive-only .aka-archive-question-source-name {
font-size: 0.86rem;
line-height: 1.12;
text-align: left;
}
/* FILE REQUIRED key remains a clear focal marker without overpowering title. */
.aka-archive-question-source-lock-panel {
padding-top: 1.02rem;
}
.aka-archive-question-source-lock-icon {
width: 2.18rem;
height: 2.18rem;
margin: 0 auto 0.60rem;
transform: translateY(-0.16rem);
border-color: rgba(255,45,85,0.48);
box-shadow:
0 0 9px rgba(255,45,85,0.23),
0 0 18px rgba(139,0,0,0.12);
}
.aka-archive-question-source-lock-icon svg {
width: 1.02rem;
height: 1.02rem;
stroke-width: 1.75;
}
.aka-archive-question-source-lock-body,
.aka-archive-question-source-lock-note {
max-width: 94%;
margin-left: auto;
margin-right: auto;
text-wrap: balance;
}
.aka-archive-question-source-lock-note {
font-size: 0.69rem;
}
@media (max-width: 640px) {
.aka-archive-question-tab {
width: 3.10rem;
min-width: 3.10rem;
padding-left: 0.44rem;
padding-right: 0.44rem;
}
.aka-archive-question-tab-check {
right: 0.29rem;
}
.aka-archive-question-tab.is-locked .aka-archive-question-tab-lock {
top: 53%;
right: 0.30rem;
width: 0.64rem;
height: 0.64rem;
}
.aka-archive-question-answer-source {
max-width: calc(100% - 0.5rem);
gap: 0.26rem;
font-size: 0.69rem;
}
.aka-archive-question-answer-source-icon {
flex-basis: 0.88rem;
width: 0.88rem;
height: 0.88rem;
}
.aka-archive-question-answer-source-icon svg {
width: 0.82rem;
height: 0.82rem;
}
.aka-archive-question-source.is-source-locked.is-archive-only {
width: min(100%, 15.25rem);
}
.aka-archive-question-source.is-source-locked.is-archive-only .aka-archive-question-source-label {
font-size: 0.60rem;
}
.aka-archive-question-source.is-source-locked.is-archive-only .aka-archive-question-source-name {
font-size: 0.79rem;
}
.aka-archive-question-source-lock-panel {
padding-top: 0.94rem;
}
.aka-archive-question-source-lock-icon {
width: 2.02rem;
height: 2.02rem;
margin-bottom: 0.54rem;
transform: translateY(-0.12rem);
}
.aka-archive-question-source-lock-icon svg {
width: 0.94rem;
height: 0.94rem;
}
.aka-archive-question-source-lock-note {
font-size: 0.62rem;
}
}
@media (max-width: 768px) {
.aka-archive-task-icons { top:2.58rem; gap:.30rem; }
.aka-archive-task-icon { width:1.80rem; height:1.80rem; flex-basis:1.80rem; }
.aka-archive-task-icon svg { width:0.96rem; height:0.96rem; }
}
/* ========================================================================== */
/* ARCHIVE MAZE CORE V3.1 — AUTHORITATIVE WALLET / LOCK / TRACE VISUAL LAYER */
/* ========================================================================== */
/* Desktop wallet hierarchy: ID → address → title → holders → signals → counts. */
.aka-wallet-dropdown {
padding:1.02rem 1.04rem .92rem !important;
}
.aka-wallet-dropdown-kicker { margin-bottom:.22rem !important; }
.aka-wallet-dropdown-address { margin-bottom:.72rem !important; }
.aka-wallet-title-section {
margin:.12rem 0 .64rem !important;
padding:.58rem .62rem .56rem !important;
border:1px solid rgba(212,168,67,.11) !important;
border-radius:6px !important;
background:linear-gradient(180deg,rgba(19,14,8,.48),rgba(7,6,5,.44)) !important;
}
.aka-wallet-dropdown-holders { margin:0 0 .70rem !important; }
.aka-wallet-signal-strip {
position:relative !important;
top:auto !important;
right:auto !important;
display:flex !important;
justify-content:center !important;
align-items:center !important;
gap:.54rem !important;
margin:.06rem 0 .72rem !important;
padding:.64rem .24rem .70rem !important;
border-top:1px solid rgba(212,168,67,.09) !important;
border-bottom:1px solid rgba(212,168,67,.12) !important;
}
.aka-wallet-signal-action {
--aka-wallet-signal-rgb:164,160,153;
width:1.78rem !important;height:1.78rem !important;min-width:1.78rem !important;min-height:1.78rem !important;
padding:0 !important;border-radius:5px !important;
border:1px solid rgba(var(--aka-wallet-signal-rgb),.22) !important;
color:rgba(var(--aka-wallet-signal-rgb),.60) !important;
background:radial-gradient(circle at 38% 30%,rgba(255,255,255,.055),transparent 34%),rgba(5,5,5,.76) !important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.025) !important;
opacity:.58;filter:saturate(.28) brightness(.86);
transition:opacity .26s ease,filter .28s ease,border-color .28s ease,box-shadow .34s ease,color .28s ease,transform .18s ease;
}
.aka-wallet-signal-action svg { width:.84rem !important;height:.84rem !important;stroke-width:1.85; }
.aka-wallet-signal-action.is-diamond { --aka-wallet-signal-rgb:139,5,115; }
.aka-wallet-signal-action.is-magnifier {
--aka-wallet-signal-rgb:113,225,232;
color:rgba(174,242,245,.96) !important;
background:
radial-gradient(circle at 49% 43%,rgba(180,247,249,.20) 0 20%,rgba(88,196,201,.045) 21% 35%,transparent 36%),
linear-gradient(145deg,rgba(20,36,38,.90),rgba(3,9,10,.96) 68%) !important;
}
.aka-wallet-signal-action.is-magnifier svg { filter:drop-shadow(0 0 4px rgba(113,225,232,.46)); }
.aka-wallet-signal-action.is-key {
--aka-wallet-signal-rgb:191,105,53;
color:rgba(210,132,76,.96) !important;
background:
radial-gradient(circle at 38% 30%,rgba(219,132,70,.11),transparent 40%),
linear-gradient(145deg,rgba(32,17,10,.90),rgba(5,4,3,.96) 70%) !important;
}
.aka-wallet-signal-action.is-bonus { --aka-wallet-signal-rgb:230,181,83; }
.aka-wallet-signal-action.is-secret { --aka-wallet-signal-rgb:74,168,255; }
.aka-wallet-signal-action.is-neutral { opacity:.50;filter:saturate(.48) brightness(.82); }
.aka-wallet-signal-action.is-stored { opacity:.94;filter:none;color:rgba(var(--aka-wallet-signal-rgb),1) !important;border-color:rgba(var(--aka-wallet-signal-rgb),.48) !important;box-shadow:0 0 9px rgba(var(--aka-wallet-signal-rgb),.23),inset 0 0 10px rgba(var(--aka-wallet-signal-rgb),.045) !important; }
.aka-wallet-signal-action.is-actionable { opacity:1;filter:none;color:rgba(var(--aka-wallet-signal-rgb),1) !important;border-color:rgba(var(--aka-wallet-signal-rgb),.78) !important;box-shadow:0 0 12px rgba(var(--aka-wallet-signal-rgb),.40),0 0 25px rgba(var(--aka-wallet-signal-rgb),.15),inset 0 0 11px rgba(var(--aka-wallet-signal-rgb),.06) !important;animation:none !important;cursor:pointer !important; }
.aka-wallet-signal-action.is-selected {
opacity:1 !important;
filter:none !important;
color:rgba(var(--aka-wallet-signal-rgb),1) !important;
border-color:rgba(var(--aka-wallet-signal-rgb),.88) !important;
box-shadow:0 0 0 2px rgba(4,4,4,.96),0 0 0 3px rgba(var(--aka-wallet-signal-rgb),.42),0 0 18px rgba(var(--aka-wallet-signal-rgb),.28),inset 0 0 13px rgba(var(--aka-wallet-signal-rgb),.08) !important;
}
.aka-wallet-signal-action.is-diamond.is-selected { --aka-wallet-signal-rgb:139,5,115; }
.aka-wallet-signal-action.is-magnifier.is-selected {
--aka-wallet-signal-rgb:113,225,232;
color:rgba(174,242,245,.96) !important;
background:
radial-gradient(circle at 49% 43%,rgba(180,247,249,.20) 0 20%,rgba(88,196,201,.045) 21% 35%,transparent 36%),
linear-gradient(145deg,rgba(20,36,38,.90),rgba(3,9,10,.96) 68%) !important;
}
.aka-wallet-signal-action.is-key.is-selected {
--aka-wallet-signal-rgb:191,105,53;
color:rgba(210,132,76,.96) !important;
background:
radial-gradient(circle at 38% 30%,rgba(219,132,70,.11),transparent 40%),
linear-gradient(145deg,rgba(32,17,10,.90),rgba(5,4,3,.96) 70%) !important;
}
.aka-wallet-signal-action.is-bonus.is-selected { --aka-wallet-signal-rgb:230,181,83; }
.aka-wallet-signal-action.is-secret.is-selected { --aka-wallet-signal-rgb:74,168,255; }
.aka-wallet-signal-action:focus-visible { outline:none !important; }
.aka-wallet-signal-action:disabled { cursor:default !important; }
.aka-wallet-signal-drawer {
display:none;
width:100%;
min-width:0;
box-sizing:border-box;
margin:-.28rem 0 .72rem;
}
.aka-wallet-signal-drawer.is-open { display:block;animation:akaWalletDrawerReveal .28s cubic-bezier(.22,1,.36,1) both; }
@keyframes akaWalletDrawerReveal { from{opacity:0;transform:translateY(-5px) scale(.988)}to{opacity:1;transform:none} }
.aka-wallet-drawer-inner {
--aka-drawer-rgb:180,132,67;
position:relative;
overflow:hidden;
width:calc(100% - .20rem);
height:7.60rem;
min-height:7.60rem;
max-height:7.60rem;
min-width:0;
margin-inline:auto;
display:flex;
flex-direction:column;
box-sizing:border-box;
padding:.72rem;
border:1px solid rgba(var(--aka-drawer-rgb),.25);
border-radius:7px;
background:
radial-gradient(circle at 12% 0%,rgba(var(--aka-drawer-rgb),.105),transparent 45%),
radial-gradient(circle at 100% 100%,rgba(48,126,94,.055),transparent 46%),
linear-gradient(155deg,rgba(8,23,19,.98),rgba(4,13,12,.99) 58%,rgba(3,7,7,.995));
box-shadow:0 12px 28px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.025),inset 0 0 22px rgba(var(--aka-drawer-rgb),.025);
}
.aka-wallet-drawer-inner::before {
content:"";position:absolute;inset:0 auto 0 0;width:1px;
background:linear-gradient(transparent,rgba(var(--aka-drawer-rgb),.78),transparent);
box-shadow:0 0 9px rgba(var(--aka-drawer-rgb),.42);
}
.aka-wallet-drawer-inner.is-diamond { --aka-drawer-rgb:139,5,115; }
.aka-wallet-drawer-inner.is-magnifier {
--aka-drawer-rgb:113,225,232;
background:
radial-gradient(circle at 14% 0%,rgba(151,237,240,.13),transparent 45%),
radial-gradient(circle at 100% 100%,rgba(107,151,153,.05),transparent 48%),
linear-gradient(155deg,rgba(13,27,29,.99),rgba(5,13,14,.995) 58%,rgba(3,8,9,.998));
}
.aka-wallet-drawer-inner.is-key {
--aka-drawer-rgb:191,105,53;
background:
radial-gradient(circle at 14% 0%,rgba(205,116,57,.14),transparent 45%),
radial-gradient(circle at 100% 100%,rgba(121,65,32,.075),transparent 48%),
linear-gradient(155deg,rgba(27,15,9,.99),rgba(12,8,5,.995) 58%,rgba(6,5,4,.998));
}
.aka-wallet-drawer-inner.is-bonus { --aka-drawer-rgb:230,181,83; }
.aka-wallet-drawer-inner.is-secret { --aka-drawer-rgb:74,168,255; }
.aka-wallet-drawer-heading {
display:flex;align-items:center;justify-content:space-between;gap:.65rem;margin:0 0 .58rem;
color:rgba(var(--aka-drawer-rgb),.92);font:600 .48rem/1.2 'Special Elite',monospace;letter-spacing:.13em;
}
.aka-wallet-drawer-stats { display:grid;grid-template-columns:repeat(auto-fit,minmax(4.5rem,1fr));gap:.38rem; }
.aka-wallet-drawer-stat {
min-width:0;min-height:2.65rem;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.34rem;padding:.48rem .46rem;
border:1px solid rgba(var(--aka-drawer-rgb),.13);border-radius:5px;background:rgba(4,4,4,.47);color:rgba(var(--aka-drawer-rgb),.82);
}
.aka-wallet-drawer-stat.is-sealed { color:rgba(232,213,183,.45);border-color:rgba(232,213,183,.10); }
.aka-wallet-drawer-stat.is-ready { color:rgba(121,238,168,.92);border-color:rgba(74,222,128,.20);box-shadow:inset 0 0 12px rgba(74,222,128,.035); }
.aka-wallet-drawer-stat svg { width:.84rem;height:.84rem;stroke-width:1.9;filter:drop-shadow(0 0 4px currentColor); }
.aka-wallet-drawer-stat small { min-width:0;overflow:visible;text-overflow:clip;font:700 .47rem/1.1 'Special Elite',monospace;letter-spacing:.06em;white-space:nowrap;text-shadow:0 0 7px currentColor; }
.aka-wallet-drawer-stat strong { font:700 .68rem/1 'Space Grotesk',sans-serif;color:currentColor; }
.aka-wallet-drawer-key-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.38rem; }
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key-grid { margin-block:auto; }
.aka-wallet-drawer-key {
--aka-key-rgb:205,218,229;
min-width:0;min-height:2.72rem;display:flex;align-items:center;justify-content:center;gap:.36rem;padding:.45rem .22rem;
border:1px solid rgba(var(--aka-key-rgb),.22);border-radius:5px;background:linear-gradient(180deg,rgba(var(--aka-key-rgb),.06),rgba(3,3,3,.72));color:rgba(var(--aka-key-rgb),.95);
appearance:none;font:inherit;cursor:default;
}
.aka-wallet-drawer-key.is-gold { --aka-key-rgb:255,198,53; }
.aka-wallet-drawer-key.is-red { --aka-key-rgb:255,45,85; }
.aka-wallet-drawer-key.is-blue { --aka-key-rgb:55,174,255; }
.aka-wallet-drawer-key svg { width:.82rem;height:.82rem;stroke-width:1.95;filter:drop-shadow(0 0 5px rgba(var(--aka-key-rgb),.48)); }
.aka-wallet-drawer-key strong { font:700 .70rem/1 'Space Grotesk',sans-serif; }
.aka-wallet-drawer-key.is-empty { opacity:.46;filter:saturate(.38) brightness(.80); }
.aka-wallet-drawer-key.is-held { opacity:.78;filter:saturate(.72) brightness(.90); }
.aka-wallet-drawer-key.is-trackable {
opacity:1;cursor:pointer;border-color:rgba(var(--aka-key-rgb),.62);
box-shadow:0 0 11px rgba(var(--aka-key-rgb),.22),inset 0 0 11px rgba(var(--aka-key-rgb),.045);
transition:border-color .2s ease,box-shadow .2s ease,filter .2s ease,transform .16s ease;
}
.aka-wallet-drawer-key.is-trackable:hover,
.aka-wallet-drawer-key.is-trackable:focus-visible {
border-color:rgba(var(--aka-key-rgb),.88);outline:none;filter:brightness(1.08);
box-shadow:0 0 15px rgba(var(--aka-key-rgb),.34),inset 0 0 12px rgba(var(--aka-key-rgb),.07);
}
.aka-wallet-drawer-key.is-trackable:active { transform:translateY(1px); }
.aka-wallet-drawer-footer {
min-width:0;min-height:1.72rem;display:grid;grid-template-columns:3.50rem minmax(0,1fr) 3.50rem;align-items:center;gap:.20rem;margin:auto 0 0;
}
.aka-wallet-track-signal { display:grid;place-items:center;width:1.18rem;height:1.18rem; }
.aka-wallet-track-signal svg {
display:block;width:100%;height:100%;overflow:visible;
stroke:currentColor;stroke-width:1.58;stroke-linecap:round;stroke-linejoin:round;
filter:drop-shadow(0 0 4px rgba(var(--aka-drawer-rgb),.20));
}
.aka-wallet-drawer-footer-status {
min-width:0;text-align:center;color:rgba(232,213,183,.38);font:600 .40rem/1.35 'Special Elite',monospace;letter-spacing:.08em;
}
.aka-wallet-drawer-footer-balance { display:block;width:3.50rem;min-width:3.50rem; }
.aka-wallet-drawer-action {
width:100%;display:flex;align-items:center;justify-content:center;gap:.42rem;margin:.58rem 0 0;padding:.52rem .60rem;
border:1px solid rgba(var(--aka-drawer-rgb),.30);border-radius:5px;background:linear-gradient(180deg,rgba(var(--aka-drawer-rgb),.09),rgba(var(--aka-drawer-rgb),.025));
color:rgba(var(--aka-drawer-rgb),.96);font:600 .44rem/1 'Special Elite',monospace;letter-spacing:.12em;transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .18s ease;
}
.aka-wallet-drawer-action:hover { border-color:rgba(var(--aka-drawer-rgb),.62);background:rgba(var(--aka-drawer-rgb),.10);box-shadow:0 0 14px rgba(var(--aka-drawer-rgb),.14); }
.aka-wallet-drawer-action:active { transform:translateY(1px); }
.aka-wallet-drawer-action svg { width:.72rem;height:.72rem; }
/* Mobile: premium negative space, signals centered instead of pinned to corners. */
.aka-mobile-maze-panel { display:grid !important;grid-template-columns:minmax(0,1fr) !important;gap:.70rem !important;padding-top:.16rem;min-width:0;width:100%;box-sizing:border-box; }
.aka-mobile-holder-chip { width:100%; }
.aka-mobile-wallet-signal-strip { display:grid !important;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;justify-items:center;column-gap:.38rem !important;width:100%;min-width:0;box-sizing:border-box;padding:.66rem .20rem .70rem;border-top:1px solid rgba(212,168,67,.09);border-bottom:1px solid rgba(212,168,67,.11); }
.aka-mobile-wallet-signal-strip .aka-wallet-signal-action {
display:grid !important;
place-items:center !important;
width:2.02rem !important;
min-width:2.02rem !important;
height:2.02rem !important;
min-height:2.02rem !important;
padding:0 !important;
justify-self:center;
line-height:0 !important;
text-align:center !important;
overflow:hidden;
/* State changes stay premium but no longer animate GPU-heavy filter/transform
properties on touch hardware. Border/halo/color carry the transition. */
transition:border-color .18s ease,box-shadow .20s ease,color .16s ease !important;
}
/* Mobile uses the same canonical MAG material as desktop. The generic mobile
face applies only to the other mechanisms, so MAG's cyan glass core cannot
disappear when its state is stored/actionable but the drawer is closed. */
.aka-mobile-wallet-signal-strip .aka-wallet-signal-action:not(.is-magnifier) {
background:
linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.008) 42%,rgba(0,0,0,.16)),
rgba(5,5,5,.84) !important;
}
.aka-mobile-wallet-signal-strip .aka-wallet-signal-action::before,
.aka-mobile-wallet-signal-strip .aka-wallet-signal-action::after {
content:none !important;
display:none !important;
}
.aka-mobile-wallet-signal-strip .aka-wallet-signal-action svg {
position:static !important;
display:block !important;
width:.99rem !important;
height:.99rem !important;
margin:0 !important;
transform:none !important;
}
.aka-mobile-wallet-signal-strip .aka-wallet-signal-action.is-key.is-selected {
background:
radial-gradient(circle at 38% 30%,rgba(219,132,70,.11),transparent 40%),
linear-gradient(145deg,rgba(32,17,10,.90),rgba(5,4,3,.96) 70%) !important;
}
/* Mobile Wallet identity is display-only except for the orbit core and AKA pencil.
This prevents accidental connect/disconnect presses across the full header card. */
#mobileWalletConnectBtn {
pointer-events:none;
transform:none !important;
filter:none !important;
}
#mobileWalletConnectBtn #mobileWalletIconWrap,
#mobileWalletConnectBtn .aka-alias-pencil {
pointer-events:auto;
}
#mobileWalletConnectBtn #mobileWalletIconWrap {
cursor:pointer;
transform:translateY(0) scale(1) translateZ(0);
transform-origin:center;
transition:transform 220ms var(--aka-control-ease),filter 260ms ease;
}
#mobileWalletConnectBtn:active {
transform:none !important;
filter:none !important;
}
#mobileWalletConnectBtn:active #mobileWalletIconWrap {
transform:translateY(.35px) scale(.982) translateZ(0);
filter:brightness(.986);
}
.aka-wallet-signal-drawer.is-mobile { width:100%;min-width:0;box-sizing:border-box;margin:-.05rem 0 .06rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner { padding:.78rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-key { min-height:3rem; }
@media (max-width:320px) {
#mobileMenu > div { padding-left:.72rem !important;padding-right:.72rem !important; }
.aka-mobile-identity-panel { padding:.66rem; }
.aka-mobile-wallet-signal-strip { column-gap:.18rem !important;padding-left:.08rem;padding-right:.08rem; }
.aka-mobile-wallet-signal-strip .aka-wallet-signal-action { width:1.92rem !important;min-width:1.92rem !important;height:1.92rem !important;min-height:1.92rem !important; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner { padding:.66rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-stats { grid-template-columns:repeat(auto-fit,minmax(4.25rem,1fr)); }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-key-grid { gap:.26rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-key { min-height:2.74rem;padding-left:.12rem;padding-right:.12rem;gap:.24rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-footer { grid-template-columns:3.34rem minmax(0,1fr) 3.34rem;gap:.14rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-footer-balance { width:3.34rem;min-width:3.34rem; }
}
/* Poster sidebar: download position/size stays authoritative; only spacing breathes. */
.aka-archive-task-icons { gap:.49rem !important; }
@media (max-width:768px){ .aka-archive-task-icons{top:2.58rem !important;gap:.46rem !important;} .aka-archive-task-icon{width:1.80rem;height:1.80rem;flex-basis:1.80rem;} .aka-archive-task-icon svg{width:.96rem;height:.96rem;} }
/* Magnifier identity: bronze instrument, cold cyan lens. Secret File remains blue. */
.aka-archive-magnifier-icon { --aka-task-accent:184,126,74 !important;background:radial-gradient(circle at 50% 46%,rgba(72,205,235,.16) 0 23%,rgba(72,205,235,.035) 24% 38%,transparent 39%),linear-gradient(180deg,rgba(184,126,74,.12),rgba(5,3,3,.96)) !important; }
.aka-archive-magnifier-icon > svg { color:rgb(196,139,86);filter:drop-shadow(0 0 3px rgba(78,202,235,.42)); }
/* Locked side element: one bright archive-crimson lock, no ring around the lock. */
.aka-archive-task-icon.is-sealed { opacity:.90 !important;filter:saturate(.88) brightness(.92) !important; }
.aka-archive-task-lock { right:-.08rem !important;bottom:-.08rem !important;width:.84rem !important;height:.84rem !important;border:0 !important;border-radius:0 !important;background:radial-gradient(circle,rgba(22,2,7,.98) 0 48%,rgba(22,2,7,.72) 49% 64%,transparent 65%) !important;color:#ff3158 !important;box-shadow:none !important;filter:drop-shadow(0 0 5px rgba(255,45,85,1)) drop-shadow(0 0 12px rgba(179,0,36,.86)) !important;opacity:1 !important;z-index:3; }
.aka-archive-task-lock svg { width:.62rem !important;height:.62rem !important;stroke-width:2.85 !important; }
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock { border:0 !important;background:transparent !important;color:#ff4d6e !important;box-shadow:none !important;filter:drop-shadow(0 0 5px rgba(255,45,85,1)) drop-shadow(0 0 13px rgba(255,45,85,.76)) drop-shadow(0 0 19px rgba(212,168,67,.18)) !important;animation:akaMazeLockSignal 2.28s ease-in-out infinite; }
.aka-archive-question-tab-lock,.aka-archive-question-source-lock-icon { color:#ff3158 !important;filter:drop-shadow(0 0 7px rgba(255,45,85,.72)); }
.aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,.aka-archive-question-source-lock-panel.is-key-lock.is-key-ready .aka-archive-question-source-lock-icon { color:#ff4d6e !important;filter:drop-shadow(0 0 8px rgba(255,45,85,.96)) drop-shadow(0 0 15px rgba(212,168,67,.16));animation:akaMazeLockSignal 2.28s ease-in-out infinite; }
@keyframes akaMazeLockSignal { 0%,100%{filter:brightness(.96) drop-shadow(0 0 5px rgba(255,45,85,.80));transform:scale(1)}50%{filter:brightness(1.22) drop-shadow(0 0 10px rgba(255,45,85,1));transform:scale(1.08)} }
/* File status: NEW TRACE is intentionally temporary; COMPLETED remains identical every time. */
.aka-archive-file-card.is-new-trace { border-color:rgba(92,204,235,.47) !important;box-shadow:0 0 24px rgba(72,190,220,.16),inset 0 0 18px rgba(72,190,220,.035) !important; }
.aka-archive-recovered-badge.is-new-trace { color:rgba(137,227,249,.98) !important;border-color:rgba(91,201,229,.58) !important;background:rgba(13,42,49,.80) !important;box-shadow:0 0 13px rgba(72,190,220,.25) !important; }
.aka-archive-file-card.is-recovered { border-color:rgba(74,222,128,.30) !important;box-shadow:0 0 20px rgba(34,197,94,.10); }
.aka-archive-file-card.is-completed { border-color:rgba(74,222,128,.48) !important;box-shadow:0 0 26px rgba(34,197,94,.17),inset 0 0 16px rgba(34,197,94,.035); }
.aka-archive-recovered-badge.is-completed { border-color:rgba(74,222,128,.62);box-shadow:0 0 12px rgba(74,222,128,.24); }
.aka-archive-file-card.is-completed.is-new-trace { border-color:rgba(74,222,128,.56) !important;box-shadow:0 0 26px rgba(34,197,94,.19),inset 0 0 18px rgba(34,197,94,.045) !important; }
.aka-archive-recovered-badge.is-completed.is-new-trace { color:rgba(179,255,201,.98) !important;border-color:rgba(74,222,128,.66) !important;background:rgba(3,31,13,.88) !important;box-shadow:0 0 13px rgba(34,197,94,.27) !important; }
/* Discovery notices: same premium panel, mechanism-specific icon and color. */
.aka-game-notice-symbol { width:2.72rem;height:2.72rem;margin:0 auto .78rem;display:flex;align-items:center;justify-content:center;border:1px solid color-mix(in srgb,var(--aka-notice-color) 38%,transparent);border-radius:999px;color:var(--aka-notice-color);background:radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--aka-notice-color) 12%,transparent),rgba(5,5,5,.72) 72%);box-shadow:0 0 18px color-mix(in srgb,var(--aka-notice-color) 20%,transparent),inset 0 0 12px rgba(255,255,255,.025); }
.aka-game-notice-symbol svg { width:1.26rem;height:1.26rem;stroke-width:1.8;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--aka-notice-color) 44%,transparent)); }
.aka-game-notice-overlay.is-discovery .aka-game-notice-panel { border-color:var(--aka-notice-border);background:radial-gradient(circle at 50% 0,var(--aka-notice-wash-a),transparent 46%),linear-gradient(180deg,rgba(13,11,9,.985),rgba(4,4,4,.992)); }
/* Wallet/gate focus never bypasses archive accessibility. */
[data-archive].is-wallet-gate-focus { outline:1px solid rgba(212,168,67,.58);outline-offset:3px;box-shadow:0 0 24px rgba(212,168,67,.20) !important; }
/* DYOR remains a physical web-puzzle surface. */
.aka-manifesto-panel { transition:transform .18s ease,border-color .34s ease,box-shadow .38s ease,background .38s ease,filter .34s ease; }
.aka-manifesto-panel.is-dyor-active { transform:translateY(1px) scale(.9985);border-color:rgba(255,45,85,.48) !important;background:radial-gradient(circle at 50% 8%,rgba(139,0,0,.19),transparent 44%),linear-gradient(180deg,rgba(41,6,10,.34),rgba(10,7,6,.95)) !important;box-shadow:0 0 24px rgba(255,45,85,.14),inset 0 0 32px rgba(139,0,0,.09) !important;filter:brightness(1.035); }
.aka-manifesto-panel.is-dyor-active .aka-risk-line { color:#ff5975 !important;text-shadow:0 0 9px rgba(255,45,85,.62),0 0 19px rgba(139,0,0,.30); }
@media (max-width:768px){ .aka-wallet-dropdown-kicker,.aka-wallet-dropdown-address{padding-right:0 !important;} }
@media (prefers-reduced-motion:reduce){ .aka-archive-task-icon.is-key-ready,.aka-archive-task-icon.is-key-ready .aka-archive-task-lock,.aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,.aka-archive-question-source-lock-panel.is-key-lock.is-key-ready .aka-archive-question-source-lock-icon{animation:none !important;} }
/* ========================================================================== */
/* ARCHIVE MAZE V32 — FOUR-KEY GRAMMAR / MOBILE WALLET / EXACT STATE MARKERS */
/* ========================================================================== */
.aka-archive-key-icon.is-silver { --aka-task-accent:205,218,229 !important; }
.aka-archive-key-icon.is-gold { --aka-task-accent:255,198,53 !important; }
.aka-archive-key-icon.is-red { --aka-task-accent:255,45,85 !important; }
.aka-archive-key-icon.is-blue { --aka-task-accent:55,174,255 !important; }
.aka-archive-task-lock.is-silver {
color:#e4edf5 !important;
filter:drop-shadow(0 0 5px rgba(210,225,238,.98)) drop-shadow(0 0 12px rgba(116,147,172,.72)) !important;
}
.aka-archive-task-lock.is-gold {
color:#ffd447 !important;
filter:drop-shadow(0 0 5px rgba(255,209,69,1)) drop-shadow(0 0 13px rgba(204,138,20,.78)) !important;
}
.aka-archive-task-lock.is-red {
color:#ff3158 !important;
filter:drop-shadow(0 0 5px rgba(255,45,85,1)) drop-shadow(0 0 13px rgba(179,0,36,.86)) !important;
}
.aka-archive-task-lock.is-blue {
color:#47bcff !important;
filter:drop-shadow(0 0 5px rgba(71,188,255,1)) drop-shadow(0 0 13px rgba(26,105,210,.82)) !important;
}
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock { opacity:1 !important; }
/* Question locks are always Silver; Bonus and archive locks have their own color. */
.aka-archive-question-tab-lock,
.aka-archive-question-source-lock-icon {
color:#e4edf5 !important;
filter:drop-shadow(0 0 7px rgba(183,207,226,.76)) !important;
}
.aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,
.aka-archive-question-source-lock-panel.is-key-lock.is-key-ready .aka-archive-question-source-lock-icon {
color:#f4f9fd !important;
filter:drop-shadow(0 0 8px rgba(214,234,249,.98)) drop-shadow(0 0 16px rgba(104,156,197,.40)) !important;
}
/* Keep the original task glyph centered. The small corner ring owns the check. */
.aka-archive-task-check {
right:-.13rem !important;
bottom:-.13rem !important;
width:.72rem !important;
height:.72rem !important;
padding:0 !important;
line-height:0 !important;
}
.aka-archive-task-check svg {
display:block !important;
width:.44rem !important;
height:.44rem !important;
margin:0 !important;
transform:translate(0,0) !important;
}
@media (max-width:768px) {
.aka-mobile-identity-panel { width:100%; }
.aka-mobile-maze-panel { gap:.76rem !important; }
.aka-mobile-wallet-signal-strip { margin-top:.02rem; }
}
.aka-trailer-locked-btn.is-blue-key-ready {
color:#47bcff !important;
border-color:rgba(71,188,255,.78) !important;
background:radial-gradient(circle at 50% 20%,rgba(71,188,255,.13),rgba(4,10,18,.76)) !important;
box-shadow:0 0 14px rgba(71,188,255,.32),0 0 30px rgba(26,105,210,.17),inset 0 0 16px rgba(71,188,255,.05) !important;
animation:akaBlueTrailerReady 2.8s ease-in-out infinite;
}
.aka-trailer-locked-btn.is-blue-key-ready .aka-trailer-lock-icon {
color:#47bcff !important;
filter:drop-shadow(0 0 7px rgba(71,188,255,.92));
}
@keyframes akaBlueTrailerReady {
0%,100% { filter:brightness(.96); }
50% { filter:brightness(1.18); }
}
/* ========================================================================== */
/* V32.9 — UNSEAL CONTROLS + STRICT TRACE-FRAME QUESTION CONSOLE */
/* MAG keeps cyan; main questions use the same sharp frame in crimson. */
/* ========================================================================== */
/* UNSEAL and SEALED are two states of one physical archive control. */
#modalContent .aka-archive-file-card
.aka-archive-progression-action[data-archive-progression-state="inspect"]
.aka-archive-inspect-btn,
#modalContent .aka-archive-file-card
.aka-archive-progression-action[data-archive-progression-state="locked"]
.aka-archive-locked-btn {
inline-size:5.9rem !important;
width:5.9rem !important;
min-width:5.9rem !important;
max-width:5.9rem !important;
padding-inline:.54rem !important;
}
/* Main poster questions: warm picture-house memory, not a luxury console. */
.aka-archive-main-question-modal {
--elm-question-accent:108,31,39;
--elm-question-amber:194,132,65;
--elm-question-paper:238,220,190;
padding:1rem;
background:
radial-gradient(ellipse 40% 68% at 50% 3%,rgba(var(--elm-question-amber),.075),transparent 72%),
radial-gradient(ellipse 48% 58% at 50% 48%,rgba(var(--elm-question-accent),.11),transparent 78%),
rgba(0,0,0,.67);
backdrop-filter:blur(6px) saturate(.78);
-webkit-backdrop-filter:blur(6px) saturate(.78);
}
.aka-archive-main-question-modal[data-question-archive="night"] { --elm-question-accent:96,25,37;--elm-question-amber:174,112,62; }
.aka-archive-main-question-modal[data-question-archive="rise"] { --elm-question-accent:120,62,40;--elm-question-amber:205,146,79; }
.aka-archive-main-question-modal[data-question-archive="lost"] { --elm-question-accent:100,49,41;--elm-question-amber:181,122,70; }
.aka-archive-main-question-modal[data-question-archive="dominion"] { --elm-question-accent:128,39,30;--elm-question-amber:194,126,61; }
.aka-archive-main-question-modal[data-question-archive="finale"] { --elm-question-accent:105,38,55;--elm-question-amber:184,118,74; }
.aka-archive-main-question-card,
.aka-archive-main-question-card.is-multi-question {
position:relative;
display:flex;
flex-direction:column;
width:min(34rem,100%);
height:min(30rem,calc(100dvh - 2rem));
min-height:0;
max-height:calc(100dvh - 2rem);
padding:0 1.25rem 1.15rem;
overflow:hidden;
border:1px solid rgba(var(--elm-question-paper),.16);
border-radius:6px;
background:
radial-gradient(ellipse 72% 45% at 50% -8%,rgba(var(--elm-question-amber),.075),transparent 74%),
radial-gradient(ellipse 75% 78% at 105% 52%,rgba(var(--elm-question-accent),.075),transparent 74%),
linear-gradient(158deg,rgba(25,14,12,.992),rgba(11,8,7,.997) 54%,rgba(5,4,4,.998));
box-shadow:
0 0 0 4px rgba(5,3,3,.76),
0 0 0 5px rgba(var(--elm-question-paper),.025),
0 30px 88px rgba(0,0,0,.84),
0 0 54px rgba(var(--elm-question-accent),.09),
inset 0 1px 0 rgba(var(--elm-question-paper),.045),
inset 0 0 42px rgba(0,0,0,.48);
backdrop-filter:blur(3px) saturate(.92);
-webkit-backdrop-filter:blur(3px) saturate(.92);
isolation:isolate;
}
.aka-archive-main-question-card::before {
content:"";
position:absolute;
inset:0;
z-index:0;
pointer-events:none;
background:
linear-gradient(90deg,rgba(0,0,0,.46),transparent 18%,transparent 82%,rgba(0,0,0,.46)),
repeating-linear-gradient(0deg,rgba(var(--elm-question-paper),.010) 0 1px,transparent 1px 4px),
repeating-linear-gradient(113deg,rgba(var(--elm-question-paper),.008) 0 1px,transparent 1px 7px);
opacity:.62;
}
.aka-archive-main-question-card::after {
content:"";
position:absolute;
inset:0;
z-index:0;
pointer-events:none;
background:
radial-gradient(ellipse 34% 74% at 50% -13%,rgba(var(--elm-question-amber),.085),transparent 76%),
linear-gradient(180deg,rgba(var(--elm-question-paper),.018),transparent 26%);
mix-blend-mode:screen;
opacity:.44;
}
.aka-archive-main-question-card > :not(.aka-archive-question-close) {
position:relative;
z-index:1;
}
.aka-archive-main-question-card .aka-archive-question-close {
top:.58rem;
right:.95rem;
width:2.75rem;
height:2.75rem;
border-color:rgba(var(--elm-question-paper),.14);
border-radius:3px;
background:rgba(7,5,4,.66);
color:rgba(var(--elm-question-paper),.56);
transition:
transform .22s cubic-bezier(.22,1,.36,1),
border-color .22s ease,
color .22s ease,
box-shadow .22s ease,
text-shadow .22s ease;
}
.aka-archive-main-question-card .aka-archive-question-close:hover,
.aka-archive-main-question-card .aka-archive-question-close:focus-visible {
transform:none;
border-color:rgba(var(--elm-question-amber),.45);
color:rgba(var(--elm-question-paper),.96);
box-shadow:inset 0 1px 0 rgba(var(--elm-question-paper),.035),0 0 14px rgba(var(--elm-question-amber),.07);
text-shadow:none;
}
.elm-question-console-head {
position:relative;
z-index:1;
flex:0 0 auto;
min-height:4.25rem;
margin:0 -1.25rem;
padding:.94rem 4rem .82rem 1.30rem;
display:flex;
align-items:center;
justify-content:space-between;
gap:1rem;
border-bottom:1px solid rgba(var(--elm-question-paper),.095);
background:
linear-gradient(90deg,rgba(var(--elm-question-accent),.20),transparent 54%),
linear-gradient(180deg,rgba(var(--elm-question-paper),.014),rgba(0,0,0,.16));
box-shadow:0 12px 28px rgba(0,0,0,.17);
}
.elm-question-console-head::after {
content:"";
position:absolute;
left:1.30rem;
right:1.30rem;
bottom:-1px;
height:1px;
background:linear-gradient(90deg,rgba(var(--elm-question-accent),.66),rgba(var(--elm-question-amber),.22) 38%,transparent 84%);
box-shadow:0 0 12px rgba(var(--elm-question-accent),.14);
}
.elm-question-console-brand {
position:relative;
min-width:0;
display:grid;
gap:.26rem;
padding-left:.92rem;
text-align:left;
}
.elm-question-console-brand::before {
content:"";
position:absolute;
width:2px;
height:1.75rem;
left:0;
top:50%;
transform:translateY(-50%);
background:rgba(var(--elm-question-amber),.78);
box-shadow:0 0 12px rgba(var(--elm-question-amber),.19);
}
.elm-question-console-brand span,
.elm-question-console-index span {
color:rgba(var(--elm-question-paper),.68);
font-family:"Space Grotesk",sans-serif;
font-size:.6875rem;
font-weight:500;
line-height:1.2;
letter-spacing:.06em;
}
.elm-question-console-brand strong {
color:rgba(var(--elm-question-paper),.94);
font-family:"Bebas Neue",Impact,sans-serif;
font-size:1.24rem;
font-weight:400;
line-height:1;
letter-spacing:.12em;
text-shadow:0 1px 0 rgba(0,0,0,.74),0 0 15px rgba(var(--elm-question-amber),.045);
}
.elm-question-console-index {
flex:none;
display:grid;
justify-items:end;
gap:.28rem;
padding-right:.15rem;
text-align:right;
}
.elm-question-console-index b {
color:rgba(var(--elm-question-amber),.86);
font-family:"Space Grotesk",sans-serif;
font-size:.6875rem;
font-weight:500;
line-height:1.2;
letter-spacing:.04em;
}
.aka-archive-main-question-card .aka-archive-question-stage {
position:relative;
z-index:1;
flex:1 1 auto;
min-height:0;
width:100%;
display:flex;
flex-direction:column;
justify-content:center;
margin:0;
padding:1rem 1.05rem .92rem;
overflow:hidden;
border:0;
border-top:1px solid rgba(var(--elm-question-paper),.075);
border-bottom:1px solid rgba(var(--elm-question-paper),.065);
border-radius:2px;
background:
radial-gradient(ellipse 72% 54% at 50% 0,rgba(var(--elm-question-amber),.047),transparent 78%),
linear-gradient(180deg,rgba(8,6,5,.73),rgba(3,3,3,.89));
box-shadow:
inset 0 1px 0 rgba(var(--elm-question-paper),.012),
inset 0 0 28px rgba(0,0,0,.48),
0 10px 24px rgba(0,0,0,.14);
}
.aka-archive-main-question-card .aka-archive-question-tabs {
--aka-sealed-glow-in-ms:140ms;
--aka-sealed-glow-out-ms:260ms;
z-index:2;
flex:0 0 auto;
width:100%;
margin:.05rem auto 1.5rem;
gap:.66rem;
padding:.58rem .2rem .48rem;
border:0;
background:radial-gradient(ellipse at center,rgba(var(--elm-question-amber),.025),transparent 68%);
}
.aka-archive-main-question-card .aka-archive-question-tab {
position:relative;
box-sizing:border-box;
width:2.75rem;
min-width:2.75rem;
height:2.75rem;
min-height:2.75rem;
padding:0;
gap:0;
border:1px solid rgba(var(--elm-question-paper),.16);
border-radius:6px;
background:
linear-gradient(180deg,rgba(var(--elm-question-paper),.065),transparent 24%),
linear-gradient(180deg,rgba(26,18,14,.94),rgba(7,5,4,.98));
color:rgba(var(--elm-question-paper),.55);
font-size:.75rem;
letter-spacing:.055em;
text-shadow:0 1px 1px rgba(0,0,0,.88);
box-shadow:
inset 0 1px 0 rgba(var(--elm-question-paper),.075),
inset 0 -3px 5px rgba(0,0,0,.58),
0 1px 0 rgba(var(--elm-question-paper),.025),
0 6px 12px rgba(0,0,0,.26);
transform:translateY(0);
transition:
border-color 180ms ease,
color 180ms ease,
background 180ms ease,
box-shadow 180ms ease,
filter 180ms ease;
}
.aka-archive-main-question-card .aka-archive-question-tab:hover,
.aka-archive-main-question-card .aka-archive-question-tab:focus-visible,
.aka-archive-main-question-card .aka-archive-question-tab.is-active {
border-color:rgba(var(--elm-question-amber),.58);
color:rgba(var(--elm-question-paper),.96);
background:
linear-gradient(180deg,rgba(var(--elm-question-paper),.095),transparent 22%),
radial-gradient(ellipse at 50% 22%,rgba(var(--elm-question-amber),.22),transparent 70%),
linear-gradient(180deg,rgba(73,43,24,.52),rgba(11,7,5,.96));
box-shadow:
0 0 10px rgba(var(--elm-question-amber),.17),
0 0 22px rgba(var(--elm-question-amber),.075),
0 7px 13px rgba(0,0,0,.29),
inset 0 1px 0 rgba(var(--elm-question-paper),.12),
inset 0 -3px 5px rgba(0,0,0,.52);
}
.aka-archive-main-question-card .aka-archive-question-tab.is-active {
animation:elmQuestionCurrentLamp 2900ms ease-in-out infinite;
}
.aka-archive-main-question-card .aka-archive-question-tab:disabled:not(.is-sequence-sealed) {
opacity:1;
border-color:rgba(125,151,91,.40);
color:rgba(220,226,177,.86);
background:
linear-gradient(180deg,rgba(232,239,197,.07),transparent 23%),
radial-gradient(ellipse at 50% 25%,rgba(108,137,68,.16),transparent 72%),
linear-gradient(180deg,rgba(25,35,18,.82),rgba(6,8,5,.96));
box-shadow:
0 0 10px rgba(92,112,53,.075),
0 6px 12px rgba(0,0,0,.24),
inset 0 1px 0 rgba(230,236,189,.08),
inset 0 -3px 5px rgba(0,0,0,.55);
animation:none;
}
.aka-archive-main-question-card .aka-archive-question-tab.is-sequence-sealed,
.aka-archive-main-question-card .aka-archive-question-tab.is-sequence-sealed:hover,
.aka-archive-main-question-card .aka-archive-question-tab.is-sequence-sealed:focus-visible,
.aka-archive-main-question-card .aka-archive-question-tab.is-sequence-sealed:disabled {
cursor:not-allowed;
overflow:visible;
opacity:1;
transform:none;
border-color:rgba(var(--elm-question-accent),.46);
color:rgba(233,205,199,.86);
background:
linear-gradient(180deg,rgba(var(--elm-question-paper),.045),transparent 24%),
radial-gradient(ellipse at 50% 24%,rgba(var(--elm-question-accent),.15),transparent 70%),
linear-gradient(180deg,rgba(var(--elm-question-accent),.16),rgba(7,5,5,.96));
box-shadow:
0 0 0 1px rgba(var(--elm-question-accent),.035),
0 5px 11px rgba(0,0,0,.25),
inset 0 1px 0 rgba(var(--elm-question-paper),.06),
inset 0 -3px 5px rgba(0,0,0,.58);
text-shadow:0 0 7px rgba(var(--elm-question-accent),.26);
}
@keyframes elmQuestionCurrentLamp {
0%,100% {
box-shadow:
0 0 9px rgba(var(--elm-question-amber),.14),
0 0 19px rgba(var(--elm-question-amber),.055),
0 7px 13px rgba(0,0,0,.29),
inset 0 1px 0 rgba(var(--elm-question-paper),.11),
inset 0 -3px 5px rgba(0,0,0,.52);
}
50% {
box-shadow:
0 0 12px rgba(var(--elm-question-amber),.21),
0 0 25px rgba(var(--elm-question-amber),.09),
0 7px 13px rgba(0,0,0,.29),
inset 0 1px 0 rgba(var(--elm-question-paper),.14),
inset 0 -3px 5px rgba(0,0,0,.50);
}
}
@media (prefers-reduced-motion:reduce) {
.aka-archive-main-question-card .aka-archive-question-tab.is-active {
animation:none !important;
}
}
.aka-archive-question-tab-seal {
position:relative;
display:grid;
place-items:center;
font-family:'Special Elite',Georgia,serif;
font-size:.75rem;
font-weight:500;
line-height:1;
letter-spacing:.055em;
color:inherit;
}
.aka-archive-question-sequence-hint {
position:absolute;
z-index:6;
left:50%;
top:calc(100% - .24rem);
width:max-content;
max-width:10rem;
padding:.30rem .45rem;
border:1px solid rgba(151,40,54,.30);
border-radius:3px;
color:rgba(238,220,190,.76);
background:rgba(14,6,7,.96);
box-shadow:0 6px 14px rgba(0,0,0,.42),0 0 9px rgba(151,40,54,.08);
font-family:'Space Grotesk',sans-serif;
font-size:.6875rem;
font-weight:500;
line-height:1.25;
letter-spacing:.02em;
white-space:nowrap;
opacity:0;
visibility:hidden;
transform:translate(-50%,-.16rem);
transition:opacity var(--aka-sealed-glow-in-ms,140ms) ease,transform var(--aka-sealed-glow-in-ms,140ms) ease,visibility 0s linear var(--aka-sealed-glow-out-ms,260ms);
pointer-events:none;
}
.aka-archive-main-question-card .aka-archive-question-tab-check {
top:auto;
right:.17rem;
bottom:.12rem;
transform:none;
font-size:.48rem;
}
.aka-archive-main-question-card .aka-archive-question-tab.is-locked .aka-archive-question-tab-lock {
top:auto;
right:.12rem;
bottom:.10rem;
width:.54rem;
height:.54rem;
transform:none;
}
.aka-archive-main-question-card .aka-archive-question-prompt-scroll {
flex:1 1 auto;
min-height:0;
max-height:none;
margin:0;
padding:.42rem .46rem .72rem;
overflow-y:auto;
overflow-x:hidden;
overscroll-behavior:contain;
scrollbar-width:thin;
scrollbar-color:rgba(var(--elm-question-amber),.24) transparent;
outline:none;
}
.aka-archive-main-question-card .aka-archive-question-prompt-scroll::-webkit-scrollbar {
width:3px;
}
.aka-archive-main-question-card .aka-archive-question-prompt-scroll::-webkit-scrollbar-track {
background:transparent;
}
.aka-archive-main-question-card .aka-archive-question-prompt-scroll::-webkit-scrollbar-thumb {
border-radius:999px;
background:linear-gradient(180deg,rgba(var(--elm-question-amber),.40),rgba(var(--elm-question-accent),.28));
}
.aka-archive-main-question-card .aka-archive-question-prompt-scroll h2 {
margin:auto;
min-height:100%;
display:flex;
align-items:center;
justify-content:center;
color:rgba(var(--elm-question-paper),.96);
font-size:clamp(1.38rem,2.65vw,1.72rem);
line-height:1.15;
letter-spacing:.045em;
text-shadow:
0 1px 0 rgba(0,0,0,.78),
0 0 18px rgba(var(--elm-question-amber),.038);
}
.aka-archive-main-question-card .aka-archive-question-answer-source {
flex:0 0 auto;
width:100%;
max-width:none;
margin:.62rem auto .04rem !important;
padding:.51rem .68rem .46rem !important;
justify-content:flex-start;
font-family:"Space Grotesk",sans-serif;
font-size:.75rem;
line-height:1.3;
border:0 !important;
border-bottom:1px solid rgba(var(--elm-question-paper),.075) !important;
border-radius:0 !important;
background:
linear-gradient(90deg,rgba(var(--elm-question-accent),.095),rgba(var(--elm-question-amber),.025) 44%,transparent 76%) !important;
box-shadow:
inset 0 1px 0 rgba(var(--elm-question-paper),.010) !important;
}
.aka-archive-main-question-card:not(.is-investigation-trace) .aka-archive-question-answer-source-divider {
display:none;
}
.aka-archive-main-question-card:not(.is-investigation-trace) .aka-archive-question-answer-source-label {
color:rgba(var(--elm-question-paper),.68);
font-family:"Space Grotesk",sans-serif;
}
.aka-archive-main-question-card:not(.is-investigation-trace) .aka-archive-question-answer-source strong {
color:rgba(var(--elm-question-paper),.75);
font-family:"Space Grotesk",sans-serif;
font-weight:500;
letter-spacing:.04em;
}
.aka-archive-main-question-card:not(.is-investigation-trace) .aka-archive-question-answer-source-icon {
color:rgba(var(--elm-question-amber),.62);
}
.aka-archive-main-question-card .aka-archive-question-source {
flex:0 0 auto;
margin:.15rem auto .72rem;
}
.aka-archive-main-question-card .aka-archive-question-trace,
.aka-archive-main-question-card .aka-archive-question-verified-status,
.aka-archive-main-question-card .aka-archive-question-source-lock-panel {
flex:0 0 auto;
}
.aka-archive-main-question-card form:not(.elm-question-answer-form) {
flex:0 0 auto;
width:100%;
margin:.16rem auto 0;
display:grid;
grid-template-columns:minmax(0,1fr) 10.75rem;
grid-template-areas:"input submit" "error error";
gap:.58rem .62rem;
align-items:start;
}
.aka-archive-main-question-card form:not(.elm-question-answer-form) input {
grid-area:input;
width:100%;
min-height:2.90rem;
margin-inline:auto;
border-radius:3px;
border-color:rgba(var(--elm-question-paper),.15);
background:
linear-gradient(180deg,rgba(var(--elm-question-paper),.009),transparent),
rgba(3,3,2,.86);
box-shadow:
inset 0 1px 0 rgba(var(--elm-question-paper),.012),
inset 0 0 18px rgba(0,0,0,.66),
0 8px 18px rgba(0,0,0,.16);
color:rgba(var(--elm-question-paper),.93);
font-family:"Space Grotesk",sans-serif;
font-size:1rem;
letter-spacing:.025em;
}
.aka-archive-main-question-card form:not(.elm-question-answer-form) input::placeholder {
color:rgba(var(--elm-question-paper),.54);
opacity:1;
}
/* The answer field stays visually neutral when a question tab moves focus to
it. Keyboard focus remains legible through a restrained border change only. */
.aka-archive-main-question-card form:not(.elm-question-answer-form) input:focus {
outline:none;
border-color:rgba(var(--elm-question-amber),.26);
box-shadow:
inset 0 0 17px rgba(0,0,0,.62),
0 0 14px rgba(var(--elm-question-amber),.025);
}
.aka-archive-main-question-card form:not(.elm-question-answer-form) input:focus-visible {
border-color:rgba(var(--elm-question-amber),.42);
}
.aka-archive-main-question-card form:not(.elm-question-answer-form) .aka-archive-question-error {
grid-area:error;
min-height:1.05rem;
margin:0;
}
.aka-archive-main-question-card .aka-archive-question-error {
font-family:"Space Grotesk",sans-serif;
font-size:.75rem;
line-height:1.4;
letter-spacing:.035em;
}
.aka-archive-main-question-card .aka-archive-question-error.is-visible {
color:#f3a3ad;
text-shadow:none;
}
.aka-archive-main-question-card .elm-question-answer-field:has(input[aria-invalid="true"]),
.aka-archive-main-question-card form:not(.elm-question-answer-form) input[aria-invalid="true"] {
border-color:rgba(243,163,173,.62);
}
.aka-archive-main-question-card form:not(.elm-question-answer-form) .aka-archive-question-submit {
grid-area:submit;
width:100%;
min-height:2.90rem;
margin:0;
display:block;
border-radius:3px;
border-color:rgba(var(--elm-question-accent),.48);
color:rgba(var(--elm-question-paper),.91);
background:
linear-gradient(112deg,transparent,rgba(var(--elm-question-paper),.026),transparent),
linear-gradient(180deg,rgba(var(--elm-question-accent),.28),rgba(43,13,16,.78));
box-shadow:
inset 0 1px 0 rgba(var(--elm-question-paper),.055),
inset 0 -1px 0 rgba(0,0,0,.48),
0 8px 18px rgba(0,0,0,.22),
0 0 16px rgba(var(--elm-question-accent),.055);
}
.aka-archive-main-question-card form:not(.elm-question-answer-form) .aka-archive-question-submit:hover,
.aka-archive-main-question-card form:not(.elm-question-answer-form) .aka-archive-question-submit:focus-visible {
transform:translateY(-1px);
outline:none;
border-color:rgba(var(--elm-question-amber),.38);
background:
linear-gradient(112deg,transparent,rgba(var(--elm-question-paper),.04),transparent),
linear-gradient(180deg,rgba(var(--elm-question-accent),.37),rgba(49,15,17,.86));
box-shadow:
inset 0 1px 0 rgba(var(--elm-question-paper),.07),
inset 0 -1px 0 rgba(0,0,0,.52),
0 9px 20px rgba(0,0,0,.25),
0 0 20px rgba(var(--elm-question-accent),.085);
}
.aka-archive-main-question-card form:not(.elm-question-answer-form) .aka-archive-question-submit:active {
transform:translateY(0) scale(.988);
}
/* Cinema answer deck: one recessed projector-console assembly instead of two
unrelated web controls. */
.aka-archive-main-question-card .elm-question-answer-form {
flex:0 0 auto;
width:100%;
margin:.14rem auto 0;
display:grid;
grid-template-areas:"deck" "error";
gap:.30rem;
}
.aka-archive-main-question-card .elm-question-answer-deck {
grid-area:deck;
min-width:0;
display:grid;
grid-template-columns:minmax(0,1fr) 10.55rem;
gap:.38rem;
padding:.34rem;
border:1px solid rgba(var(--elm-question-paper),.11);
border-radius:6px;
background:
linear-gradient(180deg,rgba(var(--elm-question-paper),.038),transparent 25%),
linear-gradient(160deg,rgba(31,20,15,.90),rgba(8,6,5,.97) 58%,rgba(4,4,3,.99));
box-shadow:
inset 0 1px 0 rgba(var(--elm-question-paper),.055),
inset 0 -2px 5px rgba(0,0,0,.54),
0 8px 19px rgba(0,0,0,.25);
}
.aka-archive-main-question-card .elm-question-answer-field {
position:relative;
display:block;
min-width:0;
min-height:3.08rem;
overflow:hidden;
border:1px solid rgba(var(--elm-question-paper),.13);
border-radius:4px;
background:
radial-gradient(ellipse at 28% 0,rgba(var(--elm-question-amber),.035),transparent 58%),
linear-gradient(180deg,rgba(8,6,4,.94),rgba(2,2,2,.98));
box-shadow:
inset 0 2px 7px rgba(0,0,0,.78),
inset 0 0 18px rgba(0,0,0,.43),
0 1px 0 rgba(var(--elm-question-paper),.025);
transition:border-color 180ms ease,box-shadow 180ms ease,background 180ms ease;
}
.aka-archive-main-question-card .elm-question-answer-label {
position:absolute;
z-index:1;
top:.43rem;
left:.78rem;
color:rgba(var(--elm-question-amber),.78);
font-family:"Space Grotesk",sans-serif;
font-size:.6875rem;
font-weight:500;
line-height:1;
letter-spacing:.05em;
pointer-events:none;
transition:color 180ms ease,text-shadow 180ms ease;
}
.aka-archive-main-question-card .elm-question-answer-field input {
display:block;
width:100%;
min-height:3.08rem;
margin:0;
padding:1.40rem .78rem .38rem;
border:0;
border-radius:4px;
outline:none;
background:transparent;
color:rgba(var(--elm-question-paper),.94);
font-family:"Space Grotesk",sans-serif;
font-size:1rem;
line-height:1.25rem;
letter-spacing:.025em;
text-align:left;
text-transform:uppercase;
box-shadow:none;
}
.aka-archive-main-question-card .elm-question-answer-field input::placeholder {
color:rgba(var(--elm-question-paper),.54);
opacity:1;
text-shadow:none;
}
.aka-archive-main-question-card .elm-question-answer-field:focus-within {
border-color:rgba(var(--elm-question-amber),.38);
background:
radial-gradient(ellipse at 28% 0,rgba(var(--elm-question-amber),.06),transparent 61%),
linear-gradient(180deg,rgba(11,8,5,.96),rgba(2,2,2,.99));
box-shadow:
inset 0 2px 7px rgba(0,0,0,.72),
inset 0 0 18px rgba(var(--elm-question-amber),.022),
0 0 10px rgba(var(--elm-question-amber),.055);
}
.aka-archive-main-question-card .elm-question-answer-field:focus-within .elm-question-answer-label {
color:rgba(var(--elm-question-amber),.92);
text-shadow:none;
}
.aka-archive-main-question-card .elm-question-answer-field input:focus,
.aka-archive-main-question-card .elm-question-answer-field input:focus-visible {
border:0;
outline:none;
box-shadow:none;
}
.aka-archive-main-question-card .elm-question-answer-form .aka-archive-question-error {
grid-area:error;
min-height:1.05rem;
margin:0;
}
.aka-archive-main-question-card .elm-question-answer-deck .aka-archive-question-submit {
width:100%;
min-height:3.08rem;
margin:0;
display:block;
border:1px solid rgba(var(--elm-question-accent),.48);
border-radius:4px;
color:rgba(var(--elm-question-paper),.91);
background:
linear-gradient(180deg,rgba(var(--elm-question-paper),.085),transparent 22%),
radial-gradient(ellipse at 50% 18%,rgba(var(--elm-question-amber),.075),transparent 68%),
linear-gradient(180deg,rgba(var(--elm-question-accent),.34),rgba(43,13,16,.84));
box-shadow:
inset 0 1px 0 rgba(var(--elm-question-paper),.095),
inset 0 -3px 5px rgba(0,0,0,.52),
0 6px 12px rgba(0,0,0,.29),
0 0 14px rgba(var(--elm-question-accent),.05);
text-shadow:0 1px 1px rgba(0,0,0,.82);
transform:translateY(0);
transition:transform 145ms cubic-bezier(.22,1,.36,1),filter 180ms ease,border-color 180ms ease,box-shadow 180ms ease;
}
.aka-archive-main-question-card .elm-question-answer-deck .aka-archive-question-submit:hover,
.aka-archive-main-question-card .elm-question-answer-deck .aka-archive-question-submit:focus-visible {
transform:translateY(-.5px);
filter:brightness(1.045);
outline:none;
border-color:rgba(var(--elm-question-amber),.42);
box-shadow:
inset 0 1px 0 rgba(var(--elm-question-paper),.12),
inset 0 -3px 5px rgba(0,0,0,.49),
0 7px 14px rgba(0,0,0,.30),
0 0 16px rgba(var(--elm-question-amber),.075);
}
.aka-archive-main-question-card .elm-question-answer-deck .aka-archive-question-submit:active {
transform:translateY(.65px) scale(.992);
filter:brightness(.99);
box-shadow:
inset 0 2px 6px rgba(0,0,0,.61),
inset 0 0 10px rgba(var(--elm-question-accent),.07),
0 3px 7px rgba(0,0,0,.24);
}
@media (max-width:640px) {
#modalContent .aka-archive-file-card
.aka-archive-progression-action[data-archive-progression-state="inspect"]
.aka-archive-inspect-btn,
#modalContent .aka-archive-file-card
.aka-archive-progression-action[data-archive-progression-state="locked"]
.aka-archive-locked-btn {
inline-size:5.2rem !important;
width:5.2rem !important;
min-width:5.2rem !important;
max-width:5.2rem !important;
padding-inline:.42rem !important;
}
.aka-archive-main-question-modal {
padding:
max(.55rem,env(safe-area-inset-top,0px))
.55rem
max(.55rem,env(safe-area-inset-bottom,0px));
overflow:hidden;
background:
radial-gradient(ellipse 58% 72% at 50% 7%,rgba(var(--elm-question-amber),.055),transparent 68%),
radial-gradient(ellipse at center,rgba(var(--elm-question-accent),.07),transparent 54%),
rgba(0,0,0,.72);
backdrop-filter:none !important;
-webkit-backdrop-filter:none !important;
animation:none !important;
}
.aka-archive-main-question-card,
.aka-archive-main-question-card.is-multi-question {
width:100%;
height:min(30rem,calc(100dvh - 1.1rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)));
min-height:0;
max-height:calc(100dvh - 1.1rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));
padding:0 .80rem .76rem;
overflow:hidden;
border-radius:7px;
background:
radial-gradient(ellipse at 50% 0,rgba(var(--elm-question-amber),.055),transparent 50%),
linear-gradient(160deg,rgba(21,12,11,.995),rgba(5,5,5,1));
box-shadow:
0 0 0 1px rgba(var(--elm-question-paper),.022),
0 0 14px rgba(var(--elm-question-accent),.075),
0 18px 48px rgba(0,0,0,.72),
inset 0 0 18px rgba(0,0,0,.26);
backdrop-filter:none !important;
-webkit-backdrop-filter:none !important;
animation:none !important;
transition:none !important;
}
.aka-archive-main-question-card::before {
background:
linear-gradient(90deg,rgba(0,0,0,.48),transparent 23%,transparent 77%,rgba(0,0,0,.48)),
repeating-linear-gradient(0deg,rgba(var(--elm-question-paper),.009) 0 1px,transparent 1px 5px);
opacity:.54;
}
.aka-archive-main-question-card::after {
background:radial-gradient(ellipse at 50% 0,rgba(var(--elm-question-amber),.045),transparent 45%);
mix-blend-mode:normal;
opacity:.32;
}
.aka-archive-main-question-card .aka-archive-question-close {
top:.35rem;
right:.40rem;
width:2.75rem;
height:2.75rem;
}
.elm-question-console-head {
min-height:3.75rem;
margin:0 -.80rem;
padding:.78rem 3.35rem .70rem .88rem;
gap:.62rem;
}
.elm-question-console-head::after { left:.88rem;right:.88rem; }
.elm-question-console-brand { padding-left:.72rem;gap:.22rem; }
.elm-question-console-brand::before { height:1.48rem; }
.elm-question-console-brand span,
.elm-question-console-index span { font-size:.6875rem;letter-spacing:.025em; }
.elm-question-console-brand strong { font-size:1.05rem;letter-spacing:.09em; }
.elm-question-console-index b { font-size:.6875rem;letter-spacing:.025em; }
.aka-archive-main-question-card .aka-archive-question-stage {
padding:.76rem .68rem .70rem;
}
.aka-archive-main-question-card .aka-archive-question-tabs {
margin:.02rem auto 1.5rem;
padding:.47rem .18rem .48rem;
gap:.40rem;
}
.aka-archive-main-question-card .aka-archive-question-tab {
width:2.75rem;
min-width:2.75rem;
height:2.75rem;
min-height:2.75rem;
padding:0;
font-size:.75rem;
border-radius:5px;
}
.aka-archive-main-question-card .aka-archive-question-prompt-scroll {
flex:1 1 auto;
min-height:0;
max-height:none;
margin:0;
padding:.22rem .30rem .48rem;
}
.aka-archive-main-question-card .aka-archive-question-prompt-scroll h2 {
font-size:clamp(1.12rem,5.6vw,1.40rem);
line-height:1.13;
}
.aka-archive-main-question-card .aka-archive-question-answer-source {
margin:.52rem auto .02rem !important;
padding:.42rem .48rem .38rem !important;
font-size:.75rem;
}
.aka-archive-main-question-card .aka-archive-question-source {
margin:.10rem auto .54rem;
}
.aka-archive-main-question-card form:not(.elm-question-answer-form) input,
.aka-archive-main-question-card .elm-question-answer-field input {
min-height:3.08rem;
}
.aka-archive-main-question-card form:not(.elm-question-answer-form) {
grid-template-columns:1fr;
grid-template-areas:"input" "error" "submit";
gap:.32rem;
}
.aka-archive-main-question-card .elm-question-answer-form {
grid-template-areas:"deck" "error";
gap:.20rem;
}
.aka-archive-main-question-card .elm-question-answer-deck {
grid-template-columns:1fr;
gap:.31rem;
padding:.31rem;
}
.aka-archive-main-question-card .elm-question-answer-field {
min-height:3.08rem;
}
.aka-archive-main-question-card .elm-question-answer-label {
top:.43rem;
left:.70rem;
font-size:.6875rem;
}
.aka-archive-main-question-card .elm-question-answer-field input {
padding:1.40rem .70rem .38rem;
}
.aka-archive-main-question-card .aka-archive-question-error {
margin:.38rem 0 .18rem;
}
.aka-archive-main-question-card form:not(.elm-question-answer-form) .aka-archive-question-submit,
.aka-archive-main-question-card .elm-question-answer-deck .aka-archive-question-submit {
min-height:2.75rem;
}
}
/* ========================================================================== */
/* AKA REWARD VAULT — WALLET BALANCE + SHARED SIGNAL DRAWER */
/* ========================================================================== */
.aka-wallet-dropdown-holders,
.aka-wallet-aka-balance {
width:100%;
height:2rem;
min-height:2rem;
box-sizing:border-box;
}
.aka-wallet-dropdown-holders {
margin-bottom:.34rem !important;
}
.aka-wallet-aka-balance {
display:flex;
align-items:center;
justify-content:space-between;
gap:.70rem;
margin:0 0 .70rem;
padding:.46rem .52rem;
border:1px solid rgba(151,126,67,.25);
border-radius:2px;
background:
linear-gradient(90deg,rgba(214,174,83,.022),transparent 28%),
linear-gradient(102deg,rgba(12,31,20,.96),rgba(6,20,13,.98));
box-shadow:
inset 0 1px 0 rgba(255,255,255,.025),
inset 0 0 18px rgba(54,107,70,.045),
0 0 12px rgba(28,66,43,.055);
font-family:'Special Elite',monospace;
}
.aka-wallet-aka-balance-label,
.aka-mobile-aka-balance-label {
min-width:0;
display:inline-flex;
align-items:center;
gap:.44rem;
color:rgba(184,201,177,.70);
line-height:1;
text-shadow:0 0 7px rgba(57,115,73,.12);
}
.aka-wallet-balance-name {
color:rgba(231,219,188,.86);
font:700 .63rem/1 'Special Elite',monospace;
letter-spacing:.16em;
text-shadow:
0 0 1px rgba(255,255,255,.10),
0 0 7px rgba(212,168,67,.10);
}
.aka-wallet-aka-balance-number,
.aka-mobile-aka-balance-number {
margin-left:auto;
color:rgba(241,220,165,.88);
font:700 .68rem/1 'Space Grotesk',sans-serif;
letter-spacing:.04em;
text-align:right;
text-shadow:0 0 8px rgba(212,168,67,.12);
}
.aka-wallet-aka-balance-number.is-long,
.aka-mobile-aka-balance-number.is-long {
font-size:.60rem;
letter-spacing:.015em;
}
.aka-wallet-aka-balance-number.is-very-long,
.aka-mobile-aka-balance-number.is-very-long {
font-size:.54rem;
letter-spacing:0;
}
.aka-wallet-balance-dollar {
position:relative;
display:inline-grid;
place-items:center;
width:1.16rem;
height:1.16rem;
flex:0 0 1.16rem;
border:1px solid rgba(212,168,67,.38);
border-radius:4px;
color:rgba(248,204,94,.96);
background:
radial-gradient(circle at 34% 25%,rgba(255,245,188,.18),transparent 32%),
linear-gradient(145deg,rgba(87,66,20,.72),rgba(30,25,10,.94) 52%,rgba(8,19,12,.98));
box-shadow:
inset 1px 1px 0 rgba(255,244,194,.08),
inset -1px -1px 0 rgba(0,0,0,.52),
0 0 7px rgba(212,168,67,.16),
0 2px 4px rgba(0,0,0,.40);
font:700 .72rem/1 'Space Grotesk',sans-serif;
text-shadow:
0 0 4px rgba(255,215,111,.42),
0 0 10px rgba(212,168,67,.20);
}
.aka-wallet-signal-action.is-vault {
--aka-wallet-signal-rgb:77,195,132;
animation:none !important;
border-color:rgba(53,151,101,.48) !important;
background:
radial-gradient(circle at 50% 48%,rgba(53,174,113,.14),transparent 48%),
linear-gradient(180deg,rgba(255,255,255,.032),rgba(2,19,14,.80)) !important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.025) !important;
}
.aka-wallet-signal-action.is-vault.is-stored,
.aka-wallet-signal-action.is-vault.is-actionable {
opacity:1;
filter:none;
color:rgba(91,232,156,.98) !important;
border-color:rgba(67,151,98,.68) !important;
box-shadow:
0 0 11px rgba(77,195,132,.30),
0 0 22px rgba(77,195,132,.10),
inset 0 0 11px rgba(77,195,132,.055) !important;
animation:none !important;
}
.aka-wallet-dollar-glyph {
display:inline-block;
width:auto;
height:auto;
border:0;
border-radius:0;
color:rgba(244,198,85,.96);
background:none;
box-shadow:none;
font:700 .94rem/1 'Space Grotesk',sans-serif;
text-shadow:
0 0 5px rgba(212,168,67,.38),
0 0 11px rgba(65,190,125,.14);
}
.aka-wallet-signal-action.is-vault.is-selected {
border-color:rgba(101,230,163,1) !important;
background:
radial-gradient(circle at 50% 42%,rgba(244,198,85,.08),transparent 34%),
radial-gradient(circle at 50% 48%,rgba(53,174,113,.14),transparent 58%),
linear-gradient(160deg,rgba(9,48,32,.97),rgba(2,16,11,.99)) !important;
box-shadow:
0 0 0 2px rgba(3,12,8,.98),
0 -1px 0 3px rgba(244,190,84,.18),
0 0 0 3px rgba(184,117,34,.54),
0 0 4px rgba(77,195,132,.24),
0 0 6px rgba(212,168,67,.06),
inset 0 1px 0 rgba(232,255,243,.11),
inset 0 0 4px rgba(77,195,132,.09) !important;
}
.aka-wallet-signal-action.is-vault.is-selected .aka-wallet-dollar-glyph {
color:rgba(255,211,94,1);
background:linear-gradient(180deg,
rgba(255,244,177,1) 0%,
rgba(255,211,94,1) 45%,
rgba(193,126,31,1) 100%);
-webkit-background-clip:text;
background-clip:text;
-webkit-text-fill-color:transparent;
filter:none;
text-shadow:
0 0 1px rgba(255,241,166,.56),
0 1px 0 rgba(75,43,9,.78);
}
.aka-wallet-drawer-inner.is-vault {
--aka-drawer-rgb:107,151,105;
padding:.62rem .66rem;
background:
linear-gradient(90deg,rgba(212,168,67,.018),transparent 30%),
linear-gradient(155deg,rgba(10,29,18,.99),rgba(5,18,11,.995) 62%,rgba(3,10,7,.998));
}
.aka-wallet-vault-grid {
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:.46rem;
}
.aka-wallet-vault-stat {
min-width:0;
min-height:4.10rem;
display:flex;
flex-direction:column;
align-items:stretch;
justify-content:space-between;
gap:.58rem;
padding:.66rem .64rem .62rem;
border:1px solid rgba(143,159,102,.18);
border-radius:6px;
background:
radial-gradient(circle at 12% 0,rgba(212,168,67,.055),transparent 52%),
linear-gradient(155deg,rgba(11,32,19,.82),rgba(3,13,8,.88));
box-shadow:
inset 0 1px 0 rgba(255,255,255,.026),
inset 0 0 17px rgba(65,108,70,.035),
0 3px 10px rgba(0,0,0,.13);
}
.aka-wallet-vault-stat small {
min-width:0;
color:rgba(166,196,169,.68);
font:700 .51rem/1.16 'Special Elite',monospace;
letter-spacing:.085em;
overflow-wrap:anywhere;
}
.aka-wallet-vault-value-row {
min-width:0;
display:flex;
align-items:baseline;
justify-content:space-between;
gap:.40rem;
}
.aka-wallet-vault-unit {
min-width:0;
color:rgba(206,219,197,.55);
font:700 .50rem/1 'Special Elite',monospace;
font-style:normal;
letter-spacing:.10em;
white-space:nowrap;
}
.aka-wallet-vault-unit.is-aka {
color:rgba(239,201,111,.92);
text-shadow:0 0 8px rgba(212,168,67,.20);
}
.aka-wallet-vault-stat strong {
min-width:0;
color:rgba(244,221,164,.92);
font:700 .82rem/1 'Space Grotesk',sans-serif;
letter-spacing:.025em;
text-align:right;
white-space:nowrap;
}
.aka-wallet-drawer-action.is-vault-claim {
margin-top:.46rem;
padding:.53rem .56rem;
border-color:rgba(212,168,67,.34);
color:rgba(238,202,117,.88);
background:
radial-gradient(ellipse at 50% 0,rgba(212,168,67,.10),transparent 72%),
linear-gradient(180deg,rgba(88,65,19,.14),rgba(19,15,7,.11));
font-size:.48rem;
letter-spacing:.13em;
text-shadow:0 0 7px rgba(212,168,67,.24);
cursor:pointer;
opacity:.82;
filter:saturate(.88);
box-shadow:
inset 0 1px 0 rgba(255,239,178,.045),
inset 0 0 12px rgba(212,168,67,.022),
0 0 9px rgba(212,168,67,.045);
}
.aka-wallet-drawer-action.is-vault-claim:hover,
.aka-wallet-drawer-action.is-vault-claim:focus-visible {
outline:none;
border-color:rgba(212,168,67,.50);
color:rgba(246,216,145,.96);
background:
radial-gradient(ellipse at 50% 0,rgba(212,168,67,.14),transparent 72%),
linear-gradient(180deg,rgba(88,65,19,.18),rgba(19,15,7,.13));
box-shadow:inset 0 1px 0 rgba(255,239,178,.055),inset 0 0 12px rgba(212,168,67,.03),0 0 12px rgba(212,168,67,.08);
}
.aka-wallet-drawer-action.is-vault-claim:active {
transform:translateY(.35px) scale(.986) translateZ(0);
filter:brightness(1.035);
box-shadow:inset 0 1px 4px rgba(0,0,0,.24),0 0 10px rgba(212,168,67,.12);
transition-duration:130ms;
}
@keyframes akaVaultEmptyValueReject {
0%,12%,38%,58%,86%,100% { color:rgba(244,221,164,.92);text-shadow:none; }
24%,72% { color:rgba(255,239,190,.99);text-shadow:0 0 5px rgba(212,168,67,.40),0 0 11px rgba(89,176,117,.10); }
}
.aka-wallet-drawer-inner.is-vault.is-empty-feedback .aka-wallet-vault-stat strong {
animation:akaVaultEmptyValueReject 1500ms cubic-bezier(.20,.88,.24,1) both;
}
/* Premium physical response is limited to real actions and sealed question tabs.
Poster SEALED and NEW TRACE visuals keep their existing behaviour. */
#modalContent .aka-archive-inspect-btn:active,
#modalContent [data-archive-recover]:not(:disabled):active,
.aka-archive-main-question-card .aka-archive-question-tab.is-sequence-sealed[data-archive-sealed-feedback="question"]:active {
transform:translateY(.35px) scale(.986) translateZ(0) !important;
filter:brightness(1.035) !important;
transition-duration:130ms !important;
}
@media (prefers-reduced-motion:reduce) {
.aka-wallet-drawer-inner.is-vault.is-empty-feedback .aka-wallet-vault-stat strong { animation:none !important; }
}
.aka-mobile-holder-chip,
.aka-mobile-aka-balance {
width:100%;
height:2.1rem;
min-height:2.1rem;
box-sizing:border-box;
}
.aka-mobile-holder-chip {
display:flex !important;
align-items:center !important;
justify-content:space-between !important;
gap:.70rem;
padding:.46rem .52rem !important;
text-align:left;
}
.aka-mobile-holder-label {
min-width:0;
display:inline-flex;
align-items:center;
gap:.38rem;
color:rgba(232,213,183,.56);
font:400 .54rem/1 'Special Elite',monospace;
letter-spacing:.14em;
}
.aka-mobile-holder-label svg {
width:.84rem;
height:.84rem;
color:rgba(212,168,67,.78) !important;
}
#mobileTopbarHoldersCount {
margin-left:auto;
color:rgba(255,232,170,.84);
font:700 .66rem/1 'Space Grotesk',sans-serif;
letter-spacing:.04em;
text-align:right;
}
.aka-mobile-aka-balance {
display:flex;
align-items:center;
justify-content:space-between;
gap:.70rem;
padding:.46rem .52rem;
border:1px solid rgba(151,126,67,.23);
border-radius:4px;
background:
linear-gradient(90deg,rgba(214,174,83,.02),transparent 28%),
linear-gradient(102deg,rgba(12,31,20,.95),rgba(6,20,13,.98));
box-shadow:inset 0 1px 0 rgba(255,255,255,.022),inset 0 0 18px rgba(54,107,70,.04);
font-family:'Special Elite',monospace;
}
.aka-mobile-wallet-signal-strip {
grid-template-columns:repeat(6,minmax(0,1fr)) !important;
}
.aka-mobile-wallet-signal-strip .aka-wallet-dollar-glyph {
margin:0 !important;
transform:none !important;
font-size:.91rem;
}
@media (max-width:359px) {
.aka-mobile-aka-balance {
padding-left:.44rem;
padding-right:.44rem;
}
.aka-mobile-aka-balance-label {
font-size:.50rem;
letter-spacing:.10em;
}
}
/* ============================================================
SHARED PREMIUM SEALED PRESS
NAV now has a single canonical rule set beside its base component.
Language remains the physical motion reference for both SEALED controls.
============================================================ */
.modal-box.archive-modal-wide > .modal-close {
top:.50rem !important;
right:.64rem !important;
width:1.78rem !important;
height:1.78rem !important;
min-width:1.78rem !important;
min-height:1.78rem !important;
font-size:1.08rem !important;
line-height:1 !important;
z-index:90 !important;
}
/* One physical model. Language supplies the exact motion constants; SEALED only
supplies its own crimson/gold visual language. */
#navbar .aka-language-button.aka-premium-press,
.aka-archive-main-question-card .aka-archive-question-tab.aka-premium-press,
#modalContent .aka-archive-file-card .aka-archive-locked-btn.aka-premium-press {
transform:var(--aka-premium-press-rest) !important;
transform-origin:center !important;
will-change:transform,filter;
}
.aka-archive-main-question-card .aka-archive-question-tab.aka-premium-press,
#modalContent .aka-archive-file-card .aka-archive-locked-btn.aka-premium-press {
cursor:pointer !important;
transition:
transform var(--aka-premium-press-motion-ms) var(--aka-premium-press-ease),
filter 560ms ease,
border-color var(--aka-sealed-glow-in-ms) cubic-bezier(.18,.82,.24,1),
color var(--aka-sealed-glow-in-ms) cubic-bezier(.18,.82,.24,1),
background var(--aka-sealed-glow-in-ms) cubic-bezier(.18,.82,.24,1),
box-shadow var(--aka-sealed-glow-in-ms) cubic-bezier(.18,.82,.24,1),
text-shadow var(--aka-sealed-glow-in-ms) cubic-bezier(.18,.82,.24,1) !important;
}
@media (any-hover:hover) {
#navbar .aka-language-button.aka-premium-press:hover,
#navbar .aka-language-button.aka-premium-press.is-open,
#modalContent .aka-archive-file-card .aka-archive-locked-btn.aka-premium-press:hover {
transform:var(--aka-premium-press-hover) !important;
filter:brightness(1.05) !important;
}
/* Sealed question tabs acknowledge hover without rising off the console. */
.aka-archive-main-question-card .aka-archive-question-tab.aka-premium-press:hover {
transform:var(--aka-premium-press-rest) !important;
filter:brightness(1.05) !important;
}
}
#navbar .aka-language-button.aka-premium-press:active,
.aka-archive-main-question-card .aka-archive-question-tab.aka-premium-press:active,
#modalContent .aka-archive-file-card .aka-archive-locked-btn.aka-premium-press:active {
transform:var(--aka-premium-press-down) !important;
filter:brightness(.986) !important;
transition-duration:var(--aka-premium-press-down-ms) !important;
transition-timing-function:var(--aka-premium-press-ease) !important;
}
.aka-archive-main-question-card .aka-archive-question-tab.is-sequence-sealed[data-archive-sealed-feedback="question"] {
border-color:rgba(151,40,54,.38) !important;
color:rgba(225,190,196,.76) !important;
background:
linear-gradient(180deg,rgba(255,225,230,.045),transparent 24%),
linear-gradient(180deg,rgba(152,24,45,.105),transparent 72%),
linear-gradient(180deg,rgba(54,8,17,.72),rgba(10,3,5,.97)) !important;
box-shadow:
0 0 0 1px rgba(151,40,54,.025),
0 5px 11px rgba(0,0,0,.28),
inset 0 1px 0 rgba(255,232,236,.055),
inset 0 -3px 5px rgba(0,0,0,.60) !important;
text-shadow:0 1px 1px rgba(0,0,0,.88) !important;
}
.aka-archive-main-question-card .aka-archive-question-tab.is-sequence-sealed[data-archive-sealed-feedback="question"]:active {
box-shadow:
0 0 0 1px rgba(255,45,85,.08),
0 0 6px rgba(255,45,85,.18),
inset 0 1px 5px rgba(0,0,0,.72),
inset 0 0 11px rgba(255,45,85,.08) !important;
}
.aka-archive-main-question-card .aka-archive-question-tab.is-sequence-sealed[data-archive-sealed-feedback="question"].is-sealed-feedback-active {
border-color:rgba(255,83,111,.68) !important;
color:rgba(255,239,242,.98) !important;
background:
linear-gradient(180deg,rgba(255,239,242,.09),transparent 23%),
linear-gradient(180deg,rgba(255,45,85,.23),transparent 76%),
linear-gradient(180deg,rgba(91,8,23,.78),rgba(13,2,6,.97)) !important;
box-shadow:
0 0 0 1px rgba(255,126,146,.08),
0 0 10px rgba(255,45,85,.28),
0 0 19px rgba(139,0,28,.14),
0 5px 11px rgba(0,0,0,.25),
inset 0 1px 0 rgba(255,241,244,.11),
inset 0 -3px 5px rgba(0,0,0,.51) !important;
text-shadow:0 0 6px rgba(255,210,220,.46) !important;
}
.aka-archive-main-question-card .aka-archive-question-tab-seal {
transition:
color var(--aka-sealed-glow-in-ms) cubic-bezier(.18,.82,.24,1),
text-shadow var(--aka-sealed-glow-in-ms) cubic-bezier(.18,.82,.24,1) !important;
}
.aka-archive-main-question-card .aka-archive-question-tab.is-sequence-sealed[data-archive-sealed-feedback="question"].is-sealed-feedback-active .aka-archive-question-tab-seal {
color:rgba(255,232,176,.98) !important;
text-shadow:
0 0 5px rgba(255,232,176,.62),
0 0 11px rgba(212,168,67,.34),
0 0 17px rgba(255,45,85,.15) !important;
}
.aka-archive-main-question-card .aka-archive-question-tabs.is-sealed-feedback-active > .aka-archive-question-sequence-hint {
opacity:1;
visibility:visible;
transform:translate(-50%,0);
transition-delay:0s;
}
.aka-archive-main-question-card .aka-archive-question-tab.is-sequence-sealed[data-archive-sealed-feedback="question"].is-sealed-feedback-fading,
.aka-archive-main-question-card .aka-archive-question-tab.is-sequence-sealed[data-archive-sealed-feedback="question"].is-sealed-feedback-fading .aka-archive-question-tab-seal,
.aka-archive-main-question-card .aka-archive-question-tabs.is-sealed-feedback-fading > .aka-archive-question-sequence-hint {
transition-duration:var(--aka-sealed-glow-out-ms) !important;
transition-timing-function:cubic-bezier(.22,.72,.20,1) !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn.aka-archive-locked-btn[data-archive-sealed-feedback="poster"] {
border-color:rgba(255,45,85,.64) !important;
color:rgba(255,226,231,.94) !important;
background:
radial-gradient(ellipse at 50% 0%,rgba(255,45,85,.18),transparent 62%),
linear-gradient(180deg,rgba(88,7,21,.70),rgba(11,2,5,.92)) !important;
box-shadow:
0 0 0 1px rgba(255,45,85,.11),
0 0 9px rgba(255,45,85,.23),
0 0 19px rgba(139,0,0,.14),
0 9px 22px rgba(0,0,0,.54),
inset 0 1px 0 rgba(255,255,255,.06),
inset 0 0 13px rgba(255,45,85,.055) !important;
text-shadow:
0 1px 2px rgba(0,0,0,.86),
0 0 7px rgba(255,45,85,.38) !important;
animation:none !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn.aka-archive-locked-btn[data-archive-sealed-feedback="poster"]::before,
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn.aka-archive-locked-btn[data-archive-sealed-feedback="poster"]::after {
content:none !important;
display:none !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn.aka-archive-locked-btn[data-archive-sealed-feedback="poster"]:active {
box-shadow:
0 0 0 1px rgba(255,45,85,.10),
0 0 8px rgba(255,45,85,.22),
inset 0 2px 7px rgba(0,0,0,.74),
inset 0 0 13px rgba(255,45,85,.08) !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn.aka-archive-locked-btn[data-archive-sealed-feedback="poster"].is-sealed-feedback-active {
border-color:rgba(255,83,111,.78) !important;
color:rgba(255,240,243,.98) !important;
box-shadow:
0 0 0 1px rgba(255,126,146,.10),
0 0 9px rgba(255,45,85,.36),
0 0 18px rgba(139,0,28,.21),
0 8px 20px rgba(0,0,0,.50),
inset 0 1px 0 rgba(255,241,244,.10),
inset 0 0 11px rgba(255,72,104,.10) !important;
text-shadow:0 0 6px rgba(255,210,220,.54) !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-recover-btn.aka-archive-locked-btn[data-archive-sealed-feedback="poster"].is-sealed-feedback-fading {
transition-duration:var(--aka-sealed-glow-out-ms) !important;
transition-timing-function:cubic-bezier(.22,.72,.20,1) !important;
}
/* The sealed card keeps the original premium gold perimeter at rest and on
hover. An explicit SEALED press temporarily replaces it with crimson. */
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed {
/* One geometry source owns both the reel and every colored light layer.
This restores the intended V32.9 reel placement that a later rule reset. */
--aka-sealed-reel-lift:.60rem;
--aka-sealed-reel-scale:1.22;
--aka-sealed-reel-center-y:calc(50% - var(--aka-sealed-reel-lift));
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified) {
--aka-sealed-card-border:rgba(212,168,67,.34);
--aka-sealed-card-shadow:
inset 0 0 0 1px rgba(255,232,176,.018),
0 0 12px rgba(212,168,67,.10),
0 0 20px rgba(139,0,0,.10),
0 18px 46px rgba(0,0,0,.68);
border-color:var(--aka-sealed-card-border) !important;
box-shadow:var(--aka-sealed-card-shadow) !important;
transform:none !important;
transition:border-color 210ms ease,box-shadow 280ms ease !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified) {
background:
radial-gradient(ellipse at 50% 42%,rgba(33,42,54,.34),transparent 58%),
radial-gradient(circle at 50% var(--aka-sealed-reel-center-y),rgba(255,45,85,.075),transparent 36%),
linear-gradient(180deg,#07090c 0%,#050404 54%,#020101 100%) !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified)::before {
background:
radial-gradient(circle at 50% var(--aka-sealed-reel-center-y),rgba(212,168,67,.055),transparent 22%),
radial-gradient(circle at 50% var(--aka-sealed-reel-center-y),rgba(255,45,85,.105),transparent 38%),
linear-gradient(180deg,rgba(0,0,0,.48),rgba(3,2,2,.56) 46%,rgba(0,0,0,.86)) !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified) .aka-sealed-poster-veil {
background:
radial-gradient(circle at 50% var(--aka-sealed-reel-center-y),rgba(255,45,85,.10),transparent 35%),
linear-gradient(180deg,rgba(0,0,0,.52),rgba(4,2,2,.54) 45%,rgba(0,0,0,.88)) !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified) .aka-archive-file-inner {
background:
radial-gradient(circle at 50% var(--aka-sealed-reel-center-y),rgba(255,45,85,.16),transparent 36%),
radial-gradient(circle at 50% var(--aka-sealed-reel-center-y),rgba(212,168,67,.07),transparent 49%),
linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.46)) !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified):where(:hover,:focus-within) {
--aka-sealed-card-border:rgba(255,190,96,.52);
--aka-sealed-card-shadow:
0 0 18px rgba(212,168,67,.16),
0 0 28px rgba(139,0,0,.24),
0 20px 54px rgba(0,0,0,.76);
transform:none !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed.is-sealed-feedback-active:not(.is-classified) {
--aka-sealed-card-border:rgba(255,90,118,.70);
--aka-sealed-card-shadow:
inset 0 0 0 1px rgba(255,226,231,.045),
0 0 17px rgba(255,45,85,.34),
0 0 38px rgba(139,0,28,.20),
0 18px 46px rgba(0,0,0,.68);
transition-duration:var(--aka-sealed-glow-in-ms) !important;
transition-timing-function:cubic-bezier(.18,.82,.24,1) !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed.is-sealed-feedback-fading:not(.is-classified) {
transition-duration:var(--aka-sealed-glow-out-ms) !important;
transition-timing-function:cubic-bezier(.22,.72,.20,1) !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed .aka-archive-film-reel {
transition:filter 820ms cubic-bezier(.22,.72,.20,1) !important;
transform:
translateY(calc(0rem - var(--aka-sealed-reel-lift)))
scale(var(--aka-sealed-reel-scale))
translateZ(0) !important;
margin-bottom:0 !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed.is-sealed-feedback-active .aka-archive-film-reel {
filter:
brightness(1.045)
drop-shadow(0 0 5px rgba(255,83,111,.22))
drop-shadow(0 0 11px rgba(139,0,28,.11)) !important;
transition-duration:60ms !important;
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed.is-sealed-feedback-fading .aka-archive-film-reel {
transition-duration:var(--aka-sealed-glow-out-ms) !important;
}
@media (max-width:640px) {
.modal-box.archive-modal-wide > .modal-close {
top:.40rem !important;
right:.48rem !important;
width:1.66rem !important;
height:1.66rem !important;
min-width:1.66rem !important;
min-height:1.66rem !important;
font-size:1rem !important;
}
}
@media (max-width:359px) {
.aka-archive-main-question-card,
.aka-archive-main-question-card.is-multi-question {
padding-inline:.72rem;
}
}
/* Origin entry is intentionally as quiet and compact as one main question. */
.modal-box.aka-origin-access-modal-box {
width:min(25.75rem,calc(100vw - 2rem));
}
#modalContent .aka-origin-question-card,
#modalContent .aka-origin-question-card.is-multi-question {
width:min(25.75rem,100%);
height:min(22.5rem,calc(100dvh - 2rem));
min-height:20rem;
max-height:calc(100dvh - 2rem);
padding:1.55rem 1.12rem 1rem;
border-radius:6px;
}
#modalContent .aka-origin-question-card .aka-archive-question-kicker {
flex:0 0 auto;
margin:0 auto .72rem;
}
#modalContent .aka-origin-question-stage {
position:relative;
z-index:1;
flex:1 1 auto;
min-height:0;
width:100%;
display:flex;
flex-direction:column;
justify-content:center;
}
#modalContent .aka-origin-question-card form {
width:100%;
margin:.36rem auto 0;
}
@media (max-width:640px) {
.modal-box.aka-origin-access-modal-box {
width:min(25.75rem,calc(100vw - 1.1rem));
}
#modalContent .aka-origin-question-card,
#modalContent .aka-origin-question-card.is-multi-question {
height:min(22rem,calc(100dvh - 1.1rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)));
min-height:18.75rem;
padding:1.32rem .82rem .78rem;
}
}
/* ========================================================================== */
/* PREMIUM PRESS V35.9 — WALLET, FOOTER AND ARABIC DIRECTION CORRECTIONS */
/* ========================================================================== */
/* Wallet selection is a cinematic vault: archive-card structure, its own
restrained obsidian / emerald / aged-bronze material language. */
#modalContent.aka-wallet-select-content > .aka-wallet-select-modal {
--aka-wallet-vault-emerald:74,151,104;
--aka-wallet-vault-bronze:184,117,34;
--aka-wallet-vault-gold:224,174,73;
isolation:isolate;
overflow:hidden !important;
border:1px solid rgba(var(--aka-wallet-vault-bronze),.48) !important;
border-radius:6px !important;
background:
radial-gradient(ellipse at 50% -8%,rgba(var(--aka-wallet-vault-emerald),.20),transparent 39%),
radial-gradient(ellipse at 10% 92%,rgba(91,29,24,.075),transparent 37%),
radial-gradient(ellipse at 90% 92%,rgba(91,29,24,.065),transparent 37%),
linear-gradient(90deg,rgba(51,31,14,.23),transparent 20%,transparent 80%,rgba(51,31,14,.20)),
repeating-linear-gradient(0deg,rgba(255,255,255,.014) 0 1px,transparent 1px 4px),
linear-gradient(155deg,rgba(8,24,16,.99),rgba(4,11,8,.995) 58%,rgba(13,8,4,.998)) !important;
box-shadow:
0 0 0 1px rgba(var(--aka-wallet-vault-emerald),.075),
0 0 18px rgba(var(--aka-wallet-vault-emerald),.10),
0 0 34px rgba(var(--aka-wallet-vault-bronze),.055),
0 24px 64px rgba(0,0,0,.72),
inset 0 1px 0 rgba(246,216,154,.055),
inset 0 0 28px rgba(var(--aka-wallet-vault-emerald),.035) !important;
backdrop-filter:blur(2px) saturate(1.02);
-webkit-backdrop-filter:blur(2px) saturate(1.02);
}
#modalContent.aka-wallet-select-content > .aka-wallet-select-modal::before {
inset:0;
border:0;
background:
linear-gradient(90deg,rgba(0,0,0,.52),transparent 22%,transparent 78%,rgba(0,0,0,.52)),
repeating-linear-gradient(0deg,rgba(237,225,194,.012) 0 1px,transparent 1px 4px);
opacity:.72;
}
#modalContent.aka-wallet-select-content > .aka-wallet-select-modal::after {
top:0;
left:15%;
right:15%;
height:1px;
background:linear-gradient(90deg,
transparent,
rgba(var(--aka-wallet-vault-bronze),.28),
rgba(242,194,95,.72),
rgba(var(--aka-wallet-vault-emerald),.26),
transparent);
box-shadow:0 0 6px rgba(var(--aka-wallet-vault-gold),.12);
opacity:.82;
}
#modalContent.aka-wallet-select-content .aka-wallet-provider-icon {
border:1px solid rgba(var(--aka-wallet-vault-emerald),.66) !important;
border-radius:6px !important;
color:rgba(235,184,79,.97) !important;
background:
radial-gradient(circle at 48% 31%,rgba(238,191,92,.10),transparent 34%),
linear-gradient(155deg,rgba(11,53,35,.98),rgba(3,18,12,.995)) !important;
box-shadow:
0 0 0 2px rgba(3,12,8,.98),
0 0 0 3px rgba(var(--aka-wallet-vault-bronze),.40),
0 0 7px rgba(var(--aka-wallet-vault-emerald),.18),
inset 0 1px 0 rgba(224,255,239,.075),
inset 0 0 7px rgba(var(--aka-wallet-vault-emerald),.07) !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-provider-icon svg {
color:rgba(235,184,79,.97) !important;
filter:drop-shadow(0 0 2px rgba(var(--aka-wallet-vault-gold),.28));
}
#modalContent.aka-wallet-select-content .aka-wallet-provider-kicker {
color:rgba(202,147,61,.86) !important;
text-shadow:0 0 4px rgba(var(--aka-wallet-vault-bronze),.16);
}
#modalContent.aka-wallet-select-content .aka-wallet-provider-title {
color:rgba(241,224,186,.98) !important;
text-shadow:
0 1px 0 rgba(0,0,0,.78),
0 0 8px rgba(var(--aka-wallet-vault-gold),.10);
}
#modalContent.aka-wallet-select-content .aka-wallet-provider-copy {
border:1px solid rgba(var(--aka-wallet-vault-bronze),.22);
border-radius:6px;
color:rgba(224,211,181,.68) !important;
background:
radial-gradient(ellipse at 50% 0,rgba(var(--aka-wallet-vault-emerald),.075),transparent 65%),
linear-gradient(180deg,rgba(15,36,25,.58),rgba(5,13,9,.72));
box-shadow:
inset 0 1px 0 rgba(241,215,158,.045),
inset 0 0 18px rgba(var(--aka-wallet-vault-emerald),.032),
0 8px 18px rgba(0,0,0,.16);
}
#modalContent.aka-wallet-select-content .aka-wallet-option {
border:1px solid rgba(var(--aka-wallet-vault-bronze),.25);
border-radius:6px !important;
color:rgba(238,220,180,.90);
background:
radial-gradient(circle at 18% 0,rgba(var(--aka-wallet-vault-gold),.055),transparent 42%),
radial-gradient(circle at 100% 100%,rgba(var(--aka-wallet-vault-emerald),.075),transparent 48%),
linear-gradient(155deg,rgba(12,29,20,.97),rgba(4,11,8,.99) 68%,rgba(16,10,5,.99));
box-shadow:
inset 0 1px 0 rgba(241,215,158,.050),
inset 0 0 18px rgba(var(--aka-wallet-vault-emerald),.026),
0 10px 22px rgba(0,0,0,.31);
}
#modalContent.aka-wallet-select-content .aka-wallet-option::before {
background:linear-gradient(112deg,
transparent 0 43%,
rgba(244,207,132,.075) 48%,
rgba(var(--aka-wallet-vault-emerald),.045) 51%,
transparent 56%);
}
#modalContent.aka-wallet-select-content .aka-wallet-option.is-primary {
border-color:rgba(var(--aka-wallet-vault-emerald),.45);
background:
radial-gradient(circle at 18% 0,rgba(var(--aka-wallet-vault-gold),.075),transparent 42%),
radial-gradient(circle at 100% 100%,rgba(var(--aka-wallet-vault-emerald),.11),transparent 49%),
linear-gradient(155deg,rgba(14,39,26,.98),rgba(4,13,9,.995) 68%,rgba(18,11,5,.99));
box-shadow:
inset 0 1px 0 rgba(241,215,158,.060),
inset 0 0 20px rgba(var(--aka-wallet-vault-emerald),.04),
0 10px 22px rgba(0,0,0,.32);
}
#modalContent.aka-wallet-select-content .aka-wallet-option-rank {
color:rgba(var(--aka-wallet-vault-bronze),.58);
}
#modalContent.aka-wallet-select-content .aka-wallet-option-mark {
border:1px solid rgba(var(--aka-wallet-vault-bronze),.32);
border-radius:5px !important;
background:
radial-gradient(circle at 34% 22%,rgba(236,193,105,.075),transparent 34%),
linear-gradient(150deg,rgba(13,39,27,.97),rgba(4,12,8,.995) 68%,rgba(20,12,5,.99));
box-shadow:
inset 0 1px 0 rgba(242,218,167,.065),
inset 0 -8px 14px rgba(0,0,0,.18),
0 0 0 1px rgba(2,8,5,.72),
0 4px 10px rgba(0,0,0,.28);
}
#modalContent.aka-wallet-select-content .aka-wallet-option-logo {
filter:
drop-shadow(0 0 3px rgba(var(--aka-wallet-vault-gold),.10))
drop-shadow(0 2px 4px rgba(0,0,0,.42));
}
#modalContent.aka-wallet-select-content .aka-wallet-option-name {
color:rgba(241,224,186,.97);
text-shadow:0 1px 0 rgba(0,0,0,.70);
}
#modalContent.aka-wallet-select-content .aka-wallet-option-headline {
color:rgba(204,151,65,.80);
}
#modalContent.aka-wallet-select-content .aka-wallet-option-note {
color:rgba(216,204,178,.54);
}
#modalContent.aka-wallet-select-content .aka-wallet-option-status {
border:1px solid rgba(var(--aka-wallet-vault-bronze),.22);
border-radius:4px;
color:rgba(215,200,169,.55);
background:linear-gradient(180deg,rgba(52,32,14,.18),rgba(4,10,7,.56));
text-shadow:none;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-status:is(.is-ready, .is-reconnect) {
border-color:rgba(var(--aka-wallet-vault-emerald),.52);
color:rgba(141,223,169,.91);
background:linear-gradient(180deg,rgba(25,87,55,.23),rgba(4,21,13,.66));
box-shadow:inset 0 1px 0 rgba(187,246,209,.045);
text-shadow:0 0 3px rgba(var(--aka-wallet-vault-emerald),.18);
}
#modalContent.aka-wallet-select-content .aka-wallet-option.is-not-detected {
border-color:rgba(151,53,48,.50);
box-shadow:
inset 0 1px 0 rgba(241,215,158,.045),
inset 0 0 16px rgba(104,19,20,.055),
0 10px 22px rgba(0,0,0,.30);
}
#modalContent.aka-wallet-select-content .aka-wallet-option-status.is-not-detected {
border-color:rgba(163,61,54,.52);
color:rgba(224,132,123,.88);
background:rgba(84,17,20,.18);
text-shadow:none;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-download {
border-color:rgba(var(--aka-wallet-vault-bronze),.46);
border-radius:4px;
color:rgba(235,206,143,.90);
background:linear-gradient(180deg,rgba(var(--aka-wallet-vault-bronze),.14),rgba(45,27,10,.18));
text-shadow:none;
}
#modalContent.aka-wallet-select-content .aka-wallet-option:focus-within {
border-color:rgba(var(--aka-wallet-vault-emerald),.64);
box-shadow:
0 0 0 1px rgba(var(--aka-wallet-vault-bronze),.14),
0 0 8px rgba(var(--aka-wallet-vault-emerald),.12),
0 12px 26px rgba(0,0,0,.36),
inset 0 1px 0 rgba(241,215,158,.055);
}
@media (hover:hover) and (pointer:fine) {
#modalContent.aka-wallet-select-content .aka-wallet-option:hover {
transform:translateY(-1px);
border-color:rgba(var(--aka-wallet-vault-bronze),.47);
box-shadow:
0 0 0 1px rgba(var(--aka-wallet-vault-emerald),.13),
0 0 8px rgba(var(--aka-wallet-vault-emerald),.09),
0 14px 28px rgba(0,0,0,.39),
inset 0 1px 0 rgba(245,221,170,.07),
inset 0 0 18px rgba(var(--aka-wallet-vault-emerald),.035);
filter:brightness(1.035) saturate(1.01);
}
#modalContent.aka-wallet-select-content .aka-wallet-option:hover::before {
opacity:.78;
transform:translateX(24%);
}
}
#modalContent.aka-wallet-select-content .aka-wallet-option:active {
transform:translateY(.5px) scale(.988);
filter:brightness(1.025);
}
#modalContent.aka-wallet-select-content .aka-wallet-select-safety {
border:1px solid rgba(var(--aka-wallet-vault-bronze),.28);
border-radius:6px !important;
color:rgba(210,196,166,.52);
background:
linear-gradient(90deg,rgba(55,33,14,.34),rgba(8,20,14,.90) 48%,rgba(55,33,14,.31)),
rgba(4,10,7,.88);
box-shadow:
inset 0 1px 0 rgba(240,211,150,.04),
inset 0 0 18px rgba(var(--aka-wallet-vault-emerald),.025),
0 8px 18px rgba(0,0,0,.20);
}
#modalContent.aka-wallet-select-content .aka-wallet-select-safety-title {
color:rgba(224,174,80,.96);
text-shadow:0 0 3px rgba(var(--aka-wallet-vault-gold),.12);
}
#modalContent.aka-wallet-select-content .aka-wallet-select-safety-official {
color:rgba(181,218,192,.84);
}
/* V35.8 legibility and hierarchy: provider names remain dominant, while the
practical and security copy is comfortably readable without enlarging the
vault into a separate page. */
@media (min-width:769px) {
#modalContent.aka-wallet-select-content .aka-wallet-option-headline {
font-size:.60rem !important;
line-height:1.32 !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-note {
font-size:.68rem !important;
line-height:1.38 !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-status,
#modalContent.aka-wallet-select-content .aka-wallet-option-download {
min-height:1.36rem !important;
padding:.22rem .50rem !important;
font-size:.56rem !important;
letter-spacing:.10em !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-select-safety {
margin-top:.82rem !important;
padding:.72rem .86rem !important;
font-size:.62rem !important;
line-height:1.55 !important;
letter-spacing:.075em !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-select-safety-title {
font-size:.60rem;
letter-spacing:.21em;
}
}
/* V0.44.00 — EL MULLERO CINEMATIC EXPERIENCE.
Archive names are a first-unlock-only presentation. Title awards remain a
separate, richer recognition ceremony. Both layers are cosmetic and never
own player progress. */
@font-face {
font-family:"Mullero Cinema";
src:url("../fonts/cinematic/mullero-cinema-display.woff") format("woff");
font-style:normal;
font-weight:600;
font-display:swap;
}
.elm-archive-entry-cinematic {
--elm-face:#A9D6FF;
--elm-inner:rgba(20,47,70,.96);
--elm-contour:rgba(220,235,250,.56);
--elm-scene:5450ms;
--elm-finish-delay:4031ms;
--elm-finish-duration:1080ms;
--elm-vertical:0px;
--elm-rotation:7deg;
--elm-angle:-3deg;
--elm-overshoot:1.025;
--elm-settle-scale:1.004;
position:fixed;
z-index:10115;
inset:0;
overflow:hidden;
isolation:isolate;
cursor:pointer;
touch-action:manipulation;
background:
radial-gradient(ellipse at 50% 51%,color-mix(in srgb,var(--elm-face) 9%,transparent),transparent 57%),
rgba(2,4,7,.70);
backdrop-filter:blur(3.5px) saturate(.60) brightness(.52);
-webkit-backdrop-filter:blur(3.5px) saturate(.60) brightness(.52);
opacity:1;
transition:opacity 250ms ease;
}
.elm-archive-entry-cinematic.is-leaving { opacity:0;pointer-events:none; }
.elm-archive-entry-field { position:absolute;inset:-16%;pointer-events:none;opacity:0;transform-origin:50% 50%; }
.elm-archive-entry-field.is-far { z-index:0;background:radial-gradient(ellipse at 50% 73%,color-mix(in srgb,var(--elm-face) 16%,transparent),transparent 55%); }
.elm-archive-entry-field.is-mid { z-index:1; }
.elm-archive-entry-field.is-near { z-index:2; }
.elm-archive-entry-resonance { position:absolute;inset:5% -10%;z-index:3;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 51%,color-mix(in srgb,var(--elm-face) 24%,transparent),transparent 48%);transform:scale(.8); }
.elm-archive-entry-vignette { position:absolute;inset:0;z-index:5;pointer-events:none;background:radial-gradient(ellipse at 50% 47%,transparent 18%,rgba(2,3,5,.17) 56%,rgba(2,3,5,.79) 100%),linear-gradient(180deg,rgba(0,0,0,.48),transparent 21%,transparent 79%,rgba(0,0,0,.58)); }
.elm-archive-entry-word-frame { position:absolute;inset:0;z-index:4;display:grid;place-items:center;perspective:950px;perspective-origin:50% 50%;padding:0 18px; }
.elm-archive-entry-word {
position:relative;
isolation:isolate;
margin:0;
padding:0;
white-space:nowrap;
font:600 clamp(40px,12vw,86px)/1.06 "Mullero Cinema",Arial,sans-serif;
font-synthesis:none;
letter-spacing:.09em;
text-indent:.09em;
color:var(--elm-face);
-webkit-text-fill-color:var(--elm-face);
-webkit-text-stroke:.25px var(--elm-contour);
text-shadow:0 1px 0 var(--elm-inner),0 2px 0 rgba(0,0,0,.8),0 5px 8px rgba(0,0,0,.42);
transform-origin:50% 50%;
}
.elm-archive-entry-word::before,.elm-archive-entry-word::after { content:attr(data-title);position:absolute;inset:0;pointer-events:none; }
.elm-archive-entry-word::before { z-index:1;color:var(--elm-face);-webkit-text-fill-color:var(--elm-face);-webkit-text-stroke:.25px var(--elm-contour);text-shadow:none; }
.elm-archive-entry-word::after { z-index:2;color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--elm-face) 68%,#fff);text-shadow:none;opacity:0; }
@supports (background-clip:text) or (-webkit-background-clip:text) {
.elm-archive-entry-word::before {
background:linear-gradient(168deg,color-mix(in srgb,var(--elm-face) 70%,#fff) 6%,color-mix(in srgb,var(--elm-face) 92%,#fff) 36%,var(--elm-face) 48%,color-mix(in srgb,var(--elm-face) 82%,#111820) 68%,color-mix(in srgb,var(--elm-face) 94%,#111820) 100%);
background-clip:text;
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}
.elm-archive-entry-cinematic { --elm-finish-core:color-mix(in srgb,var(--elm-face) 12%,#fff);--elm-finish-halo:color-mix(in srgb,var(--elm-face) 72%,transparent);--elm-finish-strength:1;--elm-finish-angle:108deg;--elm-finish-motion:elmEntryOriginFinish;--elm-finish-easing:linear;--elm-finish-beam:linear-gradient(var(--elm-finish-angle),transparent 39%,color-mix(in srgb,var(--elm-face) 18%,transparent) 42%,color-mix(in srgb,var(--elm-face) 66%,transparent) 46%,color-mix(in srgb,var(--elm-face) 35%,#fff) 48.5%,var(--elm-finish-core) 49.6%,#fff 50%,var(--elm-finish-core) 50.5%,color-mix(in srgb,var(--elm-face) 55%,#fff) 52%,color-mix(in srgb,var(--elm-face) 42%,transparent) 55%,transparent 61%); }
.elm-archive-entry-word::after { background-image:var(--elm-finish-beam);background-size:240% 100%;background-position:120% 50%;background-repeat:no-repeat;background-clip:text;-webkit-background-clip:text; }
}
.elm-archive-entry-cinematic[data-scene="origin"] .is-far { background:radial-gradient(ellipse at 50% 64%,rgba(55,124,177,.25) 0%,rgba(30,77,119,.11) 32%,transparent 62%); }
.elm-archive-entry-cinematic[data-scene="origin"] .is-mid { background:radial-gradient(ellipse 63% 38% at 50% 57%,transparent 35%,rgba(8,19,32,.7) 66%,rgba(69,137,187,.065) 68%,transparent 73%); }
.elm-archive-entry-cinematic[data-scene="origin"] .is-near { background:radial-gradient(ellipse 50% 5% at 50% 80%,rgba(77,151,198,.18),transparent 74%),linear-gradient(0deg,rgba(0,5,12,.45),transparent 50%); }
.elm-archive-entry-cinematic[data-scene="origin"] { --elm-finish-easing:cubic-bezier(.24,.46,.35,1); }
.elm-archive-entry-cinematic[data-scene="night"] { --elm-rotation:5deg;--elm-angle:1deg;--elm-overshoot:1.012;--elm-settle-scale:1.002;--elm-finish-motion:elmEntryNightFinish;--elm-finish-core:color-mix(in srgb,var(--elm-face) 62%,#fff);background:radial-gradient(ellipse at 50% 47%,rgba(75,11,25,.28),transparent 58%),rgba(3,2,5,.73); }
.elm-archive-entry-cinematic[data-scene="night"] .elm-archive-entry-word { font-size:clamp(44px,12.2vw,88px);letter-spacing:.11em;text-indent:.11em; }
.elm-archive-entry-cinematic[data-scene="night"] .is-far { background:radial-gradient(ellipse 49% 42% at 50% 44%,rgba(151,17,42,.26) 5%,rgba(62,4,18,.2) 42%,transparent 75%); }
.elm-archive-entry-cinematic[data-scene="night"] .is-mid { inset:4% -17%;background:radial-gradient(ellipse 46% 38% at 50% 43%,rgba(92,18,36,.14),rgba(112,22,42,.065) 42%,transparent 78%); }
.elm-archive-entry-cinematic[data-scene="night"] .is-near { background:linear-gradient(180deg,rgba(1,1,5,.8),transparent 46%,transparent 52%,rgba(1,1,5,.86)),radial-gradient(ellipse at 50% 60%,transparent 25%,rgba(0,0,2,.6) 72%); }
.elm-archive-entry-cinematic[data-scene="rise"] { --elm-vertical:28px;--elm-rotation:10deg;--elm-angle:0deg;--elm-overshoot:1.024;--elm-finish-motion:elmEntryRiseFinish;background:radial-gradient(ellipse at 50% 67%,rgba(18,67,38,.25),transparent 60%),rgba(2,5,5,.72); }
.elm-archive-entry-cinematic[data-scene="rise"] .elm-archive-entry-word,.elm-archive-entry-cinematic[data-scene="lost"] .elm-archive-entry-word { font-size:clamp(50px,13.4vw,98px);letter-spacing:.13em;text-indent:.13em; }
.elm-archive-entry-cinematic[data-scene="rise"] .is-far { background:radial-gradient(ellipse 32% 66% at 50% 88%,rgba(67,143,85,.24),transparent 73%); }
.elm-archive-entry-cinematic[data-scene="rise"] .is-mid { background:radial-gradient(ellipse 9% 65% at 33% 77%,rgba(104,194,131,.085),transparent 72%),radial-gradient(ellipse 9% 65% at 67% 77%,rgba(104,194,131,.085),transparent 72%); }
.elm-archive-entry-cinematic[data-scene="rise"] .is-near { background:radial-gradient(ellipse 44% 12% at 50% 86%,rgba(85,178,106,.18),transparent 70%),linear-gradient(0deg,rgba(2,7,6,.74),transparent 45%); }
.elm-archive-entry-cinematic[data-scene="lost"] { --elm-rotation:-4deg;--elm-angle:3deg;--elm-overshoot:1.018;--elm-finish-motion:elmEntryLostFinish;background:radial-gradient(ellipse at 52% 51%,rgba(21,75,77,.25),transparent 60%),rgba(2,5,7,.72); }
.elm-archive-entry-cinematic[data-scene="lost"] .is-far { background:radial-gradient(ellipse 49% 35% at 52% 49%,rgba(71,155,152,.24),transparent 69%); }
.elm-archive-entry-cinematic[data-scene="lost"] .is-mid { background:radial-gradient(ellipse 70% 23% at 32% 27%,rgba(3,11,16,.93) 47%,rgba(20,68,70,.18) 73%,transparent 83%),radial-gradient(ellipse 60% 28% at 68% 79%,rgba(3,11,16,.87) 43%,rgba(24,80,82,.14) 70%,transparent 85%); }
.elm-archive-entry-cinematic[data-scene="lost"] .is-near { background:radial-gradient(ellipse 34% 72% at 18% 50%,rgba(2,9,13,.75),transparent 73%),radial-gradient(ellipse 25% 60% at 92% 35%,rgba(2,9,13,.8),transparent 73%); }
.elm-archive-entry-cinematic[data-scene="dominion"] { --elm-rotation:3deg;--elm-angle:-1deg;--elm-overshoot:1.033;--elm-settle-scale:1.003;--elm-finish-motion:elmEntryDominionFinish;background:radial-gradient(ellipse at 50% 61%,rgba(102,48,22,.28),transparent 60%),rgba(5,3,4,.73); }
.elm-archive-entry-cinematic[data-scene="dominion"] .elm-archive-entry-word { font-size:clamp(31px,9.7vw,71px);letter-spacing:.09em;text-indent:.09em; }
.elm-archive-entry-cinematic[data-scene="dominion"] .is-far { background:radial-gradient(ellipse 54% 25% at 50% 58%,rgba(163,83,40,.27),transparent 75%); }
.elm-archive-entry-cinematic[data-scene="dominion"] .is-mid { background:linear-gradient(153deg,rgba(4,3,4,.86) 27%,rgba(51,22,12,.18) 35%,transparent 42%),linear-gradient(207deg,rgba(4,3,4,.86) 27%,rgba(51,22,12,.18) 35%,transparent 42%); }
.elm-archive-entry-cinematic[data-scene="dominion"] .is-near { background:radial-gradient(ellipse 45% 5% at 50% 76%,rgba(169,83,40,.17),transparent 80%),linear-gradient(0deg,rgba(2,2,4,.82),transparent 40%); }
.elm-archive-entry-cinematic[data-scene="finale"] { --elm-rotation:0deg;--elm-angle:0deg;--elm-overshoot:1.024;--elm-finish-motion:elmEntryFinaleFinish;background:radial-gradient(ellipse at 50% 50%,rgba(61,88,113,.29),transparent 59%),rgba(3,5,7,.71); }
.elm-archive-entry-cinematic[data-scene="finale"] .is-far { background:radial-gradient(ellipse 55% 43% at 50% 48%,rgba(112,151,182,.25),rgba(41,73,103,.12) 39%,transparent 69%); }
.elm-archive-entry-cinematic[data-scene="finale"] .is-mid { background:radial-gradient(ellipse 66% 36% at 50% 51%,transparent 41%,rgba(151,186,212,.075) 57%,transparent 66%); }
.elm-archive-entry-cinematic[data-scene="finale"] .is-near { background:radial-gradient(ellipse 30% 9% at 50% 21%,rgba(155,190,218,.10),transparent 80%),radial-gradient(ellipse 47% 7% at 50% 80%,rgba(155,190,218,.14),transparent 82%); }
.elm-archive-entry-cinematic.is-playing .elm-archive-entry-word { animation:elmEntryArrival 1860ms linear 240ms both,elmEntryInk 1860ms linear 240ms both; }
.elm-archive-entry-cinematic.is-playing .elm-archive-entry-word::before { animation:elmEntryFace 1860ms linear 240ms both; }
.elm-archive-entry-cinematic.is-playing .elm-archive-entry-word::after { animation:elmEntryEdge 1860ms linear 240ms both,var(--elm-finish-motion) var(--elm-finish-duration) var(--elm-finish-easing) var(--elm-finish-delay) forwards; }
.elm-archive-entry-cinematic.is-playing .is-far { animation:elmEntryDepthFar var(--elm-scene) cubic-bezier(.18,.62,.25,1) both; }
.elm-archive-entry-cinematic.is-playing .is-mid { animation:elmEntryDepthMid var(--elm-scene) cubic-bezier(.18,.62,.25,1) both; }
.elm-archive-entry-cinematic.is-playing .is-near { animation:elmEntryDepthNear var(--elm-scene) cubic-bezier(.18,.62,.25,1) both; }
.elm-archive-entry-cinematic.is-playing .elm-archive-entry-resonance { animation:elmEntryResonance 1150ms ease 1498ms both; }
.elm-archive-entry-cinematic[data-scene="night"].is-playing .is-mid { animation-name:elmEntryEclipse; }
.elm-archive-entry-cinematic[data-scene="rise"].is-playing .is-mid { animation-name:elmEntryAscent; }
.elm-archive-entry-cinematic[data-scene="lost"].is-playing .is-mid { animation-name:elmEntryObscurity; }
.elm-archive-entry-cinematic[data-scene="dominion"].is-playing .is-mid { animation-name:elmEntryPressure; }
.elm-archive-entry-cinematic[data-scene="dominion"].is-playing .elm-archive-entry-word-frame { animation:elmEntryWeight 220ms ease 1728ms both; }
.elm-archive-entry-cinematic[data-scene="finale"].is-playing .is-mid { animation-name:elmEntryConvergence; }
@keyframes elmEntryArrival { 0%{opacity:0;transform:translateZ(-1650px) scale(.70) rotateX(var(--elm-rotation)) rotateY(var(--elm-angle));filter:blur(4px)} 16%{opacity:.54;transform:translateZ(-1280px) scale(.75) rotateX(var(--elm-rotation)) rotateY(var(--elm-angle));filter:blur(3.4px)} 42%{opacity:.92;transform:translateZ(-760px) scale(.82) rotateX(3deg) rotateY(-1deg);filter:blur(2.6px)} 64%{opacity:1;transform:translateZ(-310px) scale(.91) rotateX(1.2deg);filter:blur(1.8px)} 77%{opacity:1;transform:translateZ(-75px) scale(.975) rotateX(.35deg);filter:blur(.7px);animation-timing-function:cubic-bezier(.18,.7,.22,1)} 84%{opacity:1;transform:translateZ(0) scale(var(--elm-overshoot));filter:blur(0);animation-timing-function:cubic-bezier(.2,.65,.35,1)} 91%{opacity:1;transform:translateZ(0) scale(var(--elm-settle-scale));filter:blur(0)} 100%{opacity:1;transform:translateZ(0) scale(1);filter:blur(0)} }
@keyframes elmEntryInk { 0%,40%{color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke-color:transparent;text-shadow:none} 80%,100%{color:var(--elm-face);-webkit-text-fill-color:var(--elm-face);-webkit-text-stroke-color:var(--elm-contour);text-shadow:0 1px 0 var(--elm-inner),0 2px 0 rgba(0,0,0,.8),0 5px 8px rgba(0,0,0,.42)} }
@keyframes elmEntryFace { 0%{opacity:0} 14%{opacity:.14} 40%{opacity:.55} 72.85%,100%{opacity:1} }
@keyframes elmEntryEdge { 0%{opacity:.6} 14%{opacity:.9} 40%{opacity:.45} 72.85%,100%{opacity:0} }
@keyframes elmEntryDepthFar { 0%{opacity:0;transform:scale(.68)} 30%{opacity:.85} 55%{opacity:1} 100%{opacity:.7;transform:scale(1.1)} }
@keyframes elmEntryDepthMid { 0%{opacity:0;transform:scale(.58)} 34%{opacity:.8} 100%{opacity:.52;transform:scale(1.22)} }
@keyframes elmEntryDepthNear { 0%{opacity:0;transform:scale(1.4)} 35%{opacity:.76} 100%{opacity:.6;transform:scale(1)} }
@keyframes elmEntryEclipse { 0%{opacity:.9;transform:scale(1.55) translateY(9%)} 32%{opacity:1;transform:scale(1.14) translateY(2%)} 100%{opacity:.85;transform:scale(.93) translateY(-3%)} }
@keyframes elmEntryAscent { 0%{opacity:0;transform:translateY(30%) scaleY(.65)} 34%{opacity:.85;transform:translateY(5%) scaleY(.96)} 100%{opacity:.55;transform:translateY(-13%) scaleY(1.14)} }
@keyframes elmEntryObscurity { 0%{opacity:1;transform:scale(.71) rotate(-4deg)} 35%{opacity:.9;transform:scale(1.02) rotate(-1deg)} 100%{opacity:.59;transform:scale(1.27)} }
@keyframes elmEntryPressure { 0%{opacity:.15;transform:scale(1.6)} 34%{opacity:.88;transform:scale(1.025)} 43%{opacity:.8;transform:scale(1)} 100%{opacity:.65;transform:scale(1.04)} }
@keyframes elmEntryConvergence { 0%{opacity:0;transform:scale(1.8)} 35%{opacity:.8;transform:scale(1.07)} 100%{opacity:.65;transform:scale(.98)} }
@keyframes elmEntryWeight { 0%{transform:translateY(0)} 24%{transform:translateY(1.3px)} 100%{transform:translateY(0)} }
@keyframes elmEntryResonance { 0%{opacity:0;transform:scale(.75)} 20%{opacity:.29;transform:scale(1)} 55%{opacity:.17} 100%{opacity:.08;transform:scale(1.3)} }
@keyframes elmEntryOriginFinish { 0%{background-position:120% 50%;opacity:0;filter:none} 12%{opacity:1;filter:drop-shadow(0 0 2px var(--elm-finish-core)) drop-shadow(-5px 0 7px var(--elm-finish-halo))} 52%{opacity:1;filter:drop-shadow(0 0 3px var(--elm-finish-core)) drop-shadow(-8px 0 10px var(--elm-finish-halo))} 80%{opacity:.9} 100%{background-position:-20% 50%;opacity:0;filter:none} }
@keyframes elmEntryNightFinish { 0%,100%{background-image:none;-webkit-text-stroke:.9px var(--elm-finish-core);mask-image:linear-gradient(99deg,transparent 35%,#000 46%,#000 54%,transparent 65%);-webkit-mask-image:linear-gradient(99deg,transparent 35%,#000 46%,#000 54%,transparent 65%);mask-size:240% 100%;-webkit-mask-size:240% 100%} 0%{mask-position:94% 50%;-webkit-mask-position:94% 50%;opacity:0} 10%{mask-position:82% 50%;-webkit-mask-position:82% 50%;opacity:.94} 52%{mask-position:50% 50%;-webkit-mask-position:50% 50%;opacity:1} 90%{mask-position:18% 50%;-webkit-mask-position:18% 50%;opacity:.9} 100%{mask-position:9% 50%;-webkit-mask-position:9% 50%;opacity:0} }
@keyframes elmEntryRiseFinish { 0%,100%{background-size:100% 240%} 0%{background-position:50% -20%;opacity:0} 10%{background-position:50% 9%;opacity:1} 52%{background-position:50% 50%;opacity:1} 90%{background-position:50% 86%;opacity:.9} 100%{background-position:50% 94%;opacity:0} }
@keyframes elmEntryLostFinish { 0%,100%{background-image:var(--elm-finish-beam),var(--elm-finish-beam),var(--elm-finish-beam);background-size:240% 34%,240% 34%,240% 34%} 0%{background-position:94% 0,103% 50%,112% 100%;opacity:0} 12%{background-position:80% 0,89% 50%,98% 100%;opacity:1} 52%{background-position:41% 0,50% 50%,59% 100%;opacity:1} 90%{background-position:0 0,9% 50%,18% 100%;opacity:.9} 100%{background-position:-9% 0,0 50%,9% 100%;opacity:0} }
@keyframes elmEntryDominionFinish { 0%{background-position:94% 50%;opacity:0} 10%{background-position:82% 50%;opacity:1} 52%{background-position:50% 50%;opacity:1} 90%{background-position:18% 50%;opacity:.94} 100%{background-position:9% 50%;opacity:0} }
@keyframes elmEntryFinaleFinish { 0%,100%{background-image:var(--elm-finish-beam),var(--elm-finish-beam);background-size:240% 100%,240% 100%} 0%{background-position:94% 50%,6% 50%;opacity:0} 10%{background-position:82% 50%,18% 50%;opacity:.85} 52%{background-position:64% 50%,36% 50%;opacity:.94} 90%{background-position:51% 50%,49% 50%;opacity:1} 100%{background-position:50% 50%,50% 50%;opacity:0} }
/* Earned-title ceremony: detailed seal, recognition copy and score-specific timing. */
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] { background:radial-gradient(ellipse at 50% 50%,color-mix(in srgb,var(--aka-title-ceremony-face) 5%,transparent),transparent 48%),rgba(0,0,0,.78) !important; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-game-notice-panel { position:relative;width:min(62rem,100%);height:330px;min-height:330px;padding:0;display:block;overflow:visible;perspective:950px;transform:none !important;transition:none !important; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-title-ceremony-compass { position:absolute;top:14px;left:calc(50% - 26px);width:52px;height:52px;margin:0;display:block;opacity:0;transform:none;transition:none; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-title-ceremony-brand { position:absolute;top:87px;left:0;right:0;margin:0;display:block;color:rgba(230,221,204,.8);font:400 13px/1.4 "Special Elite",monospace;letter-spacing:.29em;text-indent:.29em;opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(10px);transition:none; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-title-ceremony-identity { position:absolute;top:117px;left:0;right:0;margin:0;display:block;color:rgba(168,183,197,.64);font:400 11px/1.4 Arial,sans-serif;letter-spacing:.21em;text-indent:.21em;opacity:0;transition:none; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-title-ceremony-rail { position:absolute;top:139px;left:0;right:0;height:100px;width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:clamp(10px,3vw,25px);align-items:center;perspective:950px;transform:translateY(-22px); }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-title-ceremony-line { display:block;width:100%;height:1px;opacity:0;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--aka-title-ceremony-face) 32%,transparent));box-shadow:none;transform:none;transition:none; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-title-ceremony-line.is-right { transform:rotate(180deg); }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-game-notice-title { position:relative;isolation:isolate;max-width:min(72vw,560px);margin:0;padding:0;white-space:nowrap;font:600 clamp(20px,6.4vw,46px)/1.06 "Mullero Cinema",Arial,sans-serif !important;font-synthesis:none;letter-spacing:.045em !important;text-indent:.045em;color:var(--aka-title-ceremony-face) !important;-webkit-text-fill-color:var(--aka-title-ceremony-face) !important;-webkit-text-stroke:.25px var(--aka-title-ceremony-contour) !important;text-shadow:0 1px 0 var(--aka-title-ceremony-inner),0 2px 0 rgba(0,0,0,.82),0 5px 8px rgba(0,0,0,.38) !important;opacity:0;clip-path:none;transform:translateZ(-1550px) scale(.32);transition:none; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-game-notice-title::before,.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-game-notice-title::after { content:attr(data-title);position:absolute;inset:0;pointer-events:none; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-game-notice-title::before { z-index:1;color:var(--aka-title-ceremony-face);-webkit-text-fill-color:var(--aka-title-ceremony-face);-webkit-text-stroke:.25px var(--aka-title-ceremony-contour);text-shadow:none; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-game-notice-title::after { z-index:2;color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke:1px color-mix(in srgb,var(--aka-title-ceremony-face) 68%,#fff);background:none;opacity:0; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-title-ceremony-earned { position:absolute;top:265px;left:0;right:0;margin:0;display:block;color:rgba(231,220,199,.66);font:400 11px/1.6 "Special Elite",monospace;letter-spacing:.21em;text-indent:.21em;opacity:0;filter:blur(4px);transform:none;transition:none; }
@supports (background-clip:text) or (-webkit-background-clip:text) {
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-game-notice-title::before,.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .elm-title-letter::before { background:linear-gradient(168deg,color-mix(in srgb,var(--aka-title-ceremony-face) 70%,#fff) 6%,color-mix(in srgb,var(--aka-title-ceremony-face) 92%,#fff) 36%,var(--aka-title-ceremony-face) 48%,color-mix(in srgb,var(--aka-title-ceremony-face) 82%,#111820) 68%,color-mix(in srgb,var(--aka-title-ceremony-face) 94%,#111820) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent; }
}
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-title-ceremony-rail { animation:elmTitleCompose var(--elm-rail-duration) cubic-bezier(.22,.8,.22,1) var(--elm-rail-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-title-ceremony-line { animation:elmTitleDetail var(--elm-line-duration) ease var(--elm-line-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-title-ceremony-compass { animation:elmTitleDetail var(--elm-compass-duration) ease var(--elm-compass-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-archive-compass-ring.is-outer { animation:elmTitleSealOuter var(--elm-outer-duration) cubic-bezier(.25,.6,.25,1) var(--elm-outer-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-archive-compass-ring.is-inner { animation:elmTitleSealInner var(--elm-inner-duration) cubic-bezier(.25,.6,.25,1) var(--elm-inner-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-archive-compass-rose { animation:elmTitleSealMetal var(--elm-rose-duration) ease var(--elm-rose-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible :is(.aka-archive-compass-facets,.aka-archive-compass-ticks,.aka-archive-compass-center) { animation:elmTitleDetail var(--elm-facets-duration) ease var(--elm-facets-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-title-ceremony-brand { animation:elmTitleBrand var(--elm-brand-duration) cubic-bezier(.2,.7,.2,1) var(--elm-brand-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-title-ceremony-identity { animation:elmTitleDetail var(--elm-identity-duration) ease var(--elm-identity-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-title-ceremony-earned { animation:elmTitleCaption var(--elm-earned-duration) cubic-bezier(.18,.65,.18,1) var(--elm-earned-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-game-notice-title:not(.is-elm-letter-title) { animation:elmTitleArrival 1660ms linear var(--elm-title-delay) both,elmTitleInk 1660ms linear var(--elm-title-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-game-notice-title:not(.is-elm-letter-title)::before { animation:elmTitleFace 1660ms linear var(--elm-title-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key].is-visible .aka-game-notice-title:not(.is-elm-letter-title)::after { animation:elmTitleEdge 1660ms linear var(--elm-title-delay) both; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key="legend"] .aka-game-notice-title.is-elm-letter-title { display:flex;align-items:baseline;justify-content:center;gap:0;width:max-content;max-width:86vw;white-space:nowrap;opacity:1;transform:none; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key="legend"] .aka-game-notice-title.is-elm-letter-title::before,.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key="legend"] .aka-game-notice-title.is-elm-letter-title::after { content:none;display:none; }
.elm-title-letter { position:relative;display:block;isolation:isolate;letter-spacing:.035em;color:var(--aka-title-ceremony-face);-webkit-text-fill-color:var(--aka-title-ceremony-face);-webkit-text-stroke:.25px var(--aka-title-ceremony-contour);text-shadow:0 1px 0 var(--aka-title-ceremony-inner),0 2px 0 rgba(0,0,0,.82),0 5px 8px rgba(0,0,0,.38);transform-origin:50% 60%; }
.elm-title-letter::before { content:attr(data-letter);position:absolute;inset:0;z-index:1;color:var(--aka-title-ceremony-face);-webkit-text-fill-color:var(--aka-title-ceremony-face);-webkit-text-stroke:.25px var(--aka-title-ceremony-contour);text-shadow:none; }
.elm-title-letter-gap { display:block;width:.30em; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key="legend"].is-visible .elm-title-letter { animation:elmTitleLetterArrival 1000ms linear var(--elm-letter-delay) both; }
@keyframes elmTitleCompose { from{transform:translateY(-22px)} to{transform:translateY(0)} }
@keyframes elmTitleDetail { from{opacity:0} to{opacity:1} }
@keyframes elmTitleSealOuter { from{stroke-dashoffset:177.2} to{stroke-dashoffset:0} }
@keyframes elmTitleSealInner { from{stroke-dashoffset:156.5} to{stroke-dashoffset:0} }
@keyframes elmTitleSealMetal { 0%{opacity:0;fill-opacity:0} 45%{opacity:.7;fill-opacity:.06} 100%{opacity:1;fill-opacity:1} }
@keyframes elmTitleBrand { from{opacity:0;clip-path:inset(0 0 100% 0);transform:translateY(10px)} to{opacity:1;clip-path:inset(0);transform:translateY(0)} }
@keyframes elmTitleCaption { from{opacity:0;filter:blur(4px);letter-spacing:.31em} to{opacity:1;filter:blur(0);letter-spacing:.21em} }
@keyframes elmTitleArrival { 0%{opacity:0;transform:translateZ(-1900px) scale(.65) rotateX(7deg) rotateY(-3deg);filter:blur(1.5px)} 14%{opacity:.75;transform:translateZ(-1650px) scale(.68) rotateX(6deg) rotateY(-2.5deg);filter:blur(1.7px)} 40%{opacity:1;transform:translateZ(-1020px) scale(.78) rotateX(4deg) rotateY(-1.5deg);filter:blur(2.2px)} 61%{opacity:1;transform:translateZ(-460px) scale(.88) rotateX(2deg);filter:blur(3px)} 72.85%{opacity:1;transform:translateZ(-120px) scale(.96) rotateX(.5deg);filter:blur(1.6px)} 80%{opacity:1;transform:translateZ(0) scale(1.018);filter:blur(0)} 86%{opacity:1;transform:translateZ(0) scale(1.003);filter:blur(0)} 100%{opacity:1;transform:translateZ(0) scale(1);filter:blur(0)} }
@keyframes elmTitleInk { 0%,40%{color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke-color:transparent;text-shadow:none} 80%,100%{color:var(--aka-title-ceremony-face);-webkit-text-fill-color:var(--aka-title-ceremony-face);-webkit-text-stroke-color:var(--aka-title-ceremony-contour);text-shadow:0 1px 0 var(--aka-title-ceremony-inner),0 2px 0 rgba(0,0,0,.82),0 5px 8px rgba(0,0,0,.38)} }
@keyframes elmTitleFace { 0%{opacity:0} 14%{opacity:.14} 40%{opacity:.55} 72.85%,100%{opacity:1} }
@keyframes elmTitleEdge { 0%{opacity:.6} 14%{opacity:.9} 40%{opacity:.45} 72.85%,100%{opacity:0} }
@keyframes elmTitleLetterArrival { 0%{opacity:0;transform:perspective(760px) translateZ(-1400px) rotateY(var(--elm-letter-turn,-7deg)) scale(.3);filter:blur(2px)} 36%{opacity:.35;transform:perspective(760px) translateZ(-820px) rotateY(var(--elm-letter-turn,-7deg)) scale(.65);filter:blur(2.5px)} 58%{opacity:.9;transform:perspective(760px) translateZ(-240px) rotateY(2deg) scale(.88);filter:blur(1.5px)} 80%{opacity:1;transform:perspective(760px) translateZ(0) rotateY(0) scale(1.05);filter:blur(0)} 94%{opacity:1;transform:perspective(760px) translateZ(0) rotateY(0) scale(1.004);filter:blur(0)} 100%{opacity:1;transform:perspective(760px) translateZ(0) rotateY(0) scale(1);filter:blur(0)} }
.aka-wallet-player-title-text[data-title="ERO LEGEND"] { --aka-rank-face:#B64A76;--aka-rank-inner:#351326;--aka-rank-contour:#DDBB6A;--aka-rank-glow:rgba(182,74,118,.14); }
@media (max-width:560px) {
.elm-archive-entry-word-frame { padding:0 10px; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-game-notice-panel { width:100%;height:310px;min-height:310px; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-title-ceremony-rail { grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-game-notice-title:not(.is-elm-letter-title) { width:calc(100vw - 72px);max-width:calc(100vw - 72px);white-space:normal;font-size:clamp(27px,9.85vw,34px) !important;line-height:1.06 !important; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key="legend"] .aka-game-notice-title.is-elm-letter-title { font-size:clamp(27px,8.8vw,34px) !important; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-title-ceremony-earned { letter-spacing:.13em;text-indent:.13em; }
}
@media (prefers-reduced-motion:reduce) {
.elm-archive-entry-cinematic,.elm-archive-entry-cinematic *,.elm-archive-entry-word::before,.elm-archive-entry-word::after,.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key],.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] * { animation:none !important;transition:none !important;filter:none !important;transform:none !important; }
.elm-archive-entry-word,.elm-archive-entry-word::before,.elm-archive-entry-field,.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] :is(.aka-title-ceremony-compass,.aka-title-ceremony-brand,.aka-title-ceremony-identity,.aka-title-ceremony-earned,.aka-title-ceremony-line,.aka-game-notice-title,.elm-title-letter) { opacity:1 !important; }
.elm-archive-entry-word::after,.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-game-notice-title::after { opacity:0 !important; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-archive-compass-ring { stroke-dashoffset:0 !important; }
.aka-game-notice-overlay.is-title-ceremony[data-ceremony-key] .aka-archive-compass-rose { opacity:1 !important;fill-opacity:1 !important; }
}
#modalContent.aka-wallet-select-content .aka-wallet-select-safety-body {
color:rgba(225,214,189,.74);
}
#modalContent.aka-wallet-select-content .aka-wallet-select-safety-status {
color:rgba(231,190,123,.84);
}
#modalContent.aka-wallet-select-content .aka-wallet-provider-close {
border:1px solid rgba(var(--aka-wallet-vault-bronze),.34);
border-radius:4px;
color:rgba(222,201,158,.68) !important;
background:linear-gradient(180deg,rgba(64,39,17,.22),rgba(5,15,10,.72));
box-shadow:
inset 0 1px 0 rgba(241,215,158,.045),
0 5px 12px rgba(0,0,0,.22);
text-shadow:none;
}
@media (hover:hover) and (pointer:fine) {
#modalContent.aka-wallet-select-content .aka-wallet-provider-close:hover {
color:rgba(241,216,163,.88) !important;
border-color:rgba(var(--aka-wallet-vault-bronze),.54);
box-shadow:
0 0 6px rgba(var(--aka-wallet-vault-gold),.07),
inset 0 1px 0 rgba(246,223,174,.065),
0 6px 14px rgba(0,0,0,.25);
filter:brightness(1.035);
}
}
@media (max-width:768px) {
#modalContent.aka-wallet-select-content > .aka-wallet-select-modal {
border-radius:6px !important;
box-shadow:
0 0 0 1px rgba(var(--aka-wallet-vault-emerald),.065),
0 0 12px rgba(var(--aka-wallet-vault-emerald),.075),
0 18px 42px rgba(0,0,0,.68),
inset 0 1px 0 rgba(246,216,154,.045) !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option,
#modalContent.aka-wallet-select-content .aka-wallet-option-mark,
#modalContent.aka-wallet-select-content .aka-wallet-provider-copy,
#modalContent.aka-wallet-select-content .aka-wallet-select-safety {
border-radius:6px !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-headline {
font-size:.60rem !important;
line-height:1.38 !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-note {
font-size:.70rem !important;
line-height:1.42 !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-option-status,
#modalContent.aka-wallet-select-content .aka-wallet-option-download {
font-size:.56rem !important;
letter-spacing:.10em !important;
}
#modalContent.aka-wallet-select-content .aka-wallet-select-safety {
padding:.72rem .76rem !important;
font-size:.60rem !important;
line-height:1.55 !important;
letter-spacing:.08em !important;
}
}
/* Arabic copy reads RTL without mirroring the site's LTR composition. */
html[lang="ar"],
html[lang="ar"] body {
direction:ltr;
}
html[lang="ar"] [data-i18n] {
direction:rtl;
unicode-bidi:isolate;
}
@media (min-width:1024px) {
html[lang="ar"] #navbar .aka-nav-cinema-segment {
width:27rem;
min-width:27rem;
justify-content:space-between;
gap:.45rem;
direction:ltr;
}
html[lang="ar"] #navbar .aka-nav-cinema-segment > a {
font-size:.68rem !important;
white-space:nowrap;
}
}
@media (min-width:769px) and (max-width:1023px) {
html[lang="ar"] #navbar .aka-nav-cinema-segment {
gap:.34rem;
padding-left:.54rem;
padding-right:.46rem;
direction:ltr;
}
html[lang="ar"] #navbar .aka-nav-cinema-segment > a {
font-size:.59rem !important;
white-space:nowrap;
}
}
/* Keep the footer emblem and main studio name on the credits' central axis. */
.aka-studio-seal {
--aka-footer-brand-shift:0px;
}
.aka-studio-seal .aka-studio-name {
transform:translateX(var(--aka-footer-brand-shift));
}
.aka-studio-seal .aka-studio-orb.aka-cinematic-signal-hotspot,
.aka-studio-seal .aka-studio-orb.aka-cinematic-signal-hotspot:hover {
transform:translateX(var(--aka-footer-brand-shift)) translateY(-0.30rem) translateZ(0);
}
.aka-studio-seal .aka-studio-orb.aka-cinematic-signal-hotspot:active,
.aka-studio-seal .aka-studio-orb.aka-cinematic-signal-hotspot.is-pressed {
transform:translateX(var(--aka-footer-brand-shift)) translateY(-0.292rem) scale(.986) translateZ(0);
}
/* Each credit gets one brief, restrained glow only when pressed. */
[data-credit-press] {
cursor:pointer;
-webkit-tap-highlight-color:transparent;
transition:color 180ms ease,text-shadow 220ms ease,filter 220ms ease;
}
[data-credit-press]:focus-visible {
outline:1px solid rgba(212,168,67,.34);
outline-offset:.22rem;
}
.aka-footer-kicker.is-credit-pressed,
.aka-credit-label.is-credit-pressed {
color:rgba(235,209,149,.78);
text-shadow:0 0 6px rgba(212,168,67,.24),0 0 13px rgba(212,168,67,.10);
}
.aka-credit-value.is-credit-pressed {
color:rgba(229,191,101,.96);
text-shadow:0 0 7px rgba(212,168,67,.30),0 0 17px rgba(139,0,0,.16);
}
.aka-credit-subvalue.is-credit-pressed {
color:rgba(235,220,189,.80);
text-shadow:0 0 6px rgba(232,213,183,.18),0 0 14px rgba(212,168,67,.08);
}
/* ========================================================================== */
/* ARCHIVE MAZE V36 — LOCK-ONLY READY SIGNAL + RESTRAINED PHYSICAL PRESS */
/* ========================================================================== */
.aka-archive-bonus-icon { --aka-task-accent:74,168,142 !important; }
.aka-archive-task-icon.is-sealed,
.aka-archive-task-icon.is-key-ready {
opacity:1 !important;
filter:none !important;
border-color:rgba(var(--aka-task-accent),.18) !important;
background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(4,4,4,.97)) !important;
box-shadow:inset 0 0 8px rgba(0,0,0,.42) !important;
animation:none !important;
}
.aka-archive-task-icon.is-sealed > svg,
.aka-archive-task-icon.is-key-ready > svg {
opacity:.28 !important;
filter:saturate(.28) brightness(.58) !important;
}
/* Matching-key readiness belongs only to the tiny color-coded lock. */
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock {
opacity:1 !important;
animation:akaMazeLockSignal 2.28s ease-in-out infinite !important;
}
button.aka-archive-task-icon:hover,
button.aka-archive-task-icon:focus-visible {
transform:none !important;
}
button.aka-archive-task-icon:not(:disabled):active {
transform:scale(.975) !important;
opacity:.92 !important;
box-shadow:inset 0 2px 7px rgba(0,0,0,.58) !important;
transition-duration:105ms !important;
transition-timing-function:cubic-bezier(.2,.78,.3,1) !important;
}
.aka-archive-task-icon.is-unlocking {
pointer-events:none !important;
}
.aka-archive-task-icon.is-unlocking .aka-archive-task-lock {
animation:akaMazeLockRelease 140ms cubic-bezier(.2,.72,.25,1) both !important;
}
@keyframes akaMazeLockRelease {
0% { opacity:1;transform:scale(1) rotate(0deg); }
42% { opacity:1;transform:scale(1.08) rotate(-9deg); }
100% { opacity:0;transform:scale(.72) translateY(-2px) rotate(-16deg); }
}
/* BONUS is royal jade; $AKA keeps its separate brighter emerald/gold vault. */
.aka-wallet-signal-action.is-bonus,
.aka-wallet-signal-action.is-bonus.is-selected { --aka-wallet-signal-rgb:74,168,142 !important; }
.aka-wallet-drawer-inner.is-bonus { --aka-drawer-rgb:74,168,142 !important; }
.aka-file-requirement-warning.is-bonus {
background:radial-gradient(ellipse at center,rgba(74,168,142,.10),transparent 44%),rgba(0,0,0,.26) !important;
}
.aka-file-requirement-warning.is-bonus .aka-file-requirement-card {
border-color:rgba(74,168,142,.40) !important;
background:radial-gradient(ellipse at 50% 0%,rgba(74,168,142,.13),transparent 48%),linear-gradient(180deg,rgba(6,20,16,.98),rgba(4,5,5,.98)) !important;
}
.aka-file-requirement-warning.is-bonus .aka-file-requirement-icon {
color:rgb(104,211,172) !important;
border-color:rgba(74,168,142,.42) !important;
background:rgba(74,168,142,.09) !important;
box-shadow:0 0 13px rgba(74,168,142,.26),inset 0 0 12px rgba(74,168,142,.08) !important;
}
/* Wallet categories are state indicators, never breathing/pulsing controls. */
.aka-wallet-signal-action,
.aka-wallet-signal-action::before,
.aka-wallet-signal-action::after,
.aka-wallet-drawer-key {
animation:none !important;
}
@keyframes akaMazeLockSignalMobile {
0%,100% { opacity:.88;transform:scale(1); }
50% { opacity:1;transform:scale(1.055); }
}
@media (max-width:768px) {
button.aka-archive-task-icon:not(:disabled):active {
box-shadow:inherit !important;
}
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock,
.aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,
.aka-archive-question-source-lock-panel.is-key-lock.is-key-ready .aka-archive-question-source-lock-icon {
animation:akaMazeLockSignalMobile 2.28s ease-in-out infinite !important;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-archive-task-icon,
.aka-archive-task-icon .aka-archive-task-lock {
transition-duration:1ms !important;
animation:none !important;
}
button.aka-archive-task-icon:not(:disabled):active {
transform:scale(.99) !important;
}
}
/* ========================================================================== */
/* V36.3 — INVESTIGATION TRACE REFERENCE + TOUCH-STABLE SEALED STATES */
/* ========================================================================== */
.aka-archive-main-question-modal.is-investigation-trace-modal {
background:
radial-gradient(ellipse at center,rgba(72,190,220,.105),transparent 48%),
rgba(0,0,0,.48) !important;
}
.aka-archive-main-question-card.is-investigation-trace,
#modalContent .aka-origin-question-card.is-investigation-trace {
--aka-trace-cyan:83,201,235;
--aka-trace-bronze:196,139,86;
width:min(37.5rem,100%) !important;
height:min(34rem,calc(100dvh - 2rem)) !important;
min-height:30rem !important;
max-height:calc(100dvh - 2rem) !important;
padding:1.65rem 2rem 1.25rem !important;
border:1px solid rgba(var(--aka-trace-cyan),.40) !important;
border-radius:0 !important;
background:
radial-gradient(ellipse at 50% -6%,rgba(var(--aka-trace-cyan),.115),transparent 47%),
linear-gradient(90deg,rgba(0,0,0,.48),transparent 22%,transparent 78%,rgba(0,0,0,.48)),
repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 4px),
linear-gradient(180deg,rgba(11,17,18,.985),rgba(4,6,6,.993)) !important;
box-shadow:
0 0 0 1px rgba(var(--aka-trace-bronze),.035),
0 0 18px rgba(var(--aka-trace-cyan),.16),
0 0 42px rgba(0,0,0,.76),
0 24px 64px rgba(0,0,0,.72),
inset 0 1px 0 rgba(255,231,194,.04),
inset 0 0 28px rgba(var(--aka-trace-bronze),.035) !important;
}
.aka-archive-main-question-card.is-investigation-trace::before,
#modalContent .aka-origin-question-card.is-investigation-trace::before {
background:
linear-gradient(90deg,rgba(0,0,0,.58),transparent 24%,transparent 76%,rgba(0,0,0,.58)),
repeating-linear-gradient(0deg,rgba(255,255,255,.022) 0 1px,transparent 1px 4px) !important;
opacity:.84 !important;
}
.aka-archive-main-question-card.is-investigation-trace::after,
#modalContent .aka-origin-question-card.is-investigation-trace::after {
background:
linear-gradient(115deg,transparent 0 36%,rgba(208,245,247,.026) 47%,transparent 58%),
linear-gradient(180deg,rgba(var(--aka-trace-cyan),.045),transparent 24%) !important;
opacity:.58 !important;
}
.aka-investigation-trace-header {
position:relative;
z-index:1;
flex:0 0 auto;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
width:100%;
margin:0 auto .72rem;
text-align:center;
}
.aka-investigation-trace-icon {
display:grid;
place-items:center;
width:3.72rem;
height:3.72rem;
margin:0 auto .88rem;
color:rgb(var(--aka-trace-bronze));
border:1px solid rgba(var(--aka-trace-cyan),.37);
background:
radial-gradient(circle,rgba(var(--aka-trace-cyan),.14),rgba(var(--aka-trace-bronze),.06)),
rgba(8,15,16,.72);
box-shadow:
0 0 13px rgba(var(--aka-trace-cyan),.22),
inset 0 0 12px rgba(var(--aka-trace-bronze),.07);
}
.aka-investigation-trace-icon svg {
width:2rem;
height:2rem;
stroke-width:1.75;
filter:drop-shadow(0 0 4px rgba(var(--aka-trace-cyan),.28));
}
.aka-investigation-trace-kicker {
margin:0 0 .76rem;
color:rgba(212,168,67,.78);
font-family:'Special Elite',monospace;
font-size:.60rem;
line-height:1;
letter-spacing:.39em;
text-transform:uppercase;
text-shadow:0 0 6px rgba(212,168,67,.12);
}
.aka-investigation-trace-title {
margin:0;
color:rgba(244,224,194,.98);
font-family:'Bebas Neue',sans-serif;
font-size:clamp(2.85rem,6vw,3.85rem);
font-weight:400;
line-height:.90;
letter-spacing:.075em;
text-transform:uppercase;
text-shadow:
0 1px 0 rgba(0,0,0,.82),
0 0 10px rgba(var(--aka-trace-bronze),.09),
0 0 20px rgba(var(--aka-trace-cyan),.045);
}
.aka-archive-main-question-card.is-investigation-trace .aka-archive-question-answer-source {
margin:.02rem auto .58rem !important;
border-color:rgba(var(--aka-trace-cyan),.30) !important;
background:
radial-gradient(circle at 50% 0,rgba(var(--aka-trace-cyan),.10),transparent 67%),
linear-gradient(180deg,rgba(var(--aka-trace-bronze),.055),rgba(5,11,12,.66)) !important;
box-shadow:
0 0 10px rgba(var(--aka-trace-cyan),.10),
inset 0 1px 0 rgba(255,235,197,.035) !important;
}
.aka-archive-main-question-card.is-investigation-trace .aka-archive-question-answer-source-icon {
color:rgb(var(--aka-trace-bronze)) !important;
}
.aka-archive-main-question-card.is-investigation-trace .aka-archive-question-tabs {
margin:.02rem auto .50rem;
border-color:rgba(var(--aka-trace-cyan),.13);
background:linear-gradient(90deg,transparent,rgba(var(--aka-trace-cyan),.05),transparent);
}
.aka-archive-main-question-card.is-investigation-trace .aka-archive-question-tab.is-active {
border-color:rgba(var(--aka-trace-cyan),.64);
background:
radial-gradient(circle at 50% 0,rgba(var(--aka-trace-cyan),.18),transparent 62%),
linear-gradient(180deg,rgba(var(--aka-trace-bronze),.08),rgba(5,11,12,.82));
box-shadow:0 0 11px rgba(var(--aka-trace-cyan),.19),inset 0 1px 0 rgba(255,236,199,.05);
}
.aka-archive-main-question-card.is-investigation-trace .aka-archive-question-prompt-scroll {
scrollbar-color:rgba(var(--aka-trace-cyan),.42) transparent;
}
.aka-archive-main-question-card.is-investigation-trace .aka-archive-question-prompt-scroll::-webkit-scrollbar-thumb {
background:linear-gradient(180deg,rgba(var(--aka-trace-cyan),.62),rgba(var(--aka-trace-bronze),.50));
}
.aka-archive-main-question-card.is-investigation-trace .aka-archive-question-prompt-scroll h2,
#modalContent .aka-origin-question-card.is-investigation-trace .aka-archive-question-prompt-scroll h2 {
text-shadow:
0 1px 0 rgba(0,0,0,.78),
0 0 13px rgba(var(--aka-trace-cyan),.07),
0 0 22px rgba(var(--aka-trace-bronze),.045) !important;
}
.aka-archive-main-question-card.is-investigation-trace [data-archive-question-input],
#modalContent .aka-origin-question-card.is-investigation-trace #originAccessInput {
border-color:rgba(var(--aka-trace-cyan),.30) !important;
background:linear-gradient(180deg,rgba(10,20,21,.86),rgba(3,7,8,.94)) !important;
box-shadow:inset 0 1px 0 rgba(224,248,249,.025),inset 0 0 14px rgba(var(--aka-trace-cyan),.025) !important;
}
.aka-archive-main-question-card.is-investigation-trace [data-archive-question-input]:focus,
#modalContent .aka-origin-question-card.is-investigation-trace #originAccessInput:focus {
border-color:rgba(var(--aka-trace-cyan),.62) !important;
box-shadow:0 0 11px rgba(var(--aka-trace-cyan),.13),inset 0 0 14px rgba(var(--aka-trace-cyan),.035) !important;
outline:none !important;
}
.aka-archive-main-question-card.is-investigation-trace .aka-archive-question-submit,
#modalContent .aka-origin-question-card.is-investigation-trace .aka-archive-question-submit {
border-color:rgba(var(--aka-trace-cyan),.43) !important;
color:rgba(236,220,188,.96) !important;
background:
radial-gradient(ellipse at 50% 0,rgba(var(--aka-trace-bronze),.11),transparent 64%),
linear-gradient(180deg,rgba(16,34,36,.86),rgba(4,10,11,.97)) !important;
box-shadow:0 0 11px rgba(var(--aka-trace-cyan),.11),inset 0 1px 0 rgba(255,238,204,.045) !important;
}
.aka-archive-main-question-card.is-investigation-trace .aka-archive-question-submit:hover,
.aka-archive-main-question-card.is-investigation-trace .aka-archive-question-submit:focus-visible,
#modalContent .aka-origin-question-card.is-investigation-trace .aka-archive-question-submit:hover,
#modalContent .aka-origin-question-card.is-investigation-trace .aka-archive-question-submit:focus-visible {
transform:none !important;
filter:brightness(1.04);
border-color:rgba(var(--aka-trace-bronze),.62) !important;
}
.aka-archive-main-question-card.is-investigation-trace .aka-archive-question-submit:active,
#modalContent .aka-origin-question-card.is-investigation-trace .aka-archive-question-submit:active {
transform:scale(.978) !important;
filter:brightness(.97);
}
/* Origin entry shares the Trace material, but deliberately has no MAG glyph. */
.modal-box.aka-origin-access-modal-box {
width:min(27rem,calc(100vw - 2rem)) !important;
}
#modalContent .aka-origin-question-card.is-investigation-trace {
width:min(27rem,100%) !important;
height:auto !important;
min-height:0 !important;
max-height:calc(100dvh - 2rem) !important;
padding:1.38rem 1.35rem 1.12rem !important;
border-color:rgba(var(--aka-trace-cyan),.44) !important;
box-shadow:
0 0 0 1px rgba(var(--aka-trace-bronze),.045),
0 0 16px rgba(var(--aka-trace-cyan),.17),
0 0 38px rgba(var(--aka-trace-cyan),.075),
0 22px 58px rgba(0,0,0,.76),
inset 0 1px 0 rgba(255,231,194,.045),
inset 0 0 25px rgba(var(--aka-trace-bronze),.04) !important;
}
#modalContent .aka-origin-question-card .aka-investigation-trace-header.is-entry-trace {
margin-top:.08rem;
margin-bottom:.48rem;
}
#modalContent .aka-origin-question-card .aka-investigation-trace-title {
font-size:clamp(2.28rem,5vw,2.75rem);
text-shadow:
0 1px 0 rgba(0,0,0,.82),
0 0 12px rgba(var(--aka-trace-bronze),.12),
0 0 24px rgba(var(--aka-trace-cyan),.07);
}
#modalContent .aka-origin-question-card .aka-origin-question-stage {
gap:.68rem;
}
#modalContent .aka-origin-question-card .aka-archive-question-prompt-scroll {
min-height:0;
max-height:8.2rem;
padding:.68rem .55rem;
}
#modalContent .aka-origin-question-card .aka-archive-question-prompt-scroll h2 {
font-size:clamp(1.18rem,3.4vw,1.48rem);
line-height:1.16;
}
#modalContent .aka-origin-question-card form {
margin:.10rem auto 0;
}
#modalContent .aka-origin-question-card input {
min-height:2.72rem;
padding:.72rem .84rem;
}
#modalContent .aka-origin-question-card .aka-archive-question-error {
min-height:.78rem;
margin:.34rem 0 .18rem;
}
#modalContent .aka-origin-question-card .aka-archive-question-submit {
min-height:2.58rem;
margin-top:.12rem;
}
@media (max-width:640px) {
.aka-archive-main-question-card.is-investigation-trace,
#modalContent .aka-origin-question-card.is-investigation-trace {
width:100% !important;
height:min(33rem,calc(100dvh - 1.1rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))) !important;
min-height:0 !important;
padding:1.08rem .82rem .76rem !important;
}
.aka-investigation-trace-icon {
width:3.05rem;
height:3.05rem;
margin-bottom:.60rem;
}
.aka-investigation-trace-icon svg { width:1.62rem;height:1.62rem; }
.aka-investigation-trace-kicker { margin-bottom:.50rem;font-size:.51rem;letter-spacing:.31em; }
.aka-investigation-trace-title { font-size:2.72rem; }
#modalContent .aka-origin-question-card.is-investigation-trace {
width:min(25rem,100%) !important;
height:auto !important;
max-height:calc(100dvh - 1.1rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px)) !important;
padding:1.15rem .88rem .82rem !important;
}
#modalContent .aka-origin-question-card .aka-investigation-trace-title {
font-size:2.32rem;
}
#modalContent .aka-origin-question-card .aka-archive-question-prompt-scroll {
max-height:7.4rem;
padding:.56rem .35rem;
}
#modalContent .aka-origin-question-card .aka-archive-question-prompt-scroll h2 {
font-size:clamp(1.04rem,5.25vw,1.28rem);
}
}
/* Touch screens must never inherit desktop hover light or cross-card feedback. */
@media (hover:none), (pointer:coarse) {
#gallery .poster-card,
#gallery .poster-card:hover,
#gallery .poster-card:active,
#gallery .poster-card.active-touch,
#gallery .poster-card.unlocked:hover,
#gallery .poster-card.unlocked.active-touch {
transform:translateZ(0) !important;
}
#gallery .poster-card::after,
#gallery .poster-card::before {
content:none !important;
display:none !important;
}
#gallery .poster-card:hover img,
#gallery .poster-card.active-touch img {
transform:none !important;
}
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret,
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret:hover,
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret.active-touch {
animation:none !important;
filter:
drop-shadow(0 0 8px rgba(34,197,94,.19))
drop-shadow(0 0 19px rgba(16,185,129,.10)) !important;
}
#modalContent .aka-archive-file-card,
#modalContent .aka-archive-file-card:hover,
#modalContent .aka-archive-file-card:active,
#modalContent .aka-archive-file-card:focus-within {
transform:translateZ(0) !important;
}
#modalContent .aka-archive-file-card.is-sealed.is-sealed-feedback-active,
#modalContent .aka-archive-file-card.is-sealed.is-sealed-feedback-fading {
transform:translateZ(0) !important;
filter:none !important;
}
#modalContent .aka-archive-file-card .aka-archive-locked-btn.aka-premium-press:hover,
#modalContent .aka-archive-file-card .aka-archive-locked-btn.aka-premium-press:focus,
#modalContent .aka-archive-file-card .aka-archive-locked-btn.aka-premium-press:focus-visible {
transform:none !important;
filter:none !important;
}
#modalContent .aka-archive-file-card .aka-archive-locked-btn[data-archive-sealed-feedback="poster"].is-sealed-feedback-fading {
transition-duration:130ms !important;
}
}
/* Completion is always unmistakably green, independent of the mission's own
MAG/DIA/Bonus/Key accent color. */
.aka-archive-task-check {
border-color:rgba(81,245,128,.96) !important;
background:#04180b !important;
color:#51f580 !important;
box-shadow:0 0 9px rgba(74,222,128,.62) !important;
}
.aka-archive-task-check svg {
color:#51f580 !important;
stroke:#51f580 !important;
filter:drop-shadow(0 0 3px rgba(81,245,128,.86)) !important;
}
.aka-archive-question-tab-check {
color:#51f580 !important;
text-shadow:0 0 5px rgba(81,245,128,.68) !important;
}
/* ========================================================================== */
/* V0.36.6 — SHARP LOCKS / ALIVE MAG / COMPLETION AFTERGLOW */
/* ========================================================================== */
/* A sealed mechanism remains recognisable. It is dormant, not blurred away. */
.aka-archive-task-icon.is-sealed,
.aka-archive-task-icon.is-key-ready {
opacity:1 !important;
filter:none !important;
-webkit-backdrop-filter:none !important;
backdrop-filter:none !important;
border-color:rgba(var(--aka-task-accent),.24) !important;
background:
radial-gradient(circle at 50% 45%,rgba(var(--aka-task-accent),.035),transparent 52%),
linear-gradient(180deg,rgba(255,255,255,.016),rgba(4,4,4,.98)) !important;
box-shadow:inset 0 0 8px rgba(0,0,0,.46) !important;
}
.aka-archive-task-icon.is-sealed > svg,
.aka-archive-task-icon.is-key-ready > svg {
opacity:.48 !important;
color:rgba(var(--aka-task-accent),.66) !important;
filter:none !important;
}
/* The small lock owns the bright state signal. Its glow is narrow and crisp. */
.aka-archive-task-lock {
--aka-lock-rgb:255,45,85;
--aka-lock-ink:#ff4264;
color:var(--aka-lock-ink) !important;
background:radial-gradient(circle,rgba(12,3,6,.98) 0 54%,transparent 57%) !important;
box-shadow:none !important;
filter:
drop-shadow(0 0 1px rgba(var(--aka-lock-rgb),1))
drop-shadow(0 0 4px rgba(var(--aka-lock-rgb),.94))
drop-shadow(0 0 8px rgba(var(--aka-lock-rgb),.34)) !important;
opacity:1 !important;
transform:translateZ(0);
transform-origin:center;
will-change:transform,opacity;
}
.aka-archive-task-lock.is-silver { --aka-lock-rgb:210,225,238;--aka-lock-ink:#edf7ff; }
.aka-archive-task-lock.is-gold { --aka-lock-rgb:255,209,69;--aka-lock-ink:#ffda54; }
.aka-archive-task-lock.is-red { --aka-lock-rgb:255,45,85;--aka-lock-ink:#ff4264; }
.aka-archive-task-lock.is-blue { --aka-lock-rgb:71,188,255;--aka-lock-ink:#5cc4ff; }
/* Owning the matching key animates only the tiny lock, never the poster/card. */
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock {
animation:akaMazeLockBreathV366 2.35s cubic-bezier(.45,.05,.55,.95) infinite !important;
}
@keyframes akaMazeLockBreathV366 {
0%,100% {
opacity:.88;
transform:scale(1) translateZ(0);
}
50% {
opacity:1;
transform:scale(1.075) translateZ(0);
}
}
/* MAG is a living bronze instrument with a cold lens, but DIA remains rarer. */
.aka-archive-magnifier-icon.is-active {
border-color:rgba(196,139,86,.70) !important;
background:
radial-gradient(circle at 50% 46%,rgba(83,216,239,.24) 0 21%,rgba(83,216,239,.065) 22% 38%,transparent 40%),
radial-gradient(circle at 34% 27%,rgba(255,222,174,.10),transparent 34%),
linear-gradient(180deg,rgba(184,126,74,.17),rgba(5,3,3,.97)) !important;
box-shadow:
0 0 7px rgba(196,139,86,.31),
0 0 15px rgba(72,205,235,.12),
inset 0 0 10px rgba(83,216,239,.055) !important;
}
.aka-archive-magnifier-icon.is-active > svg {
color:rgb(218,158,100) !important;
filter:
drop-shadow(0 0 1px rgba(255,218,177,.72))
drop-shadow(0 0 4px rgba(78,202,235,.48))
drop-shadow(0 0 8px rgba(184,126,74,.20)) !important;
}
/* Completion gets a quiet green heartbeat around the ring, not a flashing icon. */
.aka-archive-task-icon.is-complete::before {
content:"";
position:absolute;
inset:-.20rem;
border:1px solid rgba(81,245,128,.38);
border-radius:999px;
box-shadow:0 0 7px rgba(74,222,128,.20);
opacity:.32;
transform:scale(.985) translateZ(0);
pointer-events:none;
animation:akaMazeCompletedAfterglowV366 3.6s ease-in-out infinite;
}
@keyframes akaMazeCompletedAfterglowV366 {
0%,100% { opacity:.26;transform:scale(.985) translateZ(0); }
50% { opacity:.52;transform:scale(1.035) translateZ(0); }
}
@media (max-width:768px) {
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock {
animation:akaMazeLockBreathV366 2.35s cubic-bezier(.45,.05,.55,.95) infinite !important;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock,
.aka-archive-task-icon.is-complete::before {
animation:none !important;
}
.aka-archive-task-icon.is-complete::before { opacity:.36;transform:none; }
}
/* ========================================================================== */
/* V0.36.7 — PRODUCTION IMAGE / TOUCH / LAYOUT POLISH */
/* ========================================================================== */
/* Responsive wrappers must own the same box as the image they
replaced. This prevents a blank first paint while the WebP source decodes. */
#hero > .absolute.inset-0 > picture,
#hero > .absolute.inset-0 > picture > img,
#gallery .poster-card > picture,
#gallery .poster-card > picture > img {
display:block;
width:100%;
height:100%;
}
#story picture { display:block;width:100%; }
#modalContent .aka-trailer-locked-modal > picture,
#modalContent .aka-wallet-gate-modal > picture,
#modalContent .night-kaka-cinematic-bg > picture {
display:contents;
}
/* Cards fill their grid tracks; previous 330/375px caps created unintended
empty gutters that looked like missing poster content. */
#gallery .aka-archive-gallery-grid .poster-card {
width:100%;
max-width:none;
}
/* The archive reel wall uses one consistent inner gutter. Older utility
padding left Origin visibly farther from the frame than the other vaults. */
#modalContent .aka-vault-terminal .aka-vault-content {
padding-inline:clamp(.72rem,1.15vw,1rem) !important;
}
#modalContent .aka-vault-terminal .aka-archive-grid {
gap:clamp(.58rem,.92vw,.88rem) !important;
}
#gallery .poster-card p {
color:rgba(232,213,183,.62) !important;
}
/* No artificial padding around archive previews. A spoiler-safe 2:3 preview
fills the card; non-standard legacy sources use contain and are never
destructively cropped. */
#modalContent .aka-cinematic-archive:not(.is-night-reference) .aka-archive-poster-preview {
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
padding:0 !important;
margin:0 !important;
object-fit:contain !important;
object-position:center !important;
transform:none !important;
background:#020202 !important;
}
/* Night sources are authored at 2:3 already; the old extra 1.08 zoom clipped
poster edges and is no longer needed. */
#modalContent .aka-cinematic-archive.is-night-reference .aka-archive-poster-preview {
width:100% !important;
height:100% !important;
padding:0 !important;
object-fit:cover !important;
transform:translate(-50%,-50%) !important;
}
.aka-archive-task-lock { will-change:auto; }
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock { will-change:transform,opacity; }
@media (hover:none), (pointer:coarse) {
/* A retained :focus-within after tapping SEALED may not relight the whole
card. Only the pressed SEALED control acknowledges the touch. */
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified),
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed:not(.is-classified):where(:hover,:focus-within,:active) {
--aka-sealed-card-border:rgba(212,168,67,.34) !important;
--aka-sealed-card-shadow:
inset 0 0 0 1px rgba(255,232,176,.018),
0 0 12px rgba(212,168,67,.10),
0 0 20px rgba(139,0,0,.10),
0 18px 46px rgba(0,0,0,.68) !important;
}
}
@media (max-width:640px) {
.modal-box.archive-modal-wide > .modal-close {
width:2.75rem !important;
height:2.75rem !important;
min-width:2.75rem !important;
min-height:2.75rem !important;
}
}
@media (max-height:560px) and (orientation:landscape) {
#modalContent .aka-investigation-trace-card,
#modalContent .aka-origin-question-card {
min-height:0 !important;
max-height:calc(100dvh - 1rem) !important;
overflow:auto !important;
}
}
html, body { user-select:text; }
button, a, [role="button"], .aka-protected-poster, .aka-archive-poster-preview {
user-select:none;
-webkit-user-select:none;
}
/* ========================================================================== */
/* V0.36.8 — RELEASE FEEDBACK / LOCALE / MODAL GEOMETRY CONTRACT */
/* ========================================================================== */
:root {
--aka-blue-key:#47bcff;
--aka-blue-key-rgb:71,188,255;
}
/* Russian labels stay on the same physical CTA geometry as every locale. */
html[lang="ru"] .aka-hero-enter-cta,
html[lang="ru"] .aka-hero-view-story-cta,
html[lang="ru"] #buyLinkHero,
html[lang="ru"] #watchTrailerBtn {
width:auto !important;
max-width:100% !important;
min-width:0 !important;
min-height:3rem;
padding-inline:clamp(1rem,4.5vw,1.55rem) !important;
gap:.48rem !important;
white-space:nowrap !important;
font-size:clamp(.96rem,4.7vw,1.15rem) !important;
line-height:1 !important;
letter-spacing:.095em !important;
}
html[lang="ru"] .aka-hero-enter-cta span,
html[lang="ru"] .aka-hero-view-story-cta span,
html[lang="ru"] #buyLinkHero span,
html[lang="ru"] #watchTrailerBtn span {
min-width:0;
white-space:nowrap !important;
overflow-wrap:normal !important;
word-break:keep-all !important;
}
html[lang="ru"] #gallery .poster-card {
min-width:0 !important;
block-size:auto !important;
}
/* Locked archive / trailer gates are centered regardless of the mobile
document-scrolling rule used by the full reel wall. */
.modal-overlay:has(.aka-trailer-locked-modal),
.modal-overlay:has(.aka-origin-access-shell) {
align-items:center !important;
justify-content:center !important;
overflow:auto !important;
padding:
max(.75rem,env(safe-area-inset-top,0px))
max(.75rem,env(safe-area-inset-right,0px))
max(.75rem,env(safe-area-inset-bottom,0px))
max(.75rem,env(safe-area-inset-left,0px)) !important;
}
.modal-overlay:has(.aka-trailer-locked-modal) .modal-box,
.modal-overlay:has(.aka-origin-access-shell) .modal-box {
margin:auto !important;
transform-origin:center center !important;
}
.modal-overlay:has(.aka-trailer-locked-modal) #modalContent > .aka-trailer-locked-modal {
padding-top:clamp(2.9rem,8vh,4.2rem) !important;
padding-bottom:clamp(2.25rem,7vh,3.6rem) !important;
}
/* One compact premium entry console, including a close control that never
hangs outside the viewport at 320–328px. */
.modal-box.aka-origin-access-modal-box {
width:min(25rem,calc(100vw - 1.5rem)) !important;
max-height:calc(100dvh - 1.5rem) !important;
margin:auto !important;
}
.modal-box.aka-origin-access-modal-box > .modal-close {
position:absolute !important;
top:.55rem !important;
right:.55rem !important;
display:grid !important;
place-items:center !important;
width:2.35rem !important;
min-width:2.35rem !important;
height:2.35rem !important;
min-height:2.35rem !important;
margin:0 !important;
padding:0 !important;
border:1px solid rgba(212,168,67,.42) !important;
border-radius:999px !important;
background:rgba(5,7,7,.88) !important;
color:rgba(242,217,164,.94) !important;
box-shadow:0 0 12px rgba(212,168,67,.14),inset 0 0 9px rgba(212,168,67,.035) !important;
font:400 1.2rem/1 ui-sans-serif,system-ui,sans-serif !important;
transform:none !important;
z-index:40 !important;
}
#modalContent .aka-origin-access-shell {
width:100%;
min-height:0 !important;
padding:0 !important;
}
#modalContent .aka-origin-question-card.is-investigation-trace {
width:100% !important;
height:auto !important;
min-height:0 !important;
max-height:calc(100dvh - 1.5rem) !important;
padding:1.2rem 1rem .92rem !important;
overflow:hidden !important;
}
#modalContent .aka-origin-question-card .aka-investigation-trace-header.is-entry-trace {
padding-right:2rem;
padding-left:2rem;
margin-bottom:.32rem !important;
}
#modalContent .aka-origin-question-card .aka-archive-question-prompt-scroll {
max-height:min(7.3rem,25dvh) !important;
overflow:auto !important;
}
/* The eye is a deliberate part of UNSEAL, not a tiny decorative mark. */
#modalContent .aka-archive-inspect-btn {
align-items:center !important;
justify-content:center !important;
gap:.48rem !important;
}
#modalContent .aka-archive-inspect-btn svg {
position:static !important;
width:1.04rem !important;
height:1.04rem !important;
margin:0 !important;
flex:0 0 1.04rem !important;
transform:none !important;
stroke-width:1.8 !important;
}
/* MAG panels keep their cyan/bronze instrument language but state the
instruction once. The search glyph already communicates the panel type. */
.aka-investigation-trace-header.is-icon-only {
margin:0 auto .38rem !important;
}
.aka-investigation-trace-header.is-icon-only .aka-investigation-trace-icon {
width:3.15rem;
height:3.15rem;
margin:0 auto .18rem !important;
}
.aka-file-requirement-warning.is-instruction-only .aka-file-requirement-card {
width:min(90vw,31rem);
padding:1.6rem 1.5rem 1.4rem;
}
.aka-file-requirement-warning.is-instruction-only .aka-file-requirement-icon {
margin-bottom:.85rem;
}
.aka-file-requirement-warning.is-instruction-only .aka-file-requirement-copy {
max-width:25rem;
color:rgba(225,218,202,.78);
}
/* Normal mission completion is a concise, non-blocking status beat. Major
discoveries and NEW TRACE still use the full cinematic notice. */
.aka-game-notice-overlay.is-mission-complete {
align-items:flex-end;
padding:1rem 1rem max(1rem,env(safe-area-inset-bottom,0px));
background:transparent !important;
backdrop-filter:none !important;
-webkit-backdrop-filter:none !important;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel {
width:min(24rem,calc(100vw - 2rem));
padding:1rem 3rem 1rem 1rem;
display:grid;
grid-template-columns:2.35rem minmax(0,1fr);
grid-template-areas:"symbol kicker" "symbol title" "symbol subtitle";
column-gap:.78rem;
text-align:left;
border-radius:5px;
pointer-events:none;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-orb,
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-close {
display:none !important;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-symbol {
grid-area:symbol;
align-self:center;
width:2.35rem;
height:2.35rem;
margin:0;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-kicker {
grid-area:kicker;
margin:0 0 .2rem;
font-size:.52rem;
letter-spacing:.24em;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-title {
grid-area:title;
margin:0;
font-size:clamp(1.25rem,5vw,1.7rem);
line-height:1;
letter-spacing:.06em;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-subtitle {
grid-area:subtitle;
margin:.22rem 0 0;
font-size:.53rem;
line-height:1.2;
letter-spacing:.12em;
}
/* Picking up a key confirms wallet storage without interrupting play twice. */
.aka-key-stored-toast {
--aka-key-rgb:205,218,229;
position:fixed;
right:max(1rem,env(safe-area-inset-right,0px));
bottom:max(1rem,env(safe-area-inset-bottom,0px));
z-index:12250;
display:grid;
grid-template-columns:2.15rem minmax(0,1fr);
align-items:center;
gap:.72rem;
width:min(20.5rem,calc(100vw - 2rem));
padding:.72rem .86rem;
border:1px solid rgba(var(--aka-key-rgb),.38);
border-radius:5px;
background:radial-gradient(circle at 0 50%,rgba(var(--aka-key-rgb),.10),transparent 48%),rgba(5,6,7,.965);
box-shadow:0 0 18px rgba(var(--aka-key-rgb),.16),0 16px 42px rgba(0,0,0,.66),inset 0 1px 0 rgba(255,255,255,.035);
opacity:0;
pointer-events:none;
transform:translateY(.55rem) scale(.985);
transition:opacity 220ms ease,transform 260ms cubic-bezier(.22,1,.36,1);
}
.aka-key-stored-toast.is-visible { opacity:1;transform:none; }
.aka-key-stored-toast.is-gold { --aka-key-rgb:255,198,53; }
.aka-key-stored-toast.is-red { --aka-key-rgb:255,45,85; }
.aka-key-stored-toast.is-blue { --aka-key-rgb:var(--aka-blue-key-rgb); }
.aka-key-stored-toast-icon {
display:grid;
place-items:center;
width:2.15rem;
height:2.15rem;
color:rgb(var(--aka-key-rgb));
border:1px solid rgba(var(--aka-key-rgb),.32);
border-radius:999px;
background:rgba(var(--aka-key-rgb),.055);
filter:drop-shadow(0 0 6px rgba(var(--aka-key-rgb),.34));
}
.aka-key-stored-toast-icon svg { width:1.05rem;height:1.05rem; }
.aka-key-stored-toast-copy { min-width:0;display:grid;gap:.18rem; }
.aka-key-stored-toast-copy strong {
color:rgba(244,231,207,.96);
font:400 1.05rem/1 'Bebas Neue',sans-serif;
letter-spacing:.075em;
text-transform:uppercase;
}
.aka-key-stored-toast-copy small {
color:rgba(var(--aka-key-rgb),.82);
font:400 .52rem/1 'Special Elite',monospace;
letter-spacing:.22em;
text-transform:uppercase;
}
/* Blue Master Key has one exact token in the wallet, reel wall and trailer. */
.aka-wallet-drawer-key.is-blue { --aka-key-rgb:var(--aka-blue-key-rgb) !important; }
.aka-archive-key-icon.is-blue { --aka-task-accent:var(--aka-blue-key-rgb) !important; }
.aka-archive-task-lock.is-blue {
--aka-lock-rgb:var(--aka-blue-key-rgb) !important;
--aka-lock-ink:var(--aka-blue-key) !important;
color:var(--aka-blue-key) !important;
}
.aka-trailer-lock-icon,
.is-blue-key-gate .aka-blue-key-kicker,
.is-blue-key-gate .aka-blue-key-requirement,
.is-blue-key-gate .aka-blue-key-requirement svg,
.is-blue-key-gate .aka-blue-key-requirement span {
color:var(--aka-blue-key) !important;
}
.is-blue-key-gate .aka-blue-key-requirement {
border-color:rgba(var(--aka-blue-key-rgb),.38) !important;
background:rgba(var(--aka-blue-key-rgb),.08) !important;
}
#watchTrailerBtn {
color:var(--aka-blue-key) !important;
border-color:rgba(var(--aka-blue-key-rgb),.45) !important;
}
/* Reel artwork is genuinely edge-to-edge. All labels, download controls and
side-mission icons remain absolutely overlaid above this clipped layer. */
#modalContent .aka-cinematic-archive .aka-archive-file-card {
overflow:hidden !important;
}
#modalContent .aka-cinematic-archive .aka-archive-file-card .aka-archive-poster-preview,
#modalContent .aka-cinematic-archive .aka-archive-file-card img.aka-archive-revealed-poster,
#modalContent .aka-cinematic-archive .aka-archive-file-card.is-recovered img.aka-archive-revealed-poster,
#modalContent .aka-cinematic-archive .aka-archive-file-card.is-bonus-recovered img.aka-archive-revealed-poster {
position:absolute !important;
inset:0 !important;
top:0 !important;
left:0 !important;
width:100% !important;
height:100% !important;
padding:0 !important;
margin:0 !important;
object-fit:cover !important;
object-position:center center !important;
transform:none !important;
border-radius:inherit !important;
background:#020202 !important;
}
@media (max-width:640px) {
.modal-box.aka-origin-access-modal-box {
width:calc(100vw - 1rem) !important;
max-height:calc(100dvh - 1rem) !important;
}
#modalContent .aka-origin-question-card.is-investigation-trace {
max-height:calc(100dvh - 1rem) !important;
padding:1rem .78rem .72rem !important;
}
.modal-box.aka-origin-access-modal-box > .modal-close {
top:.42rem !important;
right:.42rem !important;
width:2.22rem !important;
min-width:2.22rem !important;
height:2.22rem !important;
min-height:2.22rem !important;
}
#modalContent .aka-origin-question-card .aka-investigation-trace-header.is-entry-trace {
padding-inline:1.7rem;
}
#modalContent .aka-archive-inspect-btn svg {
width:.98rem !important;
height:.98rem !important;
flex-basis:.98rem !important;
}
.aka-key-stored-toast {
right:50%;
bottom:max(.75rem,env(safe-area-inset-bottom,0px));
transform:translate(50%,.55rem) scale(.985);
}
.aka-key-stored-toast.is-visible { transform:translate(50%,0); }
}
@media (prefers-reduced-motion:reduce) {
.aka-key-stored-toast { transition:opacity 1ms linear;transform:none !important; }
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel { transform:none !important; }
}
/* ========================================================================== */
/* V0.37.0 — TARGETED MOBILE ARCHIVE / MODAL GEOMETRY POLISH */
/* ========================================================================== */
/* The disconnected wallet gate is a compact dialog, so it follows the same
centred geometry contract as the Origin verification and trailer gates.
The full archive wall keeps its intentional scroll-from-top behaviour. */
.modal-overlay:has(.aka-wallet-gate-modal) {
align-items:center !important;
justify-content:center !important;
overflow:auto !important;
padding:
max(.75rem,env(safe-area-inset-top,0px))
max(.75rem,env(safe-area-inset-right,0px))
max(.75rem,env(safe-area-inset-bottom,0px))
max(.75rem,env(safe-area-inset-left,0px)) !important;
}
.modal-overlay:has(.aka-wallet-gate-modal) .modal-box {
margin:auto !important;
transform-origin:center center !important;
}
/* All six mobile chapter covers own one premium 2:3 frame. The source image's
legacy dimensions may no longer make an unlocked card shorter than a locked
one. Desktop grid geometry is deliberately unchanged. */
@media (max-width:640px) {
#gallery .aka-archive-gallery-grid .poster-card {
position:relative;
width:100%;
aspect-ratio:2 / 3 !important;
min-height:0 !important;
block-size:auto !important;
}
#gallery .aka-archive-gallery-grid .poster-card > picture {
position:absolute;
inset:0;
width:100%;
height:100%;
}
#gallery .aka-archive-gallery-grid .poster-card > picture > img {
width:100%;
height:100% !important;
object-fit:cover !important;
object-position:center center;
}
}
/* Origin entry: keep the existing cyan/bronze console material, but restore a
calmer hierarchy and leave deliberate air around the in-frame close control. */
.modal-box.aka-origin-access-modal-box > .modal-close {
top:.50rem !important;
right:.50rem !important;
width:1.72rem !important;
min-width:1.72rem !important;
height:1.72rem !important;
min-height:1.72rem !important;
font-size:.96rem !important;
line-height:1 !important;
box-shadow:0 0 9px rgba(212,168,67,.12),inset 0 0 7px rgba(212,168,67,.025) !important;
}
#modalContent .aka-origin-question-card .aka-investigation-trace-header.is-entry-trace {
position:relative;
padding-inline:1.55rem !important;
margin-top:.08rem !important;
margin-bottom:.58rem !important;
}
#modalContent .aka-origin-question-card .aka-investigation-trace-header.is-entry-trace::after {
content:"";
width:min(7.5rem,42%);
height:1px;
margin-top:.52rem;
background:linear-gradient(90deg,transparent,rgba(var(--aka-trace-cyan),.38),rgba(var(--aka-trace-bronze),.28),transparent);
box-shadow:0 0 7px rgba(var(--aka-trace-cyan),.08);
}
#modalContent .aka-origin-question-card .aka-investigation-trace-title {
font-size:clamp(1.90rem,4.4vw,2.25rem) !important;
line-height:.94 !important;
letter-spacing:.10em !important;
}
#modalContent .aka-origin-question-card .aka-archive-question-prompt-scroll {
width:100%;
max-height:min(7rem,24dvh) !important;
padding:.62rem .72rem !important;
}
#modalContent .aka-origin-question-card .aka-archive-question-prompt-scroll h2 {
max-width:22rem;
font-size:clamp(1.06rem,3vw,1.28rem) !important;
line-height:1.24 !important;
letter-spacing:.025em;
}
/* Archive-wall X: the previous mobile 2.75rem override was visually larger
than the topbar it belongs to. Keep a >=24px target, align it inside the bar,
and reserve enough title space so the two controls never touch. */
.modal-box.archive-modal-wide > .modal-close {
top:.46rem !important;
right:.56rem !important;
width:1.65rem !important;
min-width:1.65rem !important;
height:1.65rem !important;
min-height:1.65rem !important;
font-size:.94rem !important;
line-height:1 !important;
}
.modal-box.archive-modal-wide .aka-vault-topbar {
padding-right:3.05rem !important;
}
@media (max-width:640px) {
.modal-overlay:has(.aka-wallet-gate-modal) {
min-height:100dvh;
}
.modal-box.aka-origin-access-modal-box > .modal-close {
top:.42rem !important;
right:.42rem !important;
width:1.72rem !important;
min-width:1.72rem !important;
height:1.72rem !important;
min-height:1.72rem !important;
}
#modalContent .aka-origin-question-card .aka-investigation-trace-header.is-entry-trace {
padding-inline:1.42rem !important;
margin-bottom:.50rem !important;
}
#modalContent .aka-origin-question-card .aka-investigation-trace-title {
font-size:clamp(1.78rem,8vw,2.02rem) !important;
}
#modalContent .aka-origin-question-card .aka-archive-question-prompt-scroll {
max-height:min(6.65rem,23dvh) !important;
padding:.54rem .48rem !important;
}
#modalContent .aka-origin-question-card .aka-archive-question-prompt-scroll h2 {
font-size:clamp(1rem,5vw,1.17rem) !important;
line-height:1.25 !important;
}
.modal-box.archive-modal-wide > .modal-close {
top:.42rem !important;
right:.46rem !important;
width:1.75rem !important;
min-width:1.75rem !important;
height:1.75rem !important;
min-height:1.75rem !important;
font-size:.98rem !important;
}
.modal-box.archive-modal-wide .aka-vault-topbar {
padding-right:3rem !important;
}
}
/* ========================================================================== */
/* V0.37.2 — ARCHIVE FEEDBACK, DECODE-SAFE REVEAL AND PREMIUM STATE LIGHT */
/* ========================================================================== */
/* Pointer and programmatic focus must not produce the browser's white ring.
Real keyboard navigation keeps a restrained, themed accessibility outline. */
html:not(.aka-keyboard-navigation)
:where(button,a,input,select,textarea,[tabindex]):focus,
html:not(.aka-keyboard-navigation)
:where(button,a,input,select,textarea,[tabindex]):focus-visible {
outline:none !important;
}
html.aka-keyboard-navigation
:where(button,a,input,select,textarea,[tabindex]):focus {
outline:1px solid rgba(229,191,101,.72) !important;
outline-offset:3px !important;
}
/* O1 and every other poster use final edge-to-edge geometry from the first
decoded UNSEAL frame. RECOVER/COMPLETED can no longer change image fit. */
#modalContent .aka-cinematic-archive .aka-archive-file-card.is-inspected
img.aka-archive-revealed-poster,
#modalContent .aka-cinematic-archive .aka-archive-file-card.is-recovered
img.aka-archive-revealed-poster,
#modalContent .aka-cinematic-archive .aka-archive-file-card.is-completed
img.aka-archive-revealed-poster {
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
padding:0 !important;
margin:0 !important;
object-fit:cover !important;
object-position:center center !important;
transform:none !important;
background:#020202 !important;
}
/* Mobile reveal keeps the same dissolve but animates compositor-friendly
opacity only. Expensive blur and box-shadow interpolation caused hitches. */
html.aka-mobile-runtime
#modalContent .aka-archive-file-card.is-inspect-transitioning {
transition:border-color 420ms ease !important;
}
html.aka-mobile-runtime
#modalContent .aka-archive-file-card.is-inspected.is-inspect-transitioning:not(.is-recovered)
img.aka-archive-revealed-poster {
filter:none !important;
opacity:.18 !important;
transition:opacity 430ms cubic-bezier(.22,1,.36,1) !important;
will-change:opacity;
backface-visibility:hidden;
}
html.aka-mobile-runtime
#modalContent .aka-archive-file-card.is-inspected.is-inspect-transitioning.is-inspect-revealing:not(.is-recovered)
img.aka-archive-revealed-poster {
opacity:1 !important;
}
html.aka-performance-lite
#modalContent .aka-archive-file-card.is-inspect-transitioning::before {
animation:none !important;
opacity:0 !important;
}
/* Button geometry is unchanged; only optical weight and lettering are tuned. */
#modalContent .aka-archive-inspect-btn,
#modalContent .aka-archive-inspect-btn span {
font-weight:600 !important;
font-size:clamp(.54rem,.72vw,.60rem) !important;
letter-spacing:.165em !important;
text-shadow:0 0 7px rgba(255,226,159,.42) !important;
}
#modalContent .aka-archive-file-card .aka-archive-locked-btn,
#modalContent .aka-archive-file-card .aka-archive-locked-btn span {
font-weight:700 !important;
font-size:clamp(.55rem,.76vw,.63rem) !important;
line-height:1 !important;
letter-spacing:.235em !important;
color:rgba(255,236,239,.97) !important;
text-shadow:0 0 6px rgba(255,219,226,.34),0 0 12px rgba(255,45,85,.35) !important;
}
/* Locked mechanisms remain intentionally subdued. Their tiny matching-key
locks gain a color-aware aura without making the main glyph look unlocked. */
.aka-archive-task-lock::before {
content:"";
position:absolute;
inset:-.25rem;
z-index:-1;
border-radius:999px;
background:radial-gradient(circle,currentColor 0,transparent 68%);
opacity:.22;
pointer-events:none;
}
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock::before {
opacity:.36;
}
/* Actionable mechanisms are vivid; completed mechanisms retain their own
DIA/MAG/KEY/BONUS identity and receive a crisp green completion marker. */
.aka-archive-task-icon.is-active {
opacity:1 !important;
filter:saturate(1.14) brightness(1.12) !important;
border-color:rgba(var(--aka-task-accent),.70) !important;
box-shadow:
0 0 9px rgba(var(--aka-task-accent),.38),
0 0 20px rgba(var(--aka-task-accent),.18),
inset 0 0 11px rgba(var(--aka-task-accent),.09) !important;
}
.aka-archive-task-icon.is-complete {
opacity:1 !important;
filter:saturate(1.24) brightness(1.18) !important;
color:rgb(var(--aka-task-accent)) !important;
border-color:rgba(var(--aka-task-accent),.88) !important;
background:
radial-gradient(circle at 36% 28%,rgba(255,255,255,.16),transparent 34%),
radial-gradient(circle at 50% 55%,rgba(var(--aka-task-accent),.22),transparent 68%),
linear-gradient(180deg,rgba(var(--aka-task-accent),.16),rgba(3,6,5,.97)) !important;
box-shadow:
0 0 0 1px rgba(107,240,151,.52),
0 0 10px rgba(var(--aka-task-accent),.54),
0 0 24px rgba(var(--aka-task-accent),.25),
inset 0 0 12px rgba(var(--aka-task-accent),.12) !important;
}
.aka-archive-task-icon.is-complete > svg {
opacity:1 !important;
filter:drop-shadow(0 0 4px rgba(var(--aka-task-accent),.72)) !important;
}
.aka-archive-magnifier-icon.is-active,
.aka-archive-magnifier-icon.is-complete {
background:
radial-gradient(circle at 50% 46%,rgba(72,205,235,.30) 0 23%,rgba(72,205,235,.08) 24% 42%,transparent 43%),
linear-gradient(180deg,rgba(184,126,74,.22),rgba(4,6,7,.97)) !important;
}
.aka-archive-magnifier-icon.is-active > svg,
.aka-archive-magnifier-icon.is-complete > svg {
color:rgb(224,164,105) !important;
filter:drop-shadow(0 0 4px rgba(78,202,235,.90)) drop-shadow(0 0 9px rgba(72,205,235,.42)) !important;
}
.aka-archive-task-check {
color:#b3ffc7 !important;
border-color:rgba(160,255,187,.96) !important;
background:#041a0b !important;
box-shadow:0 0 7px rgba(74,222,128,.78),0 0 14px rgba(34,197,94,.36) !important;
}
/* Completed poster atmosphere: core is emerald, Secret remains special cyan,
and Bonus keeps royal jade with a restrained gold edge. Static light avoids
permanent GPU animation while still making a finished wall feel alive. */
#modalContent .aka-archive-file-card.is-completed.is-completion-core {
border-color:rgba(101,240,151,.76) !important;
box-shadow:
0 0 0 1px rgba(74,222,128,.16),
0 0 19px rgba(34,197,94,.30),
0 0 42px rgba(16,185,129,.16),
0 20px 48px rgba(0,0,0,.58),
inset 0 0 24px rgba(74,222,128,.055) !important;
}
#modalContent .aka-archive-file-card.is-completed.is-completion-secret {
border-color:rgba(101,240,151,.76) !important;
box-shadow:
0 0 0 1px rgba(74,222,128,.16),
0 0 20px rgba(34,197,94,.30),
0 0 44px rgba(16,185,129,.16),
0 20px 48px rgba(0,0,0,.58),
inset 0 0 25px rgba(74,222,128,.055) !important;
}
#modalContent .aka-archive-file-card.is-completed.is-completion-bonus {
border-color:rgba(119,222,183,.72) !important;
box-shadow:
0 0 0 1px rgba(212,168,67,.18),
0 0 18px rgba(74,168,142,.30),
0 0 38px rgba(212,168,67,.14),
0 20px 48px rgba(0,0,0,.58),
inset 0 0 24px rgba(74,168,142,.06) !important;
}
@media (any-hover:hover) {
#modalContent .aka-archive-file-card.is-completed.is-completion-core:hover {
box-shadow:0 0 0 1px rgba(74,222,128,.20),0 0 25px rgba(34,197,94,.38),0 0 50px rgba(16,185,129,.19),0 22px 50px rgba(0,0,0,.60),inset 0 0 26px rgba(74,222,128,.07) !important;
}
#modalContent .aka-archive-file-card.is-completed.is-completion-secret:hover {
box-shadow:0 0 0 1px rgba(74,222,128,.20),0 0 26px rgba(34,197,94,.38),0 0 52px rgba(16,185,129,.19),0 22px 50px rgba(0,0,0,.60),inset 0 0 27px rgba(74,222,128,.07) !important;
}
#modalContent .aka-archive-file-card.is-completed.is-completion-bonus:hover {
box-shadow:0 0 0 1px rgba(212,168,67,.22),0 0 24px rgba(74,168,142,.38),0 0 46px rgba(212,168,67,.18),0 22px 50px rgba(0,0,0,.60),inset 0 0 26px rgba(74,168,142,.075) !important;
}
}
/* Key stored and sealed feedback share one true viewport centre. */
.aka-key-stored-toast {
top:50% !important;
left:50% !important;
right:auto !important;
bottom:auto !important;
transform:translate(-50%,calc(-50% + .48rem)) scale(.985) !important;
}
.aka-key-stored-toast.is-visible {
transform:translate(-50%,-50%) scale(1) !important;
}
.aka-archive-sealed-toast {
position:fixed;
top:50%;
left:50%;
z-index:12260;
display:grid;
grid-template-columns:2rem minmax(0,1fr);
align-items:center;
gap:.68rem;
width:min(22rem,calc(100vw - 2rem));
padding:.68rem .78rem;
border:1px solid rgba(255,64,97,.48);
border-radius:5px;
color:rgba(240,223,204,.88);
background:radial-gradient(circle at 0 50%,rgba(255,45,85,.12),transparent 48%),rgba(7,5,6,.965);
box-shadow:0 0 18px rgba(255,45,85,.19),0 16px 42px rgba(0,0,0,.68),inset 0 1px 0 rgba(255,255,255,.035);
opacity:0;
pointer-events:none;
transform:translate(-50%,calc(-50% + .48rem)) scale(.985);
transition:opacity 210ms ease,transform 250ms cubic-bezier(.22,1,.36,1);
}
.aka-archive-sealed-toast.is-visible {
opacity:1;
transform:translate(-50%,-50%) scale(1);
}
.aka-archive-sealed-toast-icon {
display:grid;
place-items:center;
width:2rem;
height:2rem;
color:#ff4265;
border:1px solid rgba(255,45,85,.35);
border-radius:999px;
background:rgba(255,45,85,.07);
filter:drop-shadow(0 0 6px rgba(255,45,85,.46));
}
.aka-archive-sealed-toast-icon svg {
width:1rem;
height:1rem;
stroke-width:2.25;
}
.aka-archive-sealed-toast-copy {
font:400 .61rem/1.45 var(--font-elite,"Special Elite",monospace);
letter-spacing:.075em;
}
@media (max-width:640px) {
#modalContent .aka-archive-inspect-btn,
#modalContent .aka-archive-inspect-btn span {
font-size:.53rem !important;
letter-spacing:.145em !important;
}
#modalContent .aka-archive-file-card .aka-archive-locked-btn,
#modalContent .aka-archive-file-card .aka-archive-locked-btn span {
font-size:.56rem !important;
letter-spacing:.205em !important;
}
.aka-archive-sealed-toast-copy {
font-size:.56rem;
line-height:1.42;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-key-stored-toast,
.aka-key-stored-toast.is-visible,
.aka-archive-sealed-toast,
.aka-archive-sealed-toast.is-visible {
transform:translate(-50%,-50%) !important;
transition:opacity 1ms linear !important;
}
}
/* ========================================================================== */
/* V0.37.16 — ORIGINAL HERO RESTORATION */
/* ========================================================================== */
/* The original continuous 3-second cyan/red VHS title layers are defined
above. Keep the R and STAR layout stabilisation from the later build. */
#heroSubtitle + .flex {
align-items:center;
}
.aka-hero-star-trigger {
margin:0 .75rem !important;
}
.aka-hero-star-line {
flex:0 0 5rem;
}
.aka-hero-r-trigger {
flex:0 0 auto;
font-family:'Bebas Neue',sans-serif !important;
font-size:1.5rem !important;
font-weight:400 !important;
line-height:1 !important;
letter-spacing:.025em !important;
color:#d4a843 !important;
}
.aka-hero-rating-badge {
align-items:center !important;
}
.aka-hero-restricted-copy {
line-height:1.28;
}
.aka-hero-rating-stars {
flex:0 0 auto;
line-height:1;
white-space:nowrap;
}
@media (prefers-reduced-motion:reduce) {
.glitch-text::before,
.glitch-text::after {
animation:none !important;
clip-path:inset(100% 0 0 0) !important;
opacity:0 !important;
}
}
/* ========================================================================== */
/* V0.37.4 — PREMIUM FEEDBACK SYSTEM + CRISP COMPLETION SIGNALS */
/* ========================================================================== */
/* Side-mission controls are tiny instruments, not frosted-glass chips. A
crisp glyph and a restrained halo read better and cost less to composite. */
.aka-archive-task-icon {
-webkit-backdrop-filter:none !important;
backdrop-filter:none !important;
}
.aka-archive-task-icon.is-active {
opacity:1 !important;
filter:saturate(1.08) brightness(1.08) !important;
border-color:rgba(var(--aka-task-accent),.82) !important;
box-shadow:
0 0 6px rgba(var(--aka-task-accent),.32),
inset 0 0 9px rgba(var(--aka-task-accent),.08) !important;
}
.aka-archive-task-icon.is-active > svg {
opacity:1 !important;
filter:drop-shadow(0 0 2px rgba(var(--aka-task-accent),.46)) !important;
}
/* Completion has three deliberately separate layers: the mechanism colour,
a dark separator, then one unmistakable green verification ring. */
.aka-archive-task-icon.is-complete {
opacity:1 !important;
filter:saturate(1.10) brightness(1.09) !important;
color:rgb(var(--aka-task-accent)) !important;
border-color:rgba(var(--aka-task-accent),.94) !important;
background:
radial-gradient(circle at 34% 27%,rgba(255,255,255,.13),transparent 33%),
radial-gradient(circle at 50% 55%,rgba(var(--aka-task-accent),.14),transparent 67%),
linear-gradient(180deg,rgba(var(--aka-task-accent),.12),rgba(3,6,5,.985)) !important;
box-shadow:
0 0 0 1px rgba(2,8,4,.98),
0 0 7px rgba(var(--aka-task-accent),.28),
inset 0 0 9px rgba(var(--aka-task-accent),.08) !important;
}
.aka-archive-task-icon.is-complete > svg {
opacity:1 !important;
filter:
drop-shadow(0 0 1px rgba(255,255,255,.30))
drop-shadow(0 0 2px rgba(var(--aka-task-accent),.48)) !important;
}
.aka-archive-task-icon.is-complete::before {
content:"";
position:absolute;
inset:-.20rem;
border:1.5px solid rgba(101,246,142,.92);
border-radius:999px;
box-shadow:0 0 5px rgba(74,222,128,.34);
opacity:1 !important;
transform:none !important;
animation:none !important;
pointer-events:none;
}
.aka-archive-task-check {
right:-.17rem !important;
bottom:-.17rem !important;
color:#c3ffd1 !important;
border-color:rgba(174,255,195,.98) !important;
background:#031509 !important;
box-shadow:
0 0 0 1px rgba(0,5,2,.96),
0 0 5px rgba(74,222,128,.48) !important;
filter:none !important;
}
.aka-archive-task-check svg {
filter:drop-shadow(0 1px 0 rgba(0,0,0,.92)) !important;
}
/* DIA keeps its rare magenta identity, but the gem itself remains readable.
The previous two broad glows blended its facets into a pink light spot. */
.aka-archive-diamond-icon.is-active,
.aka-archive-diamond-icon.is-complete {
border-color:rgba(201,67,187,.82) !important;
background:
radial-gradient(circle at 36% 28%,rgba(201,67,187,.10),transparent 31%),
radial-gradient(circle at 50% 55%,rgba(139,5,115,.13),transparent 64%),
linear-gradient(180deg,rgba(69,2,59,.72),rgba(32,1,34,.985)) !important;
box-shadow:
0 0 0 1px rgba(2,8,4,.96),
0 0 6px rgba(139,5,115,.24),
inset 0 0 8px rgba(69,2,59,.18) !important;
}
.aka-archive-diamond-icon.is-active > svg,
.aka-archive-diamond-icon.is-complete > svg {
color:#c943bb !important;
filter:
drop-shadow(0 0 1px rgba(255,225,242,.48))
drop-shadow(0 0 2px rgba(139,5,115,.42)) !important;
}
/* MAG stays bronze/cyan, with a defined lens instead of a diffuse blue fog. */
.aka-archive-magnifier-icon.is-active,
.aka-archive-magnifier-icon.is-complete {
background:
radial-gradient(circle at 50% 46%,rgba(83,216,239,.19) 0 22%,rgba(83,216,239,.035) 23% 39%,transparent 40%),
linear-gradient(180deg,rgba(184,126,74,.15),rgba(4,6,7,.985)) !important;
}
.aka-archive-magnifier-icon.is-active > svg,
.aka-archive-magnifier-icon.is-complete > svg {
color:rgb(224,164,105) !important;
filter:
drop-shadow(0 0 1px rgba(255,226,190,.46))
drop-shadow(0 0 3px rgba(78,202,235,.52)) !important;
}
/* One visual grammar for every action beat. Compact state confirmations use
the exact centre of the viewport; discoveries remain cinematic. */
.aka-game-notice-kicker.is-empty,
.aka-game-notice-title.is-empty {
display:none !important;
}
.aka-game-notice-orb {
display:none !important;
}
.aka-game-notice-panel {
border-radius:6px;
background:
radial-gradient(circle at 10% 20%,var(--aka-notice-wash-a),transparent 47%),
linear-gradient(180deg,rgba(16,13,11,.985),rgba(4,4,4,.992));
box-shadow:
0 0 0 1px rgba(255,238,194,.035) inset,
0 0 16px color-mix(in srgb,var(--aka-notice-color) 15%,transparent),
0 18px 52px rgba(0,0,0,.78);
contain:layout paint;
}
.aka-game-notice-symbol,
.aka-game-notice-symbol svg {
filter:none !important;
}
.aka-game-notice-symbol {
border-color:color-mix(in srgb,var(--aka-notice-color) 62%,transparent);
color:var(--aka-notice-color);
background:
radial-gradient(circle at 50% 44%,color-mix(in srgb,var(--aka-notice-color) 11%,transparent),rgba(4,4,4,.94) 70%);
box-shadow:
0 0 6px color-mix(in srgb,var(--aka-notice-color) 23%,transparent),
inset 0 0 8px color-mix(in srgb,var(--aka-notice-color) 6%,transparent);
}
.aka-game-notice-symbol svg {
stroke-width:2.05;
filter:drop-shadow(0 0 2px color-mix(in srgb,var(--aka-notice-color) 42%,transparent)) !important;
}
.aka-game-notice-overlay:is(.is-discovery,.is-archive-unlocked,.is-status,.is-legend).is-visible {
pointer-events:auto;
}
.aka-game-notice-overlay:is(.is-discovery,.is-archive-unlocked,.is-status,.is-legend) .aka-game-notice-panel {
pointer-events:auto;
}
.aka-game-notice-overlay.is-archive-unlocked .aka-game-notice-panel {
border-color:color-mix(in srgb,var(--aka-notice-color) 58%,transparent);
}
.aka-game-notice-overlay.is-archive-unlocked .aka-game-notice-title {
text-shadow:
0 0 7px rgba(255,245,218,.12),
0 0 17px color-mix(in srgb,var(--aka-notice-color) 24%,transparent);
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) {
align-items:center !important;
justify-content:center !important;
padding:max(.75rem,env(safe-area-inset-top,0px)) max(1rem,env(safe-area-inset-right,0px)) max(.75rem,env(safe-area-inset-bottom,0px)) max(1rem,env(safe-area-inset-left,0px)) !important;
background:transparent !important;
-webkit-backdrop-filter:none !important;
backdrop-filter:none !important;
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-panel {
width:min(25rem,calc(100vw - 2rem));
min-height:4.15rem;
padding:.78rem .92rem;
display:grid;
grid-template-columns:2.45rem minmax(0,1fr);
grid-template-areas:
"symbol kicker"
"symbol title"
"symbol subtitle";
align-items:center;
column-gap:.82rem;
text-align:left;
border-radius:6px;
pointer-events:none;
transform:translateY(.45rem) scale(.985);
background:
radial-gradient(circle at 0 50%,var(--aka-notice-wash-a),transparent 52%),
linear-gradient(180deg,rgba(12,10,9,.985),rgba(4,4,4,.992));
box-shadow:
0 0 0 1px rgba(255,255,255,.025) inset,
0 0 12px color-mix(in srgb,var(--aka-notice-color) 14%,transparent),
0 14px 38px rgba(0,0,0,.72);
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete).is-visible .aka-game-notice-panel {
transform:none;
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-panel::before {
inset:6px;
border-color:color-mix(in srgb,var(--aka-notice-color) 12%,transparent);
box-shadow:none;
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-panel::after,
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-close {
display:none !important;
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-symbol {
grid-area:symbol;
align-self:center;
width:2.45rem;
height:2.45rem;
margin:0;
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-symbol svg {
width:1.18rem;
height:1.18rem;
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-kicker {
grid-area:kicker;
margin:0 0 .18rem;
color:color-mix(in srgb,var(--aka-notice-color) 86%,#f4e5c8);
font:700 .60rem/1.15 'Space Grotesk',system-ui,sans-serif;
letter-spacing:.16em;
text-shadow:none;
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-title {
grid-area:title;
margin:0;
max-width:none;
color:rgba(247,235,216,.96);
font:650 clamp(.78rem,1.6vw,.88rem)/1.34 'Space Grotesk',system-ui,sans-serif;
letter-spacing:.045em;
text-transform:uppercase;
text-shadow:none;
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-subtitle {
grid-area:subtitle;
margin:.18rem 0 0;
color:rgba(224,214,198,.68);
font:550 .61rem/1.3 'Space Grotesk',system-ui,sans-serif;
letter-spacing:.08em;
text-transform:uppercase;
}
.aka-game-notice-overlay.is-blocked .aka-game-notice-panel {
min-height:4.3rem;
border-color:rgba(255,64,97,.54);
}
.aka-game-notice-overlay.is-blocked .aka-game-notice-title {
font-size:clamp(.80rem,1.8vw,.92rem);
line-height:1.38;
letter-spacing:.035em;
}
.aka-game-notice-overlay.is-key-stored .aka-game-notice-title,
.aka-game-notice-overlay.is-action-confirmed .aka-game-notice-title,
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-title {
font-family:'Bebas Neue','Space Grotesk',sans-serif;
font-size:clamp(1.05rem,2.2vw,1.25rem);
font-weight:400;
line-height:1.02;
letter-spacing:.075em;
}
.aka-game-notice-overlay :is(.aka-game-notice-kicker,.aka-game-notice-title,.aka-game-notice-subtitle,.aka-game-notice-footnote):dir(rtl) {
text-align:right;
letter-spacing:0 !important;
font-family:'Space Grotesk',system-ui,sans-serif !important;
}
@media (max-width:768px) {
/* Full-screen blur and the sweep are the only costly parts of a major notice.
Removing them on phones keeps the same panel while avoiding a frame hitch. */
.aka-game-notice-overlay {
-webkit-backdrop-filter:none !important;
backdrop-filter:none !important;
}
.aka-game-notice-panel::after {
display:none !important;
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-panel {
width:min(23rem,calc(100vw - 1.5rem));
min-height:4.35rem;
padding:.80rem .84rem;
grid-template-columns:2.38rem minmax(0,1fr);
column-gap:.72rem;
}
.aka-game-notice-overlay:is(.is-blocked,.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-title {
font-size:.80rem;
line-height:1.4;
}
.aka-game-notice-overlay:is(.is-key-stored,.is-action-confirmed,.is-mission-complete) .aka-game-notice-title {
font-size:1.08rem;
line-height:1.04;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-archive-task-icon.is-complete::before,
.aka-game-notice-overlay,
.aka-game-notice-panel {
animation:none !important;
}
}
/* ========================================================================== */
/* V0.37.17: KEY → WALLET TRANSFER */
/* ========================================================================== */
/* The transfer layer carries feedback without opening a received modal. It is
visual-only and always stays above the cinematic archive overlay. */
.aka-key-wallet-transfer-layer {
position:fixed;
inset:0;
z-index:10080;
overflow:hidden;
pointer-events:none;
contain:layout style paint;
}
.aka-key-wallet-receiver,
.aka-key-wallet-flyer {
--aka-key-transfer-rgb:205,228,244;
position:fixed;
display:inline-flex;
align-items:center;
justify-content:center;
color:rgb(var(--aka-key-transfer-rgb));
pointer-events:none;
will-change:transform,opacity,filter;
}
.aka-key-wallet-receiver.is-gold,
.aka-key-wallet-flyer.is-gold { --aka-key-transfer-rgb:255,198,53; }
.aka-key-wallet-receiver.is-red,
.aka-key-wallet-flyer.is-red { --aka-key-transfer-rgb:255,45,85; }
.aka-key-wallet-receiver.is-blue,
.aka-key-wallet-flyer.is-blue { --aka-key-transfer-rgb:74,168,255; }
.aka-key-wallet-receiver {
width:2.15rem;
height:2.15rem;
opacity:0;
transform:translate(-50%,-50%);
border:1px solid rgba(var(--aka-key-transfer-rgb),.48);
border-radius:.55rem;
background:
radial-gradient(circle at 36% 24%,rgba(255,255,255,.10),transparent 34%),
linear-gradient(155deg,rgba(20,19,17,.96),rgba(5,5,5,.98));
box-shadow:
inset 0 0 0 1px rgba(255,255,255,.025),
0 0 13px rgba(var(--aka-key-transfer-rgb),.18),
0 8px 22px rgba(0,0,0,.42);
}
.aka-key-wallet-receiver svg,
.aka-key-wallet-receiver i {
width:1.02rem;
height:1.02rem;
stroke:currentColor;
stroke-width:2.15;
filter:drop-shadow(0 0 3px rgba(var(--aka-key-transfer-rgb),.34));
}
.aka-key-wallet-flyer {
width:1.6rem;
height:1.6rem;
transform:translate(-50%,-50%);
filter:
drop-shadow(0 0 2px rgba(var(--aka-key-transfer-rgb),.90))
drop-shadow(0 0 9px rgba(var(--aka-key-transfer-rgb),.40));
}
.aka-key-wallet-flyer svg,
.aka-key-wallet-flyer i {
width:1.38rem;
height:1.38rem;
stroke:currentColor;
stroke-width:2.35;
}
@media (max-width:768px) {
.aka-key-wallet-receiver {
width:2rem;
height:2rem;
border-radius:.5rem;
}
.aka-key-wallet-flyer {
width:1.45rem;
height:1.45rem;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-key-wallet-receiver,
.aka-key-wallet-flyer {
animation:none !important;
transition:none !important;
}
}
/* Soundtrack / MAX light stays beneath the original vignettes and copy.
The existing SVG mask carries the runner; no new blur or particle system. */
.elm-hero-music-fx {
position:absolute;
inset:0;
pointer-events:none;
overflow:hidden;
transform-origin:center;
will-change:transform;
contain:layout paint style;
}
.elm-hero-music-fx > svg {
display:block;
width:100%;
height:100%;
}
.elm-hero-music-fx [data-music-tone],
.elm-hero-music-fx [data-music-outline],
.elm-hero-music-fx [data-music-rim] {
opacity:0;
filter:brightness(1.35) saturate(1.06);
}
@media (prefers-reduced-motion:reduce) {
.elm-hero-music-fx { display:none; }
}
/* ========================================================================== */
/* V0.37.5 — CINEMATIC CLARITY + BORDERLESS CLOSE CONTROL SYSTEM */
/* ========================================================================== */
/* Keep the approved cinematic atmosphere, but do not make the phone hero look
as though a blur layer sits over the artwork. High-density phones may select
the 1440px source; low-density or constrained devices retain the 720px file. */
@media (max-width:768px) {
#hero .aka-hero-background #heroBg {
opacity:.47 !important;
filter:contrast(1.045) saturate(1.025) brightness(1.025) !important;
}
#hero .aka-hero-depth-gradient {
background:linear-gradient(
to top,
rgba(10,10,10,.94) 0%,
rgba(10,10,10,.56) 39%,
rgba(10,10,10,.36) 66%,
rgba(10,10,10,.08) 100%
) !important;
}
#hero .aka-hero-side-vignette {
background:linear-gradient(
to right,
rgba(10,10,10,.65),
rgba(10,10,10,.12) 31%,
rgba(10,10,10,.12) 69%,
rgba(10,10,10,.65)
) !important;
}
#hero .aka-hero-red-vignette {
background:radial-gradient(
ellipse at center,
transparent 42%,
rgba(139,0,0,.105) 100%
) !important;
}
}
/* Every real X now uses the Investigation Trace language: no permanent ring,
no filled chip and no box shadow. The invisible hit target stays unchanged,
so the cleaner visual does not reduce mobile usability. */
/* These two modal selectors previously carried high-specificity circular
styling. Keep only their established position and hit-area dimensions. */
#cinematicModal .modal-box.archive-modal-wide > .modal-close,
#cinematicModal .modal-box.aka-origin-access-modal-box > .modal-close,
#cinematicModal .modal-box > .modal-close {
border:0 !important;
border-radius:0 !important;
background:transparent !important;
color:rgba(224,184,101,.76) !important;
box-shadow:none !important;
text-shadow:none !important;
filter:none !important;
}
/* The classified panel may keep its own accent elsewhere; the close glyph
itself remains part of the common gold navigation grammar. */
body .aka-archive-classified-signal-notice .aka-archive-classified-signal-notice-close {
border:0 !important;
border-radius:0 !important;
background:transparent !important;
color:rgba(224,184,101,.76) !important;
box-shadow:none !important;
}
/* Keyboard users still receive a small square focus cue. Pointer clicks never
gain the browser's white circular focus ring. */
/* Completed task markers use one verification ring only. The mechanism's
DIA/MAG/KEY/BONUS colour stays inside the glyph, while its old coloured
circular border is replaced by the green completion border. Wide halos are
deliberately avoided so the small symbols stay sharp on phone displays. */
.aka-archive-task-icon.is-active {
opacity:1 !important;
filter:none !important;
border-color:rgba(var(--aka-task-accent),.96) !important;
box-shadow:
0 0 2px rgba(var(--aka-task-accent),.68),
inset 0 0 0 1px rgba(var(--aka-task-accent),.08) !important;
}
.aka-archive-task-icon.is-active > svg {
opacity:1 !important;
color:rgb(var(--aka-task-accent)) !important;
stroke-width:2.15 !important;
filter:drop-shadow(0 0 1px rgba(var(--aka-task-accent),.78)) !important;
shape-rendering:geometricPrecision;
}
.aka-archive-task-icon.is-complete,
.aka-archive-diamond-icon.is-complete,
.aka-archive-magnifier-icon.is-complete {
opacity:1 !important;
filter:none !important;
border:1.5px solid rgba(101,246,142,.98) !important;
background:
radial-gradient(circle at 36% 28%,rgba(255,255,255,.10),transparent 31%),
radial-gradient(circle at 50% 55%,rgba(var(--aka-task-accent),.11),transparent 64%),
linear-gradient(180deg,rgba(var(--aka-task-accent),.075),rgba(3,8,5,.99)) !important;
box-shadow:
0 0 3px rgba(74,222,128,.46),
inset 0 0 7px rgba(74,222,128,.055) !important;
}
.aka-archive-task-icon.is-complete::before {
content:none !important;
display:none !important;
}
.aka-archive-task-icon.is-complete > svg {
opacity:1 !important;
color:rgb(var(--aka-task-accent)) !important;
stroke-width:2.2 !important;
filter:none !important;
shape-rendering:geometricPrecision;
}
.aka-archive-task-icon.is-complete .aka-archive-task-check {
border-color:rgba(174,255,195,.98) !important;
box-shadow:0 0 2px rgba(74,222,128,.72) !important;
filter:none !important;
}
.aka-archive-task-icon.is-complete .aka-archive-task-check svg {
filter:none !important;
shape-rendering:geometricPrecision;
}
/* ===== V0.37.6 PREMIUM ARCHIVE GUIDE AND DIA TERMINAL ===== */
/* The guide uses a warm archive metal language. The terminal beneath it is a
separate cold signal device, connected only by a thin bronze seam. */
.aka-archive-guide-trigger {
width:2.72rem;
height:2.72rem;
border:1px solid rgba(211,166,78,.36);
background:
radial-gradient(circle at 50% 40%,rgba(205,155,66,.12),transparent 55%),
linear-gradient(180deg,rgba(32,17,12,.98),rgba(8,7,7,.99));
color:rgba(224,182,94,.92);
box-shadow:
0 8px 18px rgba(0,0,0,.30),
inset 0 1px 0 rgba(255,241,205,.06),
inset 0 0 0 1px rgba(0,0,0,.62);
}
.aka-archive-guide-trigger::before {
content:"";
position:absolute;
inset:3px;
border:1px solid rgba(181,130,49,.20);
border-radius:inherit;
pointer-events:none;
}
.aka-archive-guide-trigger:hover,
.aka-archive-guide-trigger.is-open {
color:rgba(255,215,126,.98);
border-color:rgba(230,184,91,.64);
background:
radial-gradient(circle at 50% 40%,rgba(218,166,67,.18),transparent 58%),
linear-gradient(180deg,rgba(41,21,13,.99),rgba(8,7,7,.99));
box-shadow:
0 9px 22px rgba(0,0,0,.36),
0 0 12px rgba(211,166,78,.10),
inset 0 1px 0 rgba(255,241,205,.09),
inset 0 0 0 1px rgba(0,0,0,.64);
transform:translateY(-1px);
}
.aka-archive-compass {
position:relative;
z-index:2;
width:1.82rem;
height:1.82rem;
display:grid;
place-items:center;
}
.aka-archive-compass svg {
width:100%;
height:100%;
overflow:visible;
filter:drop-shadow(0 1px 1px rgba(0,0,0,.85));
shape-rendering:geometricPrecision;
}
.aka-archive-compass-ring,
.aka-archive-compass-rose,
.aka-archive-compass-facets,
.aka-archive-compass-ticks,
.aka-archive-compass-center {
vector-effect:non-scaling-stroke;
}
.aka-archive-compass-ring {
fill:none;
stroke:rgba(243,201,107,.80);
stroke-width:1.05;
}
.aka-archive-compass-ring.is-inner {
stroke:rgba(112,65,38,.90);
stroke-width:.78;
}
.aka-archive-compass-rose {
fill:#F3C96B;
stroke:rgba(255,240,194,.74);
stroke-width:.72;
stroke-linejoin:round;
stroke-miterlimit:2.5;
}
.aka-archive-compass-facets {
fill:#704126;
stroke:rgba(197,138,53,.72);
stroke-width:.62;
stroke-linejoin:round;
stroke-miterlimit:2.5;
}
.aka-archive-compass-ticks {
fill:none;
stroke:#C58A35;
stroke-width:.78;
stroke-linecap:round;
shape-rendering:crispEdges;
}
.aka-archive-compass-center {
fill:#FFF0C2;
stroke:#C58A35;
stroke-width:.56;
stroke-linejoin:round;
}
.aka-archive-guide-trigger:hover .aka-archive-compass,
.aka-archive-guide-trigger.is-open .aka-archive-compass {
filter:brightness(1.08);
}
/* The classified tray is intentionally colder and more compact than the
archive guide. It should feel like hardware hidden beneath old paperwork. */
@media (max-width:640px) {
.aka-archive-guide-trigger {
width:2.54rem;
height:2.54rem;
}
.aka-archive-compass {
width:1.68rem;
height:1.68rem;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-archive-guide-trigger,
.aka-archive-guide-trigger-sheen {
transition-duration:1ms !important;
animation:none !important;
}
}
/* ========================================================================== */
/* V0.37.7 PREMIUM ICON GRAMMAR / COMPACT ARCHIVE PROTOCOL */
/* ========================================================================== */
.aka-archive-protocol-seal {
width:2.32rem;
height:2.32rem;
flex:0 0 2.32rem;
display:grid;
place-items:center;
border:1px solid rgba(205,157,72,.34);
border-radius:999px;
background:linear-gradient(180deg,rgba(45,25,15,.78),rgba(7,6,6,.96));
box-shadow:inset 0 0 0 2px rgba(0,0,0,.62),inset 0 1px 0 rgba(255,231,167,.06);
}
.aka-archive-protocol-seal svg {
width:1.78rem;
height:1.78rem;
overflow:visible;
transform:none;
filter:none;
shape-rendering:geometricPrecision;
}
/* The compass is drawn as crisp metal, not a glowing help badge. */
.aka-archive-guide-trigger {
width:2.82rem;
height:2.82rem;
}
.aka-archive-compass {
width:1.94rem;
height:1.94rem;
}
.aka-archive-compass svg {
filter:none !important;
transform:none;
shape-rendering:geometricPrecision;
}
.aka-archive-compass-ring {
stroke:rgba(243,201,107,.88);
stroke-width:1.05;
}
.aka-archive-compass-ring.is-inner {
stroke:rgba(112,65,38,.96);
stroke-width:.78;
}
.aka-archive-compass-rose {
fill:#F3C96B;
stroke:rgba(255,240,194,.80);
stroke-width:.72;
}
.aka-archive-compass-facets {
fill:#704126;
stroke:rgba(197,138,53,.78);
stroke-width:.62;
}
/* One clean color identity per mechanism. */
.aka-archive-diamond-icon { --aka-task-accent:139,5,115 !important; }
.aka-archive-magnifier-icon { --aka-task-accent:202,143,82 !important; }
.aka-archive-bonus-icon { --aka-task-accent:235,186,61 !important; }
.aka-archive-task-icon {
opacity:1 !important;
filter:none !important;
-webkit-backdrop-filter:none !important;
backdrop-filter:none !important;
background:
radial-gradient(circle at 35% 26%,rgba(255,255,255,.075),transparent 29%),
radial-gradient(circle at 50% 56%,rgba(var(--aka-task-accent),.075),transparent 64%),
linear-gradient(180deg,rgba(var(--aka-task-accent),.055),rgba(4,4,4,.985)) !important;
transition:
transform 165ms cubic-bezier(.22,1,.36,1),
border-color 180ms ease,
box-shadow 180ms ease,
background 180ms ease !important;
}
.aka-archive-task-icon > svg {
opacity:.78 !important;
color:rgba(var(--aka-task-accent),.82) !important;
stroke-width:2.08 !important;
filter:none !important;
shape-rendering:geometricPrecision;
}
.aka-archive-task-icon.is-sealed,
.aka-archive-task-icon.is-key-ready,
.aka-archive-task-icon.is-dormant {
opacity:1 !important;
filter:none !important;
animation:none !important;
border-color:rgba(var(--aka-task-accent),.34) !important;
box-shadow:inset 0 0 0 1px rgba(var(--aka-task-accent),.035) !important;
}
.aka-archive-task-icon.is-sealed > svg,
.aka-archive-task-icon.is-key-ready > svg,
.aka-archive-task-icon.is-dormant > svg {
opacity:.72 !important;
color:rgba(var(--aka-task-accent),.76) !important;
}
.aka-archive-task-icon.is-active {
opacity:1 !important;
filter:none !important;
border:1.5px solid rgba(var(--aka-task-accent),.94) !important;
box-shadow:0 0 0 1px rgba(var(--aka-task-accent),.16),inset 0 0 0 1px rgba(var(--aka-task-accent),.075) !important;
}
.aka-archive-task-icon.is-active > svg {
opacity:1 !important;
color:rgb(var(--aka-task-accent)) !important;
stroke-width:2.28 !important;
filter:none !important;
}
.aka-archive-magnifier-icon {
background:
radial-gradient(circle at 50% 46%,rgba(78,205,235,.22) 0 22%,rgba(78,205,235,.045) 23% 37%,transparent 38%),
linear-gradient(180deg,rgba(202,143,82,.11),rgba(4,5,5,.985)) !important;
}
.aka-archive-magnifier-icon > svg {
color:rgb(225,164,103) !important;
filter:none !important;
}
/* Every side mission lock inherits the exact key type. No black disk or aura. */
.aka-archive-task-lock,
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock {
--aka-lock-rgb:210,225,238;
--aka-lock-ink:#edf7ff;
right:-.10rem !important;
bottom:-.10rem !important;
width:.84rem !important;
height:.84rem !important;
border:0 !important;
border-radius:0 !important;
background:transparent !important;
color:var(--aka-lock-ink) !important;
box-shadow:none !important;
opacity:1 !important;
filter:
drop-shadow(1px 0 0 rgba(0,0,0,.98))
drop-shadow(-1px 0 0 rgba(0,0,0,.98))
drop-shadow(0 1px 0 rgba(0,0,0,.98))
drop-shadow(0 -1px 0 rgba(0,0,0,.98)) !important;
transform-origin:center;
animation:none !important;
transition:transform 160ms cubic-bezier(.22,1,.36,1),opacity 180ms ease !important;
z-index:4;
}
.aka-archive-task-lock::before {
content:none !important;
display:none !important;
}
.aka-archive-task-lock svg {
width:.68rem !important;
height:.68rem !important;
stroke-width:3 !important;
}
.aka-archive-task-lock.is-silver,
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock.is-silver {
--aka-lock-rgb:210,225,238;
--aka-lock-ink:#f1f8fd;
}
.aka-archive-task-lock.is-gold,
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock.is-gold {
--aka-lock-rgb:255,207,67;
--aka-lock-ink:#ffcf43;
}
.aka-archive-task-lock.is-red,
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock.is-red {
--aka-lock-rgb:255,65,99;
--aka-lock-ink:#ff4163;
}
.aka-archive-task-lock.is-blue,
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock.is-blue {
--aka-lock-rgb:77,189,255;
--aka-lock-ink:#4dbdff;
}
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock {
animation:akaLockReadyV377 2.35s cubic-bezier(.45,.05,.55,.95) infinite !important;
}
@keyframes akaLockReadyV377 {
0%,100% { opacity:.84;transform:scale(1); }
50% { opacity:1;transform:scale(1.075); }
}
/* Question locks are Silver and equally crisp. */
.aka-archive-question-tab-lock,
.aka-archive-question-source-lock-icon,
.aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,
.aka-archive-question-source-lock-panel.is-key-lock.is-key-ready .aka-archive-question-source-lock-icon {
color:#f1f8fd !important;
filter:
drop-shadow(1px 0 0 rgba(0,0,0,.98))
drop-shadow(-1px 0 0 rgba(0,0,0,.98))
drop-shadow(0 1px 0 rgba(0,0,0,.98))
drop-shadow(0 -1px 0 rgba(0,0,0,.98)) !important;
}
.aka-archive-question-source-lock-icon {
border:0 !important;
background:transparent !important;
box-shadow:none !important;
}
/* Only a completed marker owns a dark mini disk. */
.aka-archive-task-icon.is-complete {
opacity:1 !important;
filter:none !important;
transform:none !important;
border:1.5px solid rgba(91,239,133,.98) !important;
background:
radial-gradient(circle at 50% 56%,rgba(var(--aka-task-accent),.09),transparent 62%),
linear-gradient(180deg,rgba(var(--aka-task-accent),.065),rgba(3,7,4,.99)) !important;
box-shadow:0 0 0 1px rgba(74,222,128,.18),inset 0 0 0 1px rgba(74,222,128,.06) !important;
animation:none !important;
}
.aka-archive-task-icon.is-complete > svg {
opacity:1 !important;
color:rgb(var(--aka-task-accent)) !important;
filter:none !important;
}
.aka-archive-task-check,
.aka-archive-task-icon.is-complete .aka-archive-task-check {
border:1px solid rgba(165,255,190,.98) !important;
background:#020704 !important;
color:#64f38d !important;
box-shadow:0 0 0 1px rgba(0,0,0,.96) !important;
filter:none !important;
}
.aka-archive-task-check svg,
.aka-archive-task-icon.is-complete .aka-archive-task-check svg {
color:#64f38d !important;
stroke:#64f38d !important;
filter:none !important;
}
/* RECOVERED means the core is open, not that the reel is completed. */
#modalContent .aka-archive-file-card.is-recovered.is-recovery-pending:not(.is-completed) {
border-color:rgba(224,174,76,.58) !important;
box-shadow:0 0 0 1px rgba(212,168,67,.12),inset 0 0 0 1px rgba(212,168,67,.035) !important;
}
#modalContent .aka-archive-file-card.is-recovered.is-recovery-pending:not(.is-completed) .aka-archive-recovered-badge,
.aka-archive-recovered-badge.is-pending {
color:rgba(255,218,139,.98) !important;
border-color:rgba(224,174,76,.66) !important;
background:rgba(37,24,8,.88) !important;
box-shadow:0 0 0 1px rgba(212,168,67,.10) !important;
}
#modalContent .aka-archive-file-card.is-completed {
border-color:rgba(91,239,133,.76) !important;
box-shadow:0 0 0 1px rgba(74,222,128,.18),0 0 8px rgba(34,197,94,.13),inset 0 0 0 1px rgba(74,222,128,.045) !important;
}
#modalContent .aka-archive-file-card.is-completed .aka-archive-recovered-badge.is-completed {
color:rgba(179,255,201,.98) !important;
border-color:rgba(91,239,133,.70) !important;
background:rgba(3,31,13,.88) !important;
box-shadow:0 0 0 1px rgba(74,222,128,.12) !important;
}
#modalContent .aka-archive-file-card.is-new-trace {
border-color:rgba(103,215,242,.68) !important;
box-shadow:0 0 0 1px rgba(72,190,220,.16),0 0 8px rgba(72,190,220,.12) !important;
}
/* The large gallery gate remains ruby, but no longer overpowers gold UI. */
.poster-lock-overlay .lock-neon {
width:4.15rem !important;
height:4.15rem !important;
color:#e8294f !important;
filter:
drop-shadow(1px 0 0 rgba(0,0,0,.96))
drop-shadow(-1px 0 0 rgba(0,0,0,.96))
drop-shadow(0 1px 0 rgba(0,0,0,.96))
drop-shadow(0 -1px 0 rgba(0,0,0,.96)) !important;
text-shadow:none !important;
}
/* Classified terminal: compact hardware, restored tools, semantic colors. */
/* Desktop motion belongs only to controls that can still do something. */
@media (any-hover:hover) and (pointer:fine) {
button.aka-archive-task-icon.is-active:not(:disabled):hover,
button.aka-archive-task-icon.is-active:not(:disabled):focus-visible {
transform:translateY(-1px) scale(1.04) !important;
border-color:rgba(var(--aka-task-accent),1) !important;
box-shadow:0 0 0 1px rgba(var(--aka-task-accent),.24),inset 0 0 0 1px rgba(var(--aka-task-accent),.10) !important;
}
button.aka-archive-task-icon.is-active:not(:disabled):active {
transform:translateY(0) scale(.965) !important;
}
button.aka-archive-task-icon.is-sealed:hover,
button.aka-archive-task-icon.is-sealed:focus-visible,
button.aka-archive-task-icon.is-key-ready:hover,
button.aka-archive-task-icon.is-key-ready:focus-visible,
button.aka-archive-task-icon.is-dormant:hover,
button.aka-archive-task-icon.is-dormant:focus-visible {
transform:none !important;
}
button.aka-archive-task-icon.is-sealed:hover .aka-archive-task-lock,
button.aka-archive-task-icon.is-sealed:focus-visible .aka-archive-task-lock,
button.aka-archive-task-icon.is-key-ready:hover .aka-archive-task-lock,
button.aka-archive-task-icon.is-key-ready:focus-visible .aka-archive-task-lock {
animation-play-state:paused !important;
transform:translateY(-1px) scale(1.065) !important;
}
.aka-archive-download-btn:hover,
.aka-archive-download-btn:focus-visible{
transform:translateY(-1px) scale(1.04) !important;
}
}
.aka-archive-download-btn{
-webkit-backdrop-filter:none !important;
backdrop-filter:none !important;
transition:transform 165ms cubic-bezier(.22,1,.36,1),color 165ms ease,border-color 165ms ease,background 165ms ease !important;
}
.aka-archive-download-btn {
background:rgba(7,7,6,.90) !important;
box-shadow:inset 0 0 0 1px rgba(212,168,67,.06) !important;
}
.aka-archive-download-btn:active{
transform:translateY(0) scale(.955) !important;
}
@media (hover:none), (pointer:coarse) {
.aka-archive-task-icon,
.aka-archive-task-icon:hover,
.aka-archive-download-btn:hover{
transform:none !important;
}
button.aka-archive-task-icon.is-active:not(:disabled):active,
.aka-archive-download-btn:active{
transform:scale(.955) !important;
}
button.aka-archive-task-icon.is-sealed:active,
button.aka-archive-task-icon.is-key-ready:active {
transform:none !important;
}
button.aka-archive-task-icon.is-sealed:active .aka-archive-task-lock,
button.aka-archive-task-icon.is-key-ready:active .aka-archive-task-lock {
transform:scale(.94) !important;
}
}
@media (max-width:640px) {
.aka-archive-protocol-seal {
width:2rem;
height:2rem;
flex-basis:2rem;
}
.aka-archive-protocol-seal svg {
width:1.51rem;
height:1.51rem;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-archive-task-icon,
.aka-archive-task-lock,
.aka-archive-download-btn{
animation:none !important;
transition-duration:1ms !important;
}
}
/* Final cascade authority for V0.37.7. Earlier version blocks remain for
historical compatibility, but these states are the rendered contract. */
.aka-archive-task-lock:is(.is-silver,.is-gold,.is-red,.is-blue),
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock:is(.is-silver,.is-gold,.is-red,.is-blue) {
color:var(--aka-lock-ink) !important;
background:transparent !important;
box-shadow:none !important;
filter:
drop-shadow(1px 0 0 rgba(0,0,0,.98))
drop-shadow(-1px 0 0 rgba(0,0,0,.98))
drop-shadow(0 1px 0 rgba(0,0,0,.98))
drop-shadow(0 -1px 0 rgba(0,0,0,.98)) !important;
}
.aka-archive-task-icon.is-key-ready.is-unlocking .aka-archive-task-lock {
animation:akaMazeLockRelease 140ms cubic-bezier(.2,.72,.25,1) both !important;
}
.aka-archive-task-icon.is-sealed,
.aka-archive-task-icon.is-key-ready,
.aka-archive-task-icon.is-dormant {
background:
radial-gradient(circle at 50% 54%,rgba(var(--aka-task-accent),.065),transparent 62%),
linear-gradient(180deg,rgba(var(--aka-task-accent),.045),rgba(4,4,4,.985)) !important;
}
.aka-archive-task-icon.is-sealed > svg,
.aka-archive-task-icon.is-key-ready > svg {
opacity:1 !important;
color:rgba(var(--aka-task-accent),.72) !important;
}
.aka-archive-task-icon.is-dormant > svg {
opacity:1 !important;
color:rgba(var(--aka-task-accent),.78) !important;
}
.aka-archive-magnifier-icon:is(.is-sealed,.is-key-ready,.is-dormant,.is-active,.is-complete) {
background:
radial-gradient(circle at 50% 46%,rgba(78,205,235,.23) 0 22%,rgba(78,205,235,.045) 23% 37%,transparent 38%),
linear-gradient(180deg,rgba(202,143,82,.105),rgba(4,5,5,.985)) !important;
}
.aka-archive-bonus-icon:is(.is-sealed,.is-key-ready,.is-dormant,.is-active,.is-complete) {
background:
radial-gradient(circle at 50% 54%,rgba(235,186,61,.105),transparent 61%),
linear-gradient(180deg,rgba(235,186,61,.065),rgba(5,4,2,.985)) !important;
}
button.aka-archive-task-icon:not(:disabled):active {
opacity:1 !important;
box-shadow:0 0 0 1px rgba(var(--aka-task-accent),.18),inset 0 0 0 1px rgba(var(--aka-task-accent),.08) !important;
}
button.aka-archive-task-icon:focus-visible {
outline:1.5px solid rgba(var(--aka-task-accent),.94) !important;
outline-offset:2px !important;
}
/* Pending is warm, NEW TRACE is cyan, and only true completion is green. */
#modalContent .aka-archive-file-card.is-completed:is(.is-completion-core,.is-completion-secret,.is-completion-bonus) {
border-color:rgba(91,239,133,.76) !important;
box-shadow:0 0 0 1px rgba(74,222,128,.20),inset 0 0 0 1px rgba(74,222,128,.05) !important;
}
#modalContent .aka-archive-file-card.is-recovered.is-recovery-pending.is-new-trace {
border-color:rgba(103,215,242,.72) !important;
box-shadow:0 0 0 1px rgba(72,190,220,.20),inset 0 0 0 1px rgba(72,190,220,.045) !important;
}
#modalContent .aka-archive-file-card.is-completed.is-new-trace {
border-color:rgba(91,239,133,.76) !important;
box-shadow:0 0 0 1px rgba(74,222,128,.20),inset 0 0 0 1px rgba(74,222,128,.05) !important;
}
#modalContent .aka-archive-file-card .aka-archive-recovered-badge.is-pending.is-new-trace {
color:rgba(151,235,255,.99) !important;
border-color:rgba(103,215,242,.72) !important;
background:rgba(7,35,43,.91) !important;
box-shadow:0 0 0 1px rgba(72,190,220,.16) !important;
}
#modalContent .aka-archive-file-card .aka-archive-recovered-badge.is-completed.is-new-trace {
color:rgba(179,255,201,.98) !important;
border-color:rgba(91,239,133,.70) !important;
background:rgba(3,31,13,.88) !important;
box-shadow:0 0 0 1px rgba(74,222,128,.12) !important;
}
/* Idle copy is intentionally absent. Status feedback still speaks after ACCEPT. */
@media (prefers-reduced-motion:reduce) {
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock,
.aka-archive-task-icon.is-key-ready.is-unlocking .aka-archive-task-lock {
animation:none !important;
transition-duration:1ms !important;
}
}
body.archive-guide-open {
overflow:hidden;
overscroll-behavior:none;
}
/* ========================================================================== */
/* V0.37.9: ARCHIVE LOCK FEEDBACK, STORY RHYTHM AND ATMOSPHERE POLISH */
/* ========================================================================== */
/* Keep the cinematic texture, but let artwork and type carry more contrast. */
.film-grain {
opacity:.005;
}
html.aka-performance-lite .film-grain {
opacity:.002;
}
/* The gallery gate alone owns a restrained ruby aura. Side mission locks stay
sharp and mechanism coloured. */
#gallery .poster-card[data-archive].is-archive-entry-locked .poster-lock-overlay .lock-neon {
color:#f53258 !important;
filter:
drop-shadow(1px 0 0 rgba(25,0,5,.96))
drop-shadow(-1px 0 0 rgba(25,0,5,.96))
drop-shadow(0 1px 0 rgba(25,0,5,.96))
drop-shadow(0 -1px 0 rgba(25,0,5,.96))
drop-shadow(0 0 3px rgba(255,106,127,.82))
drop-shadow(0 0 8px rgba(255,45,85,.52))
drop-shadow(0 0 15px rgba(177,0,35,.28)) !important;
}
/* Small lock hardware is crisp enough for a phone without acquiring a disk. */
.aka-archive-task-lock,
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock,
.aka-archive-task-lock:is(.is-silver,.is-gold,.is-red,.is-blue),
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock:is(.is-silver,.is-gold,.is-red,.is-blue) {
width:.92rem !important;
height:.92rem !important;
right:-.13rem !important;
bottom:-.13rem !important;
border:0 !important;
border-radius:0 !important;
background:transparent !important;
box-shadow:none !important;
filter:
drop-shadow(1px 0 0 rgba(0,0,0,.98))
drop-shadow(-1px 0 0 rgba(0,0,0,.98))
drop-shadow(0 1px 0 rgba(0,0,0,.98))
drop-shadow(0 -1px 0 rgba(0,0,0,.98))
drop-shadow(0 0 1px rgba(var(--aka-lock-rgb),.72)) !important;
pointer-events:auto;
transform-origin:center;
}
.aka-archive-task-lock svg {
width:.74rem !important;
height:.74rem !important;
stroke-width:3.05 !important;
shape-rendering:geometricPrecision;
}
.aka-archive-task-lock::after {
content:"";
position:absolute;
inset:-.22rem;
background:transparent;
}
/* Locked hardware never lifts on hover. The click itself moves only the lock. */
@media (any-hover:hover) and (pointer:fine) {
button.aka-archive-task-icon:is(.is-sealed,.is-key-ready):hover,
button.aka-archive-task-icon:is(.is-sealed,.is-key-ready):focus-visible,
button.aka-archive-task-icon:is(.is-sealed,.is-key-ready):hover .aka-archive-task-lock,
button.aka-archive-task-icon:is(.is-sealed,.is-key-ready):focus-visible .aka-archive-task-lock {
transform:none !important;
}
button.aka-archive-task-icon.is-key-ready:hover .aka-archive-task-lock,
button.aka-archive-task-icon.is-key-ready:focus-visible .aka-archive-task-lock {
animation-play-state:running !important;
}
button.aka-archive-task-icon.is-active:not(:disabled):hover,
button.aka-archive-task-icon.is-active:not(:disabled):focus-visible {
transform:translateY(-1px) scale(1.025) !important;
}
}
button.aka-archive-task-icon:is(.is-sealed,.is-key-ready):active {
transform:none !important;
}
button.aka-archive-task-icon:is(.is-sealed,.is-key-ready) .aka-archive-task-lock.is-physical-press {
animation:none !important;
transform:translateY(.65px) scale(.945) !important;
}
.aka-archive-task-icons button.aka-archive-task-icon.is-active.is-physical-press:not(:disabled) {
transform:translateY(.45px) scale(.982) !important;
box-shadow:
inset 0 1px 2px rgba(0,0,0,.34),
0 0 0 1px rgba(var(--aka-task-accent),.18) !important;
}
button.aka-archive-task-icon:is(.is-complete,.is-dormant) {
transform:none !important;
}
/* The longer synopsis now reads as a cinematic lead, not an oversized wall. */
#story .aka-story-synopsis-copy {
display:flex;
flex-direction:column;
min-width:0;
}
#story .aka-story-synopsis-copy > * {
margin-top:0 !important;
}
#story .aka-story-synopsis-copy > .aka-story-synopsis-signal {
margin-bottom:1.20rem !important;
}
#story .aka-story-synopsis-copy > .aka-story-synopsis-body-line {
margin-top:0 !important;
text-align:start;
text-wrap:pretty;
}
#story [data-i18n="storyQuote"] {
max-width:40rem;
margin-bottom:1.42rem !important;
font-size:clamp(1.32rem,1.78vw,1.68rem) !important;
line-height:1.37 !important;
letter-spacing:.004em;
text-wrap:balance;
}
#story .aka-story-synopsis-body-line:not([data-i18n="storyQuote"]) {
max-width:40rem;
font-size:clamp(.92rem,1.04vw,1rem) !important;
line-height:1.72 !important;
letter-spacing:.004em;
}
#story [data-i18n="storyParagraphOne"] {
margin-bottom:1.12rem !important;
}
#story [data-i18n="storyParagraphTwo"] {
margin-bottom:.38rem !important;
}
#story [data-i18n="storyParagraphThree"] {
margin-bottom:1.22rem !important;
}
#story [data-i18n="storyParagraphFour"] {
margin-bottom:0 !important;
color:rgba(232,213,183,.88) !important;
font-size:clamp(.96rem,1.08vw,1.04rem) !important;
line-height:1.55 !important;
letter-spacing:.055em;
}
#story .aka-story-traits {
margin-top:1rem !important;
padding-top:.55rem !important;
}
/* The shorter manifesto remains the final copy. Greater typographic presence,
not filler, gives the closing card its intended weight. */
.aka-manifesto-panel {
max-width:900px;
padding:1.52rem clamp(1.18rem,3vw,2.42rem) 1.42rem;
border-radius:1.35rem;
backdrop-filter:none;
-webkit-backdrop-filter:none;
}
.aka-manifesto-topline {
width:min(6.5rem,38vw);
margin-bottom:.90rem;
}
.aka-manifesto-title {
margin-bottom:.56rem;
font-size:clamp(1.45rem,2.55vw,2.06rem);
line-height:1;
letter-spacing:.16em;
}
.aka-risk-line {
margin-bottom:.98rem;
padding:.35rem .78rem .31rem;
font-size:clamp(.77rem,1.18vw,.90rem);
}
.aka-manifesto-copy {
max-width:800px;
color:rgba(232,213,183,.80);
font-size:clamp(.74rem,.90vw,.84rem);
line-height:1.64;
letter-spacing:.015em;
}
.aka-manifesto-copy .footer-act-gold {
color:rgba(232,213,183,.80);
}
.aka-final-signal {
margin-top:1.18rem;
padding:.56rem .96rem .51rem;
}
@media (max-width:768px) {
.film-grain {
opacity:.0028;
}
html.aka-performance-lite .film-grain {
opacity:.002;
}
#gallery .poster-card[data-archive].is-archive-entry-locked .poster-lock-overlay .lock-neon {
filter:
drop-shadow(1px 0 0 rgba(25,0,5,.96))
drop-shadow(-1px 0 0 rgba(25,0,5,.96))
drop-shadow(0 1px 0 rgba(25,0,5,.96))
drop-shadow(0 -1px 0 rgba(25,0,5,.96))
drop-shadow(0 0 3px rgba(255,106,127,.76))
drop-shadow(0 0 7px rgba(255,45,85,.44))
drop-shadow(0 0 12px rgba(177,0,35,.22)) !important;
}
#story [data-i18n="storyQuote"] {
margin-bottom:1.15rem !important;
font-size:clamp(1.16rem,5.4vw,1.36rem) !important;
line-height:1.43 !important;
}
#story .aka-story-synopsis-body-line:not([data-i18n="storyQuote"]) {
font-size:clamp(.82rem,3.75vw,.91rem) !important;
line-height:1.70 !important;
}
#story [data-i18n="storyParagraphFour"] {
font-size:clamp(.88rem,4vw,.96rem) !important;
}
#story .aka-story-traits {
margin-top:.80rem !important;
}
.aka-manifesto-panel {
padding:1.24rem .94rem 1.18rem;
}
.aka-manifesto-copy {
font-size:clamp(.74rem,3.25vw,.82rem);
line-height:1.62;
}
.aka-final-signal {
margin-top:1rem;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-archive-task-lock.is-physical-press,
button.aka-archive-task-icon.is-active.is-physical-press {
animation:none !important;
transform:none !important;
}
}
/* ========================================================================== */
/* V0.37.10: LOCK MATERIAL AND MANIFESTO PROPORTION CORRECTION */
/* ========================================================================== */
/* Restore the exact V0.37.5 archive gate lock. The main archive gates alone
carry the broad ruby light; no dark outline is painted into the glyph. */
#gallery .poster-card[data-archive].is-archive-entry-locked
.poster-lock-overlay .lock-neon {
width:5rem !important;
height:5rem !important;
color:#FF2D55 !important;
filter:
drop-shadow(0 0 6px #FF2D55)
drop-shadow(0 0 14px #FF2D55)
drop-shadow(0 0 26px rgba(255,45,85,.8)) !important;
}
/* Small mechanism locks stay transparent and use only their own key colour.
The dark completed check disk is intentionally governed elsewhere. */
.aka-archive-task-lock,
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock,
.aka-archive-task-lock:is(.is-silver,.is-gold,.is-red,.is-blue),
.aka-archive-task-icon.is-key-ready
.aka-archive-task-lock:is(.is-silver,.is-gold,.is-red,.is-blue) {
background:transparent !important;
box-shadow:none !important;
filter:
drop-shadow(0 0 1px rgba(var(--aka-lock-rgb),.96))
drop-shadow(0 0 3px rgba(var(--aka-lock-rgb),.34)) !important;
}
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock,
.aka-archive-task-icon.is-key-ready
.aka-archive-task-lock:is(.is-silver,.is-gold,.is-red,.is-blue) {
filter:
drop-shadow(0 0 1px rgba(var(--aka-lock-rgb),1))
drop-shadow(0 0 4px rgba(var(--aka-lock-rgb),.58)) !important;
}
.aka-archive-question-tab-lock,
.aka-archive-question-source-lock-icon,
.aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,
.aka-archive-question-source-lock-panel.is-key-lock.is-key-ready
.aka-archive-question-source-lock-icon {
background:transparent !important;
box-shadow:none !important;
filter:
drop-shadow(0 0 1px rgba(210,225,238,.94))
drop-shadow(0 0 3px rgba(116,147,172,.30)) !important;
}
.aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,
.aka-archive-question-source-lock-panel.is-key-lock.is-key-ready
.aka-archive-question-source-lock-icon {
filter:
drop-shadow(0 0 1px rgba(232,244,252,1))
drop-shadow(0 0 4px rgba(136,185,220,.52)) !important;
}
/* A narrower measure and real paragraph rhythm turn the closing statement
into a vertical cinema manifesto instead of a horizontal text brick. */
.aka-manifesto-panel {
width:min(100%,650px);
max-width:650px;
padding:2.20rem clamp(1.35rem,4vw,2.55rem) 2.08rem;
border-radius:1.22rem;
}
.aka-manifesto-topline {
margin-bottom:1.15rem;
}
.aka-manifesto-title {
margin-bottom:.72rem;
font-size:clamp(1.52rem,2.65vw,2.04rem);
line-height:1.04;
}
.aka-risk-line {
margin-bottom:1.42rem;
}
.aka-manifesto-copy {
max-width:540px;
font-size:clamp(.76rem,.92vw,.85rem);
line-height:1.72;
letter-spacing:.014em;
text-wrap:pretty;
}
.aka-manifesto-copy .aka-manifesto-paragraph {
display:block;
}
.aka-manifesto-copy .aka-manifesto-paragraph + .aka-manifesto-paragraph {
margin-top:.88rem;
}
.aka-final-signal {
margin-top:1.62rem;
padding:.66rem 1.05rem .61rem;
}
@media (max-width:768px) {
.aka-manifesto-panel {
width:100%;
padding:1.62rem 1.02rem 1.48rem;
border-radius:1.05rem;
}
.aka-manifesto-copy {
max-width:31rem;
font-size:clamp(.75rem,3.35vw,.83rem);
line-height:1.68;
}
.aka-manifesto-copy .aka-manifesto-paragraph + .aka-manifesto-paragraph {
margin-top:.74rem;
}
.aka-final-signal {
margin-top:1.34rem;
}
}
/* ========================================================================== */
/* V0.37.11: POWERED DOWN ICONS AND STABLE IN PLACE REEL REVEAL */
/* ========================================================================== */
/* A sealed mechanism stays readable, but its own color no longer makes it
look actionable. The matching key is communicated by the lock alone. */
.aka-archive-task-icon:is(.is-sealed,.is-key-ready,.is-dormant) {
opacity:1 !important;
filter:none !important;
border-color:rgba(var(--aka-task-accent),.18) !important;
background:
radial-gradient(circle at 35% 26%,rgba(255,255,255,.025),transparent 29%),
linear-gradient(180deg,rgba(22,20,18,.68),rgba(4,4,4,.99)) !important;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.015) !important;
animation:none !important;
}
.aka-archive-task-icon:is(.is-sealed,.is-key-ready) > svg {
opacity:.58 !important;
color:rgba(var(--aka-task-accent),.56) !important;
filter:none !important;
}
.aka-archive-task-icon.is-dormant > svg {
opacity:.48 !important;
color:rgba(176,158,128,.56) !important;
filter:none !important;
}
.aka-archive-magnifier-icon:is(.is-sealed,.is-key-ready,.is-dormant),
.aka-archive-bonus-icon:is(.is-sealed,.is-key-ready,.is-dormant) {
background:
radial-gradient(circle at 35% 26%,rgba(255,255,255,.025),transparent 29%),
linear-gradient(180deg,rgba(22,20,18,.68),rgba(4,4,4,.99)) !important;
}
/* Mini locks own no black disk and no broad blur. Their solid key color keeps
them sharp on small phone screens. */
.aka-archive-task-icon.is-sealed:not(.is-key-ready) .aka-archive-task-lock {
color:rgba(var(--aka-lock-rgb),.86) !important;
filter:none !important;
}
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock {
color:rgb(var(--aka-lock-rgb)) !important;
filter:drop-shadow(0 0 1px rgba(var(--aka-lock-rgb),.42)) !important;
animation:akaPremiumKeyReadyV3711 2.8s ease-in-out infinite !important;
}
.aka-archive-question-tab-lock,
.aka-archive-question-source-lock-icon {
color:rgba(210,225,238,.82) !important;
background:transparent !important;
box-shadow:none !important;
filter:none !important;
}
.aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,
.aka-archive-question-source-lock-panel.is-key-lock.is-key-ready
.aka-archive-question-source-lock-icon {
color:#f1f8fd !important;
filter:drop-shadow(0 0 1px rgba(136,185,220,.42)) !important;
animation:akaPremiumKeyReadyV3711 2.8s ease-in-out infinite !important;
}
@keyframes akaPremiumKeyReadyV3711 {
0%,100% { opacity:.90;transform:scale(1); }
50% { opacity:1;transform:scale(1.035); }
}
/* Card dimensions are final before UNSEAL starts. Only the existing poster
dissolve may animate, never width, height, fit, padding or position. */
#modalContent .aka-cinematic-archive .aka-archive-file-card {
aspect-ratio:2 / 3 !important;
transition-property:border-color,box-shadow,background-color !important;
}
#modalContent .aka-cinematic-archive .aka-archive-file-card
img.aka-archive-poster-preview {
transition-property:opacity,filter !important;
}
@media (prefers-reduced-motion:reduce) {
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock,
.aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,
.aka-archive-question-source-lock-panel.is-key-lock.is-key-ready
.aka-archive-question-source-lock-icon {
animation:none !important;
}
}
/* ========================================================================== */
/* V0.37.15: MOBILE HERO RESTORE + FINAL REEL COPY STATES */
/* ========================================================================== */
/* Both final reel messages occupy one stable cinema invitation. Shorter copy
gains stronger type and tighter rhythm instead of leaving an empty card. */
#community .aka-fanclub-invitation {
width:min(100%,48rem);
box-sizing:border-box;
}
#community .aka-fanclub-invitation .aka-final-reel-copy {
min-height:4.7rem;
display:flex;
align-items:center;
justify-content:center;
max-width:42rem !important;
font-size:clamp(.84rem,1.15vw,.96rem) !important;
line-height:1.72;
letter-spacing:.055em;
text-wrap:balance;
transition:color 420ms ease,text-shadow 420ms ease,opacity 420ms ease;
}
#community .aka-fanclub-invitation.is-final-reel-ready .aka-final-reel-copy {
color:rgba(239,224,198,.78) !important;
text-shadow:0 0 13px rgba(212,168,67,.11);
}
@media (max-width:767px) {
#community .aka-fanclub-invitation {
width:100%;
padding:2rem 1.2rem !important;
}
#community .aka-fanclub-invitation .aka-final-reel-copy {
min-height:5.15rem;
max-width:30rem !important;
font-size:.80rem !important;
line-height:1.68;
letter-spacing:.035em;
}
}
@media (prefers-reduced-motion:reduce) {
#community .aka-fanclub-invitation .aka-final-reel-copy {
transition:none !important;
}
}
/* ========================================================================== */
/* V0.37.14: PREMIUM MINI LOCK OPTICS */
/* ========================================================================== */
/* Locked mechanisms remain identifiable, but their own colour is powered
down. The key-coloured lock is the only bright state signal. */
.aka-archive-task-icon:is(.is-sealed,.is-key-ready,.is-dormant) {
opacity:1 !important;
filter:none !important;
border-color:rgba(173,151,116,.16) !important;
background:
radial-gradient(circle at 35% 26%,rgba(255,244,220,.022),transparent 30%),
linear-gradient(180deg,rgba(22,20,17,.62),rgba(4,4,4,.995)) !important;
box-shadow:inset 0 0 0 1px rgba(255,255,255,.012) !important;
}
.aka-archive-task-icon:is(.is-sealed,.is-key-ready,.is-dormant) > svg {
opacity:.64 !important;
color:rgba(190,175,151,.72) !important;
stroke-width:2.15 !important;
filter:none !important;
}
/* Small hardware keeps a readable keyhole and a dark edge against poster art.
Its restrained edge light retains the matching key's material colour. */
.aka-archive-task-lock,
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock,
.aka-archive-task-lock:is(.is-silver,.is-gold,.is-red,.is-blue),
.aka-archive-task-icon.is-key-ready
.aka-archive-task-lock:is(.is-silver,.is-gold,.is-red,.is-blue) {
width:1.0625rem !important;
height:1.0625rem !important;
right:-.16rem !important;
bottom:-.16rem !important;
border:0 !important;
border-radius:0 !important;
background:none !important;
color:rgba(var(--aka-lock-rgb),.94) !important;
opacity:.92 !important;
box-shadow:none !important;
filter:
drop-shadow(0 1px .5px rgba(0,0,0,.96))
drop-shadow(0 0 .65px rgba(0,0,0,.92))
drop-shadow(0 0 1.4px rgba(var(--aka-lock-rgb),.22)) !important;
transform-origin:center;
animation:none !important;
transition:transform 155ms cubic-bezier(.22,1,.36,1),opacity 180ms ease !important;
}
.aka-archive-task-lock::before {
content:none !important;
display:none !important;
}
.aka-archive-task-lock svg {
width:.875rem !important;
height:.875rem !important;
stroke:currentColor !important;
stroke-width:2.2 !important;
shape-rendering:geometricPrecision;
}
/* A matching claimed key strengthens the same material's edge light. */
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock,
.aka-archive-task-icon.is-key-ready
.aka-archive-task-lock:is(.is-silver,.is-gold,.is-red,.is-blue) {
color:rgb(var(--aka-lock-rgb)) !important;
filter:
drop-shadow(0 1px .5px rgba(0,0,0,.96))
drop-shadow(0 0 .65px rgba(0,0,0,.92))
drop-shadow(0 0 1.8px rgba(var(--aka-lock-rgb),.34)) !important;
animation:none !important;
}
@keyframes akaPremiumMiniLockV3714 {
0%,100% { opacity:.92;transform:scale(1); }
50% { opacity:1;transform:scale(1.035); }
}
/* Question locks are Silver hardware and follow the same sharp optical rule. */
.aka-archive-question-tab-lock,
.aka-archive-question-source-lock-icon {
color:rgba(210,225,238,.92) !important;
background:transparent !important;
box-shadow:none !important;
filter:
drop-shadow(0 0 .65px rgba(232,244,252,.96))
drop-shadow(0 0 2.4px rgba(136,185,220,.34)) !important;
}
.aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,
.aka-archive-question-source-lock-panel.is-key-lock.is-key-ready
.aka-archive-question-source-lock-icon {
color:#f1f8fd !important;
filter:
drop-shadow(0 0 .75px rgba(241,248,253,1))
drop-shadow(0 0 2.8px rgba(136,185,220,.50)) !important;
animation:akaPremiumMiniLockV3714 2.8s ease-in-out infinite !important;
}
@media (prefers-reduced-motion:reduce) {
.aka-archive-task-icon.is-key-ready .aka-archive-task-lock,
.aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,
.aka-archive-question-source-lock-panel.is-key-lock.is-key-ready
.aka-archive-question-source-lock-icon {
animation:none !important;
}
}
/* ========================================================================== */
/* V0.37.19 — PREMIUM KEY RECEIVER + TRACE RETURN */
/* ========================================================================== */
/* The temporary receiver represents the player's connected wallet, so its
identity remains emerald. The flying key keeps its own silver/gold/red/blue
identity and supplies the impact flash only. */
.aka-key-wallet-receiver {
--aka-wallet-transfer-rgb:74,222,128;
color:rgb(var(--aka-wallet-transfer-rgb)) !important;
border-color:rgba(var(--aka-wallet-transfer-rgb),.86);
background:
radial-gradient(circle at 50% 36%,rgba(22,163,74,.94),rgba(7,84,45,.98) 58%,rgba(3,24,14,1) 100%) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.10),
inset 0 -9px 18px rgba(0,0,0,.50),
0 0 12px rgba(var(--aka-wallet-transfer-rgb),.40),
0 0 24px rgba(34,197,94,.20),
0 0 0 1px rgba(0,0,0,.48);
overflow:visible;
}
.aka-key-wallet-receiver svg,
.aka-key-wallet-receiver i {
color:rgb(var(--aka-wallet-transfer-rgb)) !important;
stroke:currentColor !important;
filter:
drop-shadow(0 0 3px rgba(var(--aka-wallet-transfer-rgb),.74))
drop-shadow(0 0 7px rgba(34,197,94,.32)) !important;
}
/* Desktop receiver mirrors the real connected-wallet orb: circular, weighted
ring and a second restrained outer rim instead of a floating square chip. */
.aka-key-wallet-receiver.is-desktop-receiver {
width:2.42rem;
height:2.42rem;
border:2px solid rgba(var(--aka-wallet-transfer-rgb),.90);
border-radius:999px !important;
}
.aka-key-wallet-receiver.is-desktop-receiver::after {
content:"";
position:absolute;
inset:-4px;
border:2px solid rgba(var(--aka-wallet-transfer-rgb),.56);
border-radius:inherit;
box-shadow:
0 0 9px rgba(var(--aka-wallet-transfer-rgb),.32),
0 0 18px rgba(34,197,94,.15);
pointer-events:none;
}
/* Phone receiver keeps the approved compact rounded-square shape. Its new
destination is directly below the fixed X and therefore reads as a clear
right-edge wallet target instead of another poster control. */
.aka-key-wallet-receiver.is-mobile-receiver {
width:2rem;
height:2rem;
border:1px solid rgba(var(--aka-wallet-transfer-rgb),.82);
border-radius:.5rem !important;
}
/* The key itself, not the wallet, owns the payload colour. */
.aka-key-wallet-flyer.is-gold { --aka-key-transfer-rgb:255,198,53; }
.aka-key-wallet-flyer.is-red { --aka-key-transfer-rgb:255,45,85; }
.aka-key-wallet-flyer.is-blue { --aka-key-transfer-rgb:74,168,255; }
.aka-key-wallet-flyer.is-silver { --aka-key-transfer-rgb:205,228,244; }
/* Archive X belongs to the modal frame, not to its scrolling reel wall. The
terminal remains the sole scroll container, so the close control stays in
the same top-right position throughout the archive. */
#cinematicModal .modal-box.archive-modal-wide {
overflow:visible;
}
#cinematicModal .modal-box.archive-modal-wide > .modal-close {
position:absolute !important;
z-index:10060 !important;
}
#cinematicModal .modal-box.archive-modal-wide .aka-vault-terminal {
overscroll-behavior:contain;
}
/* Key discovery notices use the recovered key as their complete colour system:
border, rail, title, glyph and wash. The glyph is free-standing—no circular
badge and no separate black puck around it. */
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel {
position:relative;
border-color:color-mix(in srgb,var(--aka-notice-color) 68%,rgba(255,255,255,.08)) !important;
background:
radial-gradient(circle at 0 50%,color-mix(in srgb,var(--aka-notice-color) 14%,transparent),transparent 55%),
linear-gradient(180deg,rgba(13,12,11,.985),rgba(4,4,4,.992)) !important;
box-shadow:
0 0 0 1px rgba(255,255,255,.022) inset,
0 0 15px color-mix(in srgb,var(--aka-notice-color) 20%,transparent),
0 14px 38px rgba(0,0,0,.72) !important;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel::before {
content:"" !important;
position:absolute !important;
inset:.48rem auto .48rem 0 !important;
width:2px !important;
border:0 !important;
border-radius:0 2px 2px 0 !important;
background:var(--aka-notice-color) !important;
box-shadow:
0 0 5px color-mix(in srgb,var(--aka-notice-color) 62%,transparent),
0 0 11px color-mix(in srgb,var(--aka-notice-color) 28%,transparent) !important;
opacity:.92 !important;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-symbol {
width:2.20rem !important;
height:2.20rem !important;
border:0 !important;
border-radius:0 !important;
background:transparent !important;
box-shadow:none !important;
overflow:visible;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-symbol svg {
width:1.46rem !important;
height:1.46rem !important;
color:var(--aka-notice-color) !important;
stroke:currentColor !important;
stroke-width:2.22 !important;
filter:
drop-shadow(0 0 1px color-mix(in srgb,var(--aka-notice-color) 88%,transparent))
drop-shadow(0 0 4px color-mix(in srgb,var(--aka-notice-color) 38%,transparent)) !important;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-kicker {
color:color-mix(in srgb,var(--aka-notice-color) 78%,#f2dfbd) !important;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-title {
color:color-mix(in srgb,var(--aka-notice-color) 78%,#fff4dc) !important;
text-shadow:0 0 7px color-mix(in srgb,var(--aka-notice-color) 18%,transparent) !important;
}
/* A detected-key card is a quiet return path to its source reel. No extra O2
line is printed; a slim chevron and interaction response carry the affordance. */
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel.is-actionable {
padding-right:2.35rem !important;
pointer-events:auto !important;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
transition:
border-color 170ms ease,
box-shadow 190ms ease,
transform 170ms cubic-bezier(.22,1,.36,1) !important;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel.is-actionable::after {
content:"›" !important;
display:block !important;
position:absolute !important;
right:.82rem !important;
top:50% !important;
width:auto !important;
height:auto !important;
transform:translateY(-52%) !important;
color:color-mix(in srgb,var(--aka-notice-color) 76%,#f5e7c8) !important;
background:none !important;
border:0 !important;
box-shadow:none !important;
opacity:.70 !important;
font:400 1.36rem/1 'Space Grotesk',system-ui,sans-serif !important;
}
@media (any-hover:hover) {
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel.is-actionable:hover {
border-color:color-mix(in srgb,var(--aka-notice-color) 84%,rgba(255,255,255,.10)) !important;
box-shadow:
0 0 0 1px rgba(255,255,255,.025) inset,
0 0 19px color-mix(in srgb,var(--aka-notice-color) 27%,transparent),
0 16px 42px rgba(0,0,0,.76) !important;
transform:translateY(-1px) !important;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel.is-actionable:hover::after {
opacity:1 !important;
}
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel.is-actionable:active {
transform:translateY(1px) scale(.995) !important;
}
html.aka-keyboard-navigation .aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel.is-actionable:focus-visible {
outline:1px solid color-mix(in srgb,var(--aka-notice-color) 72%,#f5e7c8) !important;
outline-offset:3px !important;
}
@media (max-width:768px) {
/* The archive frame itself does not scroll; reel content moves underneath the
persistent X. This also gives the mobile wallet receiver a stable target. */
#cinematicModal.active:has(.modal-box.archive-modal-wide) {
overflow:hidden !important;
}
#cinematicModal .modal-box.archive-modal-wide {
max-height:calc(100dvh - 2.15rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));
}
#cinematicModal .modal-box.archive-modal-wide .aka-vault-terminal {
max-height:calc(100dvh - 2.15rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));
overflow-y:auto;
-webkit-overflow-scrolling:touch;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel.is-actionable {
padding-right:2.18rem !important;
}
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel.is-actionable::after {
right:.70rem !important;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-game-notice-overlay.is-mission-complete .aka-game-notice-panel.is-actionable {
transition:none !important;
}
}
/* ========================================================================== */
/* V0.40 — TEMPORARY RED SEAL BREAK LAYER */
/* ========================================================================== */
/* JavaScript appends this short-lived, non-interactive layer only after a
successful atomic archive-gate unlock. The approved resting archive lock is
never restyled: the effect animates a separate clone above the reconciled
card and then yields the card to its ENTER ARCHIVE interaction. */
#gallery .poster-card[data-archive] > .aka-red-seal-break-layer {
--aka-red-seal-rgb:255,45,85;
--aka-red-seal-gold-rgb:212,168,67;
position:absolute;
inset:0;
z-index:90;
display:grid;
place-items:center;
overflow:hidden;
isolation:isolate;
pointer-events:none !important;
user-select:none;
-webkit-user-select:none;
contain:layout paint;
animation:akaRedSealBreakLayer 1650ms cubic-bezier(.20,.76,.22,1) both;
}
/* Expanding mechanical ring. It belongs only to the temporary effect layer. */
#gallery .poster-card[data-archive] > .aka-red-seal-break-layer::before {
content:"";
position:absolute;
left:50%;
top:50%;
width:clamp(7.4rem,38%,10.25rem);
aspect-ratio:1;
border:1px solid rgba(var(--aka-red-seal-rgb),.82);
border-radius:50%;
box-shadow:
0 0 0 1px rgba(var(--aka-red-seal-gold-rgb),.10) inset,
0 0 16px rgba(var(--aka-red-seal-rgb),.32),
0 0 34px rgba(var(--aka-red-seal-rgb),.14);
opacity:0;
transform:translate(-50%,-50%) scale(.58) rotate(0deg);
animation:akaRedSealBreakRing 1650ms cubic-bezier(.18,.78,.22,1) both;
}
/* One restrained ruby-gold release wave across the archive artwork. */
#gallery .poster-card[data-archive] > .aka-red-seal-break-layer::after {
content:"";
position:absolute;
inset:-12% -48%;
background:linear-gradient(
102deg,
transparent 42%,
rgba(var(--aka-red-seal-rgb),.06) 47%,
rgba(var(--aka-red-seal-gold-rgb),.22) 49.2%,
rgba(255,245,221,.24) 50%,
rgba(var(--aka-red-seal-rgb),.14) 51.2%,
transparent 56%
);
opacity:0;
transform:translate3d(-42%,0,0) skewX(-8deg);
animation:akaRedSealBreakWave 1650ms cubic-bezier(.22,.72,.24,1) both;
}
/* The cloned glyph deliberately repeats the exact approved V0.37.5/V0.37.19
large-lock material. These declarations do not target `.lock-neon`. */
#gallery .poster-card[data-archive]
> .aka-red-seal-break-layer
.aka-red-seal-break-lock {
position:relative;
z-index:2;
display:block;
width:5rem !important;
height:5rem !important;
color:#FF2D55 !important;
stroke:currentColor;
fill:none;
filter:
drop-shadow(0 0 6px #FF2D55)
drop-shadow(0 0 14px #FF2D55)
drop-shadow(0 0 26px rgba(255,45,85,.8)) !important;
transform-origin:50% 58%;
will-change:transform,opacity;
animation:akaRedSealBreakLock 1650ms cubic-bezier(.20,.76,.22,1) both;
}
@keyframes akaRedSealBreakLayer {
0% { opacity:0; }
4%,78% { opacity:1; }
100% { opacity:0; }
}
@keyframes akaRedSealBreakLock {
0% { opacity:1;transform:translate3d(0,0,0) scale(1) rotate(0deg); }
18% { opacity:1;transform:translate3d(0,0,0) scale(1.035) rotate(-2deg); }
32% { opacity:1;transform:translate3d(0,0,0) scale(.985) rotate(3deg); }
47% { opacity:1;transform:translate3d(0,-1px,0) scale(1.055) rotate(-7deg); }
62% { opacity:1;transform:translate3d(0,-2px,0) scale(1.075) rotate(11deg); }
76% { opacity:.96;transform:translate3d(0,1px,0) scale(1.025) rotate(-18deg); }
100% { opacity:0;transform:translate3d(0,24px,0) scale(.76) rotate(-28deg); }
}
@keyframes akaRedSealBreakRing {
0%,24% { opacity:0;transform:translate(-50%,-50%) scale(.58) rotate(0deg); }
38% { opacity:.74;transform:translate(-50%,-50%) scale(.76) rotate(-8deg); }
62% { opacity:.48;transform:translate(-50%,-50%) scale(1.08) rotate(13deg); }
100% { opacity:0;transform:translate(-50%,-50%) scale(1.72) rotate(28deg); }
}
@keyframes akaRedSealBreakWave {
0%,42% { opacity:0;transform:translate3d(-42%,0,0) skewX(-8deg); }
50% { opacity:.90; }
70% { opacity:.42; }
100% { opacity:0;transform:translate3d(42%,0,0) skewX(-8deg); }
}
@media (max-width:768px) {
#gallery .poster-card[data-archive] > .aka-red-seal-break-layer::before {
width:clamp(7rem,42%,9.2rem);
}
#gallery .poster-card[data-archive]
> .aka-red-seal-break-layer
.aka-red-seal-break-lock {
width:5rem !important;
height:5rem !important;
}
}
@media (prefers-reduced-motion:reduce) {
#gallery .poster-card[data-archive] > .aka-red-seal-break-layer {
animation:akaRedSealBreakLayerReduced 280ms linear both;
}
#gallery .poster-card[data-archive] > .aka-red-seal-break-layer::before,
#gallery .poster-card[data-archive] > .aka-red-seal-break-layer::after {
animation:none !important;
opacity:0 !important;
}
#gallery .poster-card[data-archive]
> .aka-red-seal-break-layer
.aka-red-seal-break-lock {
animation:akaRedSealBreakLockReduced 280ms linear both;
}
}
@keyframes akaRedSealBreakLayerReduced {
0%,70% { opacity:1; }
100% { opacity:0; }
}
@keyframes akaRedSealBreakLockReduced {
0%,45% { opacity:1;transform:none; }
100% { opacity:0;transform:none; }
}
/* ========================================================================== */
/* V0.40.2 — TRANSIENT SEAL IMPACT + ARCHIVE VAULT REVEAL */
/* ========================================================================== */
/* These pieces exist only inside the short-lived RED SEAL layer. They never
target or restyle the approved resting `.lock-neon`. */
#gallery .poster-card[data-archive]
> .aka-red-seal-break-layer
.aka-red-seal-break-impact-wave {
position:absolute;
z-index:1;
left:50%;
top:50%;
width:clamp(8rem,42%,12rem);
aspect-ratio:2.3;
border:1px solid rgba(232,184,78,.78);
border-radius:50%;
background:radial-gradient(ellipse at center,rgba(255,45,85,.13),transparent 61%);
box-shadow:
0 0 10px rgba(255,245,207,.34),
0 0 27px rgba(255,45,85,.32);
opacity:0;
pointer-events:none;
transform:translate(-50%,-50%) scale(.16,.42);
animation:akaRedSealBreakImpactWave 850ms cubic-bezier(.18,.78,.22,1) 560ms both;
}
#gallery .poster-card[data-archive]
> .aka-red-seal-break-layer
.aka-red-seal-break-particles {
position:absolute;
z-index:3;
inset:0;
pointer-events:none;
}
#gallery .poster-card[data-archive]
> .aka-red-seal-break-layer
.aka-red-seal-break-particle {
--aka-seal-particle-x:0rem;
--aka-seal-particle-y:-4rem;
--aka-seal-particle-delay:560ms;
position:absolute;
top:50%;
left:50%;
width:.3rem;
height:.3rem;
border-radius:50%;
background:radial-gradient(circle at 35% 30%,#fff6d6 0 12%,#e8b84e 31%,#ff2d55 75%);
box-shadow:0 0 7px rgba(255,45,85,.62);
opacity:0;
pointer-events:none;
transform:translate(-50%,-50%) translate3d(0,0,0) scale(.35);
animation:akaRedSealBreakParticle 820ms cubic-bezier(.18,.72,.22,1) var(--aka-seal-particle-delay) both;
}
.aka-red-seal-break-particle:nth-child(1) {
--aka-seal-particle-x:-4.8rem;
--aka-seal-particle-y:-2.5rem;
}
.aka-red-seal-break-particle:nth-child(2) {
--aka-seal-particle-x:-2.4rem;
--aka-seal-particle-y:-4.7rem;
--aka-seal-particle-delay:590ms;
}
.aka-red-seal-break-particle:nth-child(3) {
--aka-seal-particle-x:1.8rem;
--aka-seal-particle-y:-4.9rem;
}
.aka-red-seal-break-particle:nth-child(4) {
--aka-seal-particle-x:4.8rem;
--aka-seal-particle-y:-1.7rem;
--aka-seal-particle-delay:605ms;
}
.aka-red-seal-break-particle:nth-child(5) {
--aka-seal-particle-x:4.2rem;
--aka-seal-particle-y:3rem;
}
.aka-red-seal-break-particle:nth-child(6) {
--aka-seal-particle-x:1rem;
--aka-seal-particle-y:4.9rem;
--aka-seal-particle-delay:590ms;
}
.aka-red-seal-break-particle:nth-child(7) {
--aka-seal-particle-x:-3.1rem;
--aka-seal-particle-y:4.3rem;
}
.aka-red-seal-break-particle:nth-child(8) {
--aka-seal-particle-x:-4.9rem;
--aka-seal-particle-y:1.1rem;
--aka-seal-particle-delay:610ms;
}
@keyframes akaRedSealBreakImpactWave {
0% { opacity:0;transform:translate(-50%,-50%) scale(.16,.42); }
18% { opacity:.9; }
100% { opacity:0;transform:translate(-50%,-50%) scale(1.68,1.28); }
}
@keyframes akaRedSealBreakParticle {
0%,12% {
opacity:0;
transform:translate(-50%,-50%) translate3d(0,0,0) scale(.35);
}
24% {
opacity:1;
transform:translate(-50%,-50%) translate3d(0,0,0) scale(1);
}
100% {
opacity:0;
transform:translate(-50%,-50%) translate3d(var(--aka-seal-particle-x),var(--aka-seal-particle-y),0) scale(.25);
}
}
html.aka-performance-lite .aka-red-seal-break-particles {
display:none !important;
}
/* After the unlock and archive-name scenes finish, the manual ENTER ARCHIVE
action closes over the gallery, mounts the archive
behind the fully closed vault, and only then reveals the already-active
archive interior. It never animates or restyles the exterior archive card. */
.aka-archive-entry-transition {
position:fixed;
z-index:10120;
inset:0;
overflow:hidden;
visibility:visible;
opacity:1;
pointer-events:auto;
touch-action:none;
isolation:isolate;
contain:strict;
}
.aka-archive-entry-door {
position:absolute;
z-index:1;
top:0;
bottom:0;
width:50.15%;
background:
radial-gradient(ellipse at center,rgba(255,45,85,.12),transparent 48%),
linear-gradient(90deg,#020202,#0a0305 72%,rgba(93,8,22,.92));
box-shadow:inset 0 0 80px rgba(0,0,0,.88);
will-change:transform;
}
.aka-archive-entry-door.is-left-door {
left:0;
transform:translateX(-103%);
}
.aka-archive-entry-door.is-right-door {
right:0;
background:
radial-gradient(ellipse at center,rgba(255,45,85,.12),transparent 48%),
linear-gradient(-90deg,#020202,#0a0305 72%,rgba(93,8,22,.92));
transform:translateX(103%);
}
.aka-archive-entry-transition.is-covering .aka-archive-entry-door.is-left-door,
.aka-archive-entry-transition.is-covering .aka-archive-entry-door.is-right-door {
transform:translateX(0);
transition:transform 210ms cubic-bezier(.62,.04,.36,1);
}
/* Fail-closed visual state if a browser cancels the closing transition. */
.aka-archive-entry-transition.is-cover-forced {
background:#020202;
opacity:1 !important;
}
.aka-archive-entry-transition.is-cover-forced .aka-archive-entry-door {
transform:translateX(0) !important;
transition:none !important;
}
.aka-archive-entry-transition.is-revealing {
animation:akaArchiveEntryTransitionReveal 560ms linear both;
}
.aka-archive-entry-transition.is-revealing .aka-archive-entry-door.is-left-door {
animation:akaArchiveEntryDoorLeft 560ms cubic-bezier(.58,.05,.28,1) both;
}
.aka-archive-entry-transition.is-revealing .aka-archive-entry-door.is-right-door {
animation:akaArchiveEntryDoorRight 560ms cubic-bezier(.58,.05,.28,1) both;
}
.aka-archive-entry-line {
position:absolute;
z-index:3;
top:0;
bottom:0;
left:50%;
width:2px;
opacity:0;
background:linear-gradient(
180deg,
transparent 2%,
rgba(232,184,78,.94) 20%,
#fff5cf 50%,
rgba(255,45,85,.96) 82%,
transparent 98%
);
box-shadow:
0 0 7px rgba(232,184,78,.82),
0 0 22px rgba(255,45,85,.66);
transform:translateX(-50%) scaleY(0);
transform-origin:center;
}
.aka-archive-entry-transition.is-covering .aka-archive-entry-line {
animation:akaArchiveEntryLineSeal 210ms cubic-bezier(.22,.8,.25,1) both;
}
.aka-archive-entry-transition.is-revealing .aka-archive-entry-line {
animation:akaArchiveEntryLineReveal 560ms cubic-bezier(.22,.8,.25,1) both;
}
/* Suppress the generic modal zoom while the opaque vault is doing the visual
handoff. When the doors part, the archive is already at its final scale. */
#cinematicModal.is-archive-entry-staged,
#cinematicModal.is-archive-entry-staged .modal-box {
transition:none !important;
}
#cinematicModal.is-archive-entry-staged .modal-box {
transform:scale(1) !important;
opacity:1 !important;
}
@keyframes akaArchiveEntryTransitionReveal {
0%,84% { opacity:1; }
100% { opacity:0; }
}
@keyframes akaArchiveEntryDoorLeft {
0%,14% { transform:translateX(0); }
100% { transform:translateX(-103%); }
}
@keyframes akaArchiveEntryDoorRight {
0%,14% { transform:translateX(0); }
100% { transform:translateX(103%); }
}
@keyframes akaArchiveEntryLineSeal {
0%,58% { opacity:0;transform:translateX(-50%) scaleY(.18); }
100% { opacity:1;transform:translateX(-50%) scaleY(1); }
}
@keyframes akaArchiveEntryLineReveal {
0%,14% { opacity:1;transform:translateX(-50%) scaleY(1); }
100% { opacity:0;transform:translateX(-50%) scaleY(1); }
}
html.aka-performance-lite .aka-archive-entry-door {
box-shadow:none;
}
@media (max-width:768px) {
.aka-red-seal-break-particle:nth-child(n+5) {
display:none;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-red-seal-break-impact-wave,
.aka-red-seal-break-particles {
display:none !important;
}
.aka-archive-entry-transition {
background:#020202;
opacity:0;
}
.aka-archive-entry-transition.is-covering {
opacity:1;
transition:opacity 100ms linear !important;
}
.aka-archive-entry-transition.is-revealing {
animation:akaArchiveEntryReducedReveal 140ms linear both !important;
}
.aka-archive-entry-door,
.aka-archive-entry-line {
animation:none !important;
transition:none !important;
}
.aka-archive-entry-door {
display:none;
}
.aka-archive-entry-line {
display:none;
}
}
@keyframes akaArchiveEntryReducedReveal {
0% { opacity:1; }
100% { opacity:0; }
}
/* The native ENTER ARCHIVE control keeps keyboard ownership, while the full
visual card is the matching pointer target. No lock material is restyled. */
#gallery .poster-card[data-archive] {
cursor:pointer;
}
/* ========================================================================== */
/* V0.40.3 — ARCHIVE ACTIVITY FLYOUT */
/* Side-activity information belongs to its icon, not to another dark modal. */
/* The archive stays bright and scrollable while one compact console is open. */
/* ========================================================================== */
#cinematicModal > .aka-archive-activity-flyout {
--aka-activity-rgb:212,168,67;
position:absolute !important;
inset:0 !important;
z-index:10050 !important;
display:block !important;
width:auto !important;
height:auto !important;
margin:0 !important;
padding:0 !important;
overflow:visible !important;
opacity:1 !important;
pointer-events:none !important;
background:transparent !important;
box-shadow:none !important;
backdrop-filter:none !important;
-webkit-backdrop-filter:none !important;
animation:none !important;
}
#cinematicModal > .aka-archive-activity-flyout.is-activity-diamond {
--aka-activity-rgb:139,5,115;
}
#cinematicModal > .aka-archive-activity-flyout.is-activity-magnifier {
--aka-activity-rgb:83,201,235;
}
#cinematicModal > .aka-archive-activity-flyout.is-activity-bonus {
--aka-activity-rgb:212,168,67;
}
#cinematicModal > .aka-archive-activity-flyout.is-activity-key {
--aka-activity-rgb:255,45,85;
}
#cinematicModal > .aka-archive-activity-flyout > [data-archive-activity-card] {
position:absolute !important;
left:var(--aka-activity-left,12px) !important;
top:var(--aka-activity-top,12px) !important;
right:auto !important;
bottom:auto !important;
z-index:2 !important;
box-sizing:border-box !important;
max-width:calc(100vw - 24px) !important;
max-height:calc(100dvh - 24px) !important;
margin:0 !important;
pointer-events:auto !important;
opacity:0;
transform-origin:
clamp(0px,var(--aka-activity-origin-x,50%),100%)
clamp(0px,var(--aka-activity-origin-y,35%),100%);
transition:
opacity 190ms ease,
transform 260ms cubic-bezier(.22,1,.36,1),
border-color 220ms ease,
box-shadow 220ms ease !important;
will-change:transform,opacity;
}
#cinematicModal > .aka-archive-activity-flyout[data-flyout-side="right"] > [data-archive-activity-card] {
transform:translateX(18px) scale(.976);
}
#cinematicModal > .aka-archive-activity-flyout[data-flyout-side="left"] > [data-archive-activity-card] {
transform:translateX(-18px) scale(.976);
}
#cinematicModal > .aka-archive-activity-flyout[data-flyout-side="bottom"] > [data-archive-activity-card] {
transform:translateY(18px) scale(.985);
}
#cinematicModal > .aka-archive-activity-flyout.is-open > [data-archive-activity-card] {
opacity:1;
transform:none;
}
#cinematicModal > .aka-archive-activity-flyout.is-leaving > [data-archive-activity-card] {
opacity:0;
transition-duration:160ms,190ms,160ms,160ms !important;
}
#cinematicModal > .aka-archive-activity-flyout.is-leaving[data-flyout-side="right"] > [data-archive-activity-card] {
transform:translateX(10px) scale(.985);
}
#cinematicModal > .aka-archive-activity-flyout.is-leaving[data-flyout-side="left"] > [data-archive-activity-card] {
transform:translateX(-10px) scale(.985);
}
#cinematicModal > .aka-archive-activity-flyout.is-leaving[data-flyout-side="bottom"] > [data-archive-activity-card] {
transform:translateY(10px) scale(.99);
}
.aka-archive-activity-tether {
position:absolute;
z-index:1;
height:1px;
pointer-events:none;
transform:translateY(-50%) scaleX(0);
transform-origin:left center;
opacity:0;
background:linear-gradient(90deg,rgba(var(--aka-activity-rgb),.12),rgba(var(--aka-activity-rgb),.78));
box-shadow:0 0 6px rgba(var(--aka-activity-rgb),.36);
transition:opacity 180ms ease,transform 260ms cubic-bezier(.22,1,.36,1);
}
.aka-archive-activity-flyout[data-flyout-side="left"] .aka-archive-activity-tether {
transform-origin:right center;
background:linear-gradient(90deg,rgba(var(--aka-activity-rgb),.78),rgba(var(--aka-activity-rgb),.12));
}
.aka-archive-activity-flyout.is-open .aka-archive-activity-tether {
opacity:.82;
transform:translateY(-50%) scaleX(1);
}
.aka-archive-activity-tether.is-hidden {
display:none;
}
.aka-archive-activity-origin-pulse {
position:absolute;
z-index:3;
width:1.55rem;
height:1.55rem;
border:1px solid rgba(var(--aka-activity-rgb),.72);
border-radius:50%;
pointer-events:none;
opacity:0;
transform:translate(-50%,-50%) scale(.45);
box-shadow:0 0 10px rgba(var(--aka-activity-rgb),.34);
}
.aka-archive-activity-flyout.is-open .aka-archive-activity-origin-pulse {
animation:akaArchiveActivityOriginPulse 430ms cubic-bezier(.22,1,.36,1) both;
}
@keyframes akaArchiveActivityOriginPulse {
0% { opacity:.84;transform:translate(-50%,-50%) scale(.48); }
100% { opacity:0;transform:translate(-50%,-50%) scale(1.55); }
}
/* Existing authored cards keep their content and colour identity. Only their
presentation changes from a centered blocker into an icon-owned console. */
#cinematicModal > .aka-archive-activity-flyout .aka-file-requirement-card,
#cinematicModal > .aka-archive-activity-flyout .aka-archive-special-hint-card {
width:min(29rem,calc(100vw - 24px)) !important;
}
#cinematicModal > .aka-archive-activity-flyout .aka-archive-main-question-card {
width:min(31.5rem,calc(100vw - 24px)) !important;
}
#cinematicModal > .aka-archive-activity-flyout .aka-archive-main-question-card.is-investigation-trace {
width:min(35rem,calc(100vw - 24px)) !important;
height:min(34rem,calc(100dvh - 24px)) !important;
min-height:min(30rem,calc(100dvh - 24px)) !important;
}
#cinematicModal > .aka-archive-activity-flyout.is-activity-bonus .aka-archive-main-question-card {
border-color:rgba(var(--aka-activity-rgb),.46) !important;
background:
radial-gradient(ellipse at 50% 0,rgba(var(--aka-activity-rgb),.15),transparent 48%),
linear-gradient(180deg,rgba(24,17,5,.985),rgba(6,5,3,.992)) !important;
box-shadow:
0 0 0 1px rgba(255,45,85,.035),
0 0 18px rgba(var(--aka-activity-rgb),.17),
0 20px 54px rgba(0,0,0,.72),
inset 0 0 26px rgba(var(--aka-activity-rgb),.04) !important;
}
#cinematicModal > .aka-archive-activity-flyout.is-activity-key .aka-file-requirement-card {
width:min(27rem,calc(100vw - 24px)) !important;
border-color:rgba(var(--aka-activity-rgb),.48) !important;
background:
radial-gradient(ellipse at 50% 0,rgba(var(--aka-activity-rgb),.15),transparent 48%),
linear-gradient(180deg,rgba(22,4,8,.985),rgba(5,4,4,.992)) !important;
box-shadow:
0 0 18px rgba(var(--aka-activity-rgb),.20),
0 18px 48px rgba(0,0,0,.70),
inset 0 0 24px rgba(var(--aka-activity-rgb),.045) !important;
}
#cinematicModal > .aka-archive-activity-flyout.is-activity-key .aka-file-requirement-icon {
color:rgb(var(--aka-activity-rgb));
border-color:rgba(var(--aka-activity-rgb),.46);
background:rgba(var(--aka-activity-rgb),.09);
box-shadow:0 0 13px rgba(var(--aka-activity-rgb),.28),inset 0 0 12px rgba(var(--aka-activity-rgb),.07);
}
#cinematicModal > .aka-archive-activity-flyout.is-activity-key .aka-file-requirement-card h2 {
font-size:clamp(1.72rem,4vw,2.58rem);
line-height:1;
overflow-wrap:anywhere;
}
#cinematicModal > .aka-archive-activity-flyout.is-activity-key .aka-file-requirement-copy span {
color:rgba(244,224,194,.76);
}
button.aka-archive-task-icon.is-complete.is-inspectable {
cursor:pointer !important;
pointer-events:auto !important;
}
button.aka-archive-task-icon.is-complete.is-inspectable:hover,
button.aka-archive-task-icon.is-complete.is-inspectable:focus-visible,
button.aka-archive-task-icon.is-complete.is-inspectable.is-flyout-open {
border-color:rgba(var(--aka-task-accent),.68) !important;
box-shadow:
0 0 10px rgba(var(--aka-task-accent),.28),
inset 0 0 10px rgba(var(--aka-task-accent),.055) !important;
outline:none;
}
button.aka-archive-task-icon.is-flyout-open {
border-color:rgba(var(--aka-task-accent),.70) !important;
box-shadow:
0 0 0 1px rgba(3,3,3,.92),
0 0 0 2px rgba(var(--aka-task-accent),.24),
0 0 13px rgba(var(--aka-task-accent),.25) !important;
}
@media (max-width:720px) {
#cinematicModal > .aka-archive-activity-flyout.is-mobile-console > [data-archive-activity-card] {
width:calc(100vw - 16px) !important;
max-width:calc(100vw - 16px) !important;
max-height:min(70dvh,calc(100dvh - 16px)) !important;
border-radius:7px !important;
overflow:auto;
overscroll-behavior:contain;
-webkit-overflow-scrolling:touch;
}
#cinematicModal > .aka-archive-activity-flyout.is-mobile-console .aka-archive-main-question-card,
#cinematicModal > .aka-archive-activity-flyout.is-mobile-console .aka-archive-main-question-card.is-investigation-trace {
width:calc(100vw - 16px) !important;
height:min(70dvh,calc(100dvh - 16px)) !important;
min-height:0 !important;
max-height:min(70dvh,calc(100dvh - 16px)) !important;
overflow:hidden;
}
#cinematicModal > .aka-archive-activity-flyout.is-mobile-console .aka-file-requirement-card,
#cinematicModal > .aka-archive-activity-flyout.is-mobile-console .aka-archive-special-hint-card {
width:calc(100vw - 16px) !important;
max-height:min(70dvh,calc(100dvh - 16px)) !important;
}
#cinematicModal > .aka-archive-activity-flyout.is-mobile-console .aka-file-requirement-card {
padding:1.45rem 1.08rem 1.15rem;
}
#cinematicModal > .aka-archive-activity-flyout.is-mobile-console .aka-archive-special-hint-card {
padding:1.85rem 1.05rem 1.18rem;
}
#cinematicModal > .aka-archive-activity-flyout.is-mobile-console .aka-archive-special-hint-body {
font-size:.72rem;
line-height:1.62;
}
}
@media (prefers-reduced-motion:reduce) {
#cinematicModal > .aka-archive-activity-flyout > [data-archive-activity-card] {
transform:none !important;
transition:opacity 1ms linear !important;
}
.aka-archive-activity-tether {
transition:none !important;
}
.aka-archive-activity-origin-pulse {
display:none !important;
animation:none !important;
}
}
/* ========================================================================== */
/* V0.40.4 — MAIN SILVER SEALS */
/* Four visible Main-spine locks turn authored MAG/Secret routes into detours. */
/* The resting red archive locks are intentionally untouched. */
/* ========================================================================== */
#modalContent .aka-archive-file-card.is-main-silver-seal {
border-color:rgba(198,215,229,.42) !important;
box-shadow:
0 0 0 1px rgba(219,233,244,.055),
0 0 18px rgba(138,176,204,.10),
0 18px 46px rgba(0,0,0,.70) !important;
}
#modalContent .aka-archive-file-card.is-main-silver-seal-ready {
border-color:rgba(226,241,251,.72) !important;
box-shadow:
0 0 0 1px rgba(235,247,255,.12),
0 0 18px rgba(184,221,245,.24),
0 0 36px rgba(104,158,197,.13),
0 18px 46px rgba(0,0,0,.70) !important;
}
#modalContent .aka-archive-file-card.is-main-silver-seal .aka-archive-file-inner {
z-index:11 !important;
padding:1rem .72rem 3.8rem !important;
border:0 !important;
border-radius:0 !important;
background:
radial-gradient(circle at 50% 43%,rgba(208,231,247,.105),transparent 31%),
radial-gradient(circle at 50% 43%,rgba(93,139,173,.09),transparent 47%),
linear-gradient(180deg,rgba(0,0,0,.13),rgba(0,0,0,.49)) !important;
pointer-events:none;
}
#modalContent .aka-main-silver-seal {
position:relative;
z-index:2;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:.34rem;
width:min(10.7rem,92%);
min-height:8.7rem;
padding:.48rem .5rem .62rem;
border:0;
color:rgba(209,226,238,.82);
background:transparent;
cursor:pointer;
pointer-events:auto;
text-align:center;
isolation:isolate;
-webkit-tap-highlight-color:transparent;
}
#modalContent .aka-main-silver-seal-aura {
position:absolute;
left:50%;
top:42%;
width:6.4rem;
height:6.4rem;
border:1px solid rgba(202,226,242,.18);
border-radius:50%;
transform:translate(-50%,-50%);
background:
radial-gradient(circle,rgba(216,235,247,.085),rgba(105,150,181,.035) 45%,transparent 69%);
box-shadow:0 0 24px rgba(144,190,220,.10),inset 0 0 18px rgba(218,237,249,.045);
pointer-events:none;
}
#modalContent .aka-main-silver-seal-lock {
position:relative;
z-index:2;
display:grid;
place-items:center;
width:4rem;
height:4rem;
color:rgba(218,233,243,.86);
border:1px solid rgba(219,236,247,.36);
border-radius:50%;
background:
radial-gradient(circle at 42% 28%,rgba(255,255,255,.11),transparent 32%),
linear-gradient(145deg,rgba(48,62,74,.88),rgba(13,18,23,.94));
box-shadow:
0 0 0 1px rgba(5,8,10,.88),
0 0 0 3px rgba(185,214,234,.065),
0 0 19px rgba(158,199,226,.16),
0 10px 24px rgba(0,0,0,.55),
inset 0 1px 0 rgba(255,255,255,.13),
inset 0 -10px 18px rgba(0,0,0,.26);
}
#modalContent .aka-main-silver-seal-lock svg {
width:2.05rem;
height:2.05rem;
stroke-width:1.45;
filter:drop-shadow(0 0 5px rgba(203,231,248,.28));
}
#modalContent .aka-main-silver-seal-kicker,
#modalContent .aka-main-silver-seal-state {
position:relative;
z-index:2;
display:block;
font-family:var(--font-elite,"Special Elite",monospace);
line-height:1.25;
text-transform:uppercase;
}
#modalContent .aka-main-silver-seal-kicker {
margin-top:.18rem;
color:rgba(228,239,246,.84);
font-size:.59rem;
letter-spacing:.19em;
}
#modalContent .aka-main-silver-seal-state {
color:rgba(174,199,216,.64);
font-size:.48rem;
letter-spacing:.145em;
}
#modalContent .aka-main-silver-seal.is-key-ready .aka-main-silver-seal-lock {
color:rgba(241,249,255,.98);
border-color:rgba(229,244,254,.72);
box-shadow:
0 0 0 1px rgba(6,9,12,.92),
0 0 0 3px rgba(213,235,249,.12),
0 0 18px rgba(189,226,249,.45),
0 0 35px rgba(108,167,207,.24),
0 10px 24px rgba(0,0,0,.55),
inset 0 1px 0 rgba(255,255,255,.22);
animation:akaMainSilverSealReady 2.45s ease-in-out infinite;
}
#modalContent .aka-main-silver-seal.is-key-ready .aka-main-silver-seal-aura {
border-color:rgba(219,239,252,.42);
box-shadow:0 0 30px rgba(170,214,242,.25),inset 0 0 24px rgba(218,237,249,.09);
}
#modalContent .aka-main-silver-seal.is-key-ready .aka-main-silver-seal-state {
color:rgba(224,240,250,.91);
}
#modalContent .aka-archive-progression-action[data-archive-progression-state^="main-seal-"] {
max-width:calc(100% - 1.36rem) !important;
}
#modalContent .aka-archive-main-seal-btn {
display:inline-flex;
align-items:center;
justify-content:center;
gap:.42rem;
min-height:2.08rem;
max-width:100%;
padding:.35rem .68rem;
border:1px solid rgba(195,218,233,.36);
border-radius:7px;
color:rgba(220,233,242,.78);
background:linear-gradient(180deg,rgba(36,49,59,.78),rgba(10,15,20,.91));
box-shadow:0 0 11px rgba(130,176,207,.10),inset 0 1px 0 rgba(255,255,255,.075);
font:600 clamp(.50rem,.70vw,.57rem)/1.05 var(--font-elite,"Special Elite",monospace);
letter-spacing:.13em;
text-transform:uppercase;
white-space:nowrap;
cursor:pointer;
transition:border-color 180ms ease,box-shadow 180ms ease,color 180ms ease,transform 130ms ease;
}
#modalContent .aka-archive-main-seal-btn svg {
width:1rem;
height:1rem;
flex:0 0 1rem;
stroke-width:1.7;
}
#modalContent .aka-archive-main-seal-btn:is(:hover,:focus-visible) {
color:rgba(241,248,253,.96);
border-color:rgba(218,237,249,.68);
box-shadow:0 0 15px rgba(158,205,235,.21),inset 0 1px 0 rgba(255,255,255,.12);
outline:none;
}
#modalContent .aka-archive-main-seal-btn:active {
transform:translateY(.5px) scale(.985);
}
#modalContent .aka-archive-main-seal-btn.is-key-ready {
color:rgba(241,249,255,.98);
border-color:rgba(224,241,252,.72);
background:linear-gradient(180deg,rgba(65,88,103,.88),rgba(15,23,29,.96));
box-shadow:0 0 15px rgba(185,222,245,.30),0 0 29px rgba(99,157,197,.15),inset 0 1px 0 rgba(255,255,255,.16);
}
#modalContent .aka-archive-file-card.is-main-seal-breaking .aka-main-silver-seal-lock {
animation:akaMainSilverSealBreak 520ms cubic-bezier(.18,.86,.22,1) both !important;
}
#modalContent .aka-archive-file-card.is-main-seal-breaking .aka-main-silver-seal-aura {
animation:akaMainSilverAuraBreak 560ms cubic-bezier(.12,.78,.18,1) both;
}
#modalContent .aka-archive-file-card.is-main-seal-breaking .aka-main-silver-seal-kicker,
#modalContent .aka-archive-file-card.is-main-seal-breaking .aka-main-silver-seal-state {
animation:akaMainSilverCopyExit 360ms ease both;
}
@keyframes akaMainSilverSealReady {
0%,100% { transform:translateY(0) scale(1);filter:brightness(.98); }
50% { transform:translateY(-1px) scale(1.035);filter:brightness(1.15); }
}
@keyframes akaMainSilverSealBreak {
0% { transform:scale(1) rotate(0);opacity:1;filter:brightness(1); }
28% { transform:scale(1.12) rotate(-2deg);opacity:1;filter:brightness(1.65); }
58% { transform:scale(.94) rotate(3deg);opacity:.86;filter:brightness(2); }
100% { transform:scale(1.48) rotate(-5deg);opacity:0;filter:brightness(2.3) blur(1.5px); }
}
@keyframes akaMainSilverAuraBreak {
0% { transform:translate(-50%,-50%) scale(1);opacity:.65; }
45% { transform:translate(-50%,-50%) scale(1.18);opacity:1; }
100% { transform:translate(-50%,-50%) scale(2.05);opacity:0; }
}
@keyframes akaMainSilverCopyExit {
to { transform:translateY(.4rem);opacity:0;letter-spacing:.24em; }
}
@media (max-width:640px) {
#modalContent .aka-archive-file-card.is-main-silver-seal .aka-archive-file-inner {
padding:.58rem .35rem 3.15rem !important;
}
#modalContent .aka-main-silver-seal {
width:96%;
min-height:7.1rem;
gap:.24rem;
}
#modalContent .aka-main-silver-seal-aura {
width:5.25rem;
height:5.25rem;
}
#modalContent .aka-main-silver-seal-lock {
width:3.35rem;
height:3.35rem;
}
#modalContent .aka-main-silver-seal-lock svg {
width:1.72rem;
height:1.72rem;
}
#modalContent .aka-main-silver-seal-kicker { font-size:.50rem;letter-spacing:.14em; }
#modalContent .aka-main-silver-seal-state { font-size:.42rem;letter-spacing:.10em; }
#modalContent .aka-archive-main-seal-btn {
min-height:1.92rem;
padding:.31rem .54rem;
font-size:.47rem;
letter-spacing:.095em;
}
}
@media (prefers-reduced-motion:reduce) {
#modalContent .aka-main-silver-seal.is-key-ready .aka-main-silver-seal-lock,
#modalContent .aka-archive-file-card.is-main-seal-breaking .aka-main-silver-seal-lock,
#modalContent .aka-archive-file-card.is-main-seal-breaking .aka-main-silver-seal-aura,
#modalContent .aka-archive-file-card.is-main-seal-breaking .aka-main-silver-seal-kicker,
#modalContent .aka-archive-file-card.is-main-seal-breaking .aka-main-silver-seal-state {
animation:none !important;
}
}
/* ========================================================================== */
/* V0.42.5 WALLET TITLE CONTEXT */
/* Player rank remains the only value with the retro GIZMO KAKA line grammar. */
/* PRIVATE COLLECTION and poster/archive titles deliberately stay unornamented. */
/* ========================================================================== */
.aka-wallet-title-section.aka-wallet-context-crossfade.is-context-fade-a
:is(.aka-wallet-dropdown-label,.aka-wallet-dropdown-title),
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-context-fade-a
:is(#mobileWalletStatusTitle,#mobileWalletIdentityStatus) {
animation:akaWalletTitleContextFadeA 180ms ease-out both;
}
.aka-wallet-title-section.aka-wallet-context-crossfade.is-context-fade-b
:is(.aka-wallet-dropdown-label,.aka-wallet-dropdown-title),
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-context-fade-b
:is(#mobileWalletStatusTitle,#mobileWalletIdentityStatus) {
animation:akaWalletTitleContextFadeB 180ms ease-out both;
}
@keyframes akaWalletTitleContextFadeA {
from { opacity:.62; }
to { opacity:1; }
}
@keyframes akaWalletTitleContextFadeB {
from { opacity:.62; }
to { opacity:1; }
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider),
#mobileWalletConnectBtn.is-connected
.aka-wallet-copy.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
--aka-wallet-retro-line:color-mix(
in srgb,
var(--aka-identity-title-color,rgba(255,232,162,.96)) 38%,
transparent
);
box-sizing:border-box;
padding-inline:1rem;
font-family:'Bebas Neue','Arial Narrow',Impact,sans-serif !important;
font-size:1.03rem !important;
font-weight:400 !important;
font-synthesis:none;
line-height:1.08;
letter-spacing:.08em !important;
background-image:
linear-gradient(var(--aka-wallet-retro-line),var(--aka-wallet-retro-line)),
linear-gradient(var(--aka-wallet-retro-line),var(--aka-wallet-retro-line)),
linear-gradient(var(--aka-wallet-retro-line),var(--aka-wallet-retro-line)),
linear-gradient(var(--aka-wallet-retro-line),var(--aka-wallet-retro-line)),
linear-gradient(var(--aka-wallet-retro-line),var(--aka-wallet-retro-line)),
linear-gradient(var(--aka-wallet-retro-line),var(--aka-wallet-retro-line));
background-position:
left calc(50% - 4px),
left 50%,
left calc(50% + 4px),
right calc(50% - 4px),
right 50%,
right calc(50% + 4px);
background-size:.76rem 1px,.58rem 1px,.38rem 1px,.76rem 1px,.58rem 1px,.38rem 1px;
background-repeat:no-repeat;
text-rendering:geometricPrecision;
text-shadow:0 1px 1px rgba(0,0,0,.96),0 0 7px var(--aka-wallet-retro-line) !important;
}
#mobileWalletConnectBtn.is-connected
.aka-wallet-copy.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
padding-inline:.74rem;
font-size:clamp(.90rem,4vw,1rem) !important;
}
/* Gallery context owns the same fixed title area but never inherits rank art. */
.aka-wallet-title-section.aka-wallet-context-crossfade.is-gallery-context
.aka-wallet-dropdown-label {
overflow:hidden;
color:rgba(212,168,67,.68) !important;
text-overflow:ellipsis;
white-space:nowrap;
}
.aka-wallet-title-section.aka-wallet-context-crossfade.is-gallery-context
.aka-wallet-dropdown-title {
min-width:0;
max-width:100%;
overflow:hidden;
padding-inline:0;
background:none;
color:rgba(246,237,218,.92) !important;
font-family:'Bebas Neue',sans-serif;
letter-spacing:.10em !important;
text-overflow:ellipsis;
text-shadow:0 0 9px rgba(212,168,67,.13),0 0 20px rgba(0,0,0,.88) !important;
white-space:nowrap;
}
.aka-wallet-title-section.aka-wallet-context-crossfade.is-poster-context
.aka-wallet-dropdown-title {
display:-webkit-box;
overflow:hidden;
font-size:.76rem !important;
line-height:1.10;
letter-spacing:.075em !important;
text-overflow:clip;
white-space:normal;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
/* Mobile swaps only label and rank/title; the address line keeps its own slot. */
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context {
min-width:0;
overflow:hidden;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context
#mobileWalletStatusText {
display:none;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context
:is(#mobileWalletStatusTitle,#mobileWalletIdentityStatus) {
display:block;
width:100%;
max-width:100%;
overflow:hidden;
padding-inline:0;
background:none;
text-overflow:ellipsis;
white-space:nowrap;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context
#mobileWalletStatusTitle {
color:rgba(212,168,67,.78) !important;
font-family:'Special Elite',monospace;
font-size:.64rem;
line-height:1.05;
letter-spacing:.11em;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context
#mobileWalletIdentityStatus {
color:rgba(246,237,218,.92) !important;
font-family:'Bebas Neue',sans-serif;
font-size:.90rem;
line-height:1.02;
letter-spacing:.08em;
text-shadow:0 0 8px rgba(212,168,67,.12),0 0 18px rgba(0,0,0,.88) !important;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-poster-context
#mobileWalletIdentityStatus {
display:-webkit-box;
font-size:.76rem;
line-height:1.08;
white-space:normal;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
html[lang="ar"] .aka-wallet-title-section.aka-wallet-context-crossfade.is-gallery-context
:is(.aka-wallet-dropdown-label,.aka-wallet-dropdown-title),
html[lang="ar"] #mobileWalletConnectBtn
.aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context
:is(#mobileWalletStatusTitle,#mobileWalletIdentityStatus) {
letter-spacing:0 !important;
}
@media (max-width:360px) {
#mobileWalletConnectBtn
.aka-wallet-copy.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
padding-inline:.82rem;
background-size:.62rem 1px,.46rem 1px,.30rem 1px,.62rem 1px,.46rem 1px,.30rem 1px;
font-size:.90rem !important;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context
#mobileWalletStatusTitle {
font-size:.60rem;
letter-spacing:.085em;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context
#mobileWalletIdentityStatus {
font-size:.84rem;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-wallet-title-section.aka-wallet-context-crossfade
:is(.aka-wallet-dropdown-label,.aka-wallet-dropdown-title),
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade
:is(#mobileWalletStatusTitle,#mobileWalletIdentityStatus) {
opacity:1 !important;
animation:none !important;
}
}
/* ========================================================================== */
/* V0.42.14 HERO MICRO CLASSIFICATION + WALLET-OPEN STAGE SAFE AREA */
/* The label is an archival classification, not a second rating badge. */
/* ========================================================================== */
.aka-hero-classification {
display:inline-flex;
align-items:center;
justify-content:center;
gap:.62rem;
margin:.68rem 0 0;
color:rgba(212,168,67,.68);
font-family:'Special Elite',monospace;
font-size:clamp(.575rem,.644vw,.702rem);
font-weight:400;
line-height:1;
letter-spacing:.28em;
text-transform:uppercase;
text-shadow:
0 1px 0 rgba(0,0,0,.96),
0 0 7px rgba(139,0,0,.46),
0 0 12px rgba(212,168,67,.10);
opacity:.86;
transition:
color 820ms ease,
text-shadow 820ms ease,
filter 820ms ease,
opacity 820ms ease;
}
.aka-hero-classification::before,
.aka-hero-classification::after {
content:"";
position:relative;
top:-1px;
width:.276rem;
height:.276rem;
flex:0 0 .276rem;
border:1px solid rgba(212,168,67,.46);
background:rgba(139,0,0,.62);
box-shadow:
0 0 5px rgba(139,0,0,.50),
inset 0 0 2px rgba(255,222,154,.16);
transform:rotate(45deg);
transition:
border-color 820ms ease,
background-color 820ms ease,
box-shadow 820ms ease,
filter 820ms ease;
}
/* Special Elite leaves one trailing letter-space after the final E. Pull only
the right diamond back by that exact amount so both side gaps read equally. */
.aka-hero-classification::after {
margin-inline-start:-.28em;
}
body:where(:not(.aka-hero-composited)).is-hero-star-zone-active .aka-hero-classification,
.aka-hero-fx-copy[data-hero-look~="star"].aka-hero-classification,
.aka-hero-fx-copy[data-hero-look~="star"] .aka-hero-classification{
color:rgba(255,226,160,.94);
text-shadow:
0 1px 0 rgba(0,0,0,.98),
0 0 7px rgba(212,168,67,.48),
0 0 15px rgba(139,0,0,.40);
filter:brightness(1.08);
opacity:1;
}
body:where(:not(.aka-hero-composited)).is-hero-star-zone-active .aka-hero-classification::before,
.aka-hero-fx-copy[data-hero-look~="star"].aka-hero-classification::before,
.aka-hero-fx-copy[data-hero-look~="star"] .aka-hero-classification::before,
body:where(:not(.aka-hero-composited)).is-hero-star-zone-active .aka-hero-classification::after,
.aka-hero-fx-copy[data-hero-look~="star"].aka-hero-classification::after,
.aka-hero-fx-copy[data-hero-look~="star"] .aka-hero-classification::after{
border-color:rgba(255,112,112,.82);
background:rgba(174,12,29,.92);
box-shadow:
0 0 6px rgba(216,20,42,.78),
0 0 13px rgba(139,0,0,.54),
inset 0 0 2px rgba(255,222,154,.24);
filter:brightness(1.08);
}
/* At tablet/small-desktop widths the open wallet becomes a deliberate right
stage wing. Shift the hero composition—not its type size—into the free area. */
@media (min-width:769px) and (max-width:1320px) {
#hero > .relative.z-10 {
transition:transform 560ms cubic-bezier(.20,.90,.24,1);
}
body:has(#walletDropdown:not(.hidden)) #hero > .relative.z-10 {
transform:translate3d(clamp(-6.5rem,-7vw,-4.75rem),-.4rem,0);
}
}
@media (max-width:640px) {
.aka-hero-classification {
gap:.483rem;
margin-top:.58rem;
font-size:.564rem;
letter-spacing:.22em;
}
.aka-hero-classification::before,
.aka-hero-classification::after {
width:.23rem;
height:.23rem;
flex-basis:.23rem;
}
.aka-hero-classification::after {
margin-inline-start:-.22em;
}
}
/* Source: css/v41-key-track-menu.css — original cascade order preserved. */
/* V0.41.7 Wallet key locator.
This layer is deliberately scoped to the KEY panel. The five other Wallet
signal panels keep the frozen compact layout supplied by css/style.css. */
.aka-wallet-drawer-inner.is-key {
overflow:visible;
z-index:2;
}
.aka-wallet-drawer-inner.is-key-silver { --aka-key-menu-rgb:205,228,244; }
.aka-wallet-drawer-inner.is-key-gold { --aka-key-menu-rgb:255,198,53; }
.aka-wallet-drawer-inner.is-key-red { --aka-key-menu-rgb:255,45,85; }
.aka-wallet-drawer-inner.is-key-blue { --aka-key-menu-rgb:55,174,255; }
.aka-wallet-drawer-inner.is-key-silver,
.aka-wallet-drawer-inner.is-key-gold,
.aka-wallet-drawer-inner.is-key-red,
.aka-wallet-drawer-inner.is-key-blue {
--aka-drawer-rgb:var(--aka-key-menu-rgb);
background:
radial-gradient(circle at 12% 0%,rgba(var(--aka-key-menu-rgb),.13),transparent 45%),
radial-gradient(circle at 100% 100%,rgba(var(--aka-key-menu-rgb),.055),transparent 46%),
linear-gradient(155deg,rgba(18,14,10,.99),rgba(8,8,7,.995) 58%,rgba(4,5,5,.998));
}
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key-grid {
margin:0 0 .30rem;
}
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key {
cursor:pointer;
min-height:2.75rem;
}
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key.is-empty {
cursor:default;
}
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key.is-selected {
opacity:1;
filter:none;
border-color:rgba(var(--aka-key-rgb),.92);
box-shadow:
0 0 0 1px rgba(2,2,2,.94),
0 0 0 2px rgba(var(--aka-key-rgb),.30),
0 0 15px rgba(var(--aka-key-rgb),.29),
inset 0 0 12px rgba(var(--aka-key-rgb),.075);
}
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer {
position:relative;
z-index:4;
grid-template-columns:4.70rem minmax(0,1fr) 4.70rem;
gap:.30rem;
}
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-heading {
font-size:.60rem;
margin-bottom:.30rem;
}
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer-status {
color:rgba(232,213,183,.54);
font:600 .60rem/1.25 'Special Elite',monospace;
letter-spacing:.065em;
}
.aka-wallet-key-resolved {
display:block;
width:auto;
min-width:0;
overflow:hidden;
padding-inline-end:.34rem;
color:rgba(var(--aka-drawer-rgb),.54);
font:600 .58rem/1.1 'Special Elite',monospace;
letter-spacing:.04em;
text-align:end;
text-overflow:ellipsis;
white-space:nowrap;
}
.aka-wallet-key-resolved > span {
color:rgba(var(--aka-drawer-rgb),.72);
}
.aka-wallet-key-track-menu {
--aka-key-menu-rgb:191,105,53;
--aka-key-track-visible-rows:5;
--aka-key-track-row-height:2.75rem;
position:absolute;
z-index:6;
top:-1px;
right:calc(100% + .62rem);
bottom:auto;
left:auto;
display:flex;
width:16rem;
min-width:16rem;
max-height:calc(var(--aka-key-track-visible-rows) * var(--aka-key-track-row-height));
flex-direction:column;
overflow:hidden;
border:1px solid rgba(var(--aka-key-menu-rgb),.42);
border-radius:7px;
background:
radial-gradient(circle at 100% 0%,rgba(var(--aka-key-menu-rgb),.10),transparent 42%),
linear-gradient(90deg,rgba(var(--aka-key-menu-rgb),.055),transparent 36%),
linear-gradient(180deg,rgba(13,12,10,.995),rgba(3,4,4,.998));
box-shadow:
0 16px 34px rgba(0,0,0,.68),
0 0 20px rgba(var(--aka-key-menu-rgb),.12),
inset 0 1px 0 rgba(255,255,255,.035);
transform-origin:top right;
animation:akaWalletKeyMenuReveal .22s cubic-bezier(.22,1,.36,1) both;
}
.aka-wallet-key-track-menu.is-silver { --aka-key-menu-rgb:205,228,244; }
.aka-wallet-key-track-menu.is-gold { --aka-key-menu-rgb:255,198,53; }
.aka-wallet-key-track-menu.is-red { --aka-key-menu-rgb:255,45,85; }
.aka-wallet-key-track-menu.is-blue { --aka-key-menu-rgb:55,174,255; }
@keyframes akaWalletKeyMenuReveal {
from { opacity:0;transform:translateX(8px) scale(.985); }
to { opacity:1;transform:none; }
}
.aka-wallet-key-track-options {
min-height:0;
max-height:calc(var(--aka-key-track-visible-rows) * var(--aka-key-track-row-height));
overflow-x:hidden;
overflow-y:auto;
overscroll-behavior:contain;
scrollbar-gutter:stable;
touch-action:pan-y;
}
.aka-wallet-key-track-options::-webkit-scrollbar { width:4px; }
.aka-wallet-key-track-options::-webkit-scrollbar-track { background:rgba(255,255,255,.018); }
.aka-wallet-key-track-options::-webkit-scrollbar-thumb {
border-radius:999px;
background:rgba(var(--aka-key-menu-rgb),.38);
}
.aka-wallet-key-track-option {
position:relative;
display:grid;
width:100%;
min-height:var(--aka-key-track-row-height);
box-sizing:border-box;
grid-template-columns:.96rem minmax(0,1fr);
align-items:center;
gap:.52rem;
padding:.43rem .58rem;
border:0;
border-bottom:1px solid rgba(var(--aka-key-menu-rgb),.11);
background:transparent;
color:rgba(232,213,183,.70);
text-align:start;
}
.aka-wallet-key-track-option:last-child { border-bottom:0; }
button.aka-wallet-key-track-option {
cursor:pointer;
transition:background .18s ease,color .18s ease,box-shadow .18s ease;
}
button.aka-wallet-key-track-option::before {
content:"";
position:absolute;
inset:0 auto 0 0;
width:2px;
background:linear-gradient(transparent,rgba(var(--aka-key-menu-rgb),.92),transparent);
opacity:.52;
}
button.aka-wallet-key-track-option:hover,
button.aka-wallet-key-track-option:focus-visible {
outline:none;
background:linear-gradient(90deg,rgba(var(--aka-key-menu-rgb),.14),rgba(var(--aka-key-menu-rgb),.025));
color:rgba(var(--aka-key-menu-rgb),1);
box-shadow:inset 0 0 14px rgba(var(--aka-key-menu-rgb),.045);
}
.aka-wallet-key-track-option.is-unavailable {
cursor:default;
opacity:.48;
filter:saturate(.54);
}
.aka-wallet-key-track-option-icon {
display:grid;
width:.96rem;
height:.96rem;
place-items:center;
color:rgba(var(--aka-key-menu-rgb),.92);
}
.aka-wallet-key-track-option-icon svg {
width:.76rem;
height:.76rem;
stroke-width:2;
filter:drop-shadow(0 0 4px rgba(var(--aka-key-menu-rgb),.58));
}
.aka-wallet-key-track-option-copy {
display:flex;
min-width:0;
flex-direction:column;
gap:.15rem;
}
.aka-wallet-key-track-option-copy strong,
.aka-wallet-key-track-option-copy small {
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
.aka-wallet-key-track-option-copy strong {
color:inherit;
font:700 .66rem/1.16 'Special Elite',monospace;
letter-spacing:.055em;
}
.aka-wallet-key-track-option-copy small {
color:rgba(232,225,210,.43);
font:600 .56rem/1.2 'Space Grotesk',sans-serif;
letter-spacing:.045em;
}
.aka-wallet-key-track-empty {
display:grid;
min-height:2.8rem;
place-items:center;
padding:.55rem;
color:rgba(var(--aka-key-menu-rgb),.54);
font:600 .56rem/1.3 'Special Elite',monospace;
letter-spacing:.08em;
text-align:center;
}
/* TRACK is one semantic command. Only its radar face is boxed; the label sits
beside it and never appears as a hover tooltip or widens the square itself. */
.aka-wallet-drawer-inner.is-key .aka-wallet-track-command {
position:relative;
display:inline-flex;
min-width:0;
min-height:2.75rem;
align-items:center;
justify-self:start;
gap:.34rem;
padding:0;
border:0;
background:none;
color:rgba(var(--aka-drawer-rgb),.76);
cursor:pointer;
}
.aka-wallet-drawer-inner.is-key .aka-wallet-track-command.is-disabled {
opacity:.34;
filter:saturate(.20) brightness(.72);
cursor:default;
}
.aka-wallet-drawer-inner.is-key .aka-wallet-track-face {
position:relative;
display:grid;
width:1.78rem;
min-width:1.78rem;
height:1.78rem;
min-height:1.78rem;
place-items:center;
padding:.24rem;
border:1px solid rgba(var(--aka-drawer-rgb),.34);
border-radius:.32rem;
background:linear-gradient(180deg,rgba(var(--aka-drawer-rgb),.09),rgba(4,5,5,.92));
box-shadow:inset 0 0 8px rgba(var(--aka-drawer-rgb),.035);
transition:border-color .18s ease,box-shadow .18s ease,background .18s ease,transform .14s ease;
}
.aka-wallet-drawer-inner.is-key .aka-wallet-track-command.is-ready:hover .aka-wallet-track-face,
.aka-wallet-drawer-inner.is-key .aka-wallet-track-command.is-ready:focus-visible .aka-wallet-track-face {
border-color:rgba(var(--aka-drawer-rgb),.72);
background:linear-gradient(180deg,rgba(var(--aka-drawer-rgb),.14),rgba(4,5,5,.94));
box-shadow:0 0 12px rgba(var(--aka-drawer-rgb),.18),inset 0 0 9px rgba(var(--aka-drawer-rgb),.06);
}
.aka-wallet-drawer-inner.is-key .aka-wallet-track-command:focus-visible {
outline:1px solid rgba(var(--aka-drawer-rgb),.62);
outline-offset:3px;
}
.aka-wallet-drawer-inner.is-key .aka-wallet-track-command.is-ready:active .aka-wallet-track-face {
transform:translateY(1px) scale(.98);
}
.aka-wallet-drawer-inner.is-key .aka-wallet-track-face .aka-wallet-track-signal {
width:1.18rem;
height:1.18rem;
}
.aka-wallet-track-command-label {
color:rgba(var(--aka-drawer-rgb),.78);
font:600 .58rem/1 'Special Elite',monospace;
letter-spacing:.07em;
white-space:nowrap;
}
@media (max-width:768px) {
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key {
overflow:hidden;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer {
grid-template-columns:4.42rem minmax(0,1fr) 4.42rem;
gap:.18rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-track-face {
width:2.02rem;
min-width:2.02rem;
height:2.02rem;
min-height:2.02rem;
}
.aka-wallet-key-track-menu {
--aka-key-track-visible-rows:2;
--aka-key-track-row-height:2.75rem;
top:auto;
right:.58rem;
bottom:1.96rem;
left:.58rem;
width:auto;
min-width:0;
max-height:calc(var(--aka-key-track-visible-rows) * var(--aka-key-track-row-height));
transform-origin:bottom center;
animation-name:akaWalletKeyMenuRevealMobile;
}
.aka-wallet-key-track-options {
max-height:calc(var(--aka-key-track-visible-rows) * var(--aka-key-track-row-height));
}
.aka-wallet-key-track-option {
padding:.40rem .48rem;
}
.aka-wallet-key-track-option-copy strong { font-size:.64rem; }
.aka-wallet-key-track-option-copy small { font-size:.56rem; }
}
@media (max-width:360px) {
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer {
grid-template-columns:4.28rem minmax(0,1fr) 4.28rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-track-command {
gap:.24rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-track-face {
width:1.92rem;
min-width:1.92rem;
height:1.92rem;
min-height:1.92rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-track-command-label {
font-size:.51rem;
letter-spacing:.045em;
}
}
@keyframes akaWalletKeyMenuRevealMobile {
from { opacity:0;transform:translateY(7px) scale(.985); }
to { opacity:1;transform:none; }
}
@media (prefers-reduced-motion:reduce) {
.aka-wallet-key-track-menu { animation:none !important; }
}
/* Source: css/v41-route-rhythm.css — original cascade order preserved. */
/* GIZMO KAKA V0.41.7 — CLEAN KEY / NIGHT RHYTHM
* Additive presentation only. The approved V0.41 base and interaction sheets
* remain byte-for-byte frozen.
*/
/* R1 is a signpost, not a modal: both roads stay under player control. */
.aka-route-fork {
position:relative;
margin:0 0 1.8rem;
padding:1rem;
border:1px solid rgba(212,168,67,.28);
background:
linear-gradient(110deg,rgba(212,168,67,.08),transparent 42%),
rgba(4,4,4,.88);
box-shadow:inset 0 0 24px rgba(212,168,67,.035),0 12px 28px rgba(0,0,0,.22);
}
.aka-route-fork > p,
.aka-route-fork > h3 { margin:0;text-align:center;text-transform:uppercase; }
.aka-route-fork > p { color:rgba(212,168,67,.72);font:400 .62rem/1.3 "Special Elite",serif;letter-spacing:.28em; }
.aka-route-fork > h3 { margin-top:.34rem;color:rgba(247,240,222,.92);font:400 1.42rem/1 "Bebas Neue",sans-serif;letter-spacing:.08em; }
.aka-route-fork-actions { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.68rem;margin-top:.86rem; }
.aka-route-fork-actions button {
min-height:2.75rem;
display:grid;
place-content:center;
gap:.18rem;
padding:.58rem .7rem;
border:1px solid rgba(212,168,67,.34);
background:rgba(212,168,67,.055);
color:#efe3c7;
transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .15s ease;
}
.aka-route-fork-actions button span { font:400 .72rem/1.1 "Special Elite",serif;letter-spacing:.16em; }
.aka-route-fork-actions button small { color:rgba(239,227,199,.50);font:400 .54rem/1.1 "Special Elite",serif;letter-spacing:.12em; }
.aka-route-fork-actions button:not(:disabled):hover,
.aka-route-fork-actions button:not(:disabled):focus-visible { border-color:rgba(212,168,67,.76);background:rgba(212,168,67,.11);box-shadow:0 0 18px rgba(212,168,67,.12);outline:none; }
.aka-route-fork-actions button:not(:disabled):active { transform:translateY(1px); }
.aka-route-fork-actions button.is-lost { border-color:rgba(255,45,85,.30);background:rgba(255,45,85,.055); }
.aka-route-fork-actions button.is-lost.is-ready { border-color:rgba(255,45,85,.66);box-shadow:inset 0 0 18px rgba(255,45,85,.045); }
.aka-route-fork-actions button.is-locked { opacity:.58;cursor:default; }
/* D12 previews one mastery lock with three learned threads, never three icons. */
.aka-d12-mastery-preview {
position:absolute;
z-index:19;
left:.58rem;
right:.58rem;
bottom:4.18rem;
padding:.55rem .58rem .52rem;
border:1px solid rgba(206,218,228,.30);
background:linear-gradient(180deg,rgba(12,15,18,.94),rgba(3,4,5,.96));
box-shadow:0 8px 24px rgba(0,0,0,.42),inset 0 0 16px rgba(206,218,228,.035);
pointer-events:none;
}
.aka-d12-mastery-preview > strong { display:block;color:rgba(225,232,238,.78);font:400 .55rem/1.15 "Special Elite",serif;letter-spacing:.16em;text-align:center; }
.aka-d12-mastery-segments { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.28rem;margin-top:.44rem; }
.aka-d12-mastery-segment { display:grid;gap:.22rem;min-width:0;text-align:center; }
.aka-d12-mastery-segment > span { height:.18rem;border:1px solid rgba(185,198,209,.26);background:rgba(185,198,209,.07);box-shadow:inset 0 0 5px rgba(0,0,0,.65); }
.aka-d12-mastery-segment small { overflow:hidden;color:rgba(205,215,223,.42);font:400 .46rem/1 "Special Elite",serif;letter-spacing:.08em;text-overflow:ellipsis; }
.aka-d12-mastery-segment.is-complete > span { border-color:rgba(119,231,151,.72);background:rgba(80,211,119,.72);box-shadow:0 0 8px rgba(80,211,119,.42); }
.aka-d12-mastery-segment.is-complete small { color:rgba(149,239,174,.82); }
.aka-d12-mastery-preview > p { margin:.42rem 0 0;color:rgba(215,224,231,.66);font:400 .50rem/1.25 "Special Elite",serif;letter-spacing:.07em;text-align:center;text-transform:uppercase; }
.aka-d12-mastery-preview.is-complete { border-color:rgba(212,168,67,.54);box-shadow:0 0 16px rgba(212,168,67,.10),0 8px 24px rgba(0,0,0,.42); }
.aka-d12-mastery-preview.is-complete > p { color:rgba(242,202,105,.92); }
.aka-d12-mastery-preview.is-seal-ready { border-color:rgba(223,232,239,.76);box-shadow:0 0 18px rgba(205,221,232,.18),0 8px 24px rgba(0,0,0,.42); }
/* DOWNLOAD and every side icon share one compact optical rhythm. Invisible
targets grow sideways, but never overlap the neighbouring icon vertically. */
#modalContent .aka-archive-file-card {
--aka-poster-side-start:.52rem;
--aka-poster-download-size:1.74rem;
--aka-poster-side-gap:.30rem;
--aka-poster-side-hit-inset:-.15rem;
}
#modalContent .aka-archive-file-card .aka-archive-task-icons {
top:calc(var(--aka-poster-side-start) + var(--aka-poster-download-size) + var(--aka-poster-side-gap)) !important;
right:var(--aka-poster-side-start) !important;
gap:var(--aka-poster-side-gap) !important;
}
#modalContent .aka-archive-file-card button.aka-archive-task-icon:not(.is-complete)::before {
content:"";
position:absolute;
inset-block:var(--aka-poster-side-hit-inset);
inset-inline:-.48rem;
border-radius:999px;
background:transparent;
}
/* Mandatory post-final actions are route nodes, visually distinct from MAG,
DIA and Bonus inventory. They still use the same compact poster controls. */
#modalContent .aka-archive-legend-route-icon {
--aka-task-accent:212,168,67 !important;
background:
radial-gradient(circle at 50% 45%,rgba(255,218,112,.14),transparent 48%),
linear-gradient(180deg,rgba(212,168,67,.12),rgba(5,3,2,.96)) !important;
}
#modalContent .aka-archive-legend-route-icon.is-active {
border-color:rgba(238,195,91,.72) !important;
box-shadow:0 0 0 1px rgba(212,168,67,.14),0 0 15px rgba(212,168,67,.18) !important;
}
#modalContent .aka-archive-legend-route-icon > svg {
color:rgb(240,203,112) !important;
filter:drop-shadow(0 0 5px rgba(212,168,67,.42));
}
/* Poster states are one compact physical control. Text/state changes must never
change its geometry or become wider than SEALED. */
#modalContent .aka-archive-file-card .aka-archive-inspect-btn,
#modalContent .aka-archive-file-card .aka-archive-recover-btn,
#modalContent .aka-archive-file-card .aka-archive-recovered-badge {
box-sizing:border-box !important;
inline-size:5.9rem !important;
width:5.9rem !important;
min-width:5.9rem !important;
max-width:5.9rem !important;
min-height:2.02rem !important;
height:2.02rem !important;
padding-inline:.54rem !important;
white-space:nowrap !important;
overflow:hidden !important;
}
/* The Main Silver Seal CTA follows the same physical grammar as every other
poster state. Only its invisible vertical hit area reaches 44px. */
#modalContent .aka-archive-file-card .aka-archive-main-seal-btn {
position:relative !important;
box-sizing:border-box !important;
inline-size:5.9rem !important;
width:5.9rem !important;
min-width:5.9rem !important;
max-width:5.9rem !important;
min-height:2.02rem !important;
height:2.02rem !important;
padding-inline:.54rem !important;
overflow:visible !important;
}
#modalContent .aka-archive-file-card .aka-archive-main-seal-btn::before {
content:"";
position:absolute;
top:50%;
left:0;
width:100%;
height:2.75rem;
transform:translateY(-50%);
border-radius:inherit;
background:transparent;
}
/* Mobile Wallet signal icons keep their optical size but meet a 44px target. */
@media (max-width:768px), (pointer:coarse) {
.aka-mobile-wallet-signal-strip .aka-wallet-signal-action { position:relative;overflow:visible !important; }
.aka-mobile-wallet-signal-strip .aka-wallet-signal-action::after {
content:"" !important;
display:block !important;
position:absolute;
inset:-.40rem;
border-radius:999px;
background:transparent !important;
pointer-events:auto;
}
}
/* Do not reveal the Blue category before BL01 itself is discovered. */
.aka-wallet-drawer-key.is-blue.is-classified { color:rgba(145,151,158,.30) !important;border-color:rgba(145,151,158,.15) !important;background:rgba(145,151,158,.025) !important;filter:grayscale(1); }
.aka-wallet-drawer-key.is-blue.is-classified strong { color:rgba(145,151,158,.34) !important;text-shadow:none !important; }
@media (max-width:560px) {
.aka-route-fork-actions { grid-template-columns:1fr; }
.aka-route-fork { padding:.86rem;margin-bottom:1.45rem; }
.aka-d12-mastery-preview { left:.48rem;right:.48rem;bottom:4rem;padding:.48rem; }
}
@media (max-width:768px) {
#modalContent .aka-archive-file-card {
--aka-poster-side-gap:.30rem;
--aka-poster-side-hit-inset:-.15rem;
}
}
@media (max-width:640px) {
#modalContent .aka-archive-file-card {
--aka-poster-side-start:.48rem;
--aka-poster-download-size:1.80rem;
}
#modalContent .aka-archive-file-card .aka-archive-inspect-btn,
#modalContent .aka-archive-file-card .aka-archive-recover-btn,
#modalContent .aka-archive-file-card .aka-archive-recovered-badge {
inline-size:5.2rem !important;
width:5.2rem !important;
min-width:5.2rem !important;
max-width:5.2rem !important;
min-height:1.88rem !important;
height:1.88rem !important;
padding-inline:.42rem !important;
}
#modalContent .aka-archive-file-card .aka-archive-main-seal-btn {
inline-size:5.2rem !important;
width:5.2rem !important;
min-width:5.2rem !important;
max-width:5.2rem !important;
min-height:1.88rem !important;
height:1.88rem !important;
padding-inline:.42rem !important;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-route-fork-actions button { transition:none; }
}
/* Source: css/v42-exclusive-gallery.css — original cascade order preserved. */
/* GIZMO KAKA V0.42.60 — QUIET HOVER CONTROLS
* Native hover explanation bubbles are removed from controls across the site;
* approved geometry, visual states, click behavior and accessible labels stay frozen.
*/
/* ========================================================================== */
/* DIAMOND DRAWER — TRACK | GALLERY */
/* ========================================================================== */
.aka-wallet-drawer-inner.is-diamond .aka-wallet-drawer-heading {
margin-bottom:.30rem;
}
/* ========================================================================== */
/* V0.42.14 — PREMIUM WALLET HIERARCHY + DARK PLUM EXCLUSIVE MATERIAL */
/* Compact visible surfaces keep the existing type scale and safe hit areas. */
/* ========================================================================== */
:root {
--aka-dia-core-rgb:32,1,34;
--aka-dia-base-rgb:69,2,59;
--aka-dia-edge-rgb:139,5,115;
--aka-dia-highlight-rgb:201,67,187;
}
/* Optical alignment only: the dollar medallion, amount and row never move. */
.aka-wallet-aka-balance .aka-wallet-balance-name,
.aka-mobile-aka-balance .aka-wallet-balance-name {
position:relative;
top:1.5px;
}
/* Wallet Reel keeps the approved dark-blue disc/red apertures with a fine rim. */
.aka-reel-glyph.aka-wallet-secret-reel .aka-reel-rim {
stroke-width:.46 !important;
}
/* The ordinary signal drawers lose vertical bulk. Gallery keeps its approved
7.60rem internal artboard; the final frame contract lifts that artboard into
the unchanged regular Wallet body instead of lengthening the body. */
.aka-wallet-signal-drawer { margin-bottom:.50rem; }
.aka-wallet-drawer-inner:not(.is-inline-gallery) {
height:6.56rem;
min-height:6.56rem;
max-height:6.56rem;
padding:.56rem .62rem;
}
.aka-wallet-drawer-inner.is-inline-gallery {
height:7.60rem;
min-height:7.60rem;
max-height:7.60rem;
}
.aka-wallet-drawer-inner:not(.is-inline-gallery) .aka-wallet-drawer-heading {
margin-bottom:.34rem;
}
.aka-wallet-drawer-inner:not(.is-inline-gallery) .aka-wallet-drawer-stats {
gap:.30rem;
}
.aka-wallet-drawer-inner:not(.is-inline-gallery) .aka-wallet-drawer-stat {
min-height:2.18rem;
padding:.34rem .42rem;
}
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key-grid { gap:.30rem; }
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key {
min-height:2.24rem;
padding:.30rem .20rem;
}
.aka-wallet-drawer-inner.is-vault { padding:.54rem .60rem; }
.aka-wallet-drawer-inner.is-vault .aka-wallet-vault-grid { gap:.34rem; }
.aka-wallet-drawer-inner.is-vault .aka-wallet-vault-stat {
min-height:3.10rem;
gap:.36rem;
padding:.48rem .54rem .46rem;
}
.aka-wallet-drawer-inner.is-vault .aka-wallet-drawer-action.is-vault-claim {
margin-top:.34rem;
padding:.42rem .52rem;
}
.aka-wallet-diamond-summary {
gap:.30rem;
margin-bottom:.12rem;
}
.aka-wallet-diamond-stat {
min-height:1.68rem;
padding:.31rem .38rem;
}
/* TRACK/GALLERY retain a 44px semantic row on touch devices; only the visible
square faces become smaller and the actions anchor to opposite corners. */
.aka-wallet-diamond-footer,
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer,
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-drawer-footer {
grid-template-columns:4.08rem minmax(0,1fr) 4.08rem;
gap:.24rem;
min-height:2.46rem;
margin-top:auto;
}
.aka-wallet-diamond-footer-command,
.aka-wallet-drawer-inner.is-key .aka-wallet-track-command,
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-command {
min-height:2.46rem;
gap:.28rem;
}
.aka-wallet-diamond-footer-icon,
.aka-wallet-diamond-footer-icon.aka-wallet-track-signal,
.aka-wallet-drawer-inner.is-key .aka-wallet-track-face,
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-face {
width:1.50rem;
min-width:1.50rem;
height:1.50rem;
min-height:1.50rem;
padding:.16rem;
border-radius:.27rem;
}
.aka-wallet-diamond-footer-command.is-track,
.aka-wallet-drawer-inner.is-key .aka-wallet-track-command,
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-command {
justify-self:start;
}
.aka-wallet-diamond-footer-command.is-gallery { justify-self:end; }
/* Dark plum/black-cherry is the single DIA and Exclusive material. */
.aka-wallet-signal-action.is-diamond,
.aka-wallet-signal-action.is-diamond.is-selected {
--aka-wallet-signal-rgb:var(--aka-dia-edge-rgb) !important;
color:rgba(var(--aka-dia-highlight-rgb),.84) !important;
background:
radial-gradient(circle at 38% 30%,rgba(var(--aka-dia-highlight-rgb),.075),transparent 34%),
linear-gradient(150deg,rgba(var(--aka-dia-base-rgb),.62),rgba(var(--aka-dia-core-rgb),.96) 70%) !important;
}
.aka-wallet-signal-action.is-diamond.is-stored {
border-color:rgba(var(--aka-dia-edge-rgb),.48) !important;
box-shadow:0 0 7px rgba(var(--aka-dia-edge-rgb),.16),inset 0 0 8px rgba(var(--aka-dia-base-rgb),.12) !important;
}
.aka-wallet-signal-action.is-diamond.is-actionable,
.aka-wallet-signal-action.is-diamond.is-selected {
border-color:rgba(var(--aka-dia-highlight-rgb),.58) !important;
box-shadow:
0 0 0 2px rgba(4,2,5,.96),
0 0 0 3px rgba(var(--aka-dia-edge-rgb),.30),
0 0 7px rgba(var(--aka-dia-highlight-rgb),.10),
inset 0 0 7px rgba(var(--aka-dia-base-rgb),.12) !important;
}
.aka-wallet-drawer-inner.is-diamond {
--aka-drawer-rgb:var(--aka-dia-edge-rgb) !important;
background:
radial-gradient(circle at 12% 0%,rgba(var(--aka-dia-highlight-rgb),.035),transparent 42%),
radial-gradient(circle at 100% 100%,rgba(var(--aka-dia-base-rgb),.045),transparent 46%),
linear-gradient(155deg,rgba(22,5,23,.995),rgba(8,5,9,.997) 60%,rgba(3,3,4,.999)) !important;
}
.aka-wallet-diamond-stat {
border-color:rgba(var(--aka-dia-edge-rgb),.23);
background:
radial-gradient(circle at 0 0,rgba(var(--aka-dia-highlight-rgb),.028),transparent 58%),
rgba(var(--aka-dia-core-rgb),.25);
color:rgba(223,177,216,.78);
}
.aka-wallet-diamond-stat-icon {
border-color:rgba(var(--aka-dia-edge-rgb),.36);
background:rgba(var(--aka-dia-base-rgb),.16);
color:rgba(var(--aka-dia-highlight-rgb),.84);
}
.aka-wallet-diamond-footer-command.is-track {
--aka-diamond-command-rgb:var(--aka-dia-edge-rgb);
color:rgba(var(--aka-dia-highlight-rgb),.82);
}
.aka-wallet-drawer-inner.is-inline-gallery,
.aka-wallet-gallery-preview-host { --aka-gallery-dia:var(--aka-gallery-gold); }
#modalContent .aka-archive-file-card.is-exclusive,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] {
--aka-exclusive-rgb:var(--aka-dia-edge-rgb);
}
.aka-exclusive-crystal { color:rgb(var(--aka-dia-highlight-rgb)); }
.aka-exclusive-gate-badge,
.aka-exclusive-gate-badge.is-pay,
.aka-exclusive-gate-badge[data-exclusive-gate-type="pay"] {
--aka-exclusive-gate-rgb:var(--aka-dia-edge-rgb);
color:rgba(224,166,214,.90);
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-verify,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action.is-verify,
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-pay,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action.is-pay,
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-unseal,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action.is-unseal {
border-color:rgba(var(--aka-dia-highlight-rgb),.70) !important;
background:
radial-gradient(ellipse at 50% 0%,rgba(var(--aka-dia-highlight-rgb),.10),transparent 64%),
linear-gradient(180deg,rgba(var(--aka-dia-base-rgb),.72),rgba(var(--aka-dia-core-rgb),.96)) !important;
color:rgba(235,194,228,.96) !important;
box-shadow:
0 0 0 1px rgba(var(--aka-dia-edge-rgb),.12),
0 0 8px rgba(var(--aka-dia-edge-rgb),.15),
0 10px 24px rgba(0,0,0,.58),
inset 0 1px 0 rgba(255,255,255,.045) !important;
}
@media (any-hover:hover) and (pointer:fine) {
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action:is(.is-verify,.is-pay,.is-unseal):not(:disabled):is(:hover,:focus-visible),
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action:is(.is-verify,.is-pay,.is-unseal):not(:disabled):is(:hover,:focus-visible) {
border-color:rgb(var(--aka-dia-highlight-rgb)) !important;
}
}
.aka-archive-diamond-icon,
#cinematicModal > .aka-archive-activity-flyout.is-activity-diamond {
--aka-task-accent:var(--aka-dia-edge-rgb);
--aka-activity-rgb:var(--aka-dia-edge-rgb);
}
.aka-archive-diamond-icon.is-active,
.aka-archive-diamond-icon.is-complete {
border-color:rgba(var(--aka-dia-highlight-rgb),.80) !important;
background:
radial-gradient(circle at 36% 28%,rgba(var(--aka-dia-highlight-rgb),.10),transparent 31%),
radial-gradient(circle at 50% 55%,rgba(var(--aka-dia-edge-rgb),.13),transparent 64%),
linear-gradient(180deg,rgba(var(--aka-dia-base-rgb),.72),rgba(var(--aka-dia-core-rgb),.985)) !important;
box-shadow:
0 0 0 1px rgba(2,8,4,.96),
0 0 6px rgba(var(--aka-dia-edge-rgb),.24),
inset 0 0 8px rgba(var(--aka-dia-base-rgb),.18) !important;
}
.aka-archive-diamond-icon.is-active > svg,
.aka-archive-diamond-icon.is-complete > svg {
color:rgb(var(--aka-dia-highlight-rgb)) !important;
filter:drop-shadow(0 0 1px rgba(244,203,237,.34)) drop-shadow(0 0 2px rgba(var(--aka-dia-edge-rgb),.42)) !important;
}
.aka-file-requirement-warning.is-diamond {
background:radial-gradient(ellipse at center,rgba(var(--aka-dia-edge-rgb),.10),transparent 44%),rgba(0,0,0,.28);
}
.aka-file-requirement-warning.is-diamond .aka-file-requirement-card {
border-color:rgba(var(--aka-dia-highlight-rgb),.50);
background:
radial-gradient(ellipse at 50% 0%,rgba(var(--aka-dia-edge-rgb),.14),transparent 48%),
linear-gradient(180deg,rgba(var(--aka-dia-core-rgb),.97),rgba(5,3,6,.97));
box-shadow:0 0 15px rgba(var(--aka-dia-edge-rgb),.17),0 0 42px rgba(0,0,0,.75),inset 0 0 20px rgba(var(--aka-dia-base-rgb),.12);
}
.aka-file-requirement-warning.is-diamond .aka-file-requirement-icon {
color:rgb(var(--aka-dia-highlight-rgb));
border-color:rgba(var(--aka-dia-edge-rgb),.58);
background:radial-gradient(circle,rgba(var(--aka-dia-base-rgb),.54),rgba(var(--aka-dia-core-rgb),.94) 68%);
box-shadow:0 0 10px rgba(var(--aka-dia-edge-rgb),.18),inset 0 0 10px rgba(var(--aka-dia-base-rgb),.16);
}
/* The COIN Exclusive Posters reaction uses the same plum family and a tight,
crisp active edge instead of the former broad neon-pink bloom. */
[data-cinematic-signal-group="coin-plans-collections"],
#token .aka-coin-plan-item--collections {
--aka-signal-icon-rgb:var(--aka-dia-edge-rgb);
--aka-signal-text-rgb:178,119,168;
}
#token .aka-coin-plan-item--collections [data-signal-light="icon"] {
color:rgba(var(--aka-dia-highlight-rgb),.78);
filter:brightness(1) drop-shadow(0 0 3px rgba(var(--aka-dia-edge-rgb),.24));
}
#token .aka-coin-plan-item--collections.is-signal-active [data-signal-light="icon"] {
color:rgb(var(--aka-dia-highlight-rgb));
filter:
brightness(1.05)
drop-shadow(0 0 3px rgba(var(--aka-dia-highlight-rgb),.46))
drop-shadow(0 0 8px rgba(var(--aka-dia-edge-rgb),.22));
}
#token .aka-coin-plan-item--collections.is-signal-active [data-signal-light="text"] {
color:rgba(221,169,211,.90);
text-shadow:0 0 3px rgba(var(--aka-dia-highlight-rgb),.25),0 0 9px rgba(var(--aka-dia-edge-rgb),.13);
}
/* Player TITLE alone receives the second reference treatment: a warm ivory
face, graphite inset edge and restrained dusty-plum outer contour. The
existing three-line side insignias stay intact; no scanline fill is used. */
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider),
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
--aka-wallet-title-face:rgba(246,235,214,.96);
--aka-wallet-title-inset:rgba(39,20,34,.98);
--aka-wallet-title-contour:rgba(183,137,124,.82);
--aka-wallet-title-line:var(--aka-identity-title-color,rgba(255,232,162,.96));
position:relative;
display:flex !important;
width:100%;
max-width:100%;
align-items:center;
justify-content:center;
gap:.38rem;
box-sizing:border-box;
padding-inline:.82rem;
color:var(--aka-wallet-title-face) !important;
background:none !important;
-webkit-background-clip:border-box !important;
background-clip:border-box !important;
-webkit-text-fill-color:var(--aka-wallet-title-face);
-webkit-text-stroke:.42px var(--aka-wallet-title-inset);
font-family:'Bebas Neue','Arial Narrow',Impact,sans-serif !important;
font-size:1.04rem !important;
font-weight:400 !important;
font-synthesis:none;
line-height:1.08;
letter-spacing:.085em !important;
text-rendering:geometricPrecision;
text-shadow:
-.72px 0 var(--aka-wallet-title-contour),
.72px 0 var(--aka-wallet-title-contour),
0 -.72px var(--aka-wallet-title-contour),
0 .72px var(--aka-wallet-title-contour),
-.52px -.52px var(--aka-wallet-title-contour),
.52px -.52px var(--aka-wallet-title-contour),
-.52px .52px var(--aka-wallet-title-contour),
.52px .52px var(--aka-wallet-title-contour),
0 1.25px 0 rgba(10,4,8,.98) !important;
filter:drop-shadow(0 1px 0 rgba(0,0,0,.96));
white-space:nowrap;
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider)::before,
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider)::after,
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::before,
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::after {
content:"";
display:block;
width:.82rem;
min-width:.82rem;
height:7px;
flex:0 0 .82rem;
background:
linear-gradient(90deg,transparent,var(--aka-wallet-title-line)) top right / 100% 1px no-repeat,
linear-gradient(90deg,transparent 8%,var(--aka-wallet-title-line)) center right / 72% 1px no-repeat,
linear-gradient(90deg,transparent 16%,var(--aka-wallet-title-line)) bottom right / 44% 1px no-repeat !important;
-webkit-background-clip:border-box !important;
background-clip:border-box !important;
-webkit-text-fill-color:initial;
filter:none;
opacity:.78;
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider)::after,
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::after {
transform:scaleX(-1);
}
/* Archive/poster context remains clean. The selected film title gains room and
scale but never inherits the player TITLE contour treatment. */
.aka-wallet-title-section.aka-wallet-context-crossfade.is-poster-context
.aka-wallet-dropdown-title,
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade.is-poster-context
#mobileWalletIdentityStatus {
font-size:1.02rem !important;
line-height:1.08;
letter-spacing:.075em !important;
}
/* Subtle physical-card micro polish; all deterministic JS angles, thresholds,
FLIP/RESET behaviour and dimensions remain untouched. */
.aka-wallet-card-object {
--aka-card-thickness:3.8px;
--aka-card-half-thickness:1.9px;
}
.aka-wallet-card-edge,
.aka-wallet-card-edge.is-top,
.aka-wallet-card-edge.is-bottom {
background:linear-gradient(
90deg,
#040404,
#303030 var(--aka-card-edge-light-position,50%),
#080808
);
box-shadow:inset 0 0 0 1px rgba(255,255,255,.028);
}
.aka-wallet-card-face.is-front {
box-shadow:
0 18px 19px rgba(0,0,0,.56),
0 4px 7px rgba(0,0,0,.34),
0 0 4px rgba(var(--aka-gallery-stage-rgb),.07),
inset 0 0 0 1px rgba(255,247,226,.032);
}
/* Mobile hierarchy: narrower Connected status, separate centred TITLE, and a
dedicated tiny disconnect control. Empty panel space is deliberately inert. */
@media (max-width:768px) {
.aka-mobile-identity-panel { padding:.66rem !important; }
.aka-mobile-identity-panel.is-connected #mobileWalletConnectBtn {
width:80% !important;
min-width:0 !important;
max-width:80% !important;
min-height:3.78rem;
margin-inline:auto;
padding:.62rem .68rem;
}
.aka-mobile-identity-panel.is-connected #mobileWalletConnectBtn:hover {
transform:none;
}
.aka-mobile-identity-panel.is-connected #mobileWalletConnectBtn .aka-wallet-icon-wrap {
width:2.08rem;
height:2.08rem;
}
.aka-mobile-identity-panel.is-connected #mobileWalletConnectBtn .aka-wallet-copy {
width:auto;
flex:1 1 auto;
}
.aka-mobile-wallet-title-section {
display:flex;
width:86%;
min-width:0;
min-height:2.32rem;
box-sizing:border-box;
align-items:center;
justify-content:center;
flex-direction:column;
gap:.20rem;
margin:.34rem auto .48rem;
padding:.28rem .42rem .32rem;
border-top:1px solid color-mix(in srgb,var(--aka-identity-title-color,rgba(212,168,67,.50)) 18%,transparent);
border-bottom:1px solid color-mix(in srgb,var(--aka-identity-title-color,rgba(212,168,67,.50)) 13%,transparent);
text-align:center;
}
.aka-mobile-wallet-title-label {
display:block;
width:100%;
color:rgba(212,168,67,.62);
font:600 .43rem/1 'Special Elite',monospace;
letter-spacing:.24em;
text-align:center;
}
.aka-mobile-wallet-title-value {
display:block;
width:100%;
max-width:100%;
overflow:hidden;
color:var(--aka-identity-title-color,rgba(176,178,174,.82));
font:400 .94rem/1.06 'Bebas Neue','Arial Narrow',sans-serif;
letter-spacing:.08em;
text-align:center;
text-overflow:ellipsis;
white-space:nowrap;
}
.aka-mobile-wallet-title-section.is-gallery-context .aka-mobile-wallet-title-label {
color:rgba(212,168,67,.72);
}
.aka-mobile-wallet-title-section.is-gallery-context .aka-mobile-wallet-title-value {
color:rgba(246,237,218,.92);
background:none !important;
-webkit-background-clip:border-box !important;
background-clip:border-box !important;
-webkit-text-fill-color:currentColor;
-webkit-text-stroke:0;
filter:none;
font-size:.90rem;
text-shadow:0 1px 0 rgba(0,0,0,.96) !important;
}
.aka-mobile-wallet-title-section.is-poster-context {
min-height:2.50rem;
justify-content:center;
}
.aka-mobile-wallet-title-section.is-poster-context .aka-mobile-wallet-title-label {
display:none;
}
.aka-mobile-wallet-title-section.is-context-fade-a
:is(.aka-mobile-wallet-title-label,.aka-mobile-wallet-title-value) {
animation:akaWalletTitleContextFadeA 180ms ease-out both;
}
.aka-mobile-wallet-title-section.is-context-fade-b
:is(.aka-mobile-wallet-title-label,.aka-mobile-wallet-title-value) {
animation:akaWalletTitleContextFadeB 180ms ease-out both;
}
.aka-mobile-menu-metrics { margin-top:.42rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:not(.is-inline-gallery) {
height:6.48rem;
min-height:6.48rem;
max-height:6.48rem;
padding:.52rem .56rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-drawer-footer {
grid-template-columns:4.16rem minmax(0,1fr) 4.16rem;
min-height:2.75rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-command,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-track-command,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-command {
min-height:2.75rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-icon,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-icon.aka-wallet-track-signal,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-track-face,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-face {
width:1.64rem;
min-width:1.64rem;
height:1.64rem;
min-height:1.64rem;
}
.aka-wallet-card-object {
--aka-card-thickness:2.8px;
--aka-card-half-thickness:1.4px;
}
}
@media (max-width:360px) {
.aka-mobile-identity-panel.is-connected #mobileWalletConnectBtn {
width:79% !important;
max-width:79% !important;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-icon,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-icon.aka-wallet-track-signal,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-track-face,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-face {
width:1.58rem;
min-width:1.58rem;
height:1.58rem;
min-height:1.58rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-drawer-footer {
grid-template-columns:4.02rem minmax(0,1fr) 4.02rem;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
gap:.28rem;
padding-inline:.56rem;
font-size:.94rem !important;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-mobile-wallet-title-section
:is(.aka-mobile-wallet-title-label,.aka-mobile-wallet-title-value) {
opacity:1 !important;
animation:none !important;
}
}
.aka-wallet-diamond-summary {
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:.38rem;
width:100%;
min-width:0;
margin:0 0 .25rem;
}
.aka-wallet-diamond-stat {
display:flex;
align-items:center;
gap:.31rem;
min-width:0;
min-height:1.90rem;
box-sizing:border-box;
padding:.40rem .42rem;
border:1px solid rgba(139,5,115,.24);
border-radius:5px;
background:
radial-gradient(circle at 0 0,rgba(201,67,187,.055),transparent 62%),
rgba(3,3,4,.58);
color:rgba(221,153,211,.82);
box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}
.aka-wallet-diamond-stat.is-claimed {
border-color:rgba(87,218,151,.18);
background:
radial-gradient(circle at 0 0,rgba(87,218,151,.07),transparent 62%),
rgba(3,5,4,.58);
color:rgba(126,228,176,.78);
}
.aka-wallet-diamond-stat-icon {
display:grid;
place-items:center;
width:1.04rem;
height:1.04rem;
flex:0 0 1.04rem;
border:1px solid rgba(139,5,115,.38);
border-radius:3px;
background:rgba(69,2,59,.24);
}
.aka-wallet-diamond-stat.is-claimed .aka-wallet-diamond-stat-icon {
border-color:rgba(87,218,151,.24);
background:rgba(87,218,151,.04);
}
.aka-wallet-diamond-stat-icon svg {
display:block;
width:.61rem;
height:.61rem;
stroke-width:1.85;
}
.aka-wallet-diamond-stat > span:not(.aka-wallet-diamond-stat-icon) {
min-width:0;
overflow:hidden;
color:currentColor;
font:600 .39rem/1.08 "Special Elite",monospace;
letter-spacing:.065em;
text-overflow:ellipsis;
white-space:nowrap;
}
.aka-wallet-diamond-stat strong {
margin-inline-start:auto;
color:currentColor;
font:700 .69rem/1 "Space Grotesk",sans-serif;
font-variant-numeric:tabular-nums;
}
.aka-wallet-diamond-footer {
position:relative;
z-index:4;
display:grid;
grid-template-columns:4.70rem minmax(0,1fr) 4.70rem;
align-items:center;
gap:.30rem;
width:100%;
min-width:0;
min-height:2.75rem;
margin:auto 0 0;
direction:ltr;
}
.aka-wallet-diamond-footer-command {
--aka-diamond-command-rgb:139,5,115;
position:relative;
display:inline-flex;
min-width:0;
min-height:2.75rem;
align-items:center;
justify-self:start;
gap:.34rem;
padding:0;
border:0;
background:none;
color:rgba(var(--aka-diamond-command-rgb),.78);
cursor:pointer;
-webkit-tap-highlight-color:transparent;
}
.aka-wallet-diamond-footer-command.is-gallery {
--aka-diamond-command-rgb:212,168,67;
grid-column:3;
justify-self:end;
}
.aka-wallet-diamond-footer-command.is-track { grid-column:1; }
.aka-wallet-diamond-footer-command.is-disabled,
.aka-wallet-diamond-footer-command:disabled {
opacity:.34;
filter:saturate(.20) brightness(.72);
cursor:default;
}
.aka-wallet-diamond-footer-icon {
position:relative;
display:grid;
width:1.78rem;
min-width:1.78rem;
height:1.78rem;
min-height:1.78rem;
place-items:center;
box-sizing:border-box;
padding:.24rem;
border:1px solid rgba(var(--aka-diamond-command-rgb),.34);
border-radius:.32rem;
background:linear-gradient(180deg,rgba(var(--aka-diamond-command-rgb),.09),rgba(4,5,5,.92));
box-shadow:inset 0 0 8px rgba(var(--aka-diamond-command-rgb),.035);
transition:border-color .18s ease,box-shadow .18s ease,background .18s ease,transform .14s ease;
}
.aka-wallet-diamond-footer-icon.aka-wallet-track-signal {
width:1.78rem;
min-width:1.78rem;
height:1.78rem;
min-height:1.78rem;
}
.aka-wallet-diamond-footer-icon svg {
display:block;
width:1.18rem;
height:1.18rem;
overflow:visible;
stroke:currentColor;
stroke-width:1.58;
stroke-linecap:round;
stroke-linejoin:round;
filter:drop-shadow(0 0 4px rgba(var(--aka-diamond-command-rgb),.20));
}
.aka-wallet-diamond-footer-label {
color:rgba(var(--aka-diamond-command-rgb),.78);
font:600 .58rem/1 "Special Elite",monospace;
letter-spacing:.07em;
white-space:nowrap;
}
@media (any-hover:hover) and (pointer:fine) {
.aka-wallet-diamond-footer-command:not(:disabled):hover .aka-wallet-diamond-footer-icon,
.aka-wallet-diamond-footer-command:not(:disabled):focus-visible .aka-wallet-diamond-footer-icon {
border-color:rgba(var(--aka-diamond-command-rgb),.72);
background:linear-gradient(180deg,rgba(var(--aka-diamond-command-rgb),.14),rgba(4,5,5,.94));
box-shadow:0 0 12px rgba(var(--aka-diamond-command-rgb),.18),inset 0 0 9px rgba(var(--aka-diamond-command-rgb),.06);
}
}
.aka-wallet-diamond-footer-command:focus-visible {
outline:1px solid rgba(var(--aka-diamond-command-rgb),.62);
outline-offset:3px;
}
.aka-wallet-diamond-footer-command:not(:disabled):active .aka-wallet-diamond-footer-icon {
transform:translateY(1px) scale(.98);
}
.aka-wallet-diamond-summary:dir(rtl) .aka-wallet-diamond-stat > span:not(.aka-wallet-diamond-stat-icon),
.aka-wallet-diamond-footer:dir(rtl) .aka-wallet-diamond-footer-label {
letter-spacing:0;
}
html[lang="ru"] .aka-wallet-diamond-stat > span:not(.aka-wallet-diamond-stat-icon) {
font-size:.34rem;
letter-spacing:.025em;
}
html[lang="ru"] .aka-wallet-diamond-footer-label,
html[lang="ar"] .aka-wallet-diamond-footer-label { font-size:.51rem;letter-spacing:.035em; }
html[lang="ar"] .aka-wallet-diamond-stat > span:not(.aka-wallet-diamond-stat-icon) {
font-size:.36rem;
letter-spacing:0;
}
/* ========================================================================== */
/* INLINE WALLET COLLECTION — SAME DRAWER, CONTAINED PREVIEW */
/* ========================================================================== */
.aka-wallet-gallery-stack-glyph {
position:relative;
display:block;
width:.78rem;
height:.66rem;
}
.aka-wallet-gallery-stack-glyph > span {
position:absolute;
width:.56rem;
height:.42rem;
border:1px solid currentColor;
border-radius:1px;
background:rgba(4,3,2,.88);
}
.aka-wallet-gallery-stack-glyph > span:nth-child(1) { left:0;top:.18rem;opacity:.42; }
.aka-wallet-gallery-stack-glyph > span:nth-child(2) { left:.10rem;top:.09rem;opacity:.66; }
.aka-wallet-gallery-stack-glyph > span:nth-child(3) { left:.20rem;top:0; }
.aka-wallet-gallery-stack-glyph > span:nth-child(3)::after {
content:"";
position:absolute;
right:.08rem;
bottom:.07rem;
width:.22rem;
height:.14rem;
border-left:1px solid currentColor;
border-top:1px solid currentColor;
transform:skewX(-28deg) rotate(7deg);
}
.aka-wallet-drawer-inner.is-inline-gallery {
--aka-gallery-gold:212,168,67;
--aka-gallery-reel:198,151,61;
--aka-gallery-cyan:91,205,231;
--aka-gallery-dia:var(--aka-gallery-gold);
--aka-drawer-rgb:212,168,67;
isolation:isolate;
overflow:hidden;
padding:.46rem;
background:
radial-gradient(circle at 8% 0,rgba(var(--aka-gallery-gold),.085),transparent 42%),
linear-gradient(155deg,rgba(12,10,7,.99),rgba(4,8,8,.997) 62%,rgba(3,4,4,.999));
}
.aka-wallet-inline-heading {
display:grid;
grid-template-columns:1.18rem minmax(0,1fr) 1.18rem;
align-items:center;
gap:.52rem;
min-width:0;
min-height:1.12rem;
margin-bottom:.22rem;
color:rgba(var(--aka-gallery-gold),.88);
font:600 .47rem/1 "Special Elite",monospace;
letter-spacing:.14em;
text-transform:uppercase;
}
.aka-wallet-inline-heading > span:first-child {
grid-column:2;
min-width:0;
overflow:hidden;
text-align:center;
text-overflow:ellipsis;
white-space:nowrap;
}
.aka-wallet-inline-dismiss,
.aka-wallet-inline-stage-close {
display:grid;
place-items:center;
padding:0;
border:1px solid rgba(var(--aka-gallery-gold),.22);
border-radius:3px;
background:rgba(3,3,3,.82);
color:rgba(238,216,165,.70);
cursor:pointer;
}
.aka-wallet-inline-dismiss {
grid-column:3;
width:1.18rem;
height:1.18rem;
flex:0 0 1.18rem;
font:400 .82rem/1 Arial,sans-serif;
}
.aka-wallet-gallery-chevron {
display:block;
fill:none;
stroke:currentColor;
stroke-linecap:round;
stroke-linejoin:round;
}
.aka-wallet-gallery-archive-chooser {
position:relative;
display:block;
height:5.05rem;
min-height:5.05rem;
flex:0 0 5.05rem;
overflow:hidden;
padding:.03rem .02rem;
perspective:28rem;
touch-action:pan-x;
transform-origin:center;
animation:akaWalletGalleryChooserDrop 220ms cubic-bezier(.22,1,.36,1) both;
}
.aka-wallet-gallery-archive-chooser::before,
.aka-wallet-gallery-archive-chooser::after {
content:"";
position:absolute;
z-index:0;
left:.40rem;
right:.40rem;
pointer-events:none;
}
.aka-wallet-gallery-archive-chooser::before {
top:50%;
height:2rem;
border-top:1px solid rgba(var(--aka-gallery-gold),.10);
border-bottom:1px solid rgba(var(--aka-gallery-gold),.10);
background:linear-gradient(90deg,transparent,rgba(var(--aka-gallery-gold),.032) 18% 82%,transparent);
transform:translateY(-50%);
}
.aka-wallet-gallery-archive-chooser::after {
top:50%;
height:1px;
background:linear-gradient(90deg,transparent,rgba(var(--aka-gallery-gold),.22) 24% 76%,transparent);
opacity:.52;
}
.aka-wallet-gallery-archive-cylinder {
position:absolute;
z-index:1;
inset:.48rem 0;
overflow:visible;
transform-style:preserve-3d;
-webkit-mask-image:linear-gradient(180deg,transparent,black 13%,black 87%,transparent);
mask-image:linear-gradient(180deg,transparent,black 13%,black 87%,transparent);
}
.aka-wallet-gallery-archive-step {
position:absolute;
z-index:6;
left:50%;
display:grid;
width:2.42rem;
height:1rem;
place-items:center;
padding:0;
border:0;
background:transparent;
color:rgba(var(--aka-gallery-gold),.52);
cursor:pointer;
transform:translateX(-50%);
transition:color 160ms ease,transform 150ms ease,opacity 160ms ease;
-webkit-tap-highlight-color:transparent;
}
.aka-wallet-gallery-archive-step.is-previous { top:0; }
.aka-wallet-gallery-archive-step.is-next { bottom:0; }
.aka-wallet-gallery-archive-step svg { width:.88rem;height:.88rem;stroke-width:1.65; }
@keyframes akaWalletGalleryChooserDrop {
from { opacity:0;transform:translateY(-7px) scaleY(.975); }
to { opacity:1;transform:none; }
}
.aka-wallet-gallery-archive-option {
--aka-gallery-archive-rgb:var(--aka-gallery-gold);
position:absolute;
z-index:1;
top:50%;
left:.14rem;
display:grid;
grid-template-columns:minmax(0,1fr) auto;
align-items:center;
gap:.52rem;
width:calc(100% - .28rem);
min-width:0;
min-height:1.68rem;
box-sizing:border-box;
padding:.25rem .70rem .22rem .74rem;
border:1px solid rgba(var(--aka-gallery-archive-rgb),.10);
border-radius:5px;
background:linear-gradient(90deg,rgba(var(--aka-gallery-archive-rgb),.018),rgba(2,3,3,.60));
color:rgba(232,213,183,.34);
text-align:start;
opacity:0;
cursor:pointer;
pointer-events:none;
transform:translateY(-50%) scale(.72);
transform-origin:center;
transform-style:preserve-3d;
transition:opacity 190ms ease,border-color 170ms ease,color 170ms ease,background 170ms ease,box-shadow 180ms ease,transform 220ms cubic-bezier(.22,1,.36,1);
-webkit-tap-highlight-color:transparent;
}
.aka-wallet-gallery-archive-option.is-active {
z-index:4;
min-height:2rem;
opacity:1;
pointer-events:auto;
transform:translateY(-50%) rotateX(0) scale(1);
}
.aka-wallet-gallery-archive-option.is-previous,
.aka-wallet-gallery-archive-option.is-next {
z-index:2;
opacity:.46;
pointer-events:auto;
}
.aka-wallet-gallery-archive-option.is-previous {
transform:translateY(calc(-50% - 1.64rem)) rotateX(-13deg) scale(.88);
}
.aka-wallet-gallery-archive-option.is-next {
transform:translateY(calc(-50% + 1.64rem)) rotateX(13deg) scale(.88);
}
.aka-wallet-gallery-archive-option.is-offstage {
z-index:0;
visibility:hidden;
opacity:0;
pointer-events:none;
transform:translateY(-50%) scale(.70);
}
.aka-wallet-gallery-archive-option::before {
content:"";
position:absolute;
inset:15% auto 15% 0;
width:1px;
background:rgb(var(--aka-gallery-archive-rgb));
box-shadow:0 0 6px rgba(var(--aka-gallery-archive-rgb),.48);
opacity:.16;
}
.aka-wallet-gallery-archive-option::after {
content:"";
position:absolute;
top:50%;
inset-inline-end:.42rem;
width:.27rem;
height:.27rem;
border:1px solid currentColor;
border-radius:50%;
opacity:.22;
transform:translateY(-50%);
}
.aka-wallet-gallery-archive-option.is-live {
color:rgba(var(--aka-gallery-archive-rgb),.76);
}
.aka-wallet-gallery-archive-option.is-live.is-active {
border-color:rgba(var(--aka-gallery-archive-rgb),.52);
background:linear-gradient(90deg,rgba(var(--aka-gallery-archive-rgb),.12),rgba(2,3,3,.82) 56%,rgba(var(--aka-gallery-archive-rgb),.045));
color:rgba(var(--aka-gallery-archive-rgb),.98);
box-shadow:0 0 0 1px rgba(0,0,0,.70),0 0 9px rgba(var(--aka-gallery-archive-rgb),.10),inset 0 0 13px rgba(var(--aka-gallery-archive-rgb),.045);
}
.aka-wallet-gallery-archive-option.is-live::before { opacity:.48; }
.aka-wallet-gallery-archive-option.is-live.is-active::before { opacity:.92; }
.aka-wallet-gallery-archive-option.is-live::after {
background:currentColor;
opacity:.50;
box-shadow:0 0 4px currentColor;
}
.aka-wallet-gallery-archive-option.is-empty {
filter:saturate(.24) brightness(.74);
}
.aka-wallet-gallery-archive-option.is-empty.is-active {
opacity:.76;
border-color:rgba(190,169,137,.22);
background:linear-gradient(90deg,rgba(190,169,137,.045),rgba(2,3,3,.76));
color:rgba(210,194,167,.56);
}
.aka-wallet-gallery-archive-name,
.aka-wallet-gallery-archive-status {
min-width:0;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
.aka-wallet-gallery-archive-name {
padding-inline-end:.38rem;
font:600 .60rem/1 "Special Elite",monospace;
letter-spacing:.065em;
text-transform:uppercase;
}
.aka-wallet-gallery-archive-option.is-active .aka-wallet-gallery-archive-name {
font-size:.72rem;
letter-spacing:.072em;
}
.aka-wallet-gallery-archive-status {
margin-inline-end:.52rem;
color:currentColor;
font:700 .46rem/1 "Space Grotesk",sans-serif;
font-variant-numeric:tabular-nums;
opacity:.75;
}
.aka-wallet-gallery-archive-option.is-active .aka-wallet-gallery-archive-status {
font-size:.52rem;
opacity:.82;
}
.aka-wallet-gallery-archive-option.is-rejecting {
animation:akaWalletGalleryArchiveReject 360ms cubic-bezier(.36,.07,.19,.97) both;
}
@keyframes akaWalletGalleryArchiveReject {
0%,100% { transform:translateY(-50%);border-color:rgba(232,213,183,.10); }
18% { transform:translate(-2px,-50%);border-color:rgba(255,74,101,.64);color:rgba(255,128,148,.88); }
38% { transform:translate(2px,-50%);background:rgba(90,5,22,.30); }
58% { transform:translate(-2px,-50%); }
78% { transform:translate(1px,-50%); }
}
.aka-wallet-gallery-collection {
position:relative;
display:flex;
height:100%;
min-height:0;
flex:1 1 auto;
flex-direction:column;
}
.aka-wallet-inline-heading.is-collection {
position:absolute;
z-index:3;
top:50%;
right:auto;
left:.06rem;
display:flex;
width:3.62rem;
min-height:1.72rem;
margin-bottom:0;
pointer-events:none;
transform:translateY(-50%);
}
.aka-wallet-gallery-back {
display:inline-flex;
width:3.62rem;
min-width:3.62rem;
max-width:3.62rem;
height:1.72rem;
box-sizing:border-box;
align-items:center;
flex-direction:column;
justify-content:center;
gap:.13rem;
padding:.14rem .10rem;
border:1px solid rgba(var(--aka-gallery-gold),.28);
border-radius:4px;
background:rgba(3,3,3,.78);
color:rgba(var(--aka-gallery-gold),.82);
font:600 .30rem/1 "Special Elite",monospace;
letter-spacing:.05em;
text-transform:uppercase;
cursor:pointer;
}
.aka-wallet-gallery-collections-icon {
display:block;
width:.60rem;
height:.60rem;
flex:0 0 .60rem;
fill:none;
stroke:currentColor;
stroke-width:1.45;
}
.aka-wallet-inline-rail,
[data-wallet-gallery-rail] {
--aka-gallery-rail-end-space:max(.26rem,calc(100% - 8.34rem));
display:flex;
align-items:center;
justify-content:flex-start;
gap:.58rem;
width:100%;
min-width:0;
height:100%;
flex:1 1 auto;
box-sizing:border-box;
overflow-x:auto;
overflow-y:hidden;
overscroll-behavior-x:contain;
scroll-behavior:smooth;
scroll-padding-inline:4.18rem .26rem;
scroll-snap-type:x mandatory;
padding:.34rem .26rem .06rem 4.18rem;
padding-right:var(--aka-gallery-rail-end-space);
scroll-padding-right:var(--aka-gallery-rail-end-space);
border-top:1px solid rgba(var(--aka-gallery-gold),.12);
border-bottom:1px solid rgba(var(--aka-gallery-gold),.12);
cursor:grab;
direction:ltr;
scrollbar-width:none;
touch-action:pan-x;
user-select:none;
}
.aka-wallet-inline-rail::-webkit-scrollbar { display:none; }
.aka-wallet-inline-rail.is-dragging,
[data-wallet-gallery-rail].is-dragging {
scroll-behavior:auto;
scroll-snap-type:none;
cursor:grabbing;
}
.aka-wallet-inline-rail.is-dragging *,
[data-wallet-gallery-rail].is-dragging * { cursor:grabbing !important; }
.aka-wallet-inline-entry,
[data-wallet-gallery-entry] {
--aka-gallery-item-rgb:var(--aka-gallery-reel);
position:relative;
width:4.16rem;
min-width:4.16rem;
height:6.24rem;
min-height:6.24rem;
flex:0 0 4.16rem;
overflow:hidden;
padding:0;
border:1px solid rgba(var(--aka-gallery-item-rgb),.38);
border-radius:5px;
background:#020303;
color:rgb(var(--aka-gallery-item-rgb));
box-shadow:
0 0 0 1px rgba(0,0,0,.92),
inset 0 0 0 1px rgba(255,244,215,.035);
cursor:pointer;
scroll-snap-align:start;
scroll-snap-stop:always;
transform-origin:50% 58%;
transition:
transform 660ms cubic-bezier(.16,1,.30,1),
border-color 420ms ease,
box-shadow 660ms cubic-bezier(.16,1,.30,1),
filter 420ms ease;
will-change:transform;
}
.aka-wallet-inline-entry[data-gallery-kind="secret"] { --aka-gallery-item-rgb:var(--aka-gallery-cyan); }
.aka-wallet-inline-entry[data-gallery-kind="exclusive"] { --aka-gallery-item-rgb:var(--aka-gallery-dia); }
.aka-wallet-inline-entry img,
[data-wallet-gallery-entry] img {
position:relative;
z-index:0;
display:block;
width:100%;
height:100%;
object-fit:contain;
object-position:center;
opacity:1;
transform:none;
filter:none;
transition:none;
}
.aka-wallet-inline-entry::before,
[data-wallet-gallery-entry]::before {
content:"";
position:absolute;
z-index:1;
pointer-events:none;
inset:2px;
border:1px solid rgba(255,246,224,.07);
border-radius:4px;
box-shadow:inset 0 0 10px rgba(0,0,0,.20);
}
.aka-wallet-inline-entry.is-selected,
.aka-wallet-inline-entry[aria-pressed="true"] {
border-color:rgba(var(--aka-gallery-item-rgb),.66);
box-shadow:
0 0 0 1px rgba(0,0,0,.94),
0 0 0 2px rgba(var(--aka-gallery-item-rgb),.09),
inset 0 0 0 1px rgba(255,244,215,.045);
transform:none;
}
.aka-wallet-inline-entry.is-selected img,
.aka-wallet-inline-entry[aria-pressed="true"] img { opacity:1;transform:none; }
.aka-wallet-gallery-preview-host {
--aka-gallery-gold:212,168,67;
--aka-gallery-reel:198,151,61;
--aka-gallery-cyan:91,205,231;
--aka-gallery-dia:var(--aka-gallery-gold);
--aka-gallery-host-top:7rem;
--aka-gallery-host-bottom:3.25rem;
position:absolute;
z-index:12;
top:calc(var(--aka-gallery-host-top) + .62rem);
right:.72rem;
bottom:calc(var(--aka-gallery-host-bottom) + .62rem);
left:.72rem;
min-width:0;
min-height:0;
pointer-events:none;
}
.aka-wallet-gallery-preview-host.is-visible { pointer-events:auto; }
#walletDropdown:has(> .aka-wallet-gallery-preview-host.is-visible) > .aka-wallet-dropdown-holders,
#walletDropdown:has(> .aka-wallet-gallery-preview-host.is-visible) > .aka-wallet-aka-balance,
#walletDropdown:has(> .aka-wallet-gallery-preview-host.is-visible) > .aka-wallet-signal-strip,
#walletDropdown:has(> .aka-wallet-gallery-preview-host.is-visible) > .aka-wallet-signal-drawer,
.aka-mobile-identity-panel:has(> .aka-wallet-gallery-preview-host.is-visible) > .aka-mobile-menu-metrics {
opacity:0;
visibility:hidden;
pointer-events:none;
}
.aka-wallet-gallery-preview-host.is-mobile {
top:calc(var(--aka-gallery-host-top,.74rem) + .52rem);
right:.74rem;
bottom:calc(var(--aka-gallery-host-bottom,0rem) + .62rem);
left:.74rem;
}
.aka-wallet-inline-stage,
[data-wallet-gallery-stage] {
--aka-gallery-stage-rgb:var(--aka-gallery-reel);
position:absolute;
inset:0;
z-index:1;
overflow:visible;
border:0;
border-radius:0;
background:transparent;
box-shadow:none;
opacity:0;
pointer-events:none;
touch-action:pan-y;
transform:none;
transition:opacity 180ms cubic-bezier(.22,1,.36,1);
}
.aka-wallet-inline-stage[data-gallery-kind="secret"] { --aka-gallery-stage-rgb:var(--aka-gallery-cyan); }
.aka-wallet-inline-stage[data-gallery-kind="exclusive"] { --aka-gallery-stage-rgb:var(--aka-gallery-dia); }
.aka-wallet-inline-stage.is-visible {
opacity:1;
pointer-events:auto;
}
.aka-wallet-inline-stage.is-pinned { pointer-events:auto; }
.aka-wallet-inline-stage.is-leaving { opacity:0; }
.aka-wallet-inline-stage::before,
.aka-wallet-inline-stage::after {
content:"";
position:absolute;
pointer-events:none;
}
.aka-wallet-inline-stage::before {
inset:4% 10% 9%;
border:0;
border-radius:50%;
background:radial-gradient(ellipse at 50% 80%,rgba(var(--aka-gallery-gold),.022),transparent 54%);
}
.aka-wallet-inline-stage::after { display:none; }
.aka-wallet-inline-stage-close {
position:absolute;
z-index:7;
inset:.34rem .34rem auto auto;
width:1.30rem;
height:1.30rem;
font:400 .86rem/1 Arial,sans-serif;
}
.aka-wallet-inline-poster-card {
position:absolute;
z-index:3;
left:50%;
top:.44rem;
width:auto;
height:calc(100% - 3.28rem);
max-width:calc(100% - 3.10rem);
aspect-ratio:2 / 3;
overflow:visible;
border:0;
border-radius:5px;
background:transparent;
box-shadow:none;
opacity:0;
transform:translateX(-50%);
transform-origin:center;
}
.aka-wallet-inline-stage.has-navigation .aka-wallet-inline-poster-card {
max-width:calc(100% - 5.20rem);
}
.aka-wallet-card-face.is-front::before {
content:"";
position:absolute;
pointer-events:none;
inset:0;
z-index:4;
padding:1px;
border-radius:5px;
background:conic-gradient(
from var(--aka-gallery-perimeter-angle,0deg),
transparent 0 74%,
rgba(var(--aka-gallery-stage-rgb),.08) 79%,
rgba(var(--aka-gallery-stage-rgb),.64) 84%,
rgba(255,247,229,.54) 87%,
rgba(var(--aka-gallery-stage-rgb),.15) 91%,
transparent 96%
);
-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
-webkit-mask-composite:xor;
mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
mask-composite:exclude;
opacity:0;
}
.aka-wallet-inline-poster-card img {
display:block;
width:100%;
height:100%;
overflow:hidden;
object-fit:contain;
object-position:center;
border-radius:4px;
background:#000;
}
.aka-wallet-inline-preview-footer {
position:absolute;
z-index:5;
right:.42rem;
bottom:.28rem;
left:.42rem;
display:grid;
grid-template-columns:minmax(0,1fr) 1.92rem;
align-items:center;
gap:.34rem;
min-width:0;
}
.aka-wallet-inline-download {
position:relative;
z-index:1;
display:grid;
width:1.92rem;
min-width:1.92rem;
height:1.92rem;
min-height:1.92rem;
place-items:center;
align-items:center;
justify-content:center;
box-sizing:border-box;
padding:0;
border:1px solid rgba(var(--aka-gallery-gold),.34);
border-radius:4px;
background:rgba(7,6,4,.96);
color:rgba(250,220,146,.95);
box-shadow:0 6px 13px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,244,214,.025);
cursor:pointer;
transition:border-color 150ms ease,color 150ms ease,background 150ms ease,transform 140ms ease;
}
.aka-wallet-inline-download svg { width:.86rem;height:.86rem;stroke-width:1.85; }
.aka-wallet-inline-download-label {
position:absolute;
width:1px;
height:1px;
overflow:hidden;
clip:rect(0 0 0 0);
clip-path:inset(50%);
white-space:nowrap;
}
.aka-wallet-gallery-step,
[data-wallet-gallery-step] {
position:absolute;
z-index:7;
top:50%;
display:grid;
width:1.52rem;
height:2.72rem;
place-items:center;
padding:0;
border:1px solid rgba(var(--aka-gallery-stage-rgb),.18);
border-radius:6px;
background:linear-gradient(180deg,rgba(var(--aka-gallery-stage-rgb),.045),rgba(2,3,3,.90));
color:rgba(var(--aka-gallery-stage-rgb),.76);
box-shadow:0 0 0 1px rgba(0,0,0,.72),inset 0 0 8px rgba(var(--aka-gallery-stage-rgb),.025);
opacity:0;
cursor:pointer;
transform:translateY(-50%);
transition:opacity 150ms ease,border-color 160ms ease,color 160ms ease,box-shadow 160ms ease;
}
.aka-wallet-gallery-step[data-wallet-gallery-step="-1"],
.aka-wallet-gallery-step.is-previous { left:.28rem; }
.aka-wallet-gallery-step[data-wallet-gallery-step="1"],
.aka-wallet-gallery-step.is-next { right:.28rem; }
.aka-wallet-gallery-step svg,
[data-wallet-gallery-step] svg { width:.92rem;height:.92rem;stroke-width:1.8; }
.aka-wallet-gallery-step:disabled,
[data-wallet-gallery-step]:disabled { opacity:.05 !important;cursor:default; }
@media (any-hover:hover) and (pointer:fine) {
.aka-wallet-inline-entry:hover,
.aka-wallet-inline-entry:focus-visible,
[data-wallet-gallery-entry]:hover,
[data-wallet-gallery-entry]:focus-visible,
.aka-wallet-gallery-archive-option:hover,
.aka-wallet-gallery-archive-option:focus-visible,
.aka-wallet-gallery-archive-step:hover,
.aka-wallet-gallery-archive-step:focus-visible,
.aka-wallet-gallery-back:hover,
.aka-wallet-gallery-back:focus-visible,
.aka-wallet-inline-dismiss:hover,
.aka-wallet-inline-dismiss:focus-visible,
.aka-wallet-inline-stage-close:hover,
.aka-wallet-inline-stage-close:focus-visible,
.aka-wallet-inline-download:hover,
.aka-wallet-inline-download:focus-visible,
.aka-wallet-gallery-step:hover,
.aka-wallet-gallery-step:focus-visible {
outline:none;
}
.aka-wallet-inline-entry:hover,
[data-wallet-gallery-entry]:hover {
z-index:5;
border-color:rgba(var(--aka-gallery-item-rgb),.74);
filter:saturate(1.012) brightness(1.012);
transform:translateY(-.08rem) rotateX(.55deg) scale(1.006);
box-shadow:
0 0 0 1px rgba(0,0,0,.96),
0 0 0 2px rgba(var(--aka-gallery-item-rgb),.08),
0 7px 16px rgba(0,0,0,.68),
0 0 11px rgba(var(--aka-gallery-item-rgb),.09),
inset 0 0 0 1px rgba(255,244,215,.045);
}
.aka-wallet-inline-entry:focus-visible,
[data-wallet-gallery-entry]:focus-visible {
outline:none;
border-color:rgba(var(--aka-gallery-item-rgb),.68);
transform:translateY(-.07rem);
box-shadow:
0 0 0 1px rgba(0,0,0,.88),
0 0 0 2px rgba(var(--aka-gallery-item-rgb),.14);
}
.aka-wallet-gallery-archive-option:focus-visible {
outline:1px solid rgba(var(--aka-gallery-archive-rgb),.72);
outline-offset:2px;
}
.aka-wallet-gallery-archive-step:hover,
.aka-wallet-gallery-archive-step:focus-visible {
color:rgba(var(--aka-gallery-gold),.94);
transform:translateX(-50%) translateY(-1px);
}
.aka-wallet-gallery-back:hover,
.aka-wallet-gallery-back:focus-visible { border-color:rgba(var(--aka-gallery-gold),.72);color:#ffe4a1; }
.aka-wallet-inline-dismiss:hover,
.aka-wallet-inline-dismiss:focus-visible,
.aka-wallet-inline-stage-close:hover,
.aka-wallet-inline-stage-close:focus-visible { border-color:rgba(var(--aka-gallery-gold),.66);color:#ffe4a1; }
.aka-wallet-inline-download:hover,
.aka-wallet-inline-download:focus-visible { border-color:rgba(var(--aka-gallery-gold),.72);color:#ffe4a1;background:rgba(13,10,5,.98); }
.aka-wallet-inline-stage:hover .aka-wallet-gallery-step:not(:disabled),
.aka-wallet-inline-stage:focus-within .aka-wallet-gallery-step:not(:disabled),
.aka-wallet-gallery-step:not(:disabled):focus-visible {
opacity:.72;
transform:translateY(-50%);
}
.aka-wallet-gallery-step:not(:disabled):hover,
.aka-wallet-gallery-step:not(:disabled):focus-visible {
border-color:rgba(var(--aka-gallery-stage-rgb),.74);
color:rgb(var(--aka-gallery-stage-rgb));
box-shadow:0 0 0 1px rgba(0,0,0,.72),0 0 9px rgba(var(--aka-gallery-stage-rgb),.20),inset 0 0 9px rgba(var(--aka-gallery-stage-rgb),.055);
}
}
.aka-wallet-gallery-back:active,
.aka-wallet-inline-dismiss:active,
.aka-wallet-inline-stage-close:active,
.aka-wallet-inline-download:active { transform:translateY(1px) scale(.98); }
.aka-wallet-inline-entry:active,
[data-wallet-gallery-entry]:active {
border-color:rgba(var(--aka-gallery-item-rgb),.72);
transform:translateY(-.05rem) scale(.995);
transition-duration:120ms;
}
.aka-wallet-gallery-archive-option.is-active:active {
transform:translateY(calc(-50% + 1px)) scale(.985);
}
.aka-wallet-gallery-archive-step:active {
transform:translateX(-50%) translateY(1px);
}
.aka-wallet-gallery-step:not(:disabled):active { transform:translateY(-49%) scale(.97); }
@media (hover:none), (pointer:coarse) {
.aka-wallet-gallery-step,
[data-wallet-gallery-step] {
display:none !important;
pointer-events:none !important;
}
}
.aka-wallet-inline-heading:dir(rtl) { text-align:right; }
html[lang="ar"] .aka-wallet-inline-heading,
html[lang="ar"] .aka-wallet-gallery-archive-name,
html[lang="ar"] .aka-wallet-gallery-back { letter-spacing:0; }
/* ========================================================================== */
/* ARCHIVE OWNERSHIP — ONE GALLERY-GOLD CONTROL + ONE SLIDING NOTICE */
/* ========================================================================== */
.aka-archive-download-btn.is-owned,
.aka-archive-owned-seal,
[data-gallery-owned-poster] {
--aka-owned-gallery-rgb:212,168,67;
position:absolute;
top:var(--aka-poster-side-start,.52rem);
right:var(--aka-poster-side-start,.52rem);
z-index:21;
display:grid;
place-items:center;
width:var(--aka-poster-download-size,1.74rem);
height:var(--aka-poster-download-size,1.74rem);
min-width:var(--aka-poster-download-size,1.74rem);
min-height:var(--aka-poster-download-size,1.74rem);
padding:0;
border:1px solid rgba(var(--aka-owned-gallery-rgb),.66) !important;
border-radius:999px;
background:rgba(7,7,6,.90) !important;
color:rgba(242,205,112,.98) !important;
box-shadow:inset 0 0 7px rgba(var(--aka-owned-gallery-rgb),.055) !important;
cursor:pointer;
opacity:1;
transition:border-color 160ms ease,color 160ms ease,box-shadow 160ms ease,transform 145ms cubic-bezier(.22,1,.36,1) !important;
-webkit-tap-highlight-color:transparent;
}
/* No generated ring and no hover tooltip: the sliding notice is the only copy. */
.aka-archive-download-btn.is-owned::before,
.aka-archive-download-btn.is-owned::after,
.aka-archive-owned-seal::before,
.aka-archive-owned-seal::after,
[data-gallery-owned-poster]::before,
[data-gallery-owned-poster]::after {
content:none !important;
display:none !important;
}
.aka-archive-owned-gallery-glyph {
width:.78rem;
height:.66rem;
color:inherit;
filter:drop-shadow(0 0 2px rgba(var(--aka-owned-gallery-rgb),.18));
}
.aka-archive-owned-gallery-glyph > span { background:rgba(5,4,2,.94); }
@media (any-hover:hover) and (pointer:fine) {
.aka-archive-download-btn.is-owned:hover,
.aka-archive-download-btn.is-owned:focus-visible,
.aka-archive-owned-seal:hover,
.aka-archive-owned-seal:focus-visible,
[data-gallery-owned-poster]:hover,
[data-gallery-owned-poster]:focus-visible {
outline:none;
border-color:rgba(245,211,126,.98) !important;
color:#f1cb71 !important;
box-shadow:0 0 10px rgba(var(--aka-owned-gallery-rgb),.16),inset 0 0 7px rgba(var(--aka-owned-gallery-rgb),.07) !important;
transform:translateY(-1px) scale(1.035) !important;
}
}
.aka-archive-download-btn.is-owned:active,
.aka-archive-owned-seal:active,
[data-gallery-owned-poster]:active { transform:scale(.955) !important; }
.aka-owned-callout,
.aka-owned-notice,
[data-owned-callout] {
--aka-owned-gallery-rgb:212,168,67;
position:fixed;
left:50%;
bottom:max(1rem,env(safe-area-inset-bottom));
z-index:13240;
display:grid;
grid-template-columns:1.76rem minmax(0,1fr) 1.9rem;
align-items:center;
gap:.58rem;
width:min(16rem,calc(100vw - 1.5rem));
min-height:3rem;
box-sizing:border-box;
padding:.4rem .6rem .4rem .68rem;
border:1px solid rgba(var(--aka-owned-gallery-rgb),.43);
border-radius:5px;
background:
linear-gradient(90deg,rgba(var(--aka-owned-gallery-rgb),.075),transparent 48%),
#080603;
color:rgba(241,217,164,.90);
box-shadow:0 16px 42px rgba(0,0,0,.76),inset 0 1px 0 rgba(255,239,198,.028);
opacity:0;
visibility:hidden;
pointer-events:none;
transform:translate(-50%,8px);
transition:opacity 180ms ease,transform 220ms cubic-bezier(.22,1,.36,1),visibility 0s linear 220ms;
}
.aka-owned-callout.is-visible,
.aka-owned-notice.is-visible,
[data-owned-callout].is-visible {
opacity:1;
visibility:visible;
pointer-events:auto;
transform:translate(-50%,0);
transition:opacity 180ms ease,transform 220ms cubic-bezier(.22,1,.36,1),visibility 0s linear 0s;
}
.aka-owned-callout.is-anchored,
.aka-owned-notice.is-anchored,
[data-owned-callout].is-anchored {
bottom:auto;
transform:translate(0,8px);
}
.aka-owned-callout.is-anchored.is-visible,
.aka-owned-notice.is-anchored.is-visible,
[data-owned-callout].is-anchored.is-visible { transform:translate(0,0); }
.aka-owned-callout-icon {
display:grid;
place-items:center;
width:1.76rem;
height:1.76rem;
border:1px solid rgba(var(--aka-owned-gallery-rgb),.42);
border-radius:4px;
background:linear-gradient(180deg,rgba(var(--aka-owned-gallery-rgb),.09),rgba(4,5,5,.92));
color:rgba(242,205,112,.98);
box-shadow:inset 0 0 8px rgba(var(--aka-owned-gallery-rgb),.04);
}
.aka-owned-callout-icon .aka-wallet-gallery-stack-glyph {
transform:scale(1.24);
transform-origin:50% 50%;
}
.aka-owned-callout-copy {
min-width:0;
color:rgba(248,226,180,.98);
font:600 .84rem/1.35 "Space Grotesk",Arial,sans-serif;
letter-spacing:.04em;
overflow-wrap:anywhere;
text-transform:uppercase;
}
.aka-owned-callout-close {
display:grid;
place-items:center;
width:1.9rem;
height:1.9rem;
padding:0;
border:0;
background:transparent;
color:rgba(231,211,169,.58);
cursor:pointer;
}
.aka-owned-callout-close svg { width:.78rem;height:.78rem;stroke-width:1.9; }
.aka-owned-callout-close:focus-visible { outline:1px solid rgba(242,205,112,.62);outline-offset:-2px; }
/* ========================================================================== */
/* EXCLUSIVE POSTER — SEALED DIAMOND / GATE / CLAIM */
/* ========================================================================== */
/* Every Reel representation uses one SVG geometry: rim, five apertures, hub
and centre dot. Ordinary and Secret change only their material colour. */
.aka-archive-reel-signal-icon,
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"] {
--aka-task-accent:255,78,76 !important;
overflow:visible !important;
border-color:transparent !important;
border-radius:0 !important;
background:none !important;
box-shadow:none !important;
}
.aka-archive-reel-signal-icon > svg,
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"] > svg {
color:rgb(var(--aka-reel-rgb,255,78,76)) !important;
stroke-width:2.12 !important;
}
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"][data-reel-tone="secret"],
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"].is-reel-secret,
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"]:has(> .aka-reel-glyph.is-secret) {
--aka-task-accent:255,78,76 !important;
border-color:transparent !important;
background:none !important;
box-shadow:none !important;
}
/* `aka-reel-signal-glyph` remains as a compatibility hook; `aka-reel-glyph`
is the single visual contract used by cards, notices and Wallet. */
.aka-reel-glyph,
.aka-reel-signal-glyph {
--aka-reel-rgb:255,78,76;
--aka-reel-dark:12,2,3;
display:block;
width:1.2rem;
height:1.2rem;
overflow:visible;
color:rgb(var(--aka-reel-rgb));
shape-rendering:geometricPrecision;
}
.aka-reel-glyph.is-ordinary { --aka-reel-rgb:255,78,76;--aka-reel-dark:12,2,3; }
.aka-reel-glyph.is-secret {
--aka-reel-rgb:255,78,76;
--aka-reel-dark:2,9,16;
--aka-reel-fill-rgb:24,78,132;
}
/* The large sealed Ordinary Reel keeps its approved cinema-gold material.
Secret and Reel Signal glyphs use one dark-blue disc with red line work. */
.aka-reel-glyph.aka-archive-film-reel.is-ordinary {
--aka-reel-rgb:212,168,67;
--aka-reel-dark:7,4,2;
}
.aka-reel-glyph .aka-reel-rim {
fill:rgba(var(--aka-reel-fill-rgb,var(--aka-reel-rgb)),.13);
stroke:currentColor;
stroke-width:1.45;
vector-effect:non-scaling-stroke;
}
.aka-reel-glyph.is-secret .aka-reel-rim {
fill:rgba(var(--aka-reel-fill-rgb),.68);
}
.aka-reel-glyph .aka-reel-aperture,
.aka-reel-glyph .aka-reel-hub {
fill:rgba(var(--aka-reel-dark),.98);
stroke:currentColor;
stroke-width:.48;
vector-effect:non-scaling-stroke;
}
.aka-reel-glyph .aka-reel-hub { stroke-width:1.05; }
.aka-reel-glyph .aka-reel-dot {
fill:currentColor;
stroke:rgba(255,244,214,.62);
stroke-width:.28;
vector-effect:non-scaling-stroke;
}
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"] > .aka-reel-glyph {
--aka-reel-rgb:255,78,76 !important;
--aka-reel-dark:2,9,16 !important;
--aka-reel-fill-rgb:24,78,132 !important;
width:1.70rem;
height:1.70rem;
overflow:visible !important;
color:rgb(var(--aka-reel-rgb)) !important;
filter:drop-shadow(0 0 4px rgba(var(--aka-reel-rgb),.36)) !important;
}
/* Completion owns one green outer ring. The Reel keeps its blue disc and red
inner geometry, while its red rim yields to the shared green check state. */
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"].is-complete .aka-reel-rim {
fill:rgba(var(--aka-reel-fill-rgb,var(--aka-reel-rgb)),.68) !important;
stroke:transparent !important;
}
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"].is-complete {
border:1.5px solid rgba(101,246,142,.98) !important;
border-radius:999px !important;
background:none !important;
box-shadow:0 0 3px rgba(74,222,128,.46) !important;
}
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"].is-complete > .aka-reel-glyph {
filter:none !important;
}
.aka-reel-glyph.aka-archive-film-reel {
width:3.68rem;
height:3.68rem;
overflow:visible !important;
border:0 !important;
border-radius:0 !important;
background:none !important;
box-shadow:none !important;
color:rgb(var(--aka-reel-rgb)) !important;
filter:drop-shadow(0 0 4px rgba(var(--aka-reel-rgb),.28)) drop-shadow(0 0 9px rgba(var(--aka-reel-rgb),.13));
}
#modalContent .night-kaka-cinematic-archive .aka-archive-file-card.is-sealed.is-sealed-feedback-active .aka-archive-film-reel {
filter:
brightness(1.045)
drop-shadow(0 0 5px rgba(var(--aka-reel-rgb),.22))
drop-shadow(0 0 11px rgba(var(--aka-reel-rgb),.11)) !important;
}
/* Reel class identity owns the centre light: warm cinema gold for Ordinary and
cold cyan for Secret. */
#modalContent .aka-archive-file-card.is-sealed:not(.is-classified):not(.is-main-silver-seal) .aka-archive-file-inner {
background:
radial-gradient(circle at 50% 45%,rgba(212,168,67,.14),transparent 39%),
linear-gradient(180deg,rgba(0,0,0,.10),rgba(0,0,0,.48)) !important;
}
#modalContent .aka-archive-file-card.is-sealed:not(.is-classified):not(.is-main-silver-seal) .aka-sealed-poster-veil {
background:
radial-gradient(circle at 50% 45%,rgba(212,168,67,.085),transparent 35%),
linear-gradient(180deg,rgba(0,0,0,.54),rgba(4,3,2,.50) 46%,rgba(0,0,0,.90)) !important;
}
#modalContent .aka-archive-file-card.is-sealed.is-classified:not(.is-main-silver-seal) .aka-archive-file-inner {
background:
radial-gradient(circle at 50% 45%,rgba(74,168,255,.16),transparent 39%),
linear-gradient(180deg,rgba(1,8,15,.12),rgba(0,3,7,.50)) !important;
}
#modalContent .aka-archive-file-card.is-sealed.is-classified:not(.is-main-silver-seal) .aka-sealed-poster-veil {
background:
radial-gradient(circle at 50% 45%,rgba(74,168,255,.10),transparent 35%),
linear-gradient(180deg,rgba(0,5,10,.55),rgba(2,8,14,.52) 46%,rgba(0,2,5,.91)) !important;
}
.aka-reel-glyph.aka-game-notice-film-reel,
.aka-reel-glyph.aka-game-notice-reel-signal {
width:1.92rem;
height:1.92rem;
overflow:visible !important;
border:0 !important;
border-radius:0 !important;
background:none !important;
box-shadow:none !important;
filter:drop-shadow(0 0 7px rgba(var(--aka-reel-rgb),.34));
}
.aka-reel-glyph.aka-wallet-secret-reel {
width:1.28rem !important;
height:1.28rem !important;
flex:0 0 1.28rem;
overflow:visible !important;
border:0 !important;
border-radius:0 !important;
background:none !important;
box-shadow:none !important;
filter:drop-shadow(0 0 2px rgba(var(--aka-reel-rgb),.20));
}
.aka-reel-glyph.aka-wallet-secret-reel .aka-reel-rim {
stroke-width:.46;
}
.aka-reel-glyph.aka-archive-film-reel::before,
.aka-reel-glyph.aka-archive-film-reel::after,
.aka-reel-glyph.aka-game-notice-film-reel::before,
.aka-reel-glyph.aka-game-notice-film-reel::after,
.aka-reel-glyph.aka-wallet-secret-reel::before,
.aka-reel-glyph.aka-wallet-secret-reel::after {
content:none !important;
display:none !important;
}
/* Numeric Reel Signals are not DIA. Their icon-owned panel and any compact
requirement panel use an independent cold-blue cinema identity. */
.aka-archive-special-hint-modal.is-reel-signal-modal {
background:
radial-gradient(ellipse at center,rgba(74,168,255,.14),transparent 49%),
rgba(0,0,0,.40) !important;
}
.aka-archive-special-hint-card.is-reel-signal {
--aka-reel-signal-rgb:74,168,255;
border-color:rgba(var(--aka-reel-signal-rgb),.56) !important;
background:
radial-gradient(ellipse at 50% -8%,rgba(var(--aka-reel-signal-rgb),.19),transparent 49%),
linear-gradient(180deg,rgba(4,15,27,.99),rgba(3,6,10,.995)) !important;
box-shadow:
0 0 0 1px rgba(134,211,255,.045),
0 0 22px rgba(var(--aka-reel-signal-rgb),.22),
0 0 48px rgba(0,60,112,.14),
inset 0 0 29px rgba(var(--aka-reel-signal-rgb),.06) !important;
}
.aka-archive-special-hint-card.is-reel-signal::after {
background:linear-gradient(180deg,rgba(var(--aka-reel-signal-rgb),.075),transparent 25%) !important;
}
.aka-archive-special-hint-card.is-reel-signal .aka-archive-special-hint-icon {
width:2.90rem;
height:2.90rem;
color:rgb(255,78,76) !important;
border:0 !important;
border-radius:0 !important;
background:none !important;
box-shadow:none !important;
}
.aka-archive-special-hint-card.is-reel-signal .aka-archive-special-hint-icon .aka-reel-glyph {
--aka-reel-rgb:255,78,76 !important;
--aka-reel-dark:2,9,16 !important;
--aka-reel-fill-rgb:24,78,132 !important;
width:2.76rem;
height:2.76rem;
filter:drop-shadow(0 0 5px rgba(var(--aka-reel-rgb),.24));
}
.aka-archive-special-hint-card.is-reel-signal .aka-archive-question-kicker {
color:rgba(128,207,255,.98) !important;
font-size:.84rem;
letter-spacing:.15em;
text-shadow:0 0 9px rgba(var(--aka-reel-signal-rgb),.30) !important;
}
.aka-archive-special-hint-card.is-reel-signal .aka-archive-special-hint-body {
max-width:26.5rem;
font-size:.94rem;
line-height:1.58;
}
.aka-archive-special-hint-card.is-reel-signal .aka-archive-special-hint-note {
font-size:.64rem;
letter-spacing:.12em;
}
.aka-archive-special-hint-card.is-reel-signal .aka-archive-special-hint-note,
.aka-archive-special-hint-card.is-reel-signal .aka-archive-special-hint-close {
color:rgba(161,220,255,.84) !important;
}
#cinematicModal > .aka-archive-activity-flyout.is-activity-reel-signal {
--aka-activity-rgb:74,168,255;
}
.aka-file-requirement-warning.is-reel-signal {
background:radial-gradient(ellipse at center,rgba(74,168,255,.10),transparent 45%),rgba(0,0,0,.27);
}
.aka-file-requirement-warning.is-reel-signal .aka-file-requirement-card {
border-color:rgba(74,168,255,.44);
background:
radial-gradient(ellipse at 50% 0%,rgba(74,168,255,.14),transparent 49%),
linear-gradient(180deg,rgba(5,16,28,.98),rgba(4,6,8,.98));
box-shadow:0 0 18px rgba(74,168,255,.20),0 0 42px rgba(0,0,0,.75),inset 0 0 24px rgba(74,168,255,.055);
}
.aka-file-requirement-warning.is-reel-signal .aka-file-requirement-icon {
color:rgb(255,78,76);
border:0;
border-radius:0;
background:none;
box-shadow:none;
}
.aka-file-requirement-warning.is-reel-signal .aka-file-requirement-icon .aka-reel-glyph {
--aka-reel-rgb:255,78,76;
--aka-reel-dark:2,9,16;
--aka-reel-fill-rgb:24,78,132;
width:2.64rem;
height:2.64rem;
filter:drop-shadow(0 0 5px rgba(var(--aka-reel-rgb),.24));
}
.aka-game-notice-symbol > .aka-game-notice-reel-signal {
width:1.92rem;
height:1.92rem;
color:rgb(var(--aka-reel-rgb,255,78,76)) !important;
filter:drop-shadow(0 0 7px rgba(var(--aka-reel-rgb,255,78,76),.38));
}
@media (prefers-reduced-motion:reduce) {
.aka-archive-special-hint-card.is-reel-signal { animation:none !important; }
}
#modalContent .aka-archive-file-card.is-exclusive,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] {
--aka-exclusive-rgb:139,5,115;
--aka-exclusive-gold:223,183,88;
--aka-exclusive-champagne:242,211,142;
border-color:rgba(var(--aka-exclusive-rgb),.68) !important;
background:#030203 !important;
box-shadow:
0 0 0 1px rgba(var(--aka-exclusive-rgb),.17),
0 0 9px rgba(var(--aka-exclusive-rgb),.18),
inset 0 0 0 1px rgba(var(--aka-exclusive-rgb),.05) !important;
isolation:isolate;
transform-origin:center 82%;
}
#modalContent .aka-archive-file-card.is-exclusive > picture,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] > picture {
position:absolute;
inset:0;
z-index:1;
width:100%;
height:100%;
}
#modalContent .aka-archive-file-card.is-exclusive img.aka-archive-poster-preview,
#modalContent .aka-archive-file-card.is-exclusive img.aka-archive-revealed-poster,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] img.aka-archive-poster-preview,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] img.aka-archive-revealed-poster {
object-fit:contain !important;
object-position:center !important;
background:#000;
}
#modalContent .aka-archive-file-card.is-exclusive.is-exclusive-claimed,
#modalContent .aka-archive-file-card[data-file-type="exclusive"].is-exclusive-claimed {
border-color:rgba(91,239,133,.76) !important;
box-shadow:
0 0 0 1px rgba(74,222,128,.18),
0 0 8px rgba(34,197,94,.13),
inset 0 0 0 1px rgba(74,222,128,.045) !important;
}
/* Exclusive art is claimed through its own gate and never exposes the normal
archive Download corner control. Its image stays unreadable until UNSEAL. */
#modalContent .aka-archive-file-card.is-exclusive > .aka-archive-download-btn,
#modalContent .aka-archive-file-card.is-exclusive > .aka-archive-owned-seal,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] > .aka-archive-download-btn,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] > .aka-archive-owned-seal {
display:none !important;
}
#modalContent .aka-archive-file-card.is-exclusive:not(.is-exclusive-unsealed):not(.is-exclusive-claimed) img.aka-archive-poster-preview,
#modalContent .aka-archive-file-card.is-exclusive:not(.is-exclusive-unsealed):not(.is-exclusive-claimed) img.aka-archive-revealed-poster,
#modalContent .aka-archive-file-card[data-file-type="exclusive"]:not([data-exclusive-stage="unsealed"]):not([data-exclusive-stage="claim"]):not([data-exclusive-stage="claimed"]) img.aka-archive-poster-preview,
#modalContent .aka-archive-file-card[data-file-type="exclusive"]:not([data-exclusive-stage="unsealed"]):not([data-exclusive-stage="claim"]):not([data-exclusive-stage="claimed"]) img.aka-archive-revealed-poster {
opacity:.055;
}
#modalContent .aka-archive-file-card.is-exclusive-unsealed img.aka-archive-poster-preview,
#modalContent .aka-archive-file-card.is-exclusive-unsealed img.aka-archive-revealed-poster,
#modalContent .aka-archive-file-card.is-exclusive-claimed img.aka-archive-poster-preview,
#modalContent .aka-archive-file-card.is-exclusive-claimed img.aka-archive-revealed-poster,
#modalContent .aka-archive-file-card[data-exclusive-stage="unsealed"] img.aka-archive-poster-preview,
#modalContent .aka-archive-file-card[data-exclusive-stage="claim"] img.aka-archive-poster-preview,
#modalContent .aka-archive-file-card[data-exclusive-stage="claimed"] img.aka-archive-poster-preview {
opacity:1;
}
.aka-exclusive-sealed-surface {
position:absolute;
inset:0;
z-index:1;
overflow:hidden;
background:
radial-gradient(ellipse at 50% 41%,rgba(var(--aka-exclusive-rgb),.13),transparent 34%),
radial-gradient(ellipse at 50% 43%,rgba(255,117,190,.035),transparent 56%),
linear-gradient(180deg,#070306 0%,#020102 58%,#050203 100%);
}
.aka-exclusive-sealed-surface::before,
.aka-exclusive-sealed-surface::after {
content:none;
display:none;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-archive-file-id-badge.is-classified,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-archive-file-id-badge.is-classified {
z-index:22;
max-width:calc(50% - .72rem);
border-color:rgba(var(--aka-exclusive-gold),.58) !important;
background:linear-gradient(135deg,rgba(14,7,10,.96),rgba(var(--aka-exclusive-rgb),.10)) !important;
color:rgba(255,229,168,.96) !important;
box-shadow:0 0 0 1px rgba(var(--aka-exclusive-rgb),.16),0 5px 14px rgba(0,0,0,.42) !important;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-archive-file-id-badge.is-classified span,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-archive-file-id-badge.is-classified span {
color:rgba(255,229,168,.96) !important;
font-size:.60rem !important;
letter-spacing:.08em !important;
text-shadow:0 0 7px rgba(var(--aka-exclusive-gold),.22) !important;
}
.aka-exclusive-seal {
position:absolute;
z-index:12;
left:50%;
top:41%;
display:grid;
place-items:center;
width:min(58%,7.4rem);
aspect-ratio:1;
transform:translate(-50%,-50%);
pointer-events:none;
}
.aka-exclusive-seal-aura {
position:absolute;
left:50%;
top:50%;
width:112%;
aspect-ratio:1;
border:1px solid rgba(var(--aka-exclusive-rgb),.18);
border-radius:50%;
transform:translate(-50%,-50%);
background:
radial-gradient(circle at 47% 43%,rgba(255,255,255,.025),transparent 20%),
radial-gradient(circle,#080407 0 55%,#0d060b 69%,rgba(38,7,25,.94) 78%,rgba(var(--aka-exclusive-rgb),.085) 80%,transparent 82%);
box-shadow:0 0 9px rgba(var(--aka-exclusive-rgb),.11),inset 0 0 19px rgba(var(--aka-exclusive-rgb),.045);
}
.aka-exclusive-seal-aura::before,
.aka-exclusive-seal-aura::after { content:none;display:none; }
.aka-exclusive-crystal {
position:relative;
z-index:4;
width:76%;
height:76%;
overflow:visible;
color:rgb(var(--aka-exclusive-rgb));
fill:none;
stroke:currentColor;
stroke-width:1.34;
stroke-linecap:round;
stroke-linejoin:round;
shape-rendering:geometricPrecision;
filter:drop-shadow(0 0 1px rgba(255,215,236,.34)) drop-shadow(0 0 4px rgba(var(--aka-exclusive-rgb),.46));
}
/* Exclusive gates reuse the global archive control grammar; condition and
action are separate. The compact top badge names the gate, the bottom
control remains the same physical size as every other poster action. */
.aka-exclusive-progression-action {
flex-direction:row;
gap:0;
}
.aka-exclusive-gate-badge {
--aka-exclusive-gate-rgb:var(--aka-exclusive-rgb);
position:absolute;
z-index:22;
top:.52rem;
right:.52rem;
box-sizing:border-box;
display:inline-flex;
align-items:center;
justify-content:center;
min-height:1.34rem;
max-width:calc(100% - 6.7rem);
padding:.31rem .48rem .27rem;
overflow:hidden;
border:1px solid rgba(var(--aka-exclusive-gate-rgb),.42);
border-radius:999px;
background:linear-gradient(180deg,rgba(var(--aka-exclusive-gate-rgb),.085),rgba(4,2,3,.91));
color:rgba(255,201,232,.92);
box-shadow:0 0 0 1px rgba(0,0,0,.68),0 0 7px rgba(var(--aka-exclusive-gate-rgb),.11),inset 0 0 8px rgba(var(--aka-exclusive-gate-rgb),.035);
font:600 .55rem/1 "Special Elite",monospace;
letter-spacing:.065em;
text-align:center;
text-overflow:ellipsis;
text-transform:uppercase;
white-space:nowrap;
pointer-events:none;
}
.aka-exclusive-gate-badge.is-pay,
.aka-exclusive-gate-badge[data-exclusive-gate-type="pay"] {
--aka-exclusive-gate-rgb:var(--aka-exclusive-gold);
color:rgba(255,232,178,.92);
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action {
border-color:rgba(var(--aka-exclusive-gold),.66) !important;
background:
radial-gradient(ellipse at 50% 0%,rgba(255,228,158,.15),transparent 64%),
linear-gradient(180deg,rgba(58,37,8,.78),rgba(8,6,3,.90)) !important;
color:rgba(255,236,190,.98) !important;
font-size:.60rem !important;
letter-spacing:.11em !important;
box-shadow:0 0 0 1px rgba(var(--aka-exclusive-gold),.11),0 0 11px rgba(var(--aka-exclusive-gold),.24),0 10px 24px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.08) !important;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action span,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action span {
font-size:.60rem !important;
letter-spacing:.11em !important;
}
html:is([lang="ru"],[lang="es"]) #modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action,
html:is([lang="ru"],[lang="es"]) #modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action span {
letter-spacing:.07em !important;
}
html:is([lang="zh"],[lang="ar"]) #modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action,
html:is([lang="zh"],[lang="ar"]) #modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action span {
letter-spacing:0 !important;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-verify,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action.is-verify {
border-color:rgba(var(--aka-exclusive-rgb),.78) !important;
background:linear-gradient(180deg,rgba(76,8,45,.82),rgba(8,2,6,.96)) !important;
color:rgba(255,218,239,.98) !important;
box-shadow:0 0 0 1px rgba(var(--aka-exclusive-rgb),.10),0 0 8px rgba(var(--aka-exclusive-rgb),.17),0 10px 24px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.055) !important;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-pay,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action.is-pay {
border-color:rgba(var(--aka-exclusive-gold),.70) !important;
background:linear-gradient(180deg,rgba(61,40,10,.82),rgba(8,6,3,.95)) !important;
color:rgba(255,235,187,.98) !important;
box-shadow:0 0 0 1px rgba(var(--aka-exclusive-gold),.10),0 0 9px rgba(var(--aka-exclusive-gold),.18),0 10px 24px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.06) !important;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-unseal,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action.is-unseal {
border-color:rgba(var(--aka-exclusive-rgb),.90) !important;
background:radial-gradient(ellipse at 50% 0%,rgba(255,139,205,.15),transparent 64%),linear-gradient(180deg,rgba(92,10,56,.86),rgba(10,2,7,.95)) !important;
color:rgba(255,218,241,.99) !important;
box-shadow:0 0 0 1px rgba(var(--aka-exclusive-rgb),.13),0 0 11px rgba(var(--aka-exclusive-rgb),.24),0 10px 24px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.07) !important;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-claim,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action.is-claim {
border-color:rgba(var(--aka-exclusive-champagne),.76) !important;
background:radial-gradient(ellipse at 50% 0%,rgba(var(--aka-exclusive-champagne),.13),transparent 64%),linear-gradient(180deg,rgba(64,45,15,.82),rgba(9,7,3,.95)) !important;
color:rgba(255,239,199,.99) !important;
box-shadow:0 0 0 1px rgba(var(--aka-exclusive-champagne),.10),0 0 9px rgba(var(--aka-exclusive-champagne),.18),0 10px 24px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.065) !important;
}
#modalContent .aka-exclusive-action:disabled {
opacity:.62;
cursor:default;
}
@media (any-hover:hover) and (pointer:fine) {
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action:not(:disabled):hover,
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action:not(:disabled):focus-visible {
outline:none;
border-color:rgba(255,225,151,.86) !important;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-verify:not(:disabled):hover,
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-verify:not(:disabled):focus-visible {
border-color:rgba(255,117,197,.96) !important;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-unseal:not(:disabled):hover,
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-unseal:not(:disabled):focus-visible {
border-color:rgba(255,110,192,.96) !important;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-claim:not(:disabled):hover,
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-claim:not(:disabled):focus-visible {
border-color:rgba(255,231,174,.94) !important;
}
}
/* DIA arrival is viewport-triggered: the Lucide gem is cut into the sealed
surface one line at a time, then rests as a sharp magenta mark. */
.aka-exclusive-break-layer,
.aka-secret-unseal-layer {
position:absolute;
inset:0;
z-index:25;
overflow:hidden;
pointer-events:none;
}
#modalContent .aka-archive-file-card.is-exclusive-pending-arrival {
opacity:.34;
transform:translateY(14px) scale(.972);
}
#modalContent .aka-archive-file-card.is-exclusive-pending-arrival .aka-exclusive-seal,
#modalContent .aka-archive-file-card.is-exclusive-pending-arrival .aka-exclusive-progression-action { opacity:0; }
#modalContent .aka-archive-file-card.is-exclusive-arriving {
animation:akaV42ExclusiveCardArrival 1420ms cubic-bezier(.18,.82,.22,1) both;
}
#modalContent .aka-archive-file-card.is-exclusive-arriving .aka-exclusive-seal {
animation:akaV42ExclusiveSealAssemble 920ms cubic-bezier(.18,.86,.22,1) 180ms both;
}
#modalContent .aka-archive-file-card.is-exclusive-arriving .aka-exclusive-crystal :is(path,polyline,line,polygon),
#modalContent .aka-archive-file-card[data-file-type="exclusive"].is-exclusive-arriving .aka-exclusive-crystal :is(path,polyline,line,polygon) {
stroke-dasharray:48;
stroke-dashoffset:48;
animation:akaV42DiamondLineDraw 820ms cubic-bezier(.23,.86,.24,1) 260ms forwards;
}
#modalContent .aka-archive-file-card.is-exclusive-arriving .aka-exclusive-progression-action {
animation:akaV42GateControlArrival 330ms cubic-bezier(.22,1,.36,1) 980ms both;
}
@keyframes akaV42DiamondLineDraw {
0% { stroke-dashoffset:48;opacity:.08; }
58% { opacity:1; }
100% { stroke-dashoffset:0;opacity:.94; }
}
@keyframes akaV42GateControlArrival {
from { opacity:0;transform:translateY(11px); }
to { opacity:1;transform:none; }
}
@keyframes akaV42ExclusiveCardArrival {
0% { opacity:.28;transform:translateY(18px) scale(.965);border-color:rgba(var(--aka-exclusive-rgb),.18);box-shadow:0 0 0 1px transparent,inset 0 0 0 1px transparent; }
24% { opacity:1;transform:translateY(0) scale(1); }
48% { border-color:rgba(var(--aka-exclusive-rgb),.94);box-shadow:0 0 0 1px rgba(var(--aka-exclusive-rgb),.30),0 0 14px rgba(var(--aka-exclusive-rgb),.22),inset 0 0 10px rgba(var(--aka-exclusive-rgb),.07); }
70% { border-color:rgba(var(--aka-exclusive-rgb),.84);box-shadow:0 0 0 1px rgba(var(--aka-exclusive-rgb),.22),0 0 11px rgba(var(--aka-exclusive-rgb),.18),inset 0 0 8px rgba(var(--aka-exclusive-rgb),.055); }
100% { opacity:1;transform:none;border-color:rgba(var(--aka-exclusive-rgb),.68);box-shadow:0 0 0 1px rgba(var(--aka-exclusive-rgb),.17),0 0 9px rgba(var(--aka-exclusive-rgb),.18),inset 0 0 0 1px rgba(var(--aka-exclusive-rgb),.05); }
}
@keyframes akaV42ExclusiveSealAssemble {
0% { opacity:0;transform:translate(-50%,-50%) scale(.92); }
58% { opacity:1;transform:translate(-50%,-50%) scale(1.02); }
100% { opacity:1;transform:translate(-50%,-50%) scale(1); }
}
/* Gate success never opens the poster. Only UNSEAL starts this layer. */
.aka-exclusive-break-layer { opacity:0; }
.aka-exclusive-break-fragment {
position:absolute;
left:50%;
top:41%;
width:min(50%,6.6rem);
aspect-ratio:160/176;
border:1px solid rgba(255,226,162,.76);
background:linear-gradient(145deg,rgba(255,207,231,.50),rgba(var(--aka-exclusive-rgb),.30) 48%,rgba(80,7,45,.74));
clip-path:polygon(50% 0,100% 32%,50% 100%,0 32%);
box-shadow:0 0 11px rgba(var(--aka-exclusive-rgb),.32);
transform:translate(-50%,-50%);
--aka-break-x:0px;
--aka-break-y:0px;
--aka-break-r:0deg;
}
.aka-exclusive-break-fragment.is-one { --aka-break-x:-68px;--aka-break-y:-66px;--aka-break-r:-34deg;clip-path:polygon(50% 0,50% 50%,0 32%); }
.aka-exclusive-break-fragment.is-two { --aka-break-x:54px;--aka-break-y:-74px;--aka-break-r:42deg;clip-path:polygon(50% 0,100% 32%,50% 50%);background:linear-gradient(145deg,rgba(255,231,174,.48),rgba(var(--aka-exclusive-rgb),.26)); }
.aka-exclusive-break-fragment.is-three { --aka-break-x:-82px;--aka-break-y:6px;--aka-break-r:-58deg;clip-path:polygon(0 32%,50% 50%,50% 100%);background:linear-gradient(145deg,rgba(144,20,87,.72),rgba(var(--aka-exclusive-rgb),.35)); }
.aka-exclusive-break-fragment.is-four { --aka-break-x:78px;--aka-break-y:12px;--aka-break-r:64deg;clip-path:polygon(100% 32%,50% 50%,50% 100%);background:linear-gradient(145deg,rgba(var(--aka-exclusive-rgb),.42),rgba(62,5,36,.78)); }
.aka-exclusive-break-fragment.is-five { --aka-break-x:-42px;--aka-break-y:78px;--aka-break-r:-22deg;clip-path:polygon(50% 18%,76% 35%,50% 50%,24% 35%);background:rgba(255,222,237,.42); }
.aka-exclusive-break-fragment.is-six { --aka-break-x:44px;--aka-break-y:82px;--aka-break-r:28deg;clip-path:polygon(50% 50%,68% 59%,50% 100%,32% 59%);background:rgba(255,72,171,.38); }
.aka-exclusive-break-layer::before,
.aka-exclusive-break-layer::after {
content:"";
position:absolute;
left:50%;
top:42%;
background:rgba(255,177,223,.94);
opacity:0;
}
.aka-exclusive-break-layer::before { width:1px;height:58%;transform:translate(-50%,-50%); }
.aka-exclusive-break-layer::after { width:72%;height:1px;transform:translate(-50%,-50%); }
#modalContent .aka-archive-file-card.is-exclusive-unsealing .aka-exclusive-break-layer,
#modalContent .aka-archive-file-card[data-file-type="exclusive"].is-exclusive-unsealing .aka-exclusive-break-layer {
opacity:1;
animation:akaV42DiamondBreakFlash 940ms linear both;
}
#modalContent .aka-archive-file-card.is-exclusive-unsealing .aka-exclusive-break-fragment {
animation:akaV42DiamondFragmentDissolve 850ms cubic-bezier(.22,.74,.24,1) 70ms both;
}
#modalContent .aka-archive-file-card.is-exclusive-unsealing .aka-exclusive-break-layer::before,
#modalContent .aka-archive-file-card.is-exclusive-unsealing .aka-exclusive-break-layer::after {
animation:akaV42DiamondCrossFlash 410ms cubic-bezier(.2,.8,.2,1) 80ms both;
}
#modalContent .aka-archive-file-card.is-exclusive-unsealing .aka-exclusive-seal,
#modalContent .aka-archive-file-card.is-exclusive-unsealing .aka-archive-recovered-badge {
opacity:0;
}
#modalContent .aka-archive-file-card.is-exclusive-unsealing img.aka-archive-poster-preview,
#modalContent .aka-archive-file-card.is-exclusive-unsealing img.aka-archive-revealed-poster {
animation:akaV42ExclusivePosterReveal 870ms cubic-bezier(.22,1,.36,1) 90ms both;
}
#modalContent .aka-archive-file-card.is-exclusive-unsealing .aka-exclusive-progression-action {
animation:akaV42GateControlArrival 280ms cubic-bezier(.22,1,.36,1) 760ms both;
}
@keyframes akaV42DiamondFragmentDissolve {
0% { opacity:.98;transform:translate(-50%,-50%) rotate(0) scale(1); }
34% { opacity:1; }
100% { opacity:0;transform:translate(calc(-50% + var(--aka-break-x)),calc(-50% + var(--aka-break-y))) rotate(var(--aka-break-r)) scale(.24); }
}
@keyframes akaV42DiamondBreakFlash {
0%,100% { opacity:0; }
12%,58% { opacity:1; }
}
@keyframes akaV42DiamondCrossFlash {
0% { opacity:0;scale:.08 1; }
38% { opacity:.94; }
100% { opacity:0;scale:1 1; }
}
@keyframes akaV42ExclusivePosterReveal {
0% { opacity:.06;transform:scale(1.028);filter:saturate(.38) brightness(.45); }
52% { opacity:.72;filter:saturate(.86) brightness(.82); }
to { opacity:1;transform:none; }
}
/* ========================================================================== */
/* SECRET UNSEAL — PROJECTOR / SHUTTER */
/* ========================================================================== */
.aka-secret-unseal-layer {
opacity:0;
background:rgba(0,7,11,.24);
}
.aka-secret-unseal-layer::before,
.aka-secret-unseal-layer::after {
content:"";
position:absolute;
z-index:2;
left:0;
width:100%;
height:50.5%;
border-color:rgba(111,218,244,.54);
background:
repeating-linear-gradient(0deg,rgba(4,15,21,.98) 0 5px,rgba(8,25,33,.98) 5px 6px);
}
.aka-secret-unseal-layer::before {
top:0;
border-bottom:1px solid rgba(111,218,244,.54);
}
.aka-secret-unseal-layer::after {
bottom:0;
border-top:1px solid rgba(111,218,244,.54);
}
.aka-secret-projector-line {
position:absolute;
z-index:4;
left:0;
top:0;
width:100%;
height:2px;
background:linear-gradient(90deg,transparent,rgba(168,239,255,.96) 18% 82%,transparent);
opacity:0;
}
#modalContent .aka-archive-file-card.is-secret-unsealing .aka-secret-unseal-layer,
#modalContent .aka-archive-file-card.is-classified.is-secret-unsealing .aka-secret-unseal-layer {
opacity:1;
animation:akaV42SecretLayerOut 760ms linear both;
}
#modalContent .aka-archive-file-card.is-secret-unsealing .aka-secret-unseal-layer::before { animation:akaV42SecretShutterTop 680ms cubic-bezier(.22,1,.36,1) 90ms both; }
#modalContent .aka-archive-file-card.is-secret-unsealing .aka-secret-unseal-layer::after { animation:akaV42SecretShutterBottom 680ms cubic-bezier(.22,1,.36,1) 90ms both; }
#modalContent .aka-archive-file-card.is-secret-unsealing .aka-secret-projector-line { animation:akaV42SecretProjectorSweep 540ms cubic-bezier(.22,.7,.28,1) 40ms both; }
@keyframes akaV42SecretShutterTop {
0%,20% { transform:translateY(0); }
100% { transform:translateY(-102%); }
}
@keyframes akaV42SecretShutterBottom {
0%,20% { transform:translateY(0); }
100% { transform:translateY(102%); }
}
@keyframes akaV42SecretProjectorSweep {
0% { top:0;opacity:0; }
12%,76% { opacity:.96; }
100% { top:100%;opacity:0; }
}
@keyframes akaV42SecretLayerOut {
0%,84% { opacity:1; }
100% { opacity:0; }
}
/* ========================================================================== */
/* POSTER REVEAL RHYTHM */
/* One initial UNSEAL composition: poster, progression control, DOWNLOAD and */
/* every already-authored side icon share the exact same start and duration. */
/* Later MAG materialisation remains a short, separate 1–3 icon event. */
/* ========================================================================== */
#modalContent .aka-archive-file-card.is-initial-reveal {
--aka-unseal-composition-duration:940ms;
--aka-unseal-composition-ease:cubic-bezier(.22,1,.36,1);
}
#modalContent .aka-archive-file-card.is-unseal-priming
.aka-archive-film-reel .aka-reel-aperture {
transform-box:view-box;
transform-origin:12px 12px;
animation:akaElmPosterReelUnseal 1200ms cubic-bezier(.24,.45,.40,1) both;
}
@keyframes akaElmPosterReelUnseal {
0% { transform:rotate(0deg); }
100% { transform:rotate(540deg); }
}
/* Local-demo developer console. It is never mounted in backend/production mode. */
.aka-dev-key-tools {
position:fixed;
left:.72rem;
bottom:.72rem;
z-index:12050;
font-family:"Special Elite",monospace;
}
.aka-dev-key-tools,
.aka-dev-key-tools * { box-sizing:border-box; }
.aka-dev-key-toggle {
min-height:2.5rem;
min-width:3.5rem;
padding:.48rem .72rem;
color:rgba(170,224,255,.95);
border:1px solid rgba(74,168,255,.28);
border-radius:4px;
background:rgba(3,8,13,.92);
box-shadow:0 10px 28px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,255,255,.035);
font-family:inherit;
font-size:.70rem;
letter-spacing:.15em;
cursor:pointer;
}
.aka-dev-key-tools.is-open .aka-dev-key-toggle { display:none; }
.aka-dev-key-panel {
display:flex;
flex-direction:column;
width:min(42rem,calc(100vw - 1.44rem));
max-height:calc(100vh - 1.5rem);
max-height:calc(100dvh - 1.5rem);
overflow:hidden;
color:rgba(225,235,242,.90);
border:1px solid rgba(74,168,255,.28);
border-radius:6px;
background:linear-gradient(180deg,rgba(8,17,24,.98),rgba(3,7,11,.98));
box-shadow:0 24px 64px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,255,255,.04);
font-size:.74rem;
line-height:1.45;
isolation:isolate;
}
.aka-dev-key-panel[hidden],
.aka-dev-key-panel [hidden] { display:none !important; }
.aka-dev-key-head {
display:flex;
align-items:flex-start;
justify-content:space-between;
flex:none;
position:sticky;
top:0;
z-index:2;
gap:.75rem;
padding:.85rem .9rem .72rem;
border-bottom:1px solid rgba(74,168,255,.15);
background:#081118;
}
.aka-dev-key-head div { display:grid;gap:.2rem;min-width:0; }
.aka-dev-key-head span { color:#89b7d3;font-size:.60rem;letter-spacing:.16em; }
.aka-dev-key-head strong { color:#e5f0f7;font-size:.87rem;letter-spacing:.16em; }
.aka-dev-key-panel button,
.aka-dev-key-panel select {
min-height:36px;
max-width:100%;
padding:.42rem .62rem;
color:#dceaf3;
border:1px solid rgba(74,168,255,.24);
border-radius:3px;
background:rgba(74,168,255,.045);
font-family:inherit;
font-size:.66rem;
line-height:1.35;
letter-spacing:.045em;
}
.aka-dev-key-panel button { cursor:pointer; }
.aka-dev-key-panel button:not(:disabled):hover {
color:#f3f9ff;
border-color:rgba(74,168,255,.62);
background:rgba(74,168,255,.12);
}
.aka-dev-key-panel button:disabled { opacity:.45;cursor:not-allowed; }
.aka-dev-key-toggle:focus-visible,
.aka-dev-key-panel button:focus-visible,
.aka-dev-key-panel select:focus-visible,
.aka-dev-key-panel input:focus-visible {
outline:2px solid #81c9ff;
outline-offset:3px;
}
.aka-dev-key-panel .aka-dev-key-head button {
width:36px;
height:36px;
flex:none;
padding:0;
color:#b8cbd8;
font-size:1.15rem;
}
.elm-dev-tabs {
display:grid;
grid-template-columns:repeat(5,minmax(0,1fr));
flex:none;
position:sticky;
top:0;
z-index:1;
gap:.25rem;
padding:.55rem .7rem;
border-bottom:1px solid rgba(74,168,255,.15);
background:#071018;
}
.aka-dev-key-panel .elm-dev-tabs > button {
padding:.42rem .2rem;
font-size:.66rem;
letter-spacing:0;
overflow-wrap:anywhere;
border-color:transparent;
background:transparent;
}
.aka-dev-key-panel .elm-dev-tabs > button[aria-selected="true"] {
color:#e8f5ff;
border-color:rgba(74,168,255,.42);
background:rgba(74,168,255,.14);
box-shadow:inset 0 -2px 0 rgba(74,168,255,.75);
}
.elm-dev-body {
min-height:0;
overflow:auto;
overscroll-behavior:contain;
scrollbar-width:thin;
scrollbar-color:#29475c #071018;
padding:.75rem .9rem;
}
.elm-dev-section { min-width:0; }
.elm-dev-section h3 {
margin:1rem 0 .5rem;
color:#c7e3f5;
font-size:.74rem;
letter-spacing:.10em;
}
.elm-dev-section h3:first-child { margin-top:0; }
.elm-dev-note,
.aka-dev-key-panel > p {
margin:0 0 .75rem;
color:#9bafbc;
font-size:.69rem;
line-height:1.55;
overflow-wrap:anywhere;
}
.elm-dev-row {
display:flex;
align-items:center;
justify-content:space-between;
gap:.7rem;
min-width:0;
padding:.65rem 0;
border-bottom:1px solid rgba(74,168,255,.11);
}
.elm-dev-label { display:grid;gap:.2rem;min-width:0; }
.elm-dev-label > span { color:#d8e8f4;font-size:.73rem;letter-spacing:.07em; }
.elm-dev-label > small { color:#9caebb;font-size:.65rem;line-height:1.45; }
.elm-dev-label span,
.elm-dev-label small { overflow-wrap:anywhere; }
.elm-dev-state { color:#a4bfd0;font-size:.62rem;letter-spacing:.07em; }
.elm-dev-state[data-state="open"] { color:#83dba4; }
.elm-dev-state[data-state="locked"] { color:#e6a19e; }
.elm-dev-state[data-state="normal"] { color:#9ecbec; }
[data-dev-question-state][data-state="on"] { color:#83dba4; }
[data-dev-question-state][data-state="off"] { color:#f0b574; }
.elm-dev-actions,
.elm-dev-wide-actions {
display:flex;
flex-wrap:wrap;
align-items:center;
gap:.35rem;
min-width:0;
}
.elm-dev-actions { justify-content:flex-end;flex:none; }
.elm-dev-wide-actions { margin:.7rem 0; }
.elm-dev-wide-actions > button { flex:1 1 9rem; }
.elm-dev-grid {
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:.5rem;
}
.elm-dev-grid > * { min-width:0; }
.elm-dev-grid > button { overflow-wrap:anywhere; }
.elm-dev-select { display:block;width:100%;margin:.4rem 0 .7rem;color-scheme:dark; }
.elm-dev-select option { color:#dceaf3;background:#0a1620; }
.elm-dev-milestone {
display:flex;
align-items:flex-start;
gap:.65rem;
min-height:40px;
margin:.2rem 0;
padding:.55rem 0;
border-bottom:1px solid rgba(74,168,255,.11);
}
.elm-dev-milestone input[type="checkbox"] {
flex:none;
width:18px;
height:18px;
margin:.1rem 0 0;
accent-color:#5baff1;
cursor:pointer;
}
.elm-dev-milestone label { flex:1;min-width:0;cursor:pointer;overflow-wrap:anywhere; }
.elm-dev-milestone small { display:block;color:#9caebb;font-size:.65rem; }
.aka-dev-key-panel button.elm-dev-danger,
.aka-dev-key-panel .elm-dev-danger button {
color:#efb4ba;
border-color:rgba(230,94,110,.36);
background:rgba(230,94,110,.065);
}
.aka-dev-key-panel button.elm-dev-danger:not(:disabled):hover,
.aka-dev-key-panel .elm-dev-danger button:not(:disabled):hover {
color:#ffe0e3;
border-color:rgba(230,94,110,.70);
background:rgba(230,94,110,.15);
}
.aka-dev-key-panel button.is-selected {
color:#effff4;
border-color:rgba(74,222,128,.52);
background:rgba(74,222,128,.13);
box-shadow:inset 0 0 0 1px rgba(74,222,128,.08);
}
.aka-dev-key-panel [data-dev-questions="off"].is-selected {
color:#fff3e1;
border-color:rgba(240,181,116,.58);
background:rgba(240,181,116,.14);
box-shadow:inset 0 0 0 1px rgba(240,181,116,.08);
}
.elm-dev-confirm {
margin:.7rem 0;
padding:.8rem;
color:#f0c3c8;
border:1px solid rgba(230,94,110,.35);
border-radius:4px;
background:rgba(230,94,110,.065);
}
.elm-dev-confirm p { margin:0 0 .65rem;overflow-wrap:anywhere; }
.elm-dev-report { margin:.65rem 0;font-size:.69rem; }
dl.elm-dev-report,
.elm-dev-report dl {
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr);
gap:.35rem .7rem;
}
.elm-dev-report dt { color:#9eb5c4; }
.elm-dev-report dd { margin:0;color:#deedf6;text-align:right;overflow-wrap:anywhere; }
.elm-dev-report table,
table.elm-dev-report { width:100%;border-collapse:collapse;table-layout:fixed; }
.elm-dev-report th,
.elm-dev-report td { padding:.45rem .3rem;text-align:left;border-bottom:1px solid rgba(74,168,255,.11);overflow-wrap:anywhere; }
.elm-dev-report th { color:#a8c3d5;font-weight:normal; }
.elm-dev-status {
flex:none;
margin:0;
min-height:2.65rem;
padding:.7rem .9rem;
border-top:1px solid rgba(74,168,255,.15);
background:#071018;
color:#a9c6d9;
font-size:.68rem;
line-height:1.5;
overflow-wrap:anywhere;
}
.aka-dev-key-grid {
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:.42rem;
}
.aka-dev-key-panel .aka-dev-key-grid > button,
.aka-dev-key-panel .aka-dev-key-all {
position:relative;
min-height:3.05rem;
display:grid;
align-content:center;
justify-items:start;
gap:.18rem;
padding:.55rem 2.35rem .55rem .62rem;
text-align:left;
border:1px solid rgba(74,168,255,.18);
border-radius:3px;
background:rgba(74,168,255,.035);
}
.aka-dev-key-grid span,
.aka-dev-key-all span { color:#e7f0f6;font-size:.70rem;letter-spacing:.10em; }
.aka-dev-key-grid small { color:#9bb3c2;font-size:.60rem;letter-spacing:.05em; }
.aka-dev-key-grid b,
.aka-dev-key-all b {
position:absolute;
right:.55rem;
top:50%;
transform:translateY(-50%);
color:#83c5f7;
font-size:.56rem;
letter-spacing:.08em;
}
.aka-dev-key-grid > button.is-working,
.aka-dev-key-all.is-working { opacity:.58;pointer-events:none; }
.aka-dev-key-panel .aka-dev-key-grid > button.is-complete,
.aka-dev-key-panel .aka-dev-key-all.is-complete { border-color:rgba(74,222,128,.28);background:rgba(74,222,128,.04); }
.aka-dev-key-panel .aka-dev-key-grid > button.is-prepared,
.aka-dev-key-panel .aka-dev-key-all.is-prepared { border-color:rgba(74,222,128,.52);background:rgba(74,222,128,.09); }
.aka-dev-key-grid > button.is-complete b,
.aka-dev-key-all.is-complete b { color:rgba(101,246,142,.78); }
.aka-dev-key-panel .aka-dev-key-all { width:100%;margin-top:.46rem;min-height:2.72rem;border-color:rgba(255,45,85,.26);background:rgba(255,45,85,.045); }
@media (max-width:520px) {
.aka-dev-key-tools { left:.5rem;bottom:.5rem; }
.aka-dev-key-panel { width:calc(100vw - 1rem);max-height:calc(100vh - 1.5rem);max-height:calc(100dvh - 1.5rem); }
.aka-dev-key-head { padding:.7rem; }
.elm-dev-tabs { padding:.4rem;gap:.1rem; }
.aka-dev-key-panel .elm-dev-tabs > button { font-size:.63rem; }
.elm-dev-body { padding:.6rem .7rem; }
.elm-dev-row { flex-direction:column;align-items:stretch;gap:.45rem; }
.elm-dev-actions { justify-content:flex-start; }
.elm-dev-actions > button { flex:1 1 auto; }
.aka-dev-key-panel button,
.aka-dev-key-panel select { min-height:40px; }
.elm-dev-status { padding:.6rem .7rem;font-size:.65rem; }
.aka-dev-key-grid span { font-size:.66rem; }
.aka-dev-key-grid small { font-size:.57rem; }
}
@media (prefers-reduced-motion:reduce) {
#modalContent .aka-archive-file-card.is-unseal-priming
.aka-archive-film-reel .aka-reel-aperture { animation:none !important; }
}
#modalContent .aka-archive-file-card.is-inspected.is-inspect-transitioning.is-initial-reveal:not(.is-recovered)
img.aka-archive-revealed-poster {
opacity:.10 !important;
filter:brightness(.52) saturate(.72) contrast(.96) !important;
animation:none !important;
transition:
opacity var(--aka-unseal-composition-duration) var(--aka-unseal-composition-ease),
filter var(--aka-unseal-composition-duration) var(--aka-unseal-composition-ease) !important;
}
#modalContent .aka-archive-file-card.is-initial-reveal .aka-archive-download-btn,
#modalContent .aka-archive-file-card.is-initial-reveal .aka-archive-owned-seal,
#modalContent .aka-archive-file-card.is-initial-reveal .aka-archive-progression-action,
#modalContent .aka-archive-file-card.is-initial-reveal .aka-archive-task-icons > .aka-archive-task-icon {
opacity:0 !important;
transform:none !important;
animation:none !important;
transition:opacity var(--aka-unseal-composition-duration) var(--aka-unseal-composition-ease) !important;
}
#modalContent .aka-archive-file-card.is-inspected.is-inspect-transitioning.is-initial-reveal.is-inspect-revealing:not(.is-recovered)
img.aka-archive-revealed-poster {
opacity:1 !important;
filter:none !important;
}
#modalContent .aka-archive-file-card.is-initial-reveal.is-inspect-revealing .aka-archive-download-btn,
#modalContent .aka-archive-file-card.is-initial-reveal.is-inspect-revealing .aka-archive-owned-seal,
#modalContent .aka-archive-file-card.is-initial-reveal.is-inspect-revealing .aka-archive-progression-action,
#modalContent .aka-archive-file-card.is-initial-reveal.is-inspect-revealing .aka-archive-task-icons > .aka-archive-task-icon {
opacity:1 !important;
}
#modalContent .aka-archive-task-icon.is-materializing {
--aka-materialize-index:0;
animation:akaV42SideMaterialize 220ms cubic-bezier(.22,1,.36,1) calc(var(--aka-materialize-index) * 54ms) both !important;
}
#modalContent .aka-archive-task-icons > .aka-archive-task-icon.is-materializing:nth-child(2) { --aka-materialize-index:1; }
#modalContent .aka-archive-task-icons > .aka-archive-task-icon.is-materializing:nth-child(3) { --aka-materialize-index:2; }
@keyframes akaV42SideMaterialize {
0% { opacity:0;transform:translateX(5px) scale(.86); }
62% { opacity:1;transform:translateX(-1px) scale(1.025); }
100% { opacity:1;transform:none; }
}
/* ========================================================================== */
/* RESPONSIVE */
/* ========================================================================== */
@media (max-width:768px) {
.aka-mobile-identity-panel { position:relative;isolation:isolate; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer {
grid-template-columns:4.42rem minmax(0,1fr) 4.42rem;
gap:.18rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-icon {
width:2.02rem;
min-width:2.02rem;
height:2.02rem;
min-height:2.02rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-inline-gallery { padding:.46rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-inline-rail {
padding:.50rem .26rem .18rem;
scrollbar-width:none;
-webkit-overflow-scrolling:touch;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-inline-rail::-webkit-scrollbar { display:none; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-inline-entry {
width:4.16rem;
min-width:4.16rem;
height:6.24rem;
min-height:6.24rem;
flex-basis:4.16rem;
}
.aka-wallet-gallery-preview-host.is-mobile {
right:.62rem;
left:.62rem;
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-poster-card {
top:.50rem;
height:calc(100% - 3.25rem);
max-width:calc(100% - 2.75rem);
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-gallery-step { display:none; }
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-preview-footer {
right:.34rem;
bottom:.30rem;
left:.34rem;
grid-template-columns:minmax(0,1fr) 1.92rem;
gap:.34rem;
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-stage-close {
top:.50rem;
right:.50rem;
}
.aka-exclusive-seal { top:40%;width:min(64%,6.8rem); }
.aka-exclusive-seal-aura { width:112%; }
.aka-exclusive-gate-badge {
top:.48rem;
right:.48rem;
min-height:1.26rem;
max-width:calc(50% - .66rem);
padding:.29rem .42rem .25rem;
font-size:.51rem;
letter-spacing:.06em;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-archive-file-id-badge.is-classified span,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-archive-file-id-badge.is-classified span {
font-size:.56rem !important;
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action,
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action span,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action span {
font-size:.56rem !important;
letter-spacing:.09em !important;
}
.aka-archive-special-hint-card.is-reel-signal .aka-archive-question-kicker {
font-size:.76rem;
}
.aka-archive-special-hint-card.is-reel-signal .aka-archive-special-hint-body,
#cinematicModal > .aka-archive-activity-flyout.is-mobile-console .aka-archive-special-hint-card.is-reel-signal .aka-archive-special-hint-body {
font-size:.84rem !important;
line-height:1.55;
}
.aka-archive-special-hint-card.is-reel-signal .aka-archive-special-hint-note {
font-size:.59rem;
}
.aka-reel-glyph.aka-archive-film-reel { width:3.50rem;height:3.50rem; }
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"] > .aka-reel-glyph { width:1.76rem;height:1.76rem; }
}
@media (max-width:360px) {
.aka-wallet-signal-drawer.is-mobile .aka-wallet-inline-entry { width:4.16rem;min-width:4.16rem;height:6.24rem;min-height:6.24rem;flex-basis:4.16rem; }
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-preview-footer { grid-template-columns:minmax(0,1fr) 1.92rem;gap:.30rem; }
.aka-wallet-diamond-summary { gap:.18rem; }
.aka-wallet-diamond-stat { padding-inline:.30rem; }
.aka-wallet-diamond-stat-icon {
width:.94rem;
height:.94rem;
flex-basis:.94rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer { grid-template-columns:4.28rem minmax(0,1fr) 4.28rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-command { gap:.24rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-icon { width:1.92rem;min-width:1.92rem;height:1.92rem;min-height:1.92rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-label { font-size:.51rem;letter-spacing:.045em; }
}
@media (min-width:768px) and (max-width:768px) {
#navbar .hidden.md\:flex { display:none !important; }
#mobileMenuBtn.md\:hidden { display:block !important; }
#mobileMenu.md\:hidden:not(.hidden) { display:block !important; }
}
/* ========================================================================== */
/* V0.42.13 PREMIUM COLLECTIBLES — FIXED WALLET, STABLE MINIATURES */
/* Miniatures keep one scale and fill from left to right. The shelf moves in */
/* deliberate snapped steps; only the opened poster owns the cinematic light. */
/* ========================================================================== */
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-heading.is-collection {
align-items:center;
justify-content:flex-start;
pointer-events:none;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-gallery-back {
pointer-events:auto;
border-color:rgba(var(--aka-gallery-gold),.34);
background:linear-gradient(180deg,rgba(var(--aka-gallery-gold),.075),rgba(3,3,3,.91));
box-shadow:0 0 0 1px rgba(0,0,0,.72),inset 0 0 7px rgba(var(--aka-gallery-gold),.025);
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-rail {
justify-content:flex-start;
border-top:0;
border-bottom:0;
background:
linear-gradient(90deg,rgba(var(--aka-gallery-gold),.055),transparent 1.05rem),
radial-gradient(ellipse at 46% 52%,rgba(var(--aka-gallery-gold),.024),transparent 68%);
}
.aka-wallet-gallery-collection::after {
content:"";
position:absolute;
z-index:2;
top:0;
right:0;
bottom:0;
width:.72rem;
pointer-events:none;
background:linear-gradient(90deg,transparent,rgba(3,5,5,.88));
opacity:.76;
}
/* One centred hierarchy for player rank and Private Collection context. */
.aka-wallet-title-section.aka-wallet-context-crossfade {
text-align:center;
}
.aka-wallet-title-section.aka-wallet-context-crossfade
:is(.aka-wallet-dropdown-label,.aka-wallet-dropdown-title) {
width:100%;
box-sizing:border-box;
text-align:center;
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider),
#mobileWalletConnectBtn.is-connected
.aka-wallet-copy.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
position:relative;
display:flex !important;
align-items:center;
justify-content:center;
gap:.38rem;
padding-inline:.34rem;
font-family:'Bebas Neue','Arial Narrow',Impact,sans-serif !important;
font-size:1.04rem !important;
font-weight:400 !important;
font-synthesis:none;
line-height:1.06;
letter-spacing:.10em !important;
white-space:nowrap;
background:none !important;
text-rendering:geometricPrecision;
text-shadow:
0 1px 0 rgba(0,0,0,.98),
0 -1px 0 rgba(255,244,205,.075),
0 0 7px color-mix(in srgb,var(--aka-identity-title-color,rgba(255,232,162,.96)) 14%,transparent) !important;
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider)::before,
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider)::after,
#mobileWalletConnectBtn.is-connected
.aka-wallet-copy.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::before,
#mobileWalletConnectBtn.is-connected
.aka-wallet-copy.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::after {
content:"";
display:block;
width:.90rem;
min-width:.90rem;
height:7px;
flex:0 0 .90rem;
background:
linear-gradient(90deg,transparent,var(--aka-wallet-retro-line,rgba(212,168,67,.66))) top right / 100% 1px no-repeat,
linear-gradient(90deg,transparent 8%,var(--aka-wallet-retro-line,rgba(212,168,67,.66))) center right / 74% 1px no-repeat,
linear-gradient(90deg,transparent 16%,var(--aka-wallet-retro-line,rgba(212,168,67,.66))) bottom right / 46% 1px no-repeat;
filter:
drop-shadow(0 1px 0 rgba(0,0,0,.90))
drop-shadow(0 0 3px color-mix(in srgb,var(--aka-identity-title-color,rgba(255,232,162,.96)) 18%,transparent));
opacity:.94;
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider)::after,
#mobileWalletConnectBtn.is-connected
.aka-wallet-copy.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::after {
transform:scaleX(-1);
}
.aka-wallet-title-section.aka-wallet-context-crossfade.is-gallery-context
.aka-wallet-dropdown-label {
color:rgba(212,168,67,.70) !important;
overflow:visible;
padding-top:.05rem;
font:600 .48rem/1.24 "Special Elite",monospace;
letter-spacing:.24em !important;
}
.aka-wallet-title-section.aka-wallet-context-crossfade.is-gallery-context
.aka-wallet-dropdown-title {
color:rgba(246,237,218,.92) !important;
font-family:'Bebas Neue','Arial Narrow',sans-serif !important;
font-size:.84rem !important;
letter-spacing:.09em !important;
text-align:center;
}
.aka-wallet-title-section.aka-wallet-context-crossfade.is-poster-context
.aka-wallet-dropdown-label {
display:none !important;
}
.aka-wallet-title-section.aka-wallet-context-crossfade.is-poster-context {
display:flex;
min-height:2.46rem;
box-sizing:border-box;
align-items:center;
justify-content:center;
}
.aka-wallet-title-section.aka-wallet-context-crossfade.is-poster-context
.aka-wallet-dropdown-title {
margin:0;
font-size:.76rem !important;
line-height:1.10;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context {
text-align:center;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context
:is(#mobileWalletStatusTitle,#mobileWalletIdentityStatus) {
width:100%;
text-align:center;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context
#mobileWalletStatusTitle {
overflow:visible;
padding-top:.04rem;
line-height:1.22;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-poster-context
#mobileWalletStatusTitle {
display:none !important;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-poster-context
#mobileWalletIdentityStatus {
margin:0;
line-height:1.16;
}
/* On mobile the wallet glyph owns the left side of the control. Reserve the
same breathing room on the right so collection titles centre on the whole
wallet face instead of the leftover text column. */
@media (max-width:768px) {
#mobileWalletConnectBtn {
position:relative;
}
#mobileWalletConnectBtn .aka-wallet-copy.aka-wallet-context-crossfade.is-gallery-context {
position:absolute;
top:50%;
right:3.85rem;
left:3.85rem;
width:auto;
max-width:none;
pointer-events:none;
transform:translateY(-50%);
}
}
.aka-wallet-gallery-preview-host .aka-wallet-inline-preview-footer {
right:.18rem;
bottom:.14rem;
left:auto;
display:block;
width:1.30rem;
height:1.30rem;
pointer-events:none;
}
.aka-wallet-gallery-preview-host .aka-wallet-inline-download {
width:1.30rem;
min-width:1.30rem;
height:1.30rem;
min-height:1.30rem;
border-color:rgba(var(--aka-gallery-gold),.28);
border-radius:3px;
box-shadow:0 4px 10px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,244,214,.022);
pointer-events:auto;
}
.aka-wallet-gallery-preview-host .aka-wallet-inline-download svg {
width:.72rem;
height:.72rem;
stroke-width:1.8;
}
/* The mounted poster leaves a deliberate control gutter below the card. */
.aka-wallet-gallery-preview-host .aka-wallet-inline-poster-card {
top:.18rem;
height:calc(100% - 2.48rem);
max-width:calc(100% - 2.30rem);
}
.aka-wallet-gallery-preview-host .aka-wallet-inline-stage.has-navigation
.aka-wallet-inline-poster-card {
max-width:calc(100% - 4.30rem);
}
/* The opened collectible owns the cinematic reward: one perimeter ray and a */
/* restrained class-coloured side light. The artwork itself never shimmers. */
.aka-wallet-gallery-preview-host .aka-wallet-inline-stage::before {
inset:1% 12% 2%;
border-radius:48%;
background:
radial-gradient(ellipse at 50% 48%,rgba(var(--aka-gallery-stage-rgb),.058) 0,rgba(var(--aka-gallery-stage-rgb),.020) 43%,transparent 72%),
radial-gradient(ellipse at 18% 52%,rgba(var(--aka-gallery-stage-rgb),.032),transparent 42%),
radial-gradient(ellipse at 82% 52%,rgba(var(--aka-gallery-stage-rgb),.032),transparent 42%);
opacity:.92;
}
.aka-wallet-gallery-preview-host .aka-wallet-inline-stage.is-visible
.aka-wallet-inline-poster-card {
opacity:1;
transform:translateX(-50%);
}
.aka-wallet-gallery-preview-host .aka-wallet-inline-stage.is-visible.is-effect-entering
.aka-wallet-inline-poster-card {
animation:akaWalletPosterCardReveal 520ms cubic-bezier(.16,1,.30,1) both;
}
.aka-wallet-gallery-preview-host .aka-wallet-inline-stage.is-visible.is-effect-entering
.aka-wallet-card-face.is-front::before {
animation:akaWalletGalleryPerimeterRun 1050ms cubic-bezier(.22,.72,.24,1) 150ms both;
}
@property --aka-gallery-perimeter-angle {
syntax:"";
inherits:false;
initial-value:0deg;
}
@keyframes akaWalletGalleryPerimeterRun {
0% { --aka-gallery-perimeter-angle:0deg;opacity:.06; }
42% { opacity:.58; }
100% { --aka-gallery-perimeter-angle:380deg;opacity:0; }
}
@keyframes akaWalletPosterCardReveal {
from {
opacity:0;
transform:translateX(-50%) translateY(8px) rotateX(-3deg) scale(.985);
}
to {
opacity:1;
transform:translateX(-50%) translateY(0) rotateX(0) scale(1);
}
}
/* MAG / BONUS / SECRET TRACK now use the same command grammar as DIA and KEY: */
/* 1.78rem radar face, visible label, .34rem gap and a 2.75rem touch row. */
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-drawer-footer {
grid-template-columns:4.70rem minmax(0,1fr) 4.70rem;
gap:.30rem;
}
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-command {
position:relative;
display:inline-flex;
min-width:0;
min-height:2.75rem;
align-items:center;
justify-self:start;
gap:.34rem;
padding:0;
border:0;
background:none;
color:rgba(var(--aka-drawer-rgb),.76);
cursor:pointer;
}
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-command.is-disabled {
opacity:.34;
filter:saturate(.20) brightness(.72);
cursor:default;
}
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-face {
position:relative;
display:grid;
width:1.78rem;
min-width:1.78rem;
height:1.78rem;
min-height:1.78rem;
place-items:center;
box-sizing:border-box;
padding:.24rem;
border:1px solid rgba(var(--aka-drawer-rgb),.34);
border-radius:.32rem;
background:linear-gradient(180deg,rgba(var(--aka-drawer-rgb),.09),rgba(4,5,5,.92));
box-shadow:inset 0 0 8px rgba(var(--aka-drawer-rgb),.035);
transition:border-color .18s ease,box-shadow .18s ease,background .18s ease,transform .14s ease;
}
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-command-label {
color:rgba(var(--aka-drawer-rgb),.78);
font:600 .58rem/1 "Special Elite",monospace;
letter-spacing:.07em;
white-space:nowrap;
}
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key)
.aka-wallet-track-face .aka-wallet-track-signal {
width:1.18rem;
height:1.18rem;
}
@media (any-hover:hover) and (pointer:fine) {
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key)
.aka-wallet-track-command.is-ready:is(:hover,:focus-visible) .aka-wallet-track-face {
border-color:rgba(var(--aka-drawer-rgb),.72);
background:linear-gradient(180deg,rgba(var(--aka-drawer-rgb),.14),rgba(4,5,5,.94));
box-shadow:0 0 12px rgba(var(--aka-drawer-rgb),.18),inset 0 0 9px rgba(var(--aka-drawer-rgb),.06);
}
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-command:focus-visible {
outline:1px solid rgba(var(--aka-drawer-rgb),.62);
outline-offset:3px;
}
}
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key)
.aka-wallet-track-command.is-ready:active .aka-wallet-track-face {
transform:translateY(1px) scale(.98);
}
.aka-wallet-gallery-preview-host .aka-wallet-inline-download:active { transform:none; }
@media (max-width:768px) {
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-rail {
padding:.34rem .26rem .06rem 4.18rem;
padding-right:var(--aka-gallery-rail-end-space);
scroll-padding-inline:4.18rem .26rem;
scroll-padding-right:var(--aka-gallery-rail-end-space);
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-poster-card {
top:.18rem;
height:calc(100% - 2.68rem);
max-width:calc(100% - 2.30rem);
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-stage.has-navigation
.aka-wallet-inline-poster-card {
max-width:calc(100% - 4.30rem);
}
/* Both controls keep a 44px hit box while their visible face stays 1.30rem. */
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-preview-footer {
right:-.28rem;
bottom:-.28rem;
left:auto;
display:block;
width:2.75rem;
height:2.75rem;
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-download,
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-stage-close {
width:2.75rem;
min-width:2.75rem;
height:2.75rem;
min-height:2.75rem;
border:0;
background:transparent;
box-shadow:none;
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-stage-close {
top:-.28rem;
right:-.28rem;
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-download::before,
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-stage-close::before {
content:"";
position:absolute;
z-index:-1;
top:50%;
left:50%;
width:1.30rem;
height:1.30rem;
box-sizing:border-box;
border:1px solid rgba(var(--aka-gallery-gold),.28);
border-radius:3px;
background:rgba(5,4,3,.94);
box-shadow:0 4px 10px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,244,214,.022);
transform:translate(-50%,-50%);
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-download svg,
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-stage-close > span {
position:relative;
z-index:1;
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-download:focus-visible::before,
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-stage-close:focus-visible::before {
border-color:rgba(var(--aka-gallery-gold),.78);
box-shadow:
0 0 0 2px rgba(2,2,2,.96),
0 0 0 3px rgba(var(--aka-gallery-gold),.46),
0 0 12px rgba(var(--aka-gallery-gold),.18);
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-drawer-footer {
grid-template-columns:4.42rem minmax(0,1fr) 4.42rem;
gap:.18rem;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key)
.aka-wallet-track-face {
width:2.02rem;
min-width:2.02rem;
height:2.02rem;
min-height:2.02rem;
}
}
@media (max-width:360px) {
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-drawer-footer {
grid-template-columns:4.28rem minmax(0,1fr) 4.28rem;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-command {
gap:.24rem;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key)
.aka-wallet-track-face {
width:1.92rem;
min-width:1.92rem;
height:1.92rem;
min-height:1.92rem;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-track-command-label {
font-size:.51rem;
letter-spacing:.045em;
}
}
/* ========================================================================== */
/* V0.42.13 PREMIUM COLLECTIBLES — CLEAN SHELF + DETERMINISTIC 3D CARD */
/* ========================================================================== */
/* The Wallet geometry is frozen. Premium depth is built inside that space. */
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-gallery-collection {
isolation:isolate;
border-radius:5px;
background:
linear-gradient(180deg,rgba(255,246,219,.018),transparent 22% 76%,rgba(0,0,0,.32)),
radial-gradient(ellipse at 52% 58%,rgba(var(--aka-gallery-gold),.035),transparent 66%);
box-shadow:
inset 0 1px 0 rgba(var(--aka-gallery-gold),.10),
inset 0 -1px 0 rgba(var(--aka-gallery-gold),.13),
inset 0 -12px 20px rgba(0,0,0,.22);
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-gallery-collection::before {
content:"";
position:absolute;
z-index:0;
right:.34rem;
bottom:.04rem;
left:4.16rem;
height:1px;
border-top:1px solid rgba(var(--aka-gallery-gold),.20);
background:none;
box-shadow:0 4px 9px rgba(0,0,0,.48),0 0 8px rgba(var(--aka-gallery-gold),.035);
pointer-events:none;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-rail {
position:relative;
z-index:1;
perspective:34rem;
perspective-origin:50% 44%;
}
/* Opened preview: one card object owns both inspection and face rotation.
JavaScript's single spring is the only transition owner. */
.aka-wallet-gallery-preview-host .aka-wallet-inline-stage {
perspective:58rem;
perspective-origin:50% 47%;
}
.aka-wallet-card-object {
--aka-card-rotate-x:0deg;
--aka-card-rotate-y:0deg;
--aka-card-thickness:3.5px;
--aka-card-half-thickness:1.75px;
position:absolute;
inset:0;
border-radius:5px;
cursor:grab;
touch-action:none;
transform:
rotateX(var(--aka-card-rotate-x))
rotateY(var(--aka-card-rotate-y));
transform-style:preserve-3d;
transition:none;
user-select:none;
will-change:transform;
-webkit-user-select:none;
}
.aka-wallet-card-object.is-dragging,
.aka-wallet-inline-poster-card.is-dragging .aka-wallet-card-object {
cursor:grabbing;
}
.aka-wallet-card-object.is-dragging { cursor:grabbing; }
.aka-wallet-card-object img {
pointer-events:none;
user-select:none;
-webkit-user-drag:none;
-webkit-user-select:none;
}
/* Four restrained graphite planes make the poster read as a physical card.
They react only to perspective; no shine or travelling highlight is used. */
.aka-wallet-card-edge {
position:absolute;
z-index:0;
display:block;
pointer-events:none;
background:linear-gradient(
90deg,
#050505,
#242424 var(--aka-card-edge-light-position,50%),
#070707
);
box-shadow:inset 0 0 0 1px rgba(255,255,255,.018);
backface-visibility:hidden;
-webkit-backface-visibility:hidden;
}
.aka-wallet-card-edge.is-left,
.aka-wallet-card-edge.is-right {
top:5px;
bottom:5px;
width:var(--aka-card-thickness);
}
.aka-wallet-card-edge.is-left {
left:0;
transform:translateZ(calc(0px - var(--aka-card-half-thickness))) rotateY(-90deg);
transform-origin:left center;
}
.aka-wallet-card-edge.is-right {
right:0;
transform:translateZ(calc(0px - var(--aka-card-half-thickness))) rotateY(90deg);
transform-origin:right center;
}
.aka-wallet-card-rotor {
position:absolute;
inset:0;
border-radius:inherit;
transform:none;
transform-style:preserve-3d;
transition:none;
}
.aka-wallet-card-edge.is-top,
.aka-wallet-card-edge.is-bottom {
right:5px;
left:5px;
height:var(--aka-card-thickness);
background:linear-gradient(
90deg,
#050505,
#242424 var(--aka-card-edge-light-position,50%),
#070707
);
}
.aka-wallet-card-edge.is-top {
top:0;
transform:translateZ(calc(0px - var(--aka-card-half-thickness))) rotateX(90deg);
transform-origin:center top;
}
.aka-wallet-card-edge.is-bottom {
bottom:0;
transform:translateZ(calc(0px - var(--aka-card-half-thickness))) rotateX(-90deg);
transform-origin:center bottom;
}
.aka-wallet-card-face {
position:absolute;
inset:0;
overflow:hidden;
box-sizing:border-box;
border:1px solid rgba(var(--aka-gallery-stage-rgb),.40);
border-radius:4px;
backface-visibility:hidden;
-webkit-backface-visibility:hidden;
}
.aka-wallet-card-face.is-front {
z-index:2;
background:#000;
box-shadow:
0 17px 20px rgba(0,0,0,.48),
0 0 5px rgba(var(--aka-gallery-stage-rgb),.08),
inset 0 0 0 1px rgba(255,247,226,.025);
transform:translateZ(var(--aka-card-half-thickness));
}
.aka-wallet-card-face.is-back {
z-index:1;
display:grid;
place-items:center;
border-color:rgba(119,124,128,.18);
background:
radial-gradient(ellipse at 44% 27%,rgba(255,255,255,.018),transparent 32%),
linear-gradient(145deg,#111214 0%,#070809 38%,#020303 72%,#0b0c0d 100%);
box-shadow:
inset 0 0 0 1px rgba(255,255,255,.025),
inset 0 0 0 4px rgba(0,0,0,.70),
inset 0 0 28px rgba(0,0,0,.82);
transform:rotateY(180deg) translateZ(var(--aka-card-half-thickness));
}
.aka-wallet-card-face.is-back > :not(.aka-wallet-card-back-emboss) {
display:none !important;
}
.aka-wallet-card-back-emboss {
position:relative;
display:flex;
width:78%;
min-height:34%;
align-items:center;
justify-content:center;
flex-direction:column;
color:#090a0b;
text-transform:uppercase;
transform:translateY(-2%);
user-select:none;
}
.aka-wallet-card-back-emboss::before,
.aka-wallet-card-back-emboss::after {
content:none;
display:none;
}
.aka-wallet-card-back-brand {
margin:0;
color:#111315;
background:linear-gradient(180deg,#4b4f53 0%,#17191b 24%,#030405 52%,#25282b 76%,#08090a 100%);
-webkit-background-clip:text;
background-clip:text;
-webkit-text-fill-color:transparent;
font:400 clamp(2.28rem,9.6vh,3.02rem)/.86 "Bebas Neue","Arial Narrow",Impact,sans-serif;
letter-spacing:.17em;
text-indent:.17em;
-webkit-text-stroke:.30px rgba(0,0,0,.96);
text-shadow:
-1px -1px 0 rgba(0,0,0,.96),
0 1px 0 rgba(255,255,255,.12),
0 3px 4px rgba(0,0,0,.88);
}
.aka-wallet-card-back-stars {
display:flex;
align-items:center;
justify-content:center;
gap:.28rem;
margin-top:.50rem;
color:#111315;
background:linear-gradient(180deg,#45494d,#08090a 55%,#272a2d);
-webkit-background-clip:text;
background-clip:text;
-webkit-text-fill-color:transparent;
font:400 clamp(.47rem,1.55vh,.62rem)/1 Georgia,serif;
letter-spacing:0;
-webkit-text-stroke:.18px rgba(0,0,0,.96);
text-shadow:0 1px 0 rgba(255,255,255,.09),0 2px 3px rgba(0,0,0,.92);
}
.aka-wallet-card-back-stars > span:first-child,
.aka-wallet-card-back-stars > span:last-child {
transform:translateY(-.11rem);
}
.aka-wallet-card-back-stars > span:nth-child(2) {
transform:translateY(.08rem);
}
.aka-wallet-inline-preview-footer,
.aka-wallet-gallery-preview-host .aka-wallet-inline-preview-footer {
right:.18rem;
bottom:.12rem;
left:.18rem;
display:grid;
grid-template-columns:1.30rem 1.30rem 1.30rem;
width:auto;
height:1.30rem;
align-items:center;
justify-content:space-between;
column-gap:.48rem;
pointer-events:none;
}
.aka-wallet-inline-flip,
.aka-wallet-inline-reset {
position:relative;
z-index:1;
display:grid;
width:1.30rem;
min-width:1.30rem;
height:1.30rem;
min-height:1.30rem;
place-items:center;
box-sizing:border-box;
padding:0;
border:1px solid rgba(var(--aka-gallery-stage-rgb),.30);
border-radius:3px;
background:rgba(5,4,3,.95);
color:rgba(var(--aka-gallery-stage-rgb),.86);
box-shadow:0 4px 10px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,244,214,.022);
cursor:pointer;
pointer-events:auto;
transition:border-color 180ms ease,color 180ms ease,box-shadow 180ms ease,transform 160ms ease;
}
.aka-wallet-inline-flip { grid-column:1; }
.aka-wallet-inline-reset { grid-column:2;justify-self:center; }
.aka-wallet-gallery-preview-host .aka-wallet-inline-download { grid-column:3;justify-self:end; }
.aka-wallet-inline-flip svg,
.aka-wallet-inline-reset svg {
display:block;
width:.72rem;
height:.72rem;
fill:none;
stroke:currentColor;
stroke-linecap:round;
stroke-linejoin:round;
stroke-width:1.65;
}
.aka-wallet-inline-flip.is-active {
border-color:rgba(var(--aka-gallery-stage-rgb),.64);
color:rgb(var(--aka-gallery-stage-rgb));
box-shadow:0 0 10px rgba(var(--aka-gallery-stage-rgb),.14),inset 0 0 8px rgba(var(--aka-gallery-stage-rgb),.05);
}
.aka-wallet-inline-reset:disabled,
.aka-wallet-inline-reset[aria-disabled="true"] {
cursor:default;
opacity:.34;
pointer-events:none;
}
@media (any-hover:hover) and (pointer:fine) {
.aka-wallet-inline-flip:is(:hover,:focus-visible),
.aka-wallet-inline-reset:not(:disabled):is(:hover,:focus-visible) {
outline:none;
border-color:rgba(var(--aka-gallery-stage-rgb),.74);
color:rgb(var(--aka-gallery-stage-rgb));
box-shadow:0 0 11px rgba(var(--aka-gallery-stage-rgb),.16),inset 0 0 8px rgba(var(--aka-gallery-stage-rgb),.05);
}
}
.aka-wallet-inline-flip:active,
.aka-wallet-inline-reset:not(:disabled):active { transform:translateY(1px) scale(.98); }
@media (max-width:768px) {
.aka-wallet-card-object {
--aka-card-thickness:2.5px;
--aka-card-half-thickness:1.25px;
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-preview-footer {
right:-.28rem;
bottom:-.28rem;
left:-.28rem;
display:grid;
grid-template-columns:2.75rem 2.75rem 2.75rem;
width:auto;
height:2.75rem;
justify-content:space-between;
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-flip,
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-reset {
width:2.75rem;
min-width:2.75rem;
height:2.75rem;
min-height:2.75rem;
border:0;
background:transparent;
box-shadow:none;
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-flip::before,
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-reset::before {
content:"";
position:absolute;
z-index:-1;
top:50%;
left:50%;
width:1.30rem;
height:1.30rem;
box-sizing:border-box;
border:1px solid rgba(var(--aka-gallery-stage-rgb),.30);
border-radius:3px;
background:rgba(5,4,3,.94);
box-shadow:0 4px 10px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,244,214,.022);
transform:translate(-50%,-50%);
}
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-flip svg,
.aka-wallet-gallery-preview-host.is-mobile .aka-wallet-inline-reset svg {
position:relative;
z-index:1;
}
}
/* ========================================================================== */
/* PERFORMANCE-LITE + REDUCED MOTION */
/* ========================================================================== */
html.aka-performance-lite .aka-secret-projector-line {
display:none !important;
}
html.aka-performance-lite .aka-wallet-card-object,
html.aka-performance-lite .aka-wallet-card-rotor,
html.aka-performance-lite .aka-wallet-card-edge {
transition:none !important;
}
html.aka-performance-lite .aka-wallet-card-face.is-front::before {
animation:none !important;
opacity:0 !important;
}
html.aka-performance-lite .aka-secret-unseal-layer,
html.aka-performance-lite .aka-secret-unseal-layer::before,
html.aka-performance-lite .aka-secret-unseal-layer::after {
animation:none !important;
}
html.aka-performance-lite .aka-archive-file-card.is-exclusive-arriving .aka-exclusive-crystal :is(path,polyline,line,polygon) {
animation:none !important;
stroke-dashoffset:0 !important;
opacity:1 !important;
}
html.aka-performance-lite #modalContent .aka-archive-file-card.is-exclusive-arriving {
animation:akaV42LiteExclusiveCardArrival 820ms cubic-bezier(.22,1,.36,1) both !important;
}
html.aka-performance-lite #modalContent .aka-archive-file-card.is-exclusive-arriving .aka-exclusive-seal {
animation:akaV42LiteExclusiveSealArrival 540ms cubic-bezier(.22,1,.36,1) 130ms both !important;
}
html.aka-performance-lite #modalContent .aka-archive-file-card.is-exclusive-arriving .aka-exclusive-progression-action {
animation:akaV42GateControlArrival 200ms ease-out 570ms both !important;
}
html.aka-performance-lite #modalContent .aka-archive-file-card.is-exclusive-unsealing .aka-exclusive-break-layer {
display:block !important;
opacity:1;
animation:akaV42LiteDiamondBreak 520ms linear both !important;
}
html.aka-performance-lite #modalContent .aka-archive-file-card.is-exclusive-unsealing .aka-exclusive-break-fragment {
animation:akaV42DiamondFragmentDissolve 480ms ease-out both !important;
}
html.aka-performance-lite #modalContent .aka-archive-file-card.is-secret-unsealing .aka-secret-unseal-layer {
display:none !important;
}
html.aka-performance-lite .aka-archive-file-card.is-exclusive-unsealing img.aka-archive-poster-preview {
animation:akaV42LitePosterReveal 480ms ease-out 60ms both !important;
}
html.aka-performance-lite #modalContent .aka-archive-file-card.is-exclusive-unsealing .aka-exclusive-progression-action {
animation:akaV42GateControlArrival 180ms ease-out 390ms both !important;
}
html.aka-performance-lite #modalContent .aka-archive-file-card.is-initial-reveal {
--aka-unseal-composition-duration:140ms;
--aka-unseal-composition-ease:linear;
}
@keyframes akaV42LitePosterReveal {
from { opacity:.20; }
to { opacity:1; }
}
@keyframes akaV42LiteExclusiveCardArrival {
from { opacity:.32;transform:translateY(12px) scale(.975);border-color:rgba(var(--aka-exclusive-rgb),.24); }
58% { opacity:1;transform:none;border-color:rgba(var(--aka-exclusive-rgb),.92); }
to { opacity:1;transform:none;border-color:rgba(var(--aka-exclusive-rgb),.68); }
}
@keyframes akaV42LiteExclusiveSealArrival {
from { opacity:0;transform:translate(-50%,-50%) scale(.58); }
to { opacity:1;transform:translate(-50%,-50%) scale(1); }
}
@keyframes akaV42LiteDiamondBreak {
0%,100% { opacity:0; }
18%,68% { opacity:1; }
}
@media (prefers-reduced-motion:reduce) {
.aka-wallet-gallery-archive-chooser,
.aka-wallet-gallery-archive-cylinder,
.aka-wallet-gallery-archive-step,
.aka-wallet-gallery-archive-option,
.aka-wallet-gallery-back,
.aka-wallet-inline-entry,
.aka-wallet-inline-entry img,
.aka-wallet-inline-dismiss,
.aka-wallet-inline-stage,
.aka-wallet-inline-poster-card,
.aka-wallet-card-object,
.aka-wallet-card-rotor,
.aka-wallet-card-edge,
.aka-wallet-card-face,
.aka-wallet-card-face.is-front::before,
.aka-wallet-inline-stage-close,
.aka-wallet-inline-download,
.aka-wallet-inline-flip,
.aka-wallet-inline-reset,
.aka-wallet-gallery-step,
.aka-wallet-diamond-footer-command,
.aka-wallet-diamond-footer-icon,
.aka-wallet-track-command,
.aka-wallet-track-face,
.aka-wallet-drawer-inner.is-diamond [data-wallet-track],
.aka-wallet-drawer-inner.is-diamond [data-wallet-gallery-open],
.aka-archive-download-btn.is-owned,
.aka-archive-owned-seal,
[data-gallery-owned-poster],
.aka-owned-callout,
.aka-owned-notice,
[data-owned-callout],
.aka-exclusive-action,
.aka-exclusive-progression-action,
.aka-exclusive-crystal,
.aka-archive-file-card.is-exclusive-arriving {
animation:none !important;
transition:none !important;
}
.aka-wallet-inline-stage.is-visible .aka-wallet-inline-poster-card {
opacity:1;
transform:translateX(-50%);
}
.aka-wallet-inline-stage.is-visible .aka-wallet-card-face.is-front::before {
--aka-gallery-perimeter-angle:380deg;
opacity:0;
}
#modalContent .aka-archive-file-card.is-exclusive-pending-arrival,
#modalContent .aka-archive-file-card.is-exclusive-arriving {
opacity:1 !important;
transform:none !important;
}
#modalContent .aka-archive-file-card.is-exclusive-pending-arrival .aka-exclusive-seal,
#modalContent .aka-archive-file-card.is-exclusive-pending-arrival .aka-exclusive-progression-action {
opacity:1 !important;
}
.aka-exclusive-break-layer,
.aka-secret-unseal-layer,
.aka-archive-file-card.is-exclusive-unsealing .aka-exclusive-break-layer,
.aka-archive-file-card.is-secret-unsealing .aka-secret-unseal-layer {
display:none !important;
animation:none !important;
}
#modalContent .aka-archive-file-card.is-exclusive-arriving .aka-exclusive-crystal :is(path,polyline,line,polygon) {
stroke-dashoffset:0 !important;
opacity:1 !important;
animation:none !important;
}
#modalContent .aka-archive-file-card.is-initial-reveal .aka-archive-download-btn,
#modalContent .aka-archive-file-card.is-initial-reveal .aka-archive-owned-seal,
#modalContent .aka-archive-file-card.is-initial-reveal .aka-archive-progression-action,
#modalContent .aka-archive-file-card.is-initial-reveal .aka-archive-task-icons > .aka-archive-task-icon,
#modalContent .aka-archive-file-card.is-initial-reveal img.aka-archive-revealed-poster,
#modalContent .aka-archive-task-icon.is-materializing,
#modalContent .aka-archive-file-card.is-exclusive-unsealing img.aka-archive-poster-preview,
#modalContent .aka-archive-file-card.is-exclusive-unsealing img.aka-archive-revealed-poster,
#modalContent .aka-archive-file-card.is-secret-unsealing img.aka-archive-poster-preview,
#modalContent .aka-archive-file-card.is-secret-unsealing img.aka-archive-revealed-poster {
opacity:1 !important;
filter:none !important;
transform:none !important;
animation:none !important;
transition:none !important;
}
}
/* V0.42.17 authoritative premium contract: one completion ring, a dark Gallery
vault, a collectible-grade card back and a larger sharp player TITLE. */
.aka-reel-glyph.aka-wallet-secret-reel .aka-reel-rim { stroke-width:.46 !important; }
/* Older generic svg rules used a higher specificity and silently compressed
the Reel. These context selectors establish the visible final dimensions. */
.aka-wallet-signal-action > .aka-reel-glyph.aka-wallet-secret-reel {
width:1.28rem !important;
height:1.28rem !important;
flex-basis:1.28rem !important;
}
.aka-wallet-drawer-stat > .aka-reel-glyph.aka-wallet-secret-reel.is-drawer {
width:1.24rem !important;
height:1.24rem !important;
flex-basis:1.24rem !important;
}
.aka-mobile-wallet-signal-strip .aka-wallet-signal-action > .aka-reel-glyph.aka-wallet-secret-reel {
width:1.34rem !important;
height:1.34rem !important;
flex-basis:1.34rem !important;
}
/* The side Reel completion is an independent verification layer. Class and
data selectors are both retained so a live rerender cannot lose the ring. */
#modalContent .aka-archive-file-card
.aka-archive-task-icon.aka-archive-reel-signal-icon.is-complete,
#modalContent .aka-archive-file-card
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"].is-complete {
position:relative !important;
overflow:visible !important;
border-color:transparent !important;
border-radius:999px !important;
background:none !important;
box-shadow:none !important;
}
#modalContent .aka-archive-file-card
.aka-archive-task-icon.aka-archive-reel-signal-icon.is-complete::before,
#modalContent .aka-archive-file-card
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"].is-complete::before {
content:none !important;
}
#modalContent .aka-archive-file-card
.aka-archive-task-icon.aka-archive-reel-signal-icon.is-complete::after,
#modalContent .aka-archive-file-card
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"].is-complete::after {
content:"";
position:absolute;
z-index:2;
inset:-.03rem;
box-sizing:border-box;
border:1.5px solid rgba(101,246,142,.98);
border-radius:50%;
box-shadow:0 0 0 1px rgba(0,0,0,.94),0 0 4px rgba(74,222,128,.42);
pointer-events:none;
}
#modalContent .aka-archive-file-card
.aka-archive-task-icon.aka-archive-reel-signal-icon.is-complete .aka-reel-rim,
#modalContent .aka-archive-file-card
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"].is-complete .aka-reel-rim {
fill:rgba(var(--aka-reel-fill-rgb,24,78,132),.68) !important;
stroke:transparent !important;
}
#modalContent .aka-archive-file-card
.aka-archive-task-icon.aka-archive-reel-signal-icon.is-complete > .aka-reel-glyph,
#modalContent .aka-archive-file-card
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"].is-complete > .aka-reel-glyph {
position:relative;
z-index:1;
filter:none !important;
}
#modalContent .aka-archive-file-card
.aka-archive-task-icon.aka-archive-reel-signal-icon.is-complete .aka-archive-task-check,
#modalContent .aka-archive-file-card
.aka-archive-task-icon[data-archive-maze-kind="reel_signal"].is-complete .aka-archive-task-check {
z-index:4;
}
.aka-wallet-drawer-inner:not(.is-inline-gallery) {
height:6.56rem;
min-height:6.56rem;
max-height:6.56rem;
padding:.56rem .62rem;
}
.aka-wallet-drawer-inner.is-inline-gallery {
height:7.60rem;
min-height:7.60rem;
max-height:7.60rem;
}
.aka-wallet-drawer-inner:not(.is-inline-gallery) .aka-wallet-drawer-heading { margin-bottom:.34rem; }
.aka-wallet-drawer-inner:not(.is-inline-gallery) .aka-wallet-drawer-stats { gap:.30rem; }
.aka-wallet-drawer-inner:not(.is-inline-gallery) .aka-wallet-drawer-stat { min-height:2.18rem;padding:.34rem .42rem; }
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key-grid { gap:.30rem; }
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-key { min-height:2.24rem;padding:.30rem .20rem; }
.aka-wallet-drawer-inner.is-vault { padding:.54rem .60rem; }
.aka-wallet-drawer-inner.is-vault .aka-wallet-vault-grid { gap:.34rem; }
.aka-wallet-drawer-inner.is-vault .aka-wallet-vault-stat { min-height:3.10rem;gap:.36rem;padding:.48rem .54rem .46rem; }
.aka-wallet-drawer-inner.is-vault .aka-wallet-drawer-action.is-vault-claim { margin-top:.34rem;padding:.42rem .52rem; }
.aka-wallet-diamond-summary { gap:.30rem;margin-bottom:.12rem; }
.aka-wallet-diamond-stat {
min-height:1.68rem;
padding:.31rem .38rem;
border-color:rgba(var(--aka-dia-edge-rgb),.23);
background:radial-gradient(circle at 0 0,rgba(var(--aka-dia-highlight-rgb),.028),transparent 58%),rgba(var(--aka-dia-core-rgb),.25);
color:rgba(223,177,216,.78);
}
.aka-wallet-diamond-stat-icon {
border-color:rgba(var(--aka-dia-edge-rgb),.36);
background:rgba(var(--aka-dia-base-rgb),.16);
color:rgba(var(--aka-dia-highlight-rgb),.84);
}
.aka-wallet-diamond-stat.is-claimed .aka-wallet-diamond-stat-icon {
border-color:rgba(87,218,151,.34);
background:rgba(87,218,151,.045);
color:rgba(126,228,176,.90);
}
.aka-wallet-diamond-footer,
.aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer,
.aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-drawer-footer {
grid-template-columns:4.08rem minmax(0,1fr) 4.08rem;
gap:.24rem;
min-height:2.46rem;
margin-top:auto;
}
.aka-wallet-diamond-footer-command,
.aka-wallet-track-command,
.aka-wallet-gallery-command {
min-height:2.46rem !important;
gap:.28rem !important;
}
.aka-wallet-diamond-footer-icon,
.aka-wallet-track-face,
.aka-wallet-gallery-face {
width:1.50rem !important;
min-width:1.50rem !important;
height:1.50rem !important;
min-height:1.50rem !important;
padding:.16rem !important;
border-radius:.27rem !important;
}
.aka-wallet-track-command-label,
.aka-wallet-gallery-command-label,
.aka-wallet-diamond-footer-label {
font-size:.58rem !important;
line-height:1 !important;
letter-spacing:.07em !important;
}
.aka-wallet-diamond-footer-command.is-track {
--aka-diamond-command-rgb:var(--aka-dia-edge-rgb);
color:rgba(var(--aka-dia-highlight-rgb),.82);
justify-self:start;
}
.aka-wallet-diamond-footer-command.is-gallery { justify-self:end; }
.aka-wallet-drawer-inner.is-inline-gallery,
.aka-wallet-gallery-preview-host { --aka-gallery-dia:var(--aka-gallery-gold); }
/* Gallery is a black archive vault. Category colour belongs to thin edges and
labels; it never becomes a yellow fog behind the content. */
.aka-wallet-drawer-inner.is-inline-gallery {
background:linear-gradient(155deg,#090806,#030505 62%,#020303) !important;
box-shadow:inset 0 0 0 1px rgba(212,168,67,.08),inset 0 -16px 26px rgba(0,0,0,.32) !important;
}
.aka-wallet-gallery-archive-chooser::before {
border-color:rgba(var(--aka-gallery-gold),.08) !important;
background:none !important;
}
.aka-wallet-gallery-archive-chooser::after {
background:linear-gradient(90deg,transparent,rgba(var(--aka-gallery-gold),.15) 30% 70%,transparent) !important;
opacity:.34 !important;
}
.aka-wallet-gallery-archive-option,
.aka-wallet-gallery-archive-option.is-live.is-active,
.aka-wallet-gallery-archive-option.is-empty.is-active {
background:linear-gradient(90deg,rgba(var(--aka-gallery-archive-rgb),.032),rgba(2,3,3,.92) 38% 68%,rgba(var(--aka-gallery-archive-rgb),.014)) !important;
box-shadow:inset 0 0 0 1px rgba(var(--aka-gallery-archive-rgb),.025) !important;
}
.aka-wallet-gallery-archive-option::before { box-shadow:none !important; }
.aka-wallet-gallery-archive-option.is-live::after { box-shadow:none !important; }
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-gallery-collection {
background:linear-gradient(180deg,rgba(255,246,219,.010),transparent 24% 78%,rgba(0,0,0,.36)) !important;
box-shadow:inset 0 1px 0 rgba(var(--aka-gallery-gold),.075),inset 0 -1px 0 rgba(var(--aka-gallery-gold),.09) !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-rail {
background:linear-gradient(90deg,rgba(var(--aka-gallery-gold),.025),transparent .80rem) !important;
}
.aka-wallet-gallery-preview-host .aka-wallet-inline-stage::before {
inset:4% 16% 5% !important;
background:radial-gradient(ellipse at 50% 54%,rgba(255,246,224,.018),transparent 58%) !important;
opacity:.60 !important;
}
#modalContent .aka-archive-file-card.is-exclusive,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] { --aka-exclusive-rgb:var(--aka-dia-edge-rgb); }
.aka-exclusive-crystal { color:rgb(var(--aka-dia-highlight-rgb)); }
.aka-exclusive-gate-badge,
.aka-exclusive-gate-badge.is-pay,
.aka-exclusive-gate-badge[data-exclusive-gate-type="pay"] {
--aka-exclusive-gate-rgb:var(--aka-dia-edge-rgb);
color:rgba(224,166,214,.90);
}
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-verify,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action.is-verify,
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-pay,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action.is-pay,
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action.is-unseal,
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action.is-unseal {
border-color:rgba(var(--aka-dia-highlight-rgb),.70) !important;
background:radial-gradient(ellipse at 50% 0%,rgba(var(--aka-dia-highlight-rgb),.10),transparent 64%),linear-gradient(180deg,rgba(var(--aka-dia-base-rgb),.72),rgba(var(--aka-dia-core-rgb),.96)) !important;
color:rgba(235,194,228,.96) !important;
box-shadow:0 0 0 1px rgba(var(--aka-dia-edge-rgb),.12),0 0 8px rgba(var(--aka-dia-edge-rgb),.15),0 10px 24px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.045) !important;
}
@media (any-hover:hover) and (pointer:fine) {
#modalContent .aka-archive-file-card.is-exclusive .aka-exclusive-action:is(.is-verify,.is-pay,.is-unseal):not(:disabled):is(:hover,:focus-visible),
#modalContent .aka-archive-file-card[data-file-type="exclusive"] .aka-exclusive-action:is(.is-verify,.is-pay,.is-unseal):not(:disabled):is(:hover,:focus-visible) {
border-color:rgb(var(--aka-dia-highlight-rgb)) !important;
}
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"],
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"] {
position:relative;
min-height:2.78rem;
box-sizing:border-box;
align-items:center;
justify-content:center;
padding:.34rem 2.62rem !important;
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-label,
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-mobile-wallet-title-label {
position:absolute;
z-index:2;
top:50%;
left:.48rem;
width:auto !important;
margin:0;
color:rgba(212,168,67,.58) !important;
font:600 .39rem/1 "Special Elite",monospace !important;
letter-spacing:.16em !important;
text-align:left;
transform:translateY(-50%);
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider),
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
--aka-wallet-title-face:rgba(246,235,214,.96);
--aka-wallet-title-inset:rgba(39,20,34,.98);
--aka-wallet-title-contour:rgba(176,132,117,.62);
--aka-wallet-title-line:var(--aka-identity-title-color,rgba(255,232,162,.96));
position:relative;
display:flex !important;
width:100%;
max-width:100%;
align-items:center;
justify-content:center;
gap:.26rem;
box-sizing:border-box;
padding-inline:.44rem;
color:var(--aka-wallet-title-face) !important;
background:none !important;
-webkit-background-clip:border-box !important;
background-clip:border-box !important;
-webkit-text-fill-color:var(--aka-wallet-title-face);
-webkit-text-stroke:.22px var(--aka-wallet-title-inset);
font-family:'Bebas Neue','Arial Narrow',Impact,sans-serif !important;
font-size:1.46rem !important;
font-weight:400 !important;
font-synthesis:none;
line-height:1.08;
letter-spacing:.065em !important;
text-rendering:geometricPrecision;
text-shadow:-.34px 0 var(--aka-wallet-title-contour),.34px 0 var(--aka-wallet-title-contour),0 1px 0 rgba(10,4,8,.98) !important;
filter:none;
white-space:nowrap;
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider)::before,
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider)::after,
.aka-mobile-identity-panel.is-connected .aka-mobile-wallet-title-section[data-wallet-title-context="player"] #mobileWalletIdentityStatus::before,
.aka-mobile-identity-panel.is-connected .aka-mobile-wallet-title-section[data-wallet-title-context="player"] #mobileWalletIdentityStatus::after {
content:"";
display:block;
width:.58rem;
min-width:.58rem;
height:6px;
flex:0 0 .58rem;
background:linear-gradient(90deg,transparent,var(--aka-wallet-title-line)) top right / 100% 1px no-repeat,linear-gradient(90deg,transparent 12%,var(--aka-wallet-title-line)) center right / 68% 1px no-repeat,linear-gradient(90deg,transparent 22%,var(--aka-wallet-title-line)) bottom right / 38% 1px no-repeat !important;
-webkit-background-clip:border-box !important;
background-clip:border-box !important;
-webkit-text-fill-color:initial;
filter:none;
opacity:.78;
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider)::after,
.aka-mobile-identity-panel.is-connected .aka-mobile-wallet-title-section[data-wallet-title-context="player"] #mobileWalletIdentityStatus::after {
transform:scaleX(-1);
}
.aka-wallet-title-section.aka-wallet-context-crossfade.is-poster-context .aka-wallet-dropdown-title,
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade.is-poster-context #mobileWalletIdentityStatus {
font-size:1.10rem !important;
line-height:1.08;
letter-spacing:.075em !important;
}
.aka-wallet-card-object {
--aka-card-thickness:3.8px;
--aka-card-half-thickness:1.9px;
}
.aka-wallet-card-edge,
.aka-wallet-card-edge.is-top,
.aka-wallet-card-edge.is-bottom {
background:linear-gradient(90deg,#040404,#24221d var(--aka-card-edge-light-position,50%),#070707);
box-shadow:inset 0 0 0 1px rgba(229,194,125,.035);
}
.aka-wallet-card-face.is-front {
border-color:rgba(var(--aka-gallery-stage-rgb),.46);
box-shadow:0 18px 19px rgba(0,0,0,.62),0 4px 7px rgba(0,0,0,.38),inset 0 0 0 1px rgba(255,247,226,.035);
}
@media (max-width:768px) {
.aka-mobile-identity-panel.is-connected #mobileWalletConnectBtn {
width:100% !important;
max-width:100% !important;
min-height:3.86rem;
margin-inline:0 !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"] {
width:100%;
min-height:2.94rem;
margin:.34rem 0 .48rem;
flex-direction:row;
padding:.34rem 2.48rem !important;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:not(.is-inline-gallery) {
height:6.48rem;
min-height:6.48rem;
max-height:6.48rem;
padding:.52rem .56rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-drawer-footer {
grid-template-columns:4.16rem minmax(0,1fr) 4.16rem;
min-height:2.75rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-command,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-track-command,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-gallery-command { min-height:2.75rem !important; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-icon,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-track-face,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-gallery-face {
width:1.64rem !important;
min-width:1.64rem !important;
height:1.64rem !important;
min-height:1.64rem !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus { font-size:1.40rem !important; }
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade.is-poster-context #mobileWalletIdentityStatus {
font-size:1.04rem !important;
}
.aka-wallet-card-object { --aka-card-thickness:2.8px;--aka-card-half-thickness:1.4px; }
}
@media (max-width:360px) {
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"] {
padding-inline:2.28rem !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus { font-size:1.30rem !important; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer-icon,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-track-face,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-gallery-face {
width:1.58rem !important;
min-width:1.58rem !important;
height:1.58rem !important;
min-height:1.58rem !important;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-diamond-footer,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer,
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:not(.is-diamond):not(.is-key) .aka-wallet-drawer-footer {
grid-template-columns:4.02rem minmax(0,1fr) 4.02rem;
}
}
/* V0.42.19 authoritative reel-rim and title contract: every Wallet mechanism
keeps its own colour and DIA's dark material hierarchy. Non-Reel Side
instruments keep the shared completion ring; Reel completion changes the
Reel's own rim from red to the exact same green with no wrapper or gap. */
/* MAG and BONUS use the same Lucide geometry in the Wallet strip, drawer and
archive Side rail. Only context size changes; the glyph itself does not. */
.aka-wallet-signal-action > svg.aka-archive-magnifier-glyph,
.aka-wallet-signal-action > svg.aka-archive-bonus-glyph {
display:block;
width:1.02rem !important;
height:1.02rem !important;
overflow:visible;
stroke-width:2.12 !important;
shape-rendering:geometricPrecision;
}
.aka-wallet-signal-action.is-magnifier > svg.aka-archive-magnifier-glyph {
color:rgb(225,164,103) !important;
filter:drop-shadow(0 0 1.5px rgba(78,205,235,.58)) !important;
}
.aka-wallet-signal-action.is-bonus,
.aka-wallet-signal-action.is-bonus.is-selected {
--aka-wallet-signal-rgb:235,186,61 !important;
}
.aka-wallet-signal-action.is-bonus > svg.aka-archive-bonus-glyph {
width:.92rem !important;
height:.92rem !important;
color:rgba(235,186,61,.88) !important;
filter:drop-shadow(0 0 1px rgba(235,186,61,.20)) !important;
}
.aka-mobile-wallet-signal-strip
.aka-wallet-signal-action.is-bonus > svg.aka-archive-bonus-glyph {
width:.92rem !important;
height:.92rem !important;
color:rgba(235,186,61,.88) !important;
filter:drop-shadow(0 0 1px rgba(235,186,61,.20)) !important;
}
.aka-wallet-drawer-inner.is-magnifier { --aka-drawer-rgb:202,143,82 !important; }
.aka-wallet-drawer-inner.is-secret { --aka-drawer-rgb:74,168,255 !important; }
.aka-wallet-drawer-inner.is-bonus { --aka-drawer-rgb:235,186,61 !important; }
.aka-wallet-drawer-inner.is-key { --aka-drawer-rgb:191,105,53 !important; }
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus,.is-key) {
border-color:rgba(var(--aka-drawer-rgb),.23) !important;
background:
radial-gradient(circle at 10% 0%,rgba(var(--aka-drawer-rgb),.038),transparent 39%),
radial-gradient(circle at 100% 100%,rgba(var(--aka-drawer-rgb),.018),transparent 46%),
linear-gradient(155deg,rgba(15,13,12,.995),rgba(7,7,7,.998) 58%,rgba(3,4,4,.999)) !important;
box-shadow:
0 12px 28px rgba(0,0,0,.34),
inset 0 1px 0 rgba(255,255,255,.024),
inset 0 0 0 1px rgba(var(--aka-drawer-rgb),.020),
inset 0 -18px 28px rgba(0,0,0,.28) !important;
}
.aka-wallet-drawer-inner.is-magnifier {
background:
radial-gradient(circle at 10% 0%,rgba(78,205,235,.040),transparent 37%),
radial-gradient(circle at 100% 100%,rgba(202,143,82,.018),transparent 46%),
linear-gradient(155deg,rgba(14,16,16,.995),rgba(7,7,7,.998) 58%,rgba(3,4,4,.999)) !important;
}
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus) .aka-wallet-drawer-heading {
color:rgba(var(--aka-drawer-rgb),.82) !important;
text-shadow:none !important;
}
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus) .aka-wallet-drawer-stats {
grid-template-columns:minmax(0,1fr);
align-content:start;
}
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus) .aka-wallet-drawer-stat {
min-height:2.18rem;
border-color:rgba(var(--aka-drawer-rgb),.22) !important;
background:
radial-gradient(circle at 0 0,rgba(var(--aka-drawer-rgb),.030),transparent 58%),
linear-gradient(180deg,rgba(var(--aka-drawer-rgb),.025),rgba(2,3,3,.64)) !important;
color:rgba(var(--aka-drawer-rgb),.84) !important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.018) !important;
}
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
.aka-wallet-drawer-stat small {
color:inherit;
text-shadow:none !important;
}
.aka-wallet-drawer-stat > svg.aka-wallet-drawer-mechanism-icon {
width:1.24rem !important;
height:1.24rem !important;
flex:0 0 1.24rem !important;
stroke-width:2.12 !important;
filter:none !important;
shape-rendering:geometricPrecision;
}
.aka-wallet-drawer-inner.is-magnifier
.aka-wallet-drawer-stat > svg.aka-archive-magnifier-glyph {
color:rgb(225,164,103) !important;
filter:drop-shadow(0 0 1.5px rgba(78,205,235,.54)) !important;
}
.aka-wallet-drawer-inner.is-bonus
.aka-wallet-drawer-stat > svg.aka-archive-bonus-glyph {
color:rgb(235,186,61) !important;
filter:drop-shadow(0 0 1.5px rgba(235,186,61,.40)) !important;
}
/* TITLE stays large and sharp. Its label returns above the rank, while the
three-line insignias grow to the same optical weight as the larger word. */
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"],
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"] {
min-height:3.42rem;
padding:.78rem 2.84rem .18rem !important;
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-label,
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-mobile-wallet-title-label {
top:.32rem;
left:50%;
width:100% !important;
color:rgba(212,168,67,.62) !important;
text-align:center;
transform:translateX(-50%);
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider),
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
gap:.36rem;
padding-inline:.24rem;
font-size:1.56rem !important;
transform:translateY(.22rem);
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider)::before,
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider)::after,
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::before,
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::after {
width:.92rem;
min-width:.92rem;
height:9px;
flex-basis:.92rem;
background:
linear-gradient(90deg,transparent,var(--aka-wallet-title-line)) top right / 100% 1px no-repeat,
linear-gradient(90deg,transparent 10%,var(--aka-wallet-title-line)) center right / 72% 1px no-repeat,
linear-gradient(90deg,transparent 20%,var(--aka-wallet-title-line)) bottom right / 44% 1px no-repeat !important;
opacity:.82;
}
/* Non-Reel mechanisms keep one common verification wrapper. Reel owns no
wrapper ring: its intrinsic rim fills the same footprint in every state. */
#modalContent .aka-archive-file-card
.aka-archive-task-icons > .aka-archive-task-icon.is-complete:not([data-archive-maze-kind="reel_signal"]) {
position:relative !important;
overflow:visible !important;
opacity:1 !important;
filter:none !important;
box-sizing:border-box !important;
border:1.5px solid rgb(101,246,142) !important;
border-radius:999px !important;
background:
radial-gradient(circle at 50% 55%,rgba(var(--aka-task-accent),.075),transparent 62%),
linear-gradient(180deg,rgba(9,13,11,.96),rgba(2,6,4,.995)) !important;
box-shadow:
0 0 0 1px rgba(0,0,0,.98),
0 0 5px rgba(74,222,128,.58),
inset 0 0 5px rgba(74,222,128,.045) !important;
animation:none !important;
}
#modalContent .aka-archive-file-card
.aka-archive-task-icons > .aka-archive-task-icon.is-complete::before,
#modalContent .aka-archive-file-card
.aka-archive-task-icons > .aka-archive-task-icon.is-complete::after {
content:none !important;
display:none !important;
border:0 !important;
box-shadow:none !important;
}
#modalContent .aka-archive-file-card
.aka-archive-task-icons > .aka-archive-task-icon.is-complete > svg {
position:relative;
z-index:1;
opacity:1 !important;
color:rgb(var(--aka-task-accent)) !important;
filter:none !important;
shape-rendering:geometricPrecision;
}
#modalContent .aka-archive-file-card
.aka-archive-task-icons > .aka-archive-task-icon[data-archive-maze-kind="reel_signal"] {
position:relative !important;
overflow:visible !important;
box-sizing:border-box !important;
border:0 !important;
border-radius:999px !important;
background:none !important;
box-shadow:none !important;
filter:none !important;
animation:none !important;
}
#modalContent .aka-archive-file-card
.aka-archive-task-icons > .aka-archive-task-icon[data-archive-maze-kind="reel_signal"]
> .aka-reel-glyph {
position:relative;
z-index:1;
width:131.15% !important;
max-width:none !important;
height:131.15% !important;
max-height:none !important;
margin:0 !important;
color:rgb(255,78,76) !important;
filter:none !important;
}
#modalContent .aka-archive-file-card
.aka-archive-task-icons > .aka-archive-task-icon[data-archive-maze-kind="reel_signal"]
.aka-reel-rim {
fill:rgb(16,53,90) !important;
stroke:rgb(255,78,76) !important;
stroke-width:1.45 !important;
filter:drop-shadow(0 0 .45px rgba(255,78,76,.24));
}
#modalContent .aka-archive-file-card
.aka-archive-task-icons > .aka-archive-task-icon[data-archive-maze-kind="reel_signal"].is-complete
.aka-reel-rim {
fill:rgb(16,53,90) !important;
stroke:rgb(101,246,142) !important;
stroke-width:1.45 !important;
filter:drop-shadow(0 0 .75px rgba(74,222,128,.76));
}
#modalContent .aka-archive-file-card
.aka-archive-task-icons > .aka-archive-task-icon.is-complete
.aka-archive-task-check {
z-index:4;
display:inline-flex !important;
border:1px solid rgba(174,255,195,.98) !important;
background:#020704 !important;
color:#64f38d !important;
box-shadow:0 0 0 1px rgba(0,0,0,.98),0 0 4px rgba(74,222,128,.58) !important;
filter:none !important;
}
@media (max-width:768px) {
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"] {
min-height:3.46rem;
padding:.78rem 2.50rem .18rem !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
font-size:1.50rem !important;
}
}
@media (max-width:360px) {
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"] {
padding-inline:2.20rem !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
font-size:1.39rem !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::before,
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::after {
width:.80rem;
min-width:.80rem;
flex-basis:.80rem;
}
}
/* V0.42.20 authoritative responsive TITLE and footer contract. Desktop uses
the same open top/bottom rule grammar as mobile. The live player rank owns
a crisp double contour, never scanlines, blur or a glow filter. */
#walletDropdown .aka-wallet-title-section.aka-wallet-context-crossfade,
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade {
border:0 !important;
border-top:1px solid color-mix(in srgb,var(--aka-identity-title-color,rgba(212,168,67,.50)) 18%,transparent) !important;
border-bottom:1px solid color-mix(in srgb,var(--aka-identity-title-color,rgba(212,168,67,.50)) 13%,transparent) !important;
border-radius:0 !important;
background:none !important;
box-shadow:none !important;
}
#walletDropdown .aka-wallet-title-section.aka-wallet-context-crossfade {
margin:.22rem 0 .68rem !important;
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"],
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"] {
min-height:3.58rem;
padding:.94rem 2.84rem .16rem !important;
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-label,
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-mobile-wallet-title-label {
top:.42rem;
left:50%;
width:100% !important;
margin:0;
color:rgba(212,168,67,.72) !important;
font:600 .50rem/1 "Special Elite",monospace !important;
letter-spacing:.18em !important;
text-align:center;
text-shadow:none !important;
transform:translateX(-50%);
}
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider),
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
gap:.36rem;
padding-inline:.24rem;
color:rgba(246,235,214,.97) !important;
-webkit-text-fill-color:initial !important;
-webkit-text-stroke:0 !important;
font-size:1.56rem !important;
text-shadow:none !important;
filter:none !important;
transform:translateY(3px);
}
.aka-wallet-player-title-text {
position:relative;
z-index:0;
display:inline-block;
isolation:isolate;
color:rgba(246,235,214,.97) !important;
-webkit-text-fill-color:rgba(246,235,214,.97) !important;
-webkit-text-stroke:.5px rgba(44,22,31,.96) !important;
paint-order:stroke fill;
font:inherit;
letter-spacing:inherit;
line-height:inherit;
text-rendering:geometricPrecision;
text-shadow:0 1px 0 rgba(4,2,3,.98) !important;
filter:none !important;
white-space:nowrap;
}
.aka-wallet-player-title-text::before {
content:attr(data-title);
position:absolute;
z-index:-1;
inset:0;
box-sizing:border-box;
color:transparent;
-webkit-text-fill-color:transparent;
-webkit-text-stroke:1px rgba(170,121,108,.72);
font:inherit;
letter-spacing:inherit;
line-height:inherit;
text-shadow:none;
pointer-events:none;
white-space:nowrap;
}
.aka-wallet-player-title-text::after {
content:none !important;
display:none !important;
}
/* Dense circular radar geometry needs less optical area than its face, while
the thin three-card Gallery mark needs more. Hit targets never change. */
.aka-wallet-track-face > .aka-wallet-track-signal {
width:70% !important;
height:70% !important;
margin:auto !important;
place-items:center !important;
transform:none !important;
}
.aka-wallet-track-face > .aka-wallet-track-signal > svg {
display:block;
width:100% !important;
height:100% !important;
margin:auto !important;
}
.aka-wallet-gallery-face > .aka-wallet-gallery-stack-glyph {
place-self:center;
transform:scale(1.34);
transform-origin:50% 50%;
}
/* V0.42.22 authoritative TITLE + MAG optical-polish contract. The MAG lens
receives the same restrained cyan core as the archive instrument, while
its asymmetric handle is optically centred without changing the row. */
.aka-wallet-drawer-inner.is-magnifier
.aka-wallet-drawer-stat > svg.aka-wallet-drawer-mechanism-icon.aka-archive-magnifier-glyph {
width:1.18rem !important;
height:1.18rem !important;
flex:0 0 1.18rem !important;
align-self:center;
justify-self:center;
background:
radial-gradient(circle at 46% 46%,rgba(78,205,235,.19) 0 22%,rgba(78,205,235,.045) 23% 37%,transparent 38%) !important;
filter:drop-shadow(0 0 1.25px rgba(78,205,235,.46)) !important;
transform:translate(-.03rem,-.02rem);
transform-origin:50% 50%;
}
/* Only the connected mobile player TITLE is tightened. Desktop, Gallery and
poster-title contexts retain their approved geometry and scale. */
@media (max-width:768px) {
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"] {
min-height:3.40rem;
margin:.32rem 0 .42rem;
padding:.84rem 2.50rem .14rem !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-mobile-wallet-title-label {
top:.40rem;
font-size:.52rem !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
font-size:1.50rem !important;
transform:translateY(1px);
}
}
@media (max-width:360px) {
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"] {
padding-inline:2.20rem !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
font-size:1.39rem !important;
}
}
/* The physical card follows the loaded poster's real ratio. `contain` remains
authoritative, so the complete artwork fills the card without cropping,
stretching or a black letterbox above it. */
.aka-wallet-gallery-preview-host
.aka-wallet-inline-poster-card[data-wallet-inline-poster-card] {
aspect-ratio:var(--aka-wallet-poster-aspect,2 / 3);
}
.aka-wallet-gallery-preview-host
.aka-wallet-card-face.is-front
> img[data-wallet-inline-preview-image] {
object-fit:contain;
object-position:center;
}
/* ORIGIN artwork can be wider than the archive's standard physical card.
Only its card body is normalized to the common 2:3 width; the existing
height, complete-artwork `contain` fit and all three footer controls stay. */
.aka-wallet-gallery-preview-host
.aka-wallet-inline-stage[data-gallery-archive="origin"]
.aka-wallet-inline-poster-card[data-wallet-inline-poster-card] {
aspect-ratio:2 / 3;
}
/* A restrained +2px radius gives both shelf cards and the opened 3D object
the same archival collectible finish without turning them into pills. */
.aka-wallet-inline-entry,
[data-wallet-gallery-entry],
.aka-wallet-inline-poster-card,
.aka-wallet-card-object {
border-radius:7px;
}
.aka-wallet-inline-entry::before,
[data-wallet-gallery-entry]::before,
.aka-wallet-card-face,
.aka-wallet-card-face.is-front::before {
border-radius:6px;
}
.aka-wallet-card-edge.is-left,
.aka-wallet-card-edge.is-right {
top:7px;
bottom:7px;
}
.aka-wallet-card-edge.is-top,
.aka-wallet-card-edge.is-bottom {
right:7px;
left:7px;
}
@media (max-width:768px) {
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner .aka-wallet-track-command {
min-height:2.75rem !important;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner .aka-wallet-track-face {
width:1.64rem !important;
min-width:1.64rem !important;
height:1.64rem !important;
min-height:1.64rem !important;
}
}
@media (max-width:360px) {
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner .aka-wallet-track-face {
width:1.58rem !important;
min-width:1.58rem !important;
height:1.58rem !important;
min-height:1.58rem !important;
}
}
/* Shared TRACK material. Placement is defined once in the final footer block. */
.aka-wallet-signal-drawer .aka-wallet-drawer-inner .aka-wallet-track-command {
--aka-track-rgb:var(--aka-drawer-rgb);
--aka-track-ink:rgba(var(--aka-drawer-rgb),.78);
position:relative !important;
display:inline-flex !important;
grid-column:1 !important;
width:auto !important;
min-width:0 !important;
height:auto !important;
min-height:2.46rem !important;
align-items:center !important;
justify-content:flex-start !important;
justify-self:start !important;
box-sizing:border-box !important;
gap:.28rem !important;
margin:0 !important;
padding:0 !important;
border:0 !important;
border-radius:0 !important;
background:none !important;
box-shadow:none !important;
color:var(--aka-track-ink) !important;
font:inherit !important;
text-align:left !important;
-webkit-tap-highlight-color:transparent;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner.is-diamond .aka-wallet-track-command {
--aka-track-rgb:var(--aka-dia-edge-rgb);
--aka-track-ink:rgba(var(--aka-dia-highlight-rgb),.82);
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner .aka-wallet-track-command.is-disabled,
.aka-wallet-signal-drawer .aka-wallet-drawer-inner .aka-wallet-track-command:disabled {
opacity:.34 !important;
filter:saturate(.20) brightness(.72) !important;
cursor:default !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner .aka-wallet-track-command.is-ready:not(:disabled) {
opacity:1 !important;
filter:none !important;
cursor:pointer !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner .aka-wallet-track-face {
position:relative !important;
display:grid !important;
width:1.50rem !important;
min-width:1.50rem !important;
height:1.50rem !important;
min-height:1.50rem !important;
flex:0 0 1.50rem !important;
place-items:center !important;
align-self:center !important;
box-sizing:border-box !important;
margin:0 !important;
padding:.16rem !important;
border:1px solid rgba(var(--aka-track-rgb),.34) !important;
border-radius:.27rem !important;
background:linear-gradient(180deg,rgba(var(--aka-track-rgb),.09),rgba(4,5,5,.92)) !important;
box-shadow:inset 0 0 8px rgba(var(--aka-track-rgb),.035) !important;
color:var(--aka-track-ink) !important;
transform:none !important;
transition:border-color .18s ease,box-shadow .18s ease,background .18s ease,transform .14s ease !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner
.aka-wallet-track-face > .aka-wallet-track-signal {
position:relative !important;
display:grid !important;
width:70% !important;
min-width:0 !important;
height:70% !important;
min-height:0 !important;
place-items:center !important;
box-sizing:border-box !important;
margin:auto !important;
padding:0 !important;
color:inherit !important;
transform:none !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner
.aka-wallet-track-face > .aka-wallet-track-signal > svg {
display:block !important;
width:100% !important;
height:100% !important;
overflow:visible !important;
margin:0 !important;
stroke:currentColor !important;
stroke-width:2 !important;
stroke-linecap:round !important;
stroke-linejoin:round !important;
filter:drop-shadow(0 0 4px rgba(var(--aka-track-rgb),.20)) !important;
transform:none !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner .aka-wallet-track-command-label {
display:block !important;
align-self:center !important;
box-sizing:border-box !important;
margin:0 !important;
padding:0 !important;
color:var(--aka-track-ink) !important;
font:600 .58rem/1 "Special Elite",monospace !important;
font-synthesis:none !important;
letter-spacing:.07em !important;
white-space:nowrap !important;
transform:none !important;
}
@media (any-hover:hover) and (pointer:fine) {
.aka-wallet-signal-drawer .aka-wallet-drawer-inner
.aka-wallet-track-command.is-ready:not(:disabled):is(:hover,:focus-visible)
.aka-wallet-track-face {
border-color:rgba(var(--aka-track-rgb),.72) !important;
background:linear-gradient(180deg,rgba(var(--aka-track-rgb),.14),rgba(4,5,5,.94)) !important;
box-shadow:0 0 12px rgba(var(--aka-track-rgb),.18),inset 0 0 9px rgba(var(--aka-track-rgb),.06) !important;
}
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner .aka-wallet-track-command:focus-visible {
outline:1px solid rgba(var(--aka-track-rgb),.62) !important;
outline-offset:3px !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner
.aka-wallet-track-command.is-ready:not(:disabled):active .aka-wallet-track-face {
transform:translateY(1px) scale(.98) !important;
}
@media (max-width:768px) {
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner .aka-wallet-track-command {
min-height:2.75rem !important;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner .aka-wallet-track-face {
width:1.64rem !important;
min-width:1.64rem !important;
height:1.64rem !important;
min-height:1.64rem !important;
flex-basis:1.64rem !important;
}
}
@media (max-width:360px) {
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner .aka-wallet-track-face {
width:1.58rem !important;
min-width:1.58rem !important;
height:1.58rem !important;
min-height:1.58rem !important;
flex-basis:1.58rem !important;
}
}
/* Every opened collectible has one physical 2:3 body. ORIGIN may use a wider
source image, but it fills the same body instead of shortening the card. */
.aka-wallet-gallery-preview-host
.aka-wallet-inline-poster-card[data-wallet-inline-poster-card] {
aspect-ratio:2 / 3 !important;
}
.aka-wallet-gallery-preview-host
.aka-wallet-inline-stage[data-gallery-archive="origin"]
.aka-wallet-card-face.is-front
> img[data-wallet-inline-preview-image] {
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:center !important;
image-rendering:auto !important;
}
html,
body,
body * {
-webkit-user-select:none !important;
user-select:none !important;
-webkit-touch-callout:none;
}
input,
textarea,
select,
[contenteditable=""],
[contenteditable="true"],
[data-allow-native-text] {
-webkit-user-select:text !important;
user-select:text !important;
-webkit-touch-callout:default;
}
img,
svg {
-webkit-user-drag:none;
}
/* V0.43.30 — SHARED WALLET ACTION-ROW CONTRACT.
TRACK uses one physical footprint and one +6px visual baseline across MAG,
BONUS, SECRET, EXCLUSIVE and KEY. KEY alone is anchored to the current drawer
content box so its denser key grid cannot move the action row. */
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-magnifier,.is-key,.is-secret,.is-bonus)
> :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) {
position:relative !important;
display:grid !important;
grid-template-columns:4.08rem minmax(0,1fr) 4.08rem !important;
align-items:center !important;
width:100% !important;
height:2.46rem !important;
min-height:2.46rem !important;
gap:.24rem !important;
margin:auto 0 0 !important;
padding:0 !important;
direction:ltr !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-magnifier,.is-key,.is-secret,.is-bonus)
> :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer)
.aka-wallet-track-command {
grid-column:1 !important;
grid-row:1 !important;
width:4.08rem !important;
min-width:4.08rem !important;
max-width:4.08rem !important;
height:2.46rem !important;
min-height:2.46rem !important;
align-self:center !important;
justify-self:start !important;
justify-content:flex-start !important;
gap:.28rem !important;
margin:0 !important;
padding:0 !important;
transform:translateY(6px) !important;
}
/* KEY uses the same content-box edge as the flow-based reference sectors.
Desktop compact drawers use the compact .62rem horizontal edge; the footer
bottom is calibrated to the exact flow-row baseline instead of the stale .72rem anchor. */
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner.is-key
> .aka-wallet-drawer-footer {
position:absolute !important;
z-index:4 !important;
right:.62rem !important;
bottom:.48rem !important;
left:.62rem !important;
width:auto !important;
margin:0 !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner.is-key
> .aka-wallet-drawer-footer
:is(.aka-wallet-drawer-footer-status,.aka-wallet-key-resolved) {
align-self:center !important;
margin:0 !important;
transform:translateY(6px) !important;
}
@media (max-width:768px) {
/* Mobile TRACK was already approved: keep its exact .52/.56 content-box edge. */
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-key
> .aka-wallet-drawer-footer {
right:.56rem !important;
bottom:.52rem !important;
left:.56rem !important;
}
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-magnifier,.is-key,.is-secret,.is-bonus)
> :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer)
.aka-wallet-track-face {
width:1.50rem !important;
min-width:1.50rem !important;
height:1.50rem !important;
min-height:1.50rem !important;
flex:0 0 1.50rem !important;
padding:.16rem !important;
border-radius:.27rem !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-magnifier,.is-key,.is-secret,.is-bonus)
> :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer)
.aka-wallet-track-command-label {
font:600 .58rem/1 "Special Elite",monospace !important;
letter-spacing:.07em !important;
transform:none !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
.aka-wallet-gallery-command {
grid-column:3 !important;
grid-row:1 !important;
width:4.08rem !important;
min-width:4.08rem !important;
max-width:4.08rem !important;
height:2.46rem !important;
min-height:2.46rem !important;
display:inline-flex !important;
align-items:center !important;
align-self:center !important;
justify-content:flex-end !important;
justify-self:end !important;
box-sizing:border-box !important;
gap:.22rem !important;
margin:0 !important;
padding:0 !important;
transform:translateY(6px) !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
.aka-wallet-gallery-face {
display:grid !important;
width:1.50rem !important;
min-width:1.50rem !important;
height:1.50rem !important;
min-height:1.50rem !important;
flex:0 0 1.50rem !important;
place-items:center !important;
align-self:center !important;
box-sizing:border-box !important;
margin:0 !important;
padding:.16rem !important;
border-radius:.27rem !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
.aka-wallet-gallery-command-label {
align-self:center !important;
margin:0 !important;
padding:0 !important;
font:600 .48rem/1 "Special Elite",monospace !important;
letter-spacing:.04em !important;
transform:none !important;
}
/* Every Gallery state uses the exact Wallet height measured before GALLERY was
opened. Normal signal drawers never receive this lock. */
#walletDropdown.is-gallery-preview-size-locked,
.aka-mobile-identity-panel.is-gallery-preview-size-locked {
height:var(--aka-wallet-gallery-locked-height) !important;
min-height:var(--aka-wallet-gallery-locked-height) !important;
max-height:var(--aka-wallet-gallery-locked-height) !important;
}
/* Keep DISCONNECT on the exact normal-sector bottom baseline throughout the
archive chooser, miniature collection and mounted poster preview. */
#walletDropdown.is-gallery-preview-size-locked > #walletDropdownDisconnectBtn {
position:absolute !important;
z-index:13;
right:1.04rem !important;
bottom:.92rem !important;
left:1.04rem !important;
width:auto !important;
margin:0 !important;
}
@media (min-width:769px) {
/* Gallery's internal artboard is 1.04rem taller than a regular signal drawer.
Lift that preserved artboard by the same delta so its bottom aligns with
the normal drawer and never runs under the fixed DISCONNECT control. */
#walletDropdown.is-gallery-preview-size-locked
> .aka-wallet-signal-drawer:has(> .aka-wallet-drawer-inner.is-inline-gallery) {
position:relative !important;
top:-1.04rem !important;
}
}
@media (max-width:768px) {
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-diamond,.is-magnifier,.is-key,.is-secret,.is-bonus)
> :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) {
grid-template-columns:4.16rem minmax(0,1fr) 4.16rem !important;
height:2.75rem !important;
min-height:2.75rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-diamond,.is-magnifier,.is-key,.is-secret,.is-bonus)
> :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer)
:is(.aka-wallet-track-command,.aka-wallet-gallery-command) {
width:4.16rem !important;
min-width:4.16rem !important;
max-width:4.16rem !important;
height:2.75rem !important;
min-height:2.75rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-diamond,.is-magnifier,.is-key,.is-secret,.is-bonus)
> :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer)
:is(.aka-wallet-track-face,.aka-wallet-gallery-face) {
width:1.64rem !important;
min-width:1.64rem !important;
height:1.64rem !important;
min-height:1.64rem !important;
flex:0 0 1.64rem !important;
}
}
@media (max-width:360px) {
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-diamond,.is-magnifier,.is-key,.is-secret,.is-bonus)
> :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) {
grid-template-columns:4.02rem minmax(0,1fr) 4.02rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-diamond,.is-magnifier,.is-key,.is-secret,.is-bonus)
> :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer)
:is(.aka-wallet-track-command,.aka-wallet-gallery-command) {
width:4.02rem !important;
min-width:4.02rem !important;
max-width:4.02rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-diamond,.is-magnifier,.is-key,.is-secret,.is-bonus)
> :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer)
:is(.aka-wallet-track-face,.aka-wallet-gallery-face) {
width:1.58rem !important;
min-width:1.58rem !important;
height:1.58rem !important;
min-height:1.58rem !important;
flex:0 0 1.58rem !important;
}
}
/* V0.42.32 — MATCHED GALLERY COMMAND / MOBILE IDENTITY MATERIAL.
TRACK and GALLERY keep their approved positions but now use one explicit
physical footprint. Gallery's denser inner mark is reduced optically. */
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
> :is(.aka-wallet-track-command,.aka-wallet-gallery-command) {
width:4.08rem !important;
min-width:4.08rem !important;
max-width:4.08rem !important;
height:2.46rem !important;
min-height:2.46rem !important;
max-height:2.46rem !important;
box-sizing:border-box !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
> :is(.aka-wallet-track-command,.aka-wallet-gallery-command)
> :is(.aka-wallet-track-face,.aka-wallet-gallery-face) {
width:1.50rem !important;
min-width:1.50rem !important;
max-width:1.50rem !important;
height:1.50rem !important;
min-height:1.50rem !important;
max-height:1.50rem !important;
flex:0 0 1.50rem !important;
box-sizing:border-box !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
.aka-wallet-gallery-command {
gap:.18rem !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
.aka-wallet-gallery-command-label {
font-size:.46rem !important;
letter-spacing:.035em !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
.aka-wallet-gallery-face > .aka-wallet-gallery-stack-glyph {
transform:scale(1.18) !important;
transform-origin:50% 50% !important;
}
@media (max-width:768px) {
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
> :is(.aka-wallet-track-command,.aka-wallet-gallery-command) {
width:4.16rem !important;
min-width:4.16rem !important;
max-width:4.16rem !important;
height:2.75rem !important;
min-height:2.75rem !important;
max-height:2.75rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
> :is(.aka-wallet-track-command,.aka-wallet-gallery-command)
> :is(.aka-wallet-track-face,.aka-wallet-gallery-face) {
width:1.64rem !important;
min-width:1.64rem !important;
max-width:1.64rem !important;
height:1.64rem !important;
min-height:1.64rem !important;
max-height:1.64rem !important;
flex-basis:1.64rem !important;
}
/* Connected remains a status rather than competing with the identity title.
Geometry is unchanged; only the emerald material and halo are quieter. */
.aka-mobile-identity-panel.is-connected
#mobileWalletConnectBtn.is-connected:not(.is-reward-pending):not(.is-classified-active) {
border-color:rgba(74,222,128,.43) !important;
background:
radial-gradient(circle at 16% 46%,rgba(74,222,128,.075),transparent 39%),
linear-gradient(180deg,rgba(8,34,22,.91),rgba(3,9,7,.985)) !important;
box-shadow:
inset 0 1px 0 rgba(235,255,242,.055),
inset 0 -12px 24px rgba(0,0,0,.27),
0 0 0 1px rgba(0,0,0,.62),
0 0 11px rgba(74,222,128,.105),
0 11px 24px rgba(0,0,0,.28) !important;
}
.aka-mobile-identity-panel.is-connected
#mobileWalletConnectBtn.is-connected:not(.is-reward-pending):not(.is-classified-active)
.aka-wallet-icon-wrap {
width:1.96rem !important;
height:1.96rem !important;
border-color:rgba(91,229,139,.55) !important;
background:
radial-gradient(circle at 48% 36%,rgba(30,132,70,.72),rgba(7,61,32,.90) 58%,rgba(2,17,9,.98) 100%) !important;
box-shadow:
inset 0 1px 0 rgba(240,255,246,.07),
inset 0 -9px 16px rgba(0,0,0,.40),
0 0 7px rgba(74,222,128,.13) !important;
}
.aka-mobile-identity-panel.is-connected
#mobileWalletConnectBtn.is-connected:not(.is-reward-pending):not(.is-classified-active)
.aka-wallet-icon-wrap svg {
color:rgba(102,235,149,.94) !important;
filter:drop-shadow(0 0 3px rgba(74,222,128,.34)) !important;
}
.aka-mobile-identity-panel.is-connected #mobileWalletConnectBtn.is-connected
#mobileWalletStatusTitle {
color:rgba(239,246,240,.94) !important;
letter-spacing:.105em !important;
text-shadow:0 1px 0 rgba(0,0,0,.96),0 0 4px rgba(74,222,128,.09) !important;
}
.aka-mobile-identity-panel.is-connected #mobileWalletConnectBtn.is-connected
#mobileWalletStatusText {
color:rgba(116,181,194,.84) !important;
text-shadow:0 1px 0 rgba(0,0,0,.94),0 0 4px rgba(76,158,174,.08) !important;
}
/* TITLE becomes a shallow engraved plate inside its original fixed height. */
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"] {
position:relative;
isolation:isolate;
min-height:3.58rem;
padding:.80rem 2.34rem .20rem !important;
border-top:1px solid rgba(212,168,67,.245) !important;
border-bottom:1px solid rgba(212,168,67,.14) !important;
background:
radial-gradient(ellipse at 50% 46%,rgba(212,168,67,.026),transparent 64%),
linear-gradient(180deg,rgba(255,247,226,.010),rgba(0,0,0,.17)) !important;
box-shadow:
inset 0 1px 0 rgba(255,247,226,.018),
inset 0 -10px 18px rgba(0,0,0,.15) !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-mobile-wallet-title-label {
top:-.27rem;
width:auto !important;
padding:.04rem .46rem 0;
color:rgba(222,184,92,.76) !important;
background:linear-gradient(90deg,rgba(7,8,7,.86),rgba(8,8,7,.98) 22% 78%,rgba(7,8,7,.86));
font-size:.47rem !important;
letter-spacing:.19em !important;
line-height:1 !important;
text-shadow:0 1px 0 rgba(0,0,0,.94) !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
gap:.38rem;
transform:translateY(1px);
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::before,
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::after {
width:.90rem;
min-width:.90rem;
flex-basis:.90rem;
opacity:.76;
filter:drop-shadow(0 0 2px rgba(212,168,67,.13));
}
}
@media (max-width:360px) {
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
> :is(.aka-wallet-track-command,.aka-wallet-gallery-command) {
width:4.02rem !important;
min-width:4.02rem !important;
max-width:4.02rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
> :is(.aka-wallet-track-command,.aka-wallet-gallery-command)
> :is(.aka-wallet-track-face,.aka-wallet-gallery-face) {
width:1.58rem !important;
min-width:1.58rem !important;
max-width:1.58rem !important;
height:1.58rem !important;
min-height:1.58rem !important;
max-height:1.58rem !important;
flex-basis:1.58rem !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"] {
padding-inline:1.98rem !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::before,
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section[data-wallet-title-context="player"]
#mobileWalletIdentityStatus::after {
width:.82rem;
min-width:.82rem;
flex-basis:.82rem;
}
}
/* V0.42.33 — EXCLUSIVE-GRAMMAR ACTIVITY MODULES / SILENT INACTIVE TRACK.
INVESTIGATION, SECRET REEL and BONUS use the same two-cell hierarchy and
fixed action rail as EXCLUSIVE. KEY is deliberately outside every selector. */
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
> .aka-wallet-drawer-heading {
margin-bottom:.30rem !important;
}
/* MAG and BONUS use EXCLUSIVE's activity-row baseline without touching the
already approved TRACK/footer geometry. The 7px visual offset is measured
against the EXCLUSIVE summary row in the V4335 desktop reference captures.
The etched signal rail occupies the newly opened breathing space above the
activity cells; it is decorative only and cannot affect layout or input. */
@media (min-width:769px) {
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-bonus)
> .aka-wallet-activity-summary {
position:relative !important;
transform:translateY(7px) !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-bonus)
> .aka-wallet-drawer-heading {
position:relative !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-bonus)
> .aka-wallet-drawer-heading::after {
content:"";
position:absolute;
right:0;
bottom:-.23rem;
left:0;
height:1px;
pointer-events:none;
background:linear-gradient(
90deg,
rgba(var(--aka-drawer-rgb),.44) 0%,
rgba(var(--aka-drawer-rgb),.16) 31%,
rgba(212,168,67,.12) 56%,
rgba(var(--aka-drawer-rgb),.055) 82%,
transparent 100%
);
box-shadow:0 0 5px rgba(var(--aka-drawer-rgb),.055);
opacity:.78;
}
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
> .aka-wallet-activity-summary {
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
align-items:stretch !important;
width:100% !important;
min-width:0 !important;
gap:.30rem !important;
margin:0 0 .12rem !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
.aka-wallet-activity-stat {
--aka-activity-stat-rgb:var(--aka-drawer-rgb);
display:flex !important;
min-width:0 !important;
min-height:1.68rem !important;
align-items:center !important;
gap:.30rem !important;
box-sizing:border-box !important;
padding:.31rem .38rem !important;
border:1px solid rgba(var(--aka-activity-stat-rgb),.23) !important;
border-radius:5px !important;
background:
radial-gradient(circle at 0 0,rgba(var(--aka-activity-stat-rgb),.050),transparent 62%),
rgba(3,3,4,.58) !important;
color:rgba(var(--aka-activity-stat-rgb),.82) !important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.018) !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
.aka-wallet-activity-stat.is-completed {
--aka-activity-stat-rgb:87,218,151;
border-color:rgba(var(--aka-activity-stat-rgb),.18) !important;
background:
radial-gradient(circle at 0 0,rgba(var(--aka-activity-stat-rgb),.070),transparent 62%),
rgba(3,5,4,.58) !important;
color:rgba(126,228,176,.78) !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
.aka-wallet-activity-stat-icon {
display:grid !important;
width:1.04rem !important;
min-width:1.04rem !important;
height:1.04rem !important;
min-height:1.04rem !important;
flex:0 0 1.04rem !important;
place-items:center !important;
box-sizing:border-box !important;
border:1px solid rgba(var(--aka-activity-stat-rgb),.36) !important;
border-radius:3px !important;
background:rgba(var(--aka-activity-stat-rgb),.075) !important;
color:rgba(var(--aka-activity-stat-rgb),.90) !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
.aka-wallet-activity-stat.is-completed
.aka-wallet-activity-stat-icon {
border-color:rgba(var(--aka-activity-stat-rgb),.30) !important;
background:rgba(var(--aka-activity-stat-rgb),.045) !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
.aka-wallet-activity-stat-icon > svg {
display:block !important;
width:.61rem !important;
min-width:.61rem !important;
height:.61rem !important;
min-height:.61rem !important;
flex:0 0 .61rem !important;
overflow:visible !important;
color:currentColor !important;
stroke-width:1.85 !important;
filter:drop-shadow(0 0 2px rgba(var(--aka-activity-stat-rgb),.24)) !important;
transform:none !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner.is-secret
.aka-wallet-activity-stat-icon > .aka-reel-glyph.aka-wallet-secret-reel {
width:.76rem !important;
min-width:.76rem !important;
height:.76rem !important;
min-height:.76rem !important;
flex-basis:.76rem !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
.aka-wallet-activity-stat > span:not(.aka-wallet-activity-stat-icon) {
min-width:0 !important;
overflow:hidden !important;
color:currentColor !important;
font:600 .39rem/1.08 "Special Elite",monospace !important;
letter-spacing:.065em !important;
text-overflow:ellipsis !important;
white-space:nowrap !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
.aka-wallet-activity-stat > strong {
margin-inline-start:auto !important;
color:currentColor !important;
font:700 .69rem/1 "Space Grotesk",sans-serif !important;
font-variant-numeric:tabular-nums !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
> .aka-wallet-drawer-footer
.aka-wallet-drawer-footer-status:empty {
visibility:hidden !important;
}
html[lang="ru"] .aka-wallet-activity-stat > span:not(.aka-wallet-activity-stat-icon) {
font-size:.32rem !important;
letter-spacing:.015em !important;
}
html[lang="ar"] .aka-wallet-activity-stat > span:not(.aka-wallet-activity-stat-icon) {
font-size:.36rem !important;
letter-spacing:0 !important;
}
@media (max-width:768px) {
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
> .aka-wallet-drawer-footer {
grid-template-columns:4.16rem minmax(0,1fr) 4.16rem !important;
height:2.75rem !important;
min-height:2.75rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
> .aka-wallet-drawer-footer
.aka-wallet-track-command {
width:4.16rem !important;
min-width:4.16rem !important;
max-width:4.16rem !important;
height:2.75rem !important;
min-height:2.75rem !important;
max-height:2.75rem !important;
}
}
@media (max-width:360px) {
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
> .aka-wallet-drawer-footer {
grid-template-columns:4.02rem minmax(0,1fr) 4.02rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
> .aka-wallet-drawer-footer
.aka-wallet-track-command {
width:4.02rem !important;
min-width:4.02rem !important;
max-width:4.02rem !important;
}
}
/* V0.42.34 — POSTER VOCABULARY / AUTHORED PRIMARY GLYPHS / MOBILE TITLE RHYTHM.
The completion cell remains emerald. The INVESTIGATION primary identity
receives its native material, and the fixed mobile plate keeps its height. */
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner.is-magnifier
.aka-wallet-activity-stat.is-available
.aka-wallet-activity-stat-icon {
position:relative !important;
isolation:isolate !important;
background:
radial-gradient(circle at 47% 45%,rgba(78,205,235,.34) 0 20%,rgba(78,205,235,.09) 21% 31%,transparent 32%),
rgba(var(--aka-activity-stat-rgb),.075) !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner.is-magnifier
.aka-wallet-activity-stat.is-available
.aka-wallet-activity-stat-icon > svg.aka-archive-magnifier-glyph {
position:relative !important;
z-index:1 !important;
color:rgb(225,164,103) !important;
filter:drop-shadow(0 0 1.5px rgba(78,205,235,.46)) !important;
}
@media (max-width:768px) {
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-mobile-wallet-title-label {
top:.40rem !important;
padding:0 !important;
background:none !important;
}
}
/* V0.42.36 — CANONICAL REEL / MOBILE GALLERY FIT / VAULT RHYTHM.
Every change below is internal to an already fixed module. Wallet height,
DISCONNECT, KEY, TRACK, poster-card geometry and recovered-state colour stay
outside this release boundary. */
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner.is-secret
.aka-wallet-activity-stat.is-available
.aka-wallet-activity-stat-icon > .aka-reel-glyph.aka-wallet-secret-reel {
--aka-reel-rgb:255,78,76 !important;
--aka-reel-dark:2,9,16 !important;
--aka-reel-fill-rgb:24,78,132 !important;
color:rgb(var(--aka-reel-rgb)) !important;
filter:drop-shadow(0 0 2px rgba(var(--aka-reel-rgb),.20)) !important;
}
.aka-wallet-drawer-inner.is-vault {
justify-content:flex-start;
}
.aka-wallet-drawer-inner.is-vault .aka-wallet-vault-stat {
min-height:3.28rem;
}
.aka-wallet-drawer-inner.is-vault .aka-wallet-drawer-action.is-vault-claim {
flex:0 0 auto;
margin-top:auto;
margin-bottom:0;
}
@media (max-width:768px) {
/* The frozen mobile Wallet was measured with a regular 6.48rem drawer.
Gallery previously kept its desktop 7.60rem artboard, so shortening only
the cylinder never moved the black frame itself. Match the regular drawer
footprint and fit the archive wheel inside it. */
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"] {
height:6.48rem;
min-height:6.48rem;
max-height:6.48rem;
padding:.32rem .46rem .28rem;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-inline-heading {
margin-bottom:.08rem;
font-size:.52rem;
letter-spacing:.12em;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-chooser {
height:4.40rem;
min-height:4.40rem;
flex-basis:4.40rem;
box-sizing:border-box;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-cylinder {
inset:.26rem 0;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-previous {
transform:translateY(calc(-50% - 1.34rem)) rotateX(-13deg) scale(.88);
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-next {
transform:translateY(calc(-50% + 1.34rem)) rotateX(13deg) scale(.88);
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade.is-gallery-context[data-wallet-title-context="archive"] {
height:2.32rem;
min-height:2.32rem;
max-height:2.32rem;
gap:.12rem;
padding:.20rem .42rem .22rem;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade.is-gallery-context[data-wallet-title-context="archive"]
.aka-mobile-wallet-title-label {
font:600 .49rem/1 "Special Elite",monospace !important;
letter-spacing:.16em !important;
}
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade.is-gallery-context[data-wallet-title-context="archive"]
.aka-mobile-wallet-title-value {
font:400 1.02rem/1 "Bebas Neue","Arial Narrow",sans-serif !important;
letter-spacing:.10em !important;
}
}
/* V0.42.38 — RESTRAINED OUTSIDER / MATCHED GALLERY INSET / ICON-ONLY OPEN.
These are optical changes inside the frozen Wallet. They do not alter the
Wallet shell, signal-drawer height, DISCONNECT baseline or poster preview. */
.aka-wallet-dropdown-title:is(.aka-status-no-id,.aka-status-outsider)
> .aka-wallet-player-title-text,
.aka-mobile-identity-panel:is(.aka-status-no-id,.aka-status-outsider)
.aka-mobile-wallet-title-value > .aka-wallet-player-title-text {
color:rgba(214,211,201,.88) !important;
-webkit-text-fill-color:rgba(214,211,201,.88) !important;
-webkit-text-stroke:.30px rgba(18,17,16,.98) !important;
paint-order:stroke fill !important;
font-family:"Bebas Neue","Arial Narrow",sans-serif !important;
font-size:1.12rem !important;
font-weight:400 !important;
line-height:1 !important;
letter-spacing:.18em !important;
text-shadow:0 1px 0 rgba(0,0,0,.98),0 0 7px rgba(190,177,144,.10) !important;
filter:none !important;
}
.aka-wallet-dropdown-title:is(.aka-status-no-id,.aka-status-outsider)
> .aka-wallet-player-title-text::before,
.aka-mobile-identity-panel:is(.aka-status-no-id,.aka-status-outsider)
.aka-mobile-wallet-title-value > .aka-wallet-player-title-text::before {
content:none !important;
display:none !important;
}
.aka-wallet-dropdown-title:is(.aka-status-no-id,.aka-status-outsider)::before,
.aka-wallet-dropdown-title:is(.aka-status-no-id,.aka-status-outsider)::after,
.aka-mobile-identity-panel:is(.aka-status-no-id,.aka-status-outsider)
.aka-mobile-wallet-title-value::before,
.aka-mobile-identity-panel:is(.aka-status-no-id,.aka-status-outsider)
.aka-mobile-wallet-title-value::after {
content:none !important;
display:none !important;
}
/* Archives and miniature cards inherit this exact same modest inset. The
large poster preview is mounted separately and deliberately remains intact. */
.aka-wallet-signal-drawer
> .aka-wallet-drawer-inner.is-inline-gallery:is(
[data-wallet-gallery-view="archives"],
[data-wallet-gallery-view="collection"]
) {
width:calc(100% - .56rem) !important;
min-width:0 !important;
max-width:calc(100% - .56rem) !important;
margin-inline:auto !important;
box-sizing:border-box !important;
}
.aka-wallet-inline-heading:not(.is-collection) {
line-height:1.30 !important;
}
.aka-wallet-inline-heading:not(.is-collection) > span:first-child {
overflow:hidden !important;
padding-block:.07rem .02rem !important;
text-overflow:ellipsis !important;
}
/* The label describes the command but owns no hit area. Only the square icon
is a real button, so taps beside it can never open Gallery accidentally. */
.aka-wallet-gallery-command {
pointer-events:none !important;
cursor:default !important;
}
.aka-wallet-gallery-command-label {
pointer-events:none !important;
user-select:none !important;
}
.aka-wallet-gallery-command > .aka-wallet-gallery-face {
appearance:none !important;
pointer-events:auto !important;
color:inherit !important;
font:inherit !important;
cursor:pointer !important;
-webkit-tap-highlight-color:transparent;
}
.aka-wallet-gallery-command > .aka-wallet-gallery-face:focus-visible {
outline:1px solid rgba(var(--aka-diamond-command-rgb),.72) !important;
outline-offset:3px !important;
}
.aka-wallet-gallery-command > .aka-wallet-gallery-face:active {
transform:translateY(1px) scale(.98) !important;
}
@media (max-width:768px) {
.aka-mobile-identity-panel:is(.aka-status-no-id,.aka-status-outsider)
.aka-mobile-wallet-title-value > .aka-wallet-player-title-text {
font-size:1.16rem !important;
letter-spacing:.17em !important;
}
}
/* V0.42.39 — MATCHED GALLERY TOP AIR GAP / FROZEN CONTENT GEOMETRY.
The previous inset moved only the side edges. Move the top frame down by
.20rem in BOTH compact Gallery views, then remove that same amount from the
frame height and top padding. This produces real air below the selected
signal halo while preserving every content and bottom-edge coordinate. */
.aka-wallet-signal-drawer
> .aka-wallet-drawer-inner.is-inline-gallery:is(
[data-wallet-gallery-view="archives"],
[data-wallet-gallery-view="collection"]
) {
position:relative !important;
top:.20rem !important;
height:calc(7.60rem - .20rem) !important;
min-height:calc(7.60rem - .20rem) !important;
max-height:calc(7.60rem - .20rem) !important;
padding-top:calc(.46rem - .20rem) !important;
}
@media (max-width:768px) {
.aka-wallet-signal-drawer.is-mobile
> .aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"] {
height:calc(6.48rem - .20rem) !important;
min-height:calc(6.48rem - .20rem) !important;
max-height:calc(6.48rem - .20rem) !important;
padding-top:calc(.32rem - .20rem) !important;
}
}
/* V0.42.40 — GALLERY MICRO SPACING / ONE-PIXEL DISCONNECT.
Add only one pixel of inset per side and two pixels of vertical travel to
both compact Gallery frames. DISCONNECT receives one independent optical
pixel, so its calm state remains centred and its press transform is intact. */
.aka-wallet-signal-drawer
> .aka-wallet-drawer-inner.is-inline-gallery:is(
[data-wallet-gallery-view="archives"],
[data-wallet-gallery-view="collection"]
) {
width:calc(100% - .56rem - 2px) !important;
max-width:calc(100% - .56rem - 2px) !important;
top:calc(.20rem + 2px) !important;
}
#walletDropdownDisconnectBtn {
translate:0 1px !important;
}
/* V0.42.42 — EXCLUSIVE FRAME PARITY / PURPOSE-SPECIFIC GALLERY CONTENT.
The expanded EXCLUSIVE drawer is now the sole outer-geometry reference.
Both Gallery states occupy that exact frame; only their internal archive
wheel and collectible shelf are adapted to the shared footprint. */
.aka-wallet-signal-drawer
> .aka-wallet-drawer-inner.is-inline-gallery:is(
[data-wallet-gallery-view="archives"],
[data-wallet-gallery-view="collection"]
) {
width:calc(100% - .20rem) !important;
min-width:0 !important;
max-width:calc(100% - .20rem) !important;
height:6.56rem !important;
min-height:6.56rem !important;
max-height:6.56rem !important;
top:0 !important;
}
/* The old Gallery artboard was 1.04rem taller than EXCLUSIVE and therefore
needed a desktop lift. Equal frames must share the natural drawer baseline. */
@media (min-width:769px) {
#walletDropdown.is-gallery-preview-size-locked
> .aka-wallet-signal-drawer:has(> .aka-wallet-drawer-inner.is-inline-gallery) {
top:0 !important;
}
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-chooser {
height:auto !important;
min-height:0 !important;
flex:1 1 auto !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-cylinder {
inset:.26rem 0 !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-previous {
transform:translateY(calc(-50% - 1.34rem)) rotateX(-13deg) scale(.88);
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-next {
transform:translateY(calc(-50% + 1.34rem)) rotateX(13deg) scale(.88);
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-rail {
--aka-gallery-rail-end-space:max(.26rem,calc(100% - 7.30rem));
padding-top:.08rem !important;
padding-bottom:.08rem !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-entry {
width:3.64rem;
min-width:3.64rem;
height:5.46rem;
min-height:5.46rem;
flex-basis:3.64rem;
}
@media (max-width:768px) {
.aka-wallet-signal-drawer.is-mobile
> .aka-wallet-drawer-inner.is-inline-gallery:is(
[data-wallet-gallery-view="archives"],
[data-wallet-gallery-view="collection"]
) {
width:calc(100% - .20rem) !important;
max-width:calc(100% - .20rem) !important;
height:6.48rem !important;
min-height:6.48rem !important;
max-height:6.48rem !important;
top:0 !important;
padding:.46rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-entry {
width:3.56rem;
min-width:3.56rem;
height:5.34rem;
min-height:5.34rem;
flex-basis:3.56rem;
}
}
/* V0.42.44 — CLEAN GALLERY GEOMETRY.
Keep the approved EXCLUSIVE-sized outer frame. Inside it, remove the old
decorative rails, give the collection equal card clearance and reduce the
archive cylinder to three complete, quiet plates. */
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-gallery-collection {
top:.10rem;
height:calc(100% - .10rem);
background:
radial-gradient(ellipse at 48% 50%,rgba(var(--aka-gallery-gold),.022),transparent 64%),
linear-gradient(180deg,rgba(255,246,219,.008),transparent 28% 78%,rgba(0,0,0,.24)) !important;
box-shadow:none !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-gallery-collection::before,
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-gallery-collection::after {
content:none !important;
display:none !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-rail {
height:100%;
padding-top:.10rem !important;
padding-bottom:.10rem !important;
background:none !important;
transform:none;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-entry {
width:3.56rem;
min-width:3.56rem;
height:5.28rem;
min-height:5.28rem;
flex-basis:3.56rem;
box-shadow:0 4px 12px rgba(0,0,0,.48) !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-entry::before {
content:none !important;
display:none !important;
}
@media (any-hover:hover) and (pointer:fine) {
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-entry:hover {
transform:translateY(-.05rem) rotateX(.25deg) scale(1.003);
box-shadow:
0 6px 15px rgba(0,0,0,.62),
0 0 7px rgba(var(--aka-gallery-item-rgb),.055) !important;
}
}
/* ORIGIN's source is wider than the standard card. `cover` cut the authored
edges; `contain` preserves the complete poster inside the same 2:3 body. */
.aka-wallet-gallery-preview-host
.aka-wallet-inline-stage[data-gallery-archive="origin"]
.aka-wallet-card-face.is-front
> img[data-wallet-inline-preview-image] {
width:100% !important;
height:100% !important;
object-fit:contain !important;
object-position:center !important;
background:#000 !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-chooser::before,
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-chooser::after {
content:none !important;
display:none !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-cylinder {
inset:.18rem 0 !important;
overflow:visible;
-webkit-mask-image:none !important;
mask-image:none !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option {
left:.48rem;
width:calc(100% - .96rem);
min-height:1.28rem;
gap:.38rem;
padding:.15rem .52rem .13rem .56rem;
border-color:transparent;
border-radius:4px;
background:transparent !important;
box-shadow:none !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-active {
left:.14rem;
width:calc(100% - .28rem);
min-height:1.52rem;
border-color:rgba(var(--aka-gallery-archive-rgb),.28);
background:linear-gradient(90deg,rgba(var(--aka-gallery-archive-rgb),.045),rgba(2,3,3,.93) 38% 68%,rgba(var(--aka-gallery-archive-rgb),.018)) !important;
box-shadow:
0 3px 9px rgba(0,0,0,.42),
inset 0 0 8px rgba(var(--aka-gallery-archive-rgb),.018) !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-previous {
transform:translateY(calc(-50% - 1.28rem)) rotateX(-10deg) scale(.84);
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-next {
transform:translateY(calc(-50% + 1.28rem)) rotateX(10deg) scale(.84);
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-name {
padding-block:.05rem .02rem;
font-size:.49rem;
line-height:1.12;
letter-spacing:.055em;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-active .aka-wallet-gallery-archive-name {
font-size:.58rem;
line-height:1.12;
letter-spacing:.062em;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-status {
margin-inline-end:.38rem;
padding-block:.04rem .02rem;
font-size:.38rem;
line-height:1.10;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-active .aka-wallet-gallery-archive-status {
font-size:.43rem;
line-height:1.10;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-step {
width:1.72rem;
height:.42rem;
color:rgba(var(--aka-gallery-gold),.36);
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-step.is-previous { top:0; }
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-step.is-next { bottom:0; }
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-step svg {
width:.52rem;
height:.52rem;
stroke-width:1.35;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-inline-heading {
grid-template-columns:1rem minmax(0,1fr) 1rem;
gap:.44rem;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-inline-dismiss {
width:.98rem;
height:.98rem;
justify-self:end;
font-size:.66rem;
border-color:rgba(var(--aka-gallery-gold),.18);
}
@media (max-width:768px) {
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-entry {
width:3.50rem;
min-width:3.50rem;
height:5.22rem;
min-height:5.22rem;
flex-basis:3.50rem;
}
}
/* V0.42.45 — HIGH-QUALITY ORIGIN SOURCE / SOFT ARCHIVE REVOLVER.
The EXCLUSIVE-sized Gallery frame remains frozen. The two neighbouring
archive planes gain only five scale points and settle in one motion. */
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option {
backface-visibility:hidden;
will-change:transform,opacity;
transition:
opacity 220ms ease,
border-color 210ms ease,
color 210ms ease,
background 210ms ease,
box-shadow 240ms ease,
transform 260ms cubic-bezier(.22,.80,.22,1);
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-previous {
transform:translateY(calc(-50% - 1.28rem)) rotateX(-10deg) scale(.89);
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-next {
transform:translateY(calc(-50% + 1.28rem)) rotateX(10deg) scale(.89);
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-offstage {
visibility:hidden;
opacity:0;
transform:translateY(-50%) rotateX(0) scale(.89);
}
html.aka-performance-lite
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option {
transition-duration:.01ms !important;
}
@media (prefers-reduced-motion:reduce) {
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option {
transition-duration:.01ms !important;
}
}
/* V0.42.46 — EQUAL ORIGIN CARD / SHARED BODY.
ORIGIN inherits the exact common shelf and opened-card geometry. No special
width or height is allowed to make it thicker than neighbouring cards. */
/* V0.42.47 — SHARP EQUAL ORIGIN / FIVE-PERCENT READABILITY.
Geometry remains frozen. Only the requested text and inner glyphs gain
optical weight; the lead ORIGIN artwork keeps the common body and uses the
full-quality source without allowing any older cover rule to crop it. */
.aka-wallet-gallery-preview-host
.aka-wallet-inline-stage[data-gallery-archive="origin"]
.aka-wallet-card-face.is-front
> img[data-wallet-inline-preview-image] {
width:100% !important;
height:100% !important;
object-fit:contain !important;
object-position:center !important;
image-rendering:auto !important;
}
.aka-wallet-diamond-stat > span:not(.aka-wallet-diamond-stat-icon),
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
.aka-wallet-activity-stat > span:not(.aka-wallet-activity-stat-icon) {
font-size:.41rem !important;
}
.aka-wallet-diamond-stat-icon svg,
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-bonus)
.aka-wallet-activity-stat-icon > svg {
width:.64rem !important;
min-width:.64rem !important;
height:.64rem !important;
min-height:.64rem !important;
flex-basis:.64rem !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner.is-secret
.aka-wallet-activity-stat-icon > .aka-reel-glyph.aka-wallet-secret-reel {
width:.80rem !important;
min-width:.80rem !important;
height:.80rem !important;
min-height:.80rem !important;
flex-basis:.80rem !important;
}
.aka-wallet-drawer-inner.is-vault .aka-wallet-drawer-action.is-vault-claim {
padding:.44rem .55rem !important;
font-size:.505rem !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
.aka-wallet-gallery-command-label {
font-size:.485rem !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-status {
font-size:.40rem;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-active
.aka-wallet-gallery-archive-status {
font-size:.45rem;
}
/* V0.42.48 — CLEAN ORIGIN / LEGIBLE WALLET / CONTINUOUS REVOLVER.
Outer Wallet and Gallery geometry stays frozen. The lead ORIGIN thumbnail
uses its reliable WEB source; the opened card keeps the full source. Both
use one art layer and a tiny edge crop instead of bars or synthetic fill. */
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-entry.has-origin-edge-fit
> .aka-wallet-gallery-entry-art,
.aka-wallet-gallery-preview-host
.aka-wallet-inline-stage.has-origin-edge-fit
.aka-wallet-card-face.is-front
> img[data-wallet-inline-preview-image] {
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:center !important;
background:#020303 !important;
image-rendering:auto !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-magnifier,.is-secret,.is-bonus)
> .aka-wallet-drawer-heading {
font-size:.54rem !important;
letter-spacing:.115em !important;
}
.aka-wallet-diamond-stat > span:not(.aka-wallet-diamond-stat-icon),
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
.aka-wallet-activity-stat > span:not(.aka-wallet-activity-stat-icon) {
font-size:.46rem !important;
letter-spacing:.055em !important;
}
.aka-wallet-diamond-stat-icon svg,
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-magnifier,.is-bonus)
.aka-wallet-activity-stat-icon > svg {
width:.68rem !important;
min-width:.68rem !important;
height:.68rem !important;
min-height:.68rem !important;
flex-basis:.68rem !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner.is-secret
.aka-wallet-activity-stat-icon > .aka-reel-glyph.aka-wallet-secret-reel {
width:.85rem !important;
min-width:.85rem !important;
height:.85rem !important;
min-height:.85rem !important;
flex-basis:.85rem !important;
}
.aka-wallet-drawer-inner.is-vault .aka-wallet-vault-stat small {
font-size:.57rem !important;
letter-spacing:.072em !important;
}
.aka-wallet-drawer-inner.is-vault .aka-wallet-vault-unit {
font-size:.54rem !important;
letter-spacing:.085em !important;
}
.aka-wallet-drawer-inner.is-vault .aka-wallet-drawer-action.is-vault-claim {
font-size:.56rem !important;
}
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
.aka-wallet-gallery-command-label {
font-size:.53rem !important;
letter-spacing:.035em !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-inline-heading:not(.is-collection) {
font-size:.53rem !important;
letter-spacing:.12em !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-name {
font-size:.54rem;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-active .aka-wallet-gallery-archive-name {
font-size:.64rem;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-status {
font-size:.45rem;
opacity:.82;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-active .aka-wallet-gallery-archive-status {
font-size:.50rem;
opacity:.92;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option:is(.is-previous,.is-next) {
opacity:.54;
}
#walletDropdown .aka-wallet-dropdown-holders {
font-size:.60rem;
}
.aka-mobile-identity-panel .aka-mobile-holder-label {
font-size:.58rem;
}
/* V0.42.50 — DIRECT MOBILE CONNECT / FIXED LOWER DECK / THREE-DETENT CYLINDER.
The approved Wallet top, typography and 2:3 collectible body remain intact. */
/* The requested optical correction belongs to the cyan signal-strip control,
not the AVAILABLE statistic inside INVESTIGATION. */
#walletDropdownMagnifierBtn > svg.aka-archive-magnifier-glyph,
#mobileTopbarMagnifier > svg.aka-archive-magnifier-glyph {
transform:translate(-1px,-1px) !important;
transform-origin:50% 50% !important;
}
/* Only the neighbouring detents remain visible. Hidden archive options cannot
fly into depth or retain focus while the cylinder turns. */
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-offstage {
visibility:hidden !important;
opacity:0 !important;
pointer-events:none !important;
transform:translateY(-50%) rotateX(0) scale(.89) !important;
}
/* Park hidden detents on the nearest neighbour plane. When they enter the
three-card window they only fade in; they never travel from the centre. */
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-offstage[data-cylinder-offset^="-"] {
transform:translateY(calc(-50% - 1.28rem)) rotateX(-10deg) scale(.89) !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-offstage:not([data-cylinder-offset^="-"]) {
transform:translateY(calc(-50% + 1.28rem)) rotateX(10deg) scale(.89) !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option::before {
content:none !important;
display:none !important;
}
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option:is(.is-previous,.is-next) {
opacity:.62;
}
/* ORIGIN uses its own canonical poster source and the same fixed card body as
every other collectible. Cover removes letterbox bars without stretching. */
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-entry.has-origin-edge-fit
> .aka-wallet-gallery-entry-art,
.aka-wallet-gallery-preview-host
.aka-wallet-inline-stage.has-origin-edge-fit
.aka-wallet-card-face.is-front
> img[data-wallet-inline-preview-image] {
width:100% !important;
height:100% !important;
object-fit:cover !important;
object-position:50% 50% !important;
background:transparent !important;
image-rendering:auto !important;
filter:none !important;
}
/* Compact fallback only. The normal Phantom path never opens a status modal. */
.modal-box.aka-wallet-connect-retry-box {
width:min(88vw,25rem) !important;
overflow:hidden;
border-color:rgba(212,168,67,.34);
box-shadow:0 18px 56px rgba(0,0,0,.72),0 0 20px rgba(212,168,67,.08);
}
.modal-box.aka-wallet-connect-retry-box > .modal-close {
top:.58rem !important;
right:.62rem !important;
width:1.75rem !important;
height:1.75rem !important;
font-size:1rem !important;
}
.aka-wallet-connect-retry {
display:grid;
justify-items:center;
gap:.72rem;
padding:2.15rem 1.45rem 1.35rem;
text-align:center;
background:
radial-gradient(circle at 50% 0,rgba(212,168,67,.07),transparent 48%),
#070807;
}
.aka-wallet-connect-retry-icon {
display:grid;
width:2.45rem;
height:2.45rem;
place-items:center;
border:1px solid rgba(212,168,67,.34);
border-radius:50%;
color:rgba(224,184,101,.90);
background:rgba(212,168,67,.035);
}
.aka-wallet-connect-retry-icon svg { width:1.12rem;height:1.12rem; }
.aka-wallet-connect-retry-kicker {
margin:0;
color:rgba(225,72,103,.84);
font:600 .55rem/1.2 "Special Elite",monospace;
letter-spacing:.24em;
}
.aka-wallet-connect-retry-title {
margin:0;
color:rgba(244,236,217,.96);
font:400 1.78rem/1 "Bebas Neue","Arial Narrow",sans-serif;
letter-spacing:.08em;
}
.aka-wallet-connect-retry-copy {
max-width:20rem;
margin:0;
color:rgba(231,224,208,.68);
font:400 .76rem/1.55 "Special Elite",monospace;
}
.aka-wallet-connect-retry-action {
min-width:8.6rem;
min-height:2.42rem;
margin-top:.18rem;
padding:.58rem .88rem;
border:1px solid rgba(212,168,67,.48);
border-radius:3px;
color:rgba(244,230,196,.94);
background:linear-gradient(180deg,rgba(88,62,18,.18),rgba(10,8,4,.92));
font:600 .61rem/1 "Special Elite",monospace;
letter-spacing:.18em;
box-shadow:inset 0 1px 0 rgba(255,247,220,.04),0 7px 18px rgba(0,0,0,.32);
}
.aka-wallet-connect-retry-action:disabled { opacity:.46;cursor:wait; }
.aka-wallet-connect-retry-status {
min-height:.85rem;
margin:0;
color:rgba(225,72,103,.72);
font:600 .49rem/1.35 "Special Elite",monospace;
letter-spacing:.08em;
}
@media (max-width:768px) {
/* V0.43.17 — unified mobile Wallet footprint, premium internal use.
The outer Wallet stays frozen. Every lower drawer keeps the same 7.60rem
frame; only internal spacing/scale is refined inside that shared geometry. */
.aka-wallet-signal-drawer.is-mobile
> .aka-wallet-drawer-inner:not(.is-inline-gallery),
.aka-wallet-signal-drawer.is-mobile
> .aka-wallet-drawer-inner.is-inline-gallery:is(
[data-wallet-gallery-view="archives"],
[data-wallet-gallery-view="collection"]
) {
height:7.60rem !important;
min-height:7.60rem !important;
max-height:7.60rem !important;
}
/* Archive selector: use the larger frame without changing the revolver logic. */
.aka-wallet-signal-drawer.is-mobile
> .aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"] {
width:calc(100% - .20rem) !important;
max-width:calc(100% - .20rem) !important;
top:.10rem !important;
padding:.22rem .30rem .18rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-inline-heading:not(.is-collection) {
margin-bottom:.10rem !important;
font-size:.59rem !important;
letter-spacing:.115em !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-name {
font-size:.58rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-active .aka-wallet-gallery-archive-name {
font-size:.69rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-status {
font-size:.47rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="archives"]
.aka-wallet-gallery-archive-option.is-active .aka-wallet-gallery-archive-status {
font-size:.53rem !important;
}
/* Selected archive becomes a proper display case: wider, deeper and with
larger 2:3 miniatures, while the drawer frame itself remains unchanged. */
.aka-wallet-signal-drawer.is-mobile
> .aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"] {
width:calc(100% - .20rem) !important;
max-width:calc(100% - .20rem) !important;
top:.10rem !important;
padding:.22rem .18rem .08rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-heading.is-collection {
left:.02rem !important;
width:3.84rem !important;
min-height:1.90rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-gallery-back {
width:3.84rem !important;
min-width:3.84rem !important;
max-width:3.84rem !important;
height:1.90rem !important;
font-size:.35rem !important;
letter-spacing:.055em !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-rail {
padding:.18rem .14rem .03rem 4.10rem !important;
padding-right:var(--aka-gallery-rail-end-space) !important;
scroll-padding-inline:4.10rem .18rem !important;
gap:.50rem !important;
}
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner.is-inline-gallery[data-wallet-gallery-view="collection"]
.aka-wallet-inline-entry {
width:3.92rem !important;
min-width:3.92rem !important;
height:5.88rem !important;
min-height:5.88rem !important;
flex-basis:3.92rem !important;
}
/* Reward vault: the two value chambers consume the available height; the CTA
stays anchored low instead of being pulled up against the metrics. */
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-vault {
padding:.42rem .46rem .24rem !important;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-vault .aka-wallet-vault-grid {
flex:1 1 auto !important;
min-height:0 !important;
align-items:stretch !important;
gap:.30rem !important;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-vault .aka-wallet-vault-stat {
height:100% !important;
min-height:0 !important;
padding:.62rem .54rem .58rem !important;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-vault .aka-wallet-vault-stat small {
font-size:.60rem !important;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-vault .aka-wallet-vault-value-row strong {
font-size:.89rem !important;
}
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner.is-vault .aka-wallet-drawer-action.is-vault-claim {
flex:0 0 auto !important;
min-height:1.72rem !important;
margin:.40rem 0 0 !important;
padding:.47rem .60rem !important;
font-size:.57rem !important;
letter-spacing:.11em !important;
}
/* Mobile micro-copy must remain readable on S21-class widths. */
.aka-wallet-signal-drawer.is-mobile
.aka-wallet-drawer-inner:is(.is-magnifier,.is-secret,.is-bonus)
.aka-wallet-activity-stat > span:not(.aka-wallet-activity-stat-icon) {
font-size:.49rem !important;
}
#mobileWalletIconWrap { cursor:pointer; }
.modal-box.aka-wallet-connect-retry-box {
width:min(91vw,23rem) !important;
}
}
/* V0.42.51 — CINEMATIC IDENTITY TITLES.
Wallet geometry, surfaces, borders, status colors, TITLE label and the
established side-insignia design stay frozen. Only title glyph pigment and
the one-time award presentation change. */
.aka-wallet-player-title-text[data-title="THE INITIATED"] {
--aka-rank-face:#FFD78B;
--aka-rank-inner:rgba(62,35,13,.96);
--aka-rank-contour:rgba(216,183,106,.56);
--aka-rank-glow:rgba(212,168,67,.18);
}
.aka-wallet-player-title-text[data-title="ORIGIN WITNESS"] {
--aka-rank-face:#A9D6FF;
--aka-rank-inner:rgba(20,47,70,.96);
--aka-rank-contour:rgba(220,235,250,.56);
--aka-rank-glow:rgba(102,181,255,.18);
}
.aka-wallet-player-title-text[data-title="NIGHT SURVIVOR"] {
--aka-rank-face:#E84B57;
--aka-rank-inner:#5B071D;
--aka-rank-contour:rgba(255,115,122,.50);
--aka-rank-glow:rgba(114,0,60,.20);
}
.aka-wallet-player-title-text[data-title="RISE ASCENDANT"] {
--aka-rank-face:#93E6AD;
--aka-rank-inner:rgba(18,54,33,.96);
--aka-rank-contour:rgba(216,183,106,.46);
--aka-rank-glow:rgba(69,204,116,.17);
}
.aka-wallet-player-title-text[data-title="LOST FINDER"] {
--aka-rank-face:#72CEC3;
--aka-rank-inner:rgba(10,53,52,.96);
--aka-rank-contour:rgba(191,236,232,.48);
--aka-rank-glow:rgba(45,184,172,.16);
}
.aka-wallet-player-title-text[data-title="DOMINION HOLDER"] {
--aka-rank-face:#D89455;
--aka-rank-inner:rgba(62,23,17,.98);
--aka-rank-contour:rgba(216,148,85,.58);
--aka-rank-glow:rgba(89,23,20,.18);
}
.aka-wallet-player-title-text[data-title="FINAL WITNESS"] {
--aka-rank-face:#E8EFF5;
--aka-rank-inner:rgba(39,54,68,.96);
--aka-rank-contour:rgba(166,201,229,.56);
--aka-rank-glow:rgba(152,199,235,.15);
}
.aka-wallet-player-title-text[data-title="AKA LEGEND"] {
--aka-rank-face:#B64A76;
--aka-rank-inner:#351326;
--aka-rank-contour:#DDBB6A;
--aka-rank-glow:rgba(182,74,118,.14);
}
.aka-wallet-player-title-text:not([data-title="OUTSIDER"]) {
color:var(--aka-rank-face,rgba(246,235,214,.97)) !important;
-webkit-text-fill-color:var(--aka-rank-face,rgba(246,235,214,.97)) !important;
-webkit-text-stroke:.5px var(--aka-rank-inner,rgba(44,22,31,.96)) !important;
text-shadow:
0 1px 0 rgba(4,2,3,.98),
0 0 5px var(--aka-rank-glow,transparent) !important;
}
.aka-wallet-player-title-text:not([data-title="OUTSIDER"])::before {
-webkit-text-stroke:1px var(--aka-rank-contour,rgba(170,121,108,.72)) !important;
}
.aka-wallet-player-title-text[data-title="AKA LEGEND"] {
text-shadow:
0 1px 0 rgba(4,2,3,.98),
0 0 4px var(--aka-rank-glow) !important;
}
/* Keep the approved side insignias one stable warm-gold material regardless
of the pigment applied to the title letters. */
.aka-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
.aka-wallet-dropdown-title:not(.aka-status-no-id):not(.aka-status-outsider),
.aka-mobile-identity-panel.is-connected
.aka-mobile-wallet-title-section.aka-wallet-context-crossfade[data-wallet-title-context="player"]
#mobileWalletIdentityStatus {
--aka-wallet-title-line:rgba(212,168,67,.72) !important;
}
.aka-title-ceremony-brand,
.aka-title-ceremony-identity,
.aka-title-ceremony-earned,
.aka-title-ceremony-line {
display:none;
}
/* display:contents preserves every existing compact notice grid even though
the title now also has a ceremony rail around it. */
.aka-title-ceremony-rail {
display:contents;
}
.aka-game-notice-overlay.is-title-ceremony {
--aka-title-ceremony-face:#F6EBD6;
--aka-title-ceremony-inner:rgba(44,22,31,.96);
--aka-title-ceremony-contour:rgba(212,168,67,.58);
--aka-title-ceremony-glow:rgba(212,168,67,.18);
align-items:center !important;
justify-content:center !important;
padding:max(1rem,env(safe-area-inset-top,0px)) max(1rem,env(safe-area-inset-right,0px)) max(1rem,env(safe-area-inset-bottom,0px)) max(1rem,env(safe-area-inset-left,0px)) !important;
pointer-events:auto;
background:
radial-gradient(ellipse at 50% 48%,color-mix(in srgb,var(--aka-title-ceremony-face) 7%,transparent),transparent 38%),
rgba(0,0,0,.70) !important;
-webkit-backdrop-filter:none !important;
backdrop-filter:none !important;
}
.aka-game-notice-overlay.is-title-ceremony.is-visible.is-closing {
opacity:0;
pointer-events:none;
transition:opacity 450ms ease;
}
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-panel {
width:min(58rem,calc(100vw - 2rem));
min-height:14rem;
overflow:visible;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
padding:2.4rem 0;
border:0 !important;
border-radius:0 !important;
background:transparent !important;
box-shadow:none !important;
contain:layout style;
pointer-events:none;
filter:none !important;
transform:scale(.96) !important;
transition:transform 720ms cubic-bezier(.22,.80,.22,1) !important;
}
.aka-game-notice-overlay.is-title-ceremony.is-visible .aka-game-notice-panel {
transform:scale(1) !important;
}
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-panel::before,
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-panel::after,
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-close,
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-orb,
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-symbol,
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-kicker,
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-subtitle,
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-footnote {
display:none !important;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-brand {
display:block;
margin:0 0 .52rem;
color:rgba(212,168,67,.88);
font:500 .68rem/1 "Special Elite",monospace;
letter-spacing:.34em;
text-indent:.34em;
text-shadow:0 0 7px rgba(212,168,67,.13);
opacity:0;
transform:translateY(-.28rem);
transition:opacity 360ms ease 100ms,transform 520ms cubic-bezier(.22,.80,.22,1) 100ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-identity {
display:block;
margin:0 0 1.22rem;
color:rgba(231,220,199,.52);
font:500 .54rem/1 "Special Elite",monospace;
letter-spacing:.29em;
text-indent:.29em;
opacity:0;
transition:opacity 360ms ease 210ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-rail {
width:100%;
display:grid;
grid-template-columns:minmax(1.25rem,1fr) auto minmax(1.25rem,1fr);
align-items:center;
column-gap:clamp(.72rem,2.4vw,1.65rem);
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-line {
display:block;
width:100%;
height:1px;
opacity:0;
background:linear-gradient(90deg,transparent,rgba(212,168,67,.72));
box-shadow:0 0 6px rgba(212,168,67,.13);
transform:scaleX(0);
transform-origin:right center;
transition:transform 680ms cubic-bezier(.22,.80,.22,1) 270ms,opacity 280ms ease 270ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-line.is-right {
background:linear-gradient(90deg,rgba(212,168,67,.72),transparent);
transform-origin:left center;
}
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-title {
position:relative;
isolation:isolate;
min-width:0;
max-width:min(72vw,42rem);
margin:0;
color:var(--aka-title-ceremony-face) !important;
-webkit-text-fill-color:var(--aka-title-ceremony-face) !important;
-webkit-text-stroke:.7px var(--aka-title-ceremony-inner) !important;
font:400 clamp(2.15rem,7vw,5.4rem)/.94 "Bebas Neue","Arial Narrow",sans-serif !important;
letter-spacing:.12em !important;
text-indent:.12em;
text-align:center !important;
text-transform:uppercase;
white-space:nowrap;
text-shadow:
0 1px 0 rgba(0,0,0,.98),
0 0 7px var(--aka-title-ceremony-glow) !important;
opacity:0;
clip-path:inset(0 50% 0 50%);
transform:scale(.96);
transition:
clip-path 680ms cubic-bezier(.22,.80,.22,1) 330ms,
opacity 320ms ease 300ms,
transform 780ms cubic-bezier(.22,.80,.22,1) 300ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-title::before {
content:attr(data-title);
position:absolute;
inset:0;
color:transparent;
-webkit-text-fill-color:transparent;
-webkit-text-stroke:1.2px var(--aka-title-ceremony-contour);
text-shadow:none;
pointer-events:none;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-earned {
display:block;
margin:1.25rem 0 0;
color:rgba(231,220,199,.62);
font:500 .56rem/1 "Special Elite",monospace;
letter-spacing:.30em;
text-indent:.30em;
opacity:0;
transform:translateY(.22rem);
transition:opacity 360ms ease 780ms,transform 520ms cubic-bezier(.22,.80,.22,1) 760ms;
}
.aka-game-notice-overlay.is-title-ceremony.is-visible :is(
.aka-title-ceremony-brand,
.aka-title-ceremony-identity,
.aka-title-ceremony-earned
) {
opacity:1;
transform:none;
}
.aka-game-notice-overlay.is-title-ceremony.is-visible .aka-title-ceremony-line {
opacity:1;
transform:scaleX(1);
}
.aka-game-notice-overlay.is-title-ceremony.is-visible .aka-game-notice-title {
opacity:1;
clip-path:inset(0 0 0 0);
transform:scale(1);
}
.aka-final-witness-title-color {
color:#E8EFF5 !important;
-webkit-text-fill-color:#E8EFF5 !important;
-webkit-text-stroke:.7px rgba(39,54,68,.96);
text-shadow:0 1px 0 rgba(0,0,0,.98),0 0 7px rgba(152,199,235,.15) !important;
}
html[lang="ar"] .aka-game-notice-overlay.is-title-ceremony
:is(.aka-title-ceremony-identity,.aka-title-ceremony-earned) {
font-family:"Noto Sans Arabic","Segoe UI",sans-serif;
letter-spacing:0;
text-indent:0;
}
@media (max-width:768px) {
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-panel {
width:min(94vw,40rem);
min-height:12rem;
padding:2rem 0;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-rail {
grid-template-columns:minmax(.8rem,1fr) auto minmax(.8rem,1fr);
column-gap:clamp(.50rem,2.7vw,.86rem);
}
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-title {
max-width:78vw;
font-size:clamp(1.72rem,8.8vw,3.15rem) !important;
letter-spacing:.085em !important;
text-indent:.085em;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-brand {
font-size:.61rem;
letter-spacing:.28em;
text-indent:.28em;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-identity,
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-earned {
font-size:.50rem;
letter-spacing:.20em;
text-indent:.20em;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-game-notice-overlay.is-title-ceremony,
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-panel,
.aka-game-notice-overlay.is-title-ceremony :is(
.aka-title-ceremony-brand,
.aka-title-ceremony-identity,
.aka-title-ceremony-line,
.aka-game-notice-title,
.aka-title-ceremony-earned
) {
animation:none !important;
transition:none !important;
}
}
/* V0.42.52 — ONE GESTURE / ONE DETENT REVOLVER INPUT.
Visual geometry and motion remain frozen. JavaScript now discards the
residual momentum of a wheel/trackpad burst after one archive step. */
/* V0.42.53 — READABLE TITLE CEREMONY / UNIFIED COMPASS ROSE.
The Wallet, title pigments and award mechanics remain frozen. This cascade
changes only the shared compass material and the title-award presentation. */
.aka-title-ceremony-compass {
display:none;
}
.aka-game-notice-overlay.is-title-ceremony {
background:
radial-gradient(ellipse at 50% 47%,color-mix(in srgb,var(--aka-title-ceremony-face) 6%,transparent),transparent 32%),
radial-gradient(ellipse at 50% 50%,rgba(0,0,0,.88) 0%,rgba(0,0,0,.74) 38%,rgba(0,0,0,.40) 66%,transparent 84%),
rgba(0,0,0,.64) !important;
-webkit-backdrop-filter:none !important;
backdrop-filter:none !important;
}
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-panel {
min-height:20rem;
padding:2.65rem 0;
transform:scale(.975) !important;
transition:transform 820ms cubic-bezier(.22,.80,.22,1) 120ms !important;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass {
width:3.45rem;
height:3.45rem;
margin:0 0 .78rem;
display:grid;
place-items:center;
opacity:0;
transform:translateY(.34rem) scale(.92);
transition:
opacity 440ms ease 180ms,
transform 680ms cubic-bezier(.22,.80,.22,1) 180ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass svg {
width:100%;
height:100%;
overflow:visible;
filter:drop-shadow(0 1px 0 rgba(0,0,0,.86));
shape-rendering:geometricPrecision;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass .aka-archive-compass-ring {
stroke-width:1.16;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass .aka-archive-compass-ring.is-inner {
stroke-width:.86;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass .aka-archive-compass-rose {
stroke-width:.80;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass .aka-archive-compass-facets {
stroke-width:.68;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass .aka-archive-compass-ticks {
stroke-width:.88;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass .aka-archive-compass-center {
stroke-width:.62;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass .aka-archive-compass-ring {
stroke-dasharray:178;
stroke-dashoffset:178;
transition:stroke-dashoffset 760ms cubic-bezier(.22,.80,.22,1) 300ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass .aka-archive-compass-ring.is-inner {
stroke-dasharray:157;
stroke-dashoffset:157;
transition-delay:410ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass :is(.aka-archive-compass-rose,.aka-archive-compass-facets,.aka-archive-compass-ticks,.aka-archive-compass-center) {
opacity:0;
transform:scale(.82);
transform-origin:center;
transition:opacity 380ms ease 560ms,transform 620ms cubic-bezier(.22,.80,.22,1) 500ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-brand {
margin-bottom:.60rem;
font-size:.80rem;
color:rgba(222,176,86,.94);
transition:opacity 420ms ease 420ms,transform 620ms cubic-bezier(.22,.80,.22,1) 420ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-identity {
margin-bottom:1.36rem;
color:rgba(237,226,205,.66);
font-size:.65rem;
transition:opacity 420ms ease 700ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-line {
transition:transform 720ms cubic-bezier(.22,.80,.22,1) 920ms,opacity 320ms ease 920ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-title {
transform:scale(.975);
transition:
clip-path 760ms cubic-bezier(.22,.80,.22,1) 1050ms,
opacity 360ms ease 1020ms,
transform 860ms cubic-bezier(.22,.80,.22,1) 1020ms;
}
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-title::after {
content:attr(data-title);
position:absolute;
inset:0;
color:transparent;
-webkit-text-fill-color:transparent;
-webkit-text-stroke:0 transparent;
background:linear-gradient(104deg,transparent 38%,rgba(255,249,226,.82) 50%,transparent 62%);
background-size:230% 100%;
background-position:155% 0;
-webkit-background-clip:text;
background-clip:text;
opacity:0;
pointer-events:none;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-earned {
margin-top:1.36rem;
color:rgba(237,226,205,.74);
font-size:.66rem;
transition:opacity 420ms ease 1660ms,transform 620ms cubic-bezier(.22,.80,.22,1) 1620ms;
}
.aka-game-notice-overlay.is-title-ceremony.is-visible .aka-title-ceremony-compass,
.aka-game-notice-overlay.is-title-ceremony.is-visible .aka-title-ceremony-compass :is(.aka-archive-compass-rose,.aka-archive-compass-facets,.aka-archive-compass-ticks,.aka-archive-compass-center) {
opacity:1;
transform:none;
}
.aka-game-notice-overlay.is-title-ceremony.is-visible .aka-title-ceremony-compass .aka-archive-compass-ring {
stroke-dashoffset:0;
}
.aka-game-notice-overlay.is-title-ceremony.is-visible .aka-game-notice-title::after {
animation:aka-title-ceremony-specular 880ms cubic-bezier(.22,.80,.22,1) 2050ms 1 both;
}
@keyframes aka-title-ceremony-specular {
0% { opacity:0; background-position:155% 0; }
24% { opacity:.12; }
50% { opacity:.54; }
76% { opacity:.10; }
100% { opacity:0; background-position:-55% 0; }
}
@media (max-width:768px) {
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-panel {
min-height:18rem;
padding:2.25rem 0;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass {
width:3.10rem;
height:3.10rem;
margin-bottom:.72rem;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-brand {
font-size:.70rem;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-identity,
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-earned {
font-size:.58rem;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass,
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass *,
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-title::after {
animation:none !important;
transition:none !important;
}
.aka-game-notice-overlay.is-title-ceremony .aka-title-ceremony-compass .aka-archive-compass-ring {
stroke-dashoffset:0;
}
.aka-game-notice-overlay.is-title-ceremony .aka-game-notice-title::after {
opacity:0 !important;
}
}
/* V0.42.54 — ROYAL COMPASS MATERIAL / RESPONSIVE HERO PRELOAD.
The icon footprint stays frozen. Broader blades, mahogany-bronze facets,
cardinal engravings and a tiny gold diamond replace the pasted center disc. */
/* V0.42.55 — SHARP VECTOR COMPASS.
The existing 1.94rem trigger and 3.45rem ceremony footprints stay frozen.
Non-scaling optical strokes, exact vector geometry and transform-free static
rendering keep every royal facet crisp without changing the logo design. */
/* V0.42.57 — ARCHIVE RECOGNITION / AUTHENTICITY SEAL.
V0.42.55 remains the visual baseline. The title ceremony receives one
recognition phrase, while the Wallet gains a non-interactive, absolute
authenticity mark that never changes its frozen geometry or controls. */
.aka-wallet-authenticity-seal {
position:absolute;
z-index:1;
display:none;
width:1.46rem;
height:1.46rem;
color:#D4A843;
opacity:.31;
pointer-events:none;
user-select:none;
}
.aka-wallet-authenticity-seal svg {
display:block;
width:100%;
height:100%;
overflow:visible;
shape-rendering:geometricPrecision;
}
.aka-wallet-authenticity-seal :is(
.aka-wallet-seal-ring,
.aka-wallet-seal-rose,
.aka-wallet-seal-facets,
.aka-wallet-seal-ticks,
.aka-wallet-seal-center
) {
vector-effect:non-scaling-stroke;
}
.aka-wallet-authenticity-seal .aka-wallet-seal-ring {
fill:none;
stroke:currentColor;
}
.aka-wallet-authenticity-seal .aka-wallet-seal-ring.is-outer {
stroke-width:1.05;
opacity:.84;
}
.aka-wallet-authenticity-seal .aka-wallet-seal-ring.is-inner {
stroke-width:.72;
opacity:.52;
}
.aka-wallet-authenticity-seal .aka-wallet-seal-rose {
fill:#E1AE4B;
stroke:#F1CF82;
stroke-width:.62;
stroke-linejoin:miter;
}
.aka-wallet-authenticity-seal .aka-wallet-seal-facets {
fill:#754323;
stroke:#A86D31;
stroke-width:.38;
stroke-linejoin:miter;
}
.aka-wallet-authenticity-seal .aka-wallet-seal-ticks {
fill:none;
stroke:#D4A843;
stroke-width:.74;
stroke-linecap:square;
opacity:.70;
}
.aka-wallet-authenticity-seal .aka-wallet-seal-center {
fill:#F3D995;
stroke:#24140D;
stroke-width:.46;
}
#walletConnectBtn.is-connected + #walletDropdown > .aka-wallet-authenticity-seal {
top:1.18rem;
right:1.10rem;
display:block;
}
#mobileWalletConnectBtn {
position:relative;
}
.aka-mobile-identity-panel.is-connected
#mobileWalletConnectBtn > .aka-wallet-authenticity-seal {
top:50%;
right:1.04rem;
display:block;
width:1.42rem;
height:1.42rem;
transform:translateY(-50%);
}
/* V0.42.58 — TITLE PIGMENT / LIVING SEAL RINGS.
The approved Wallet geometry and the existing three-line TITLE insignias are
untouched. Only title pigment, the two seal rings and their one-shot award
transitions change. The archive-page compass always keeps its base metal. */
.aka-wallet-authenticity-seal {
color:var(--aka-wallet-seal-ring,#756B5E);
opacity:var(--aka-wallet-seal-opacity,.42);
filter:drop-shadow(0 0 2px var(--aka-wallet-seal-glow,rgba(151,132,101,.18)));
transition:opacity 220ms ease,color 420ms cubic-bezier(.22,.80,.22,1);
}
.aka-wallet-authenticity-seal .aka-wallet-seal-ring.is-outer {
stroke:var(--aka-wallet-seal-ring,#756B5E);
}
.aka-wallet-authenticity-seal .aka-wallet-seal-ring.is-inner {
stroke:var(--aka-wallet-seal-inner,#8B6A35);
}
/* AKA LEGEND uses one even ruby-plum face, a dark separator and a thin
champagne engraving. No split red/cyan tint or permanent bloom remains. */
.aka-wallet-player-title-text[data-title="AKA LEGEND"] {
color:#B64A76 !important;
-webkit-text-fill-color:#B64A76 !important;
-webkit-text-stroke:.43px #351326 !important;
text-shadow:0 1px 0 rgba(4,2,3,.98),0 0 4px rgba(182,74,118,.14) !important;
}
.aka-wallet-player-title-text[data-title="AKA LEGEND"]::before {
-webkit-text-stroke:.70px #DDBB6A !important;
opacity:.88;
}
.aka-game-notice-overlay.is-title-ceremony.is-aka-legend-ceremony .aka-game-notice-title {
-webkit-text-stroke:.68px #351326 !important;
}
.aka-game-notice-overlay.is-title-ceremony.is-aka-legend-ceremony .aka-game-notice-title::before {
-webkit-text-stroke:1.10px #DDBB6A !important;
opacity:.88;
}
/* Every ceremony enters through the original royal-gold seal, then resolves
once into the earned title ring. Only the rings change material. */
.aka-game-notice-overlay.is-title-ceremony
.aka-title-ceremony-compass .aka-archive-compass-ring.is-outer {
stroke:#F3C96B;
}
.aka-game-notice-overlay.is-title-ceremony
.aka-title-ceremony-compass .aka-archive-compass-ring.is-inner {
stroke:#704126;
}
.aka-game-notice-overlay.is-title-ceremony.is-visible
.aka-title-ceremony-compass .aka-archive-compass-ring.is-outer {
animation:aka-title-seal-ring-resolve 1120ms cubic-bezier(.22,.80,.22,1) 620ms 1 both;
}
.aka-game-notice-overlay.is-title-ceremony.is-visible
.aka-title-ceremony-compass .aka-archive-compass-ring.is-inner {
animation:aka-title-seal-inner-resolve 1040ms cubic-bezier(.22,.80,.22,1) 720ms 1 both;
}
.aka-game-notice-overlay.is-title-ceremony.is-visible .aka-title-ceremony-compass svg {
animation:aka-title-seal-focus 1280ms cubic-bezier(.22,.80,.22,1) 580ms 1 both;
}
@keyframes aka-title-seal-ring-resolve {
0%,18% { stroke:#F3C96B; opacity:.80; }
52% { stroke:#F7D98D; opacity:1; }
100% { stroke:var(--aka-title-seal-ring,#F3C96B); opacity:.92; }
}
@keyframes aka-title-seal-inner-resolve {
0%,18% { stroke:#704126; opacity:.58; }
54% { stroke:#D4A843; opacity:.78; }
100% { stroke:var(--aka-title-seal-inner,#704126); opacity:.66; }
}
@keyframes aka-title-seal-focus {
0%,20% { filter:drop-shadow(0 1px 0 rgba(0,0,0,.86)); }
54% { filter:drop-shadow(0 1px 0 rgba(0,0,0,.86)) drop-shadow(0 0 3px var(--aka-title-seal-glow,rgba(212,168,67,.18))); }
100% { filter:drop-shadow(0 1px 0 rgba(0,0,0,.86)) drop-shadow(0 0 1px var(--aka-title-seal-glow,rgba(212,168,67,.18))); }
}
/* The Wallet remembers the earned ring. Its transition is armed by the title
award and plays only on the first Wallet opening after that award. */
.aka-wallet-authenticity-seal.is-title-seal-revealing .aka-wallet-seal-ring.is-outer {
animation:aka-wallet-seal-ring-resolve 1120ms cubic-bezier(.22,.80,.22,1) 1 both;
}
.aka-wallet-authenticity-seal.is-title-seal-revealing .aka-wallet-seal-ring.is-inner {
animation:aka-wallet-seal-inner-resolve 1080ms cubic-bezier(.22,.80,.22,1) 90ms 1 both;
}
.aka-wallet-authenticity-seal.is-title-seal-revealing svg {
animation:aka-wallet-seal-focus 1260ms cubic-bezier(.22,.80,.22,1) 1 both;
}
@keyframes aka-wallet-seal-ring-resolve {
0%,18% { stroke:#D4A843; opacity:.58; }
52% { stroke:#F3D995; opacity:1; }
100% { stroke:var(--aka-wallet-seal-ring,#756B5E); opacity:.84; }
}
@keyframes aka-wallet-seal-inner-resolve {
0%,18% { stroke:#754323; opacity:.46; }
54% { stroke:#D4A843; opacity:.76; }
100% { stroke:var(--aka-wallet-seal-inner,#8B6A35); opacity:.52; }
}
@keyframes aka-wallet-seal-focus {
0%,18% { filter:none; }
52% { filter:brightness(1.12) drop-shadow(0 0 3px var(--aka-wallet-seal-glow,rgba(151,132,101,.18))); }
100% { filter:none; }
}
@media (prefers-reduced-motion:reduce) {
.aka-game-notice-overlay.is-title-ceremony.is-visible
.aka-title-ceremony-compass .aka-archive-compass-ring.is-outer,
.aka-game-notice-overlay.is-title-ceremony.is-visible
.aka-title-ceremony-compass .aka-archive-compass-ring.is-inner,
.aka-game-notice-overlay.is-title-ceremony.is-visible .aka-title-ceremony-compass svg,
.aka-wallet-authenticity-seal.is-title-seal-revealing .aka-wallet-seal-ring,
.aka-wallet-authenticity-seal.is-title-seal-revealing svg {
animation:none !important;
}
.aka-game-notice-overlay.is-title-ceremony
.aka-title-ceremony-compass .aka-archive-compass-ring.is-outer {
stroke:var(--aka-title-seal-ring,#F3C96B);
}
.aka-game-notice-overlay.is-title-ceremony
.aka-title-ceremony-compass .aka-archive-compass-ring.is-inner {
stroke:var(--aka-title-seal-inner,#704126);
}
}
/* V0.42.59 — CONNECTION RECOGNITION SEAL.
Runtime-only release: no new visual rule, no TITLE insignia mutation and no
archive-compass mutation. The existing ring animation is reused once after
each fresh verified connection for every earned title above OUTSIDER. */
/* V0.42.60 — QUIET HOVER CONTROLS.
Markup/runtime-only release: no visual CSS rule is added. Browser title
bubbles are removed while aria-label semantics and every control stay intact. */
/* Source: css/v41-interaction-fixes.css — original cascade order preserved. */
/* V0.41.1 interaction corrections layered over the frozen V0.40.4 visuals. */
/* Empty CLAIM TO WALLET keeps the approved glow-only rhythm, just much faster. */
.aka-wallet-drawer-inner.is-vault.is-empty-feedback .aka-wallet-vault-stat strong {
animation:akaVaultEmptyValueReject 360ms cubic-bezier(.20,.88,.24,1) both;
}
/* The archive artwork keeps every hover treatment, but only its CTA enters. */
#gallery .poster-card[data-archive] {
cursor:default;
}
#gallery .poster-card[data-archive] [data-archive-access] {
cursor:pointer;
}
/* Attention belongs to motion and light, not another label on the archive art. */
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret:not(.has-attention-signal),
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret:not(.has-attention-signal):hover,
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-available-secret:not(.has-attention-signal).active-touch {
animation:none !important;
filter:none !important;
}
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-attention-signal {
animation:akaArchiveAttentionSidePulse 2.8s ease-in-out infinite !important;
will-change:box-shadow;
}
@keyframes akaArchiveAttentionSidePulse {
0%,100% {
box-shadow:
-5px 0 13px rgba(52,211,104,.13),
5px 0 13px rgba(52,211,104,.13),
0 0 0 1px rgba(80,230,128,.14);
}
50% {
box-shadow:
-11px 0 23px rgba(52,211,104,.34),
11px 0 23px rgba(52,211,104,.34),
0 0 0 1px rgba(105,244,151,.38),
inset 0 0 13px rgba(49,201,101,.055);
}
}
/* The poster's existing NEW TRACE copy stays intact. This separate aura clears
only after the exact changed Reel/node is genuinely acknowledged. */
#modalContent .aka-archive-file-card.has-unseen-trace-attention {
animation:akaArchivePosterAttentionAura 2.8s ease-in-out infinite !important;
will-change:box-shadow;
}
/* Exact claimed keys light their own material; no generic gold readiness. */
[data-key-ready-kind="silver"], [data-lock-key-kind="silver"] { --aka-ready-lock-rgb:210,225,238; }
[data-key-ready-kind="gold"], [data-lock-key-kind="gold"] { --aka-ready-lock-rgb:255,207,67; }
[data-key-ready-kind="red"], [data-lock-key-kind="red"] { --aka-ready-lock-rgb:255,65,99; }
[data-key-ready-kind="blue"], [data-lock-key-kind="blue"] { --aka-ready-lock-rgb:77,189,255; }
@keyframes akaArchivePosterAttentionAura {
0%,100% {
border-color:rgba(212,168,67,.44);
box-shadow:
-4px 0 11px rgba(212,168,67,.12),
4px 0 11px rgba(212,168,67,.12),
0 0 0 1px rgba(212,168,67,.10);
}
50% {
border-color:rgba(255,218,109,.78);
box-shadow:
-9px 0 22px rgba(212,168,67,.31),
9px 0 22px rgba(212,168,67,.31),
0 0 0 1px rgba(255,226,139,.26),
inset 0 0 14px rgba(212,168,67,.045);
}
}
/* Miniature hardware stays still: only its light breathes. Larger in-archive
seals retain their existing movement. Archive-gate locks are not selected. */
#modalContent .aka-archive-task-icon.is-key-ready .aka-archive-task-lock {
animation:none !important;
}
#modalContent .aka-archive-task-icon.is-key-ready .aka-archive-task-lock svg {
animation:akaMiniLockLightPulse 1.6s ease-in-out infinite;
}
#modalContent .aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,
#modalContent .aka-archive-question-source-lock-panel.is-key-lock.is-key-ready .aka-archive-question-source-lock-icon,
#modalContent .aka-main-silver-seal.is-key-ready .aka-main-silver-seal-lock,
#modalContent .aka-archive-main-seal-btn.is-key-ready > i {
transform-origin:center;
animation:akaMiniLockLightPulse 1.6s ease-in-out infinite !important;
}
@keyframes akaMiniLockLightPulse {
0%,100% { opacity:1; }
50% { opacity:.56; }
}
/* SECRET REEL notices use a clean circular reel with no loose film-strip tail. */
.aka-game-notice-symbol .aka-game-notice-film-reel::after {
content:none !important;
display:none !important;
}
@media (prefers-reduced-motion:reduce) {
.aka-wallet-drawer-inner.is-vault.is-empty-feedback .aka-wallet-vault-stat strong {
animation:none !important;
}
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-attention-signal,
#modalContent .aka-archive-file-card.has-unseen-trace-attention,
#modalContent .aka-archive-file-card.has-key-ready-lock,
#modalContent .aka-archive-task-icon.is-key-ready .aka-archive-task-lock,
#modalContent .aka-archive-task-icon.is-key-ready .aka-archive-task-lock svg,
#modalContent .aka-archive-question-tab.is-key-ready .aka-archive-question-tab-lock,
#modalContent .aka-archive-question-source-lock-panel.is-key-lock.is-key-ready .aka-archive-question-source-lock-icon,
#modalContent .aka-main-silver-seal.is-key-ready .aka-main-silver-seal-lock,
#modalContent .aka-archive-main-seal-btn.is-key-ready > i {
animation:none !important;
}
#gallery .poster-card[data-archive].is-archive-entry-unlocked.has-attention-signal {
box-shadow:-8px 0 18px rgba(52,211,104,.24),8px 0 18px rgba(52,211,104,.24) !important;
}
#modalContent .aka-archive-file-card.has-unseen-trace-attention:not(.has-key-ready-lock) {
border-color:rgba(255,218,109,.67) !important;
box-shadow:-7px 0 17px rgba(212,168,67,.23),7px 0 17px rgba(212,168,67,.23) !important;
}
}
/* Source: css/v4262-rank-regalia-wallet.css — original cascade order preserved. */
/* GIZMO KAKA V0.42.74 — WALLET POWER / FAN CLUB REGALIA EXPERIENCE */
:root {
--aka-rank-gold:212,168,67;
--aka-rank-cream:240,224,190;
--aka-rank-cyan:91,205,231;
--aka-rank-ruby:182,74,118;
--aka-rank-violet:92,73,120;
--aka-rank-emerald:74,222,128;
--aka-rank-red:236,91,103;
}
/* Personal rank summary stays in the Wallet; the full world table lives in Fan Club. */
.aka-wallet-rank-summary {
box-sizing:border-box;
width:100%;
height:2.28rem;
margin:0 0 .66rem;
padding:.40rem .58rem;
display:grid;
grid-template-columns:minmax(0,1fr) auto;
align-items:center;
gap:.48rem;
border:1px solid rgba(var(--aka-rank-gold),.17);
border-radius:4px;
background:
radial-gradient(circle at 100% 45%,rgba(var(--aka-rank-violet),.055),transparent 44%),
linear-gradient(90deg,rgba(var(--aka-rank-gold),.035),rgba(3,7,6,.43));
box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}
.aka-wallet-rank-summary-label {
min-width:0;
color:rgba(var(--aka-rank-gold),.88);
font:600 .58rem/1 "Space Grotesk",sans-serif;
letter-spacing:.15em;
white-space:nowrap;
}
.aka-wallet-rank-summary-value {
min-width:0;
color:rgba(var(--aka-rank-cyan),.84);
font:400 .76rem/1 "Bebas Neue","Arial Narrow",sans-serif;
letter-spacing:.09em;
text-align:right;
white-space:nowrap;
}
.aka-wallet-rank-summary-value.is-up { color:rgba(var(--aka-rank-emerald),.92); }
.aka-wallet-rank-summary-value.is-down { color:rgba(var(--aka-rank-red),.90); }
/* Quiet medal command. It retains the existing toolbar geometry. */
.aka-wallet-rank-action {
--aka-rank-action-rgb:var(--aka-rank-violet);
width:1.78rem !important;
min-width:1.78rem !important;
height:1.78rem !important;
min-height:1.78rem !important;
display:grid !important;
place-items:center !important;
padding:0 !important;
overflow:hidden;
border:1px solid rgba(var(--aka-rank-violet),.20) !important;
border-radius:5px !important;
color:rgba(var(--aka-rank-cream),.56) !important;
background:linear-gradient(145deg,rgba(18,14,22,.72),rgba(4,4,5,.92)) !important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.02) !important;
opacity:.48;
filter:saturate(.42) brightness(.80);
cursor:pointer;
transition:opacity .22s ease,filter .24s ease,border-color .24s ease,box-shadow .28s ease,transform .14s ease;
}
.aka-wallet-rank-action:disabled { cursor:default; }
.aka-wallet-rank-action:not(:disabled):is(:hover,:focus-visible),
.aka-wallet-rank-action:is(.is-selected,.is-claim-ready) {
outline:0;
opacity:1;
filter:none;
border-color:rgba(var(--aka-rank-ruby),.56) !important;
color:rgba(255,231,178,.96) !important;
box-shadow:0 0 0 2px rgba(4,4,5,.96),0 0 0 3px rgba(var(--aka-rank-violet),.25),0 0 10px rgba(var(--aka-rank-ruby),.13),inset 0 0 8px rgba(var(--aka-rank-violet),.06) !important;
}
.aka-wallet-rank-action:active:not(:disabled) { transform:translateY(1px); }
.aka-wallet-rank-action.is-claim-ready { animation:akaRankClaimBreath 2.9s ease-in-out infinite; }
@keyframes akaRankClaimBreath {
0%,100% { box-shadow:0 0 0 2px rgba(4,4,5,.96),0 0 0 3px rgba(var(--aka-rank-violet),.25),0 0 8px rgba(var(--aka-rank-ruby),.10),inset 0 0 7px rgba(var(--aka-rank-violet),.05) !important; }
50% { box-shadow:0 0 0 2px rgba(4,4,5,.96),0 0 0 3px rgba(var(--aka-rank-ruby),.34),0 0 13px rgba(var(--aka-rank-ruby),.20),inset 0 0 9px rgba(var(--aka-rank-violet),.08) !important; }
}
.aka-rank-medal-glyph { width:1rem !important;height:1rem !important;overflow:visible; }
.aka-rank-medal-ring { fill:none;stroke-width:1.05; }
.aka-rank-medal-ring.is-outer { stroke:#5C4978; }
.aka-rank-medal-ring.is-inner { stroke:#B64A76;opacity:.90; }
.aka-rank-medal-ribbon { stroke:rgba(8,5,10,.82);stroke-width:.52; }
.aka-rank-medal-ribbon.is-left { fill:#B64A76; }
.aka-rank-medal-ribbon.is-right { fill:#5C4978; }
.aka-rank-medal-star { fill:#D4A843;stroke:#F2D58C;stroke-width:.48; }
.aka-rank-medal-core { fill:#8D244E;stroke:rgba(255,224,151,.82);stroke-width:.34; }
/* AKA pencil: no cube, no loud glow, and it stays physically beside the ID. */
.aka-alias-address-line {
min-width:0;
display:flex;
align-items:center;
justify-content:flex-start;
gap:.18rem;
}
.aka-alias-address-line.is-desktop { margin:0 0 .72rem; }
.aka-alias-address-line.is-desktop .aka-wallet-dropdown-address { margin:0 !important;padding-right:0 !important; }
.aka-alias-address-line.is-mobile { width:max-content;max-width:100%;gap:.12rem; }
.aka-alias-pencil {
flex:0 0 auto;
display:grid;
place-items:center;
width:.92rem;
height:.92rem;
padding:0;
border:0;
border-radius:3px;
color:rgba(var(--aka-rank-gold),.72);
background:transparent;
box-shadow:none;
cursor:pointer;
opacity:.66;
transition:color .18s ease,opacity .18s ease,background-color .18s ease,transform .12s ease;
}
.aka-alias-pencil svg { width:.62rem;height:.62rem;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round; }
.aka-alias-pencil:is(:hover,:focus-visible) { outline:0;color:rgba(245,205,105,.96);opacity:1;background:rgba(var(--aka-rank-gold),.055); }
.aka-alias-pencil:active { transform:translateY(1px); }
.aka-alias-pencil.is-mobile { width:.84rem;height:.84rem;margin-inline-start:-.08rem;position:relative;left:-.06rem;top:.10rem; }
.aka-wallet-title-section,
.aka-mobile-wallet-title-section { position:relative; }
.aka-wallet-title-section.is-alias-editing > :not(.aka-alias-editor),
.aka-mobile-wallet-title-section.is-alias-editing > :not(.aka-alias-editor) {
opacity:0 !important;
visibility:hidden !important;
pointer-events:none !important;
}
.aka-alias-editor {
position:absolute;
z-index:4;
inset:.16rem .28rem;
width:auto;
min-width:0;
height:auto;
display:grid;
grid-template-rows:1.48rem 1.02rem;
align-content:center;
gap:.28rem;
box-sizing:border-box;
animation:akaAliasIn 180ms cubic-bezier(.22,1,.36,1) both;
}
.aka-alias-editor[hidden] { display:none !important; }
@keyframes akaAliasIn {
from { opacity:0;transform:translateY(2px); }
to { opacity:1;transform:none; }
}
.aka-alias-input-shell {
min-width:0;
height:1.48rem;
display:grid;
grid-template-columns:minmax(0,1fr) auto;
align-items:center;
overflow:hidden;
border:1px solid rgba(var(--aka-rank-gold),.40);
border-radius:3px;
background:linear-gradient(180deg,rgba(2,3,3,.94),rgba(7,8,7,.88));
box-shadow:inset 0 1px 8px rgba(0,0,0,.44),0 0 0 1px rgba(0,0,0,.48);
}
.aka-alias-input-shell:focus-within {
border-color:rgba(var(--aka-rank-gold),.67);
box-shadow:inset 0 1px 8px rgba(0,0,0,.48),0 0 0 1px rgba(var(--aka-rank-gold),.09);
}
.aka-alias-input-shell input {
min-width:0;
width:100%;
height:100%;
box-sizing:border-box;
padding:.10rem .52rem .04rem;
border:0;
outline:0;
color:rgba(242,230,204,.94);
background:transparent;
font:600 .69rem/1 "Space Grotesk",sans-serif;
letter-spacing:.045em;
text-transform:none;
}
.aka-alias-input-shell input::placeholder { color:rgba(var(--aka-rank-cream),.30);letter-spacing:.07em; }
.aka-alias-input-shell > span {
align-self:stretch;
display:flex;
align-items:center;
padding:.03rem .43rem 0;
border-inline-start:1px solid rgba(var(--aka-rank-gold),.12);
color:rgba(var(--aka-rank-cream),.42);
font:600 .54rem/1 "Space Grotesk",sans-serif;
font-variant-numeric:tabular-nums;
}
.aka-alias-editor-foot {
min-width:0;
display:grid;
grid-template-columns:minmax(0,1fr) auto;
align-items:center;
gap:.46rem;
}
.aka-alias-fee {
min-width:0;
overflow:hidden;
color:rgba(var(--aka-rank-gold),.67);
font:600 .53rem/1.15 "Space Grotesk",sans-serif;
letter-spacing:.055em;
text-overflow:ellipsis;
white-space:nowrap;
}
.aka-alias-fee.is-error { color:rgba(var(--aka-rank-red),.92); }
.aka-alias-fee.is-success { color:rgba(var(--aka-rank-emerald),.92); }
.aka-alias-editor.has-error .aka-alias-editor-foot { grid-template-columns:minmax(0,1fr); }
.aka-alias-editor.has-error .aka-alias-fee { text-align:center;text-overflow:ellipsis; }
.aka-alias-editor.has-error .aka-alias-actions { display:none; }
.aka-alias-editor.has-error .aka-alias-input-shell { border-color:rgba(var(--aka-rank-red),.42);box-shadow:inset 0 1px 8px rgba(0,0,0,.48),0 0 0 1px rgba(var(--aka-rank-red),.055); }
.aka-alias-actions { display:flex;align-items:center;gap:.32rem; }
.aka-alias-actions button {
height:1.08rem;
min-width:3.04rem;
padding:.05rem .42rem 0;
border:1px solid rgba(var(--aka-rank-gold),.23);
border-radius:3px;
color:rgba(var(--aka-rank-cream),.58);
background:rgba(2,3,3,.54);
font:600 .51rem/1 "Space Grotesk",sans-serif;
letter-spacing:.08em;
cursor:pointer;
transition:border-color .17s ease,color .17s ease,background-color .17s ease,transform .10s ease;
}
.aka-alias-actions .aka-alias-accept { min-width:4.20rem;color:rgba(var(--aka-rank-cream),.88);border-color:rgba(var(--aka-rank-gold),.43);background:linear-gradient(180deg,rgba(var(--aka-rank-gold),.075),rgba(0,0,0,.36)); }
.aka-alias-actions .aka-alias-accept.is-market-locked { opacity:.38;cursor:not-allowed;filter:saturate(.45); }
.aka-alias-actions button:is(:hover,:focus-visible) { outline:0;border-color:rgba(var(--aka-rank-gold),.68);color:rgba(var(--aka-rank-cream),.96); }
.aka-alias-actions button:active:not(:disabled) { transform:translateY(1px); }
.aka-alias-actions button:disabled { opacity:.48;cursor:wait; }
/* Rank drawer uses the same downward Wallet flow as every other signal drawer. */
.aka-wallet-signal-drawer:has(.aka-wallet-rank-drawer) { margin:-.28rem 0 .72rem; }
.aka-wallet-signal-drawer.is-mobile:has(.aka-wallet-rank-drawer) { margin:-.05rem 0 .06rem; }
.aka-wallet-rank-drawer {
box-sizing:border-box;
width:calc(100% - .20rem);
min-width:0;
height:12.40rem;
min-height:12.40rem;
max-height:12.40rem;
margin:0 auto;
padding:.44rem .52rem .50rem;
display:grid;
grid-template-rows:1.42rem minmax(0,1fr);
overflow:hidden;
border:1px solid rgba(var(--aka-rank-gold),.25);
border-radius:6px;
color:rgba(var(--aka-rank-cream),.86);
background:
radial-gradient(circle at 4% -8%,rgba(var(--aka-rank-ruby),.085),transparent 39%),
radial-gradient(circle at 102% 110%,rgba(var(--aka-rank-violet),.09),transparent 43%),
linear-gradient(145deg,rgba(13,10,9,.99),rgba(3,7,8,.995));
box-shadow:0 11px 24px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.025),inset 0 0 22px rgba(var(--aka-rank-gold),.018);
animation:akaRankDrawerIn 240ms cubic-bezier(.22,1,.36,1) both;
}
@keyframes akaRankDrawerIn {
from { opacity:0;transform:translateY(-4px) scale(.992); }
to { opacity:1;transform:none; }
}
.aka-rank-tabs {
min-width:0;
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
align-items:stretch;
gap:.18rem;
border-bottom:1px solid rgba(var(--aka-rank-gold),.105);
}
.aka-rank-tab {
appearance:none;
border:0;
color:rgba(var(--aka-rank-cream),.43);
background:transparent;
font-family:"Special Elite",monospace;
cursor:pointer;
}
.aka-rank-tab {
min-width:0;
height:1.36rem;
padding:.08rem .12rem .04rem;
font-size:.62rem;
line-height:1;
letter-spacing:.09em;
}
.aka-rank-tab:is(:hover,:focus-visible),
.aka-rank-tab.is-active {
outline:0;
color:rgba(var(--aka-rank-cream),.94);
background:linear-gradient(180deg,transparent,rgba(var(--aka-rank-gold),.052));
box-shadow:inset 0 -1px rgba(var(--aka-rank-gold),.72);
}
.aka-rank-body { min-width:0;min-height:0;padding-top:.46rem;overflow:hidden; }
/* Power · V0.42.86 premium instrument pass. The Wallet shell and drawer size stay unchanged. */
.aka-power-overview {
height:100%;
min-height:0;
display:grid;
grid-template-rows:2.86rem minmax(0,1fr) 2.18rem;
gap:.30rem;
}
.aka-power-command {
min-width:0;
display:grid;
grid-template-columns:minmax(0,1fr) 5.55rem;
align-items:stretch;
border:1px solid rgba(var(--aka-rank-gold),.105);
border-radius:4px;
background:
radial-gradient(circle at 9% 22%,rgba(var(--aka-rank-cyan),.045),transparent 36%),
linear-gradient(135deg,rgba(var(--aka-rank-gold),.028),rgba(0,0,0,.24));
box-shadow:inset 0 1px 0 rgba(255,255,255,.018);
}
.aka-power-command > span { min-width:0;display:flex;flex-direction:column;justify-content:center;padding:.34rem .50rem .28rem; }
.aka-power-command-rank { align-items:flex-end;border-inline-start:1px solid rgba(var(--aka-rank-cyan),.10);text-align:right; }
.aka-power-command small { color:rgba(var(--aka-rank-gold),.67);font:600 .53rem/1 "Space Grotesk",sans-serif;letter-spacing:.105em; }
.aka-power-command strong { margin-top:.20rem;color:rgba(var(--aka-rank-cream),.96);font:400 1.20rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.075em;white-space:nowrap; }
.aka-power-command-rank strong { font-size:1.05rem; }
.aka-power-command em { margin-top:.19rem;color:rgba(var(--aka-rank-cream),.38);font:600 .46rem/1 "Space Grotesk",sans-serif;font-style:normal;letter-spacing:.055em;white-space:nowrap; }
.aka-power-command em.is-positive { color:rgba(var(--aka-rank-emerald),.78); }
.aka-power-command em.is-negative { color:rgba(var(--aka-rank-red),.77); }
.aka-power-core-panel {
position:relative;
min-width:0;
min-height:0;
display:grid;
grid-template-columns:4.26rem minmax(0,1fr);
align-items:center;
gap:.48rem;
padding:.28rem .46rem .26rem .34rem;
overflow:hidden;
border:1px solid rgba(var(--aka-rank-cyan),.09);
border-radius:4px;
background:
radial-gradient(circle at 14% 50%,rgba(var(--aka-rank-cyan),.060),transparent 30%),
radial-gradient(circle at 80% 110%,rgba(var(--aka-rank-violet),.065),transparent 48%),
rgba(0,0,0,.205);
box-shadow:inset 0 0 18px rgba(var(--aka-rank-cyan),.012);
}
.aka-power-core-panel::after {
content:"";
position:absolute;
right:.46rem;
bottom:.24rem;
left:4.96rem;
height:1px;
opacity:.38;
background:linear-gradient(90deg,rgba(var(--aka-rank-cyan),.24),rgba(var(--aka-rank-violet),.15),transparent 94%);
pointer-events:none;
}
.aka-power-core { position:relative;width:3.62rem;height:3.62rem;display:grid;place-items:center;justify-self:center; }
.aka-power-core-svg { width:100%;height:100%;overflow:visible;transform:rotate(-90deg); }
.aka-power-core-bed,.aka-power-core-arc { fill:none;vector-effect:non-scaling-stroke; }
.aka-power-core-bed { stroke:rgba(var(--aka-rank-cream),.055);stroke-width:1.2; }
.aka-power-core-bed.is-inner { stroke:rgba(var(--aka-rank-violet),.14);stroke-width:1; }
.aka-power-core-arc { fill:none;stroke-linecap:round;transform-origin:32px 32px;filter:drop-shadow(0 0 2px currentColor);animation:akaPowerArcWake 560ms cubic-bezier(.22,1,.36,1) both; }
.aka-power-core-arc.is-personal { color:rgba(var(--aka-rank-cyan),.92);stroke:currentColor;stroke-width:2.15; }
.aka-power-core-arc.is-network { color:rgba(var(--aka-rank-violet),.92);stroke:currentColor;stroke-width:1.55;animation-delay:70ms; }
.aka-power-core-diamond { fill:rgba(var(--aka-rank-violet),.13);stroke:rgba(var(--aka-rank-cyan),.38);stroke-width:.72;vector-effect:non-scaling-stroke; }
.aka-power-core-node { fill:rgba(var(--aka-rank-cream),.94);filter:drop-shadow(0 0 3px rgba(var(--aka-rank-cyan),.86)); }
.aka-power-core-caption { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;transform:translateY(.04rem); }
.aka-power-core-caption small { color:rgba(var(--aka-rank-cream),.43);font:600 .38rem/1 "Space Grotesk",sans-serif;letter-spacing:.11em; }
.aka-power-core-caption b { margin-top:.14rem;color:rgba(var(--aka-rank-cream),.78);font:400 .54rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.09em; }
@keyframes akaPowerArcWake { from{opacity:.16;stroke-dashoffset:24}to{opacity:1;stroke-dashoffset:0} }
.aka-power-feeds { min-width:0;display:grid;grid-template-rows:1fr 1fr auto;align-self:stretch;gap:.10rem;padding:.12rem 0 .20rem; }
.aka-power-feed { min-width:0;display:grid;grid-template-columns:1.34rem minmax(0,1fr);align-items:center;gap:.30rem; }
.aka-power-feed > i { position:relative;display:block;height:1px;background:linear-gradient(90deg,transparent,rgba(var(--aka-rank-cyan),.70));box-shadow:0 0 5px rgba(var(--aka-rank-cyan),.18); }
.aka-power-feed > i::after { content:"";position:absolute;right:-.08rem;top:50%;width:.18rem;height:.18rem;border-radius:50%;background:rgba(var(--aka-rank-cyan),.92);box-shadow:0 0 6px rgba(var(--aka-rank-cyan),.52);transform:translateY(-50%); }
.aka-power-feed.is-network > i { background:linear-gradient(90deg,transparent,rgba(var(--aka-rank-violet),.78));box-shadow:0 0 5px rgba(var(--aka-rank-violet),.20); }
.aka-power-feed.is-network > i::after { background:rgba(var(--aka-rank-violet),.96);box-shadow:0 0 6px rgba(var(--aka-rank-violet),.54); }
.aka-power-feed > span { min-width:0;display:flex;align-items:baseline;justify-content:space-between;gap:.24rem; }
.aka-power-feed small { overflow:hidden;color:rgba(var(--aka-rank-cream),.52);font:600 .50rem/1 "Space Grotesk",sans-serif;letter-spacing:.057em;text-overflow:ellipsis;white-space:nowrap; }
.aka-power-feed strong { color:rgba(var(--aka-rank-cream),.88);font:600 .65rem/1 "Space Grotesk",sans-serif;letter-spacing:.01em;white-space:nowrap; }
.aka-power-feed strong b { margin-inline-start:.16rem;color:rgba(var(--aka-rank-cream),.34);font-size:.45rem;letter-spacing:.02em; }
.aka-power-feed-note { align-self:end;color:rgba(var(--aka-rank-cyan),.38);font:600 .39rem/1 "Space Grotesk",sans-serif;letter-spacing:.10em;white-space:nowrap; }
.aka-power-chase {
min-width:0;
display:grid;
grid-template-rows:auto .58rem auto;
align-content:center;
gap:.08rem;
padding:.23rem .50rem .20rem;
overflow:hidden;
border-inline-start:1px solid rgba(var(--aka-rank-cyan),.44);
border-top:1px solid rgba(var(--aka-rank-cyan),.055);
background:
radial-gradient(circle at 93% 50%,rgba(var(--aka-rank-cyan),.065),transparent 30%),
linear-gradient(90deg,rgba(var(--aka-rank-cyan),.047),transparent 72%);
}
.aka-power-chase-head,.aka-power-chase-foot { min-width:0;display:flex;align-items:center;justify-content:space-between;gap:.38rem; }
.aka-power-chase-head span,.aka-power-chase-foot span { color:rgba(var(--aka-rank-cyan),.68);font:600 .45rem/1 "Space Grotesk",sans-serif;letter-spacing:.09em;white-space:nowrap; }
.aka-power-chase-head strong { min-width:0;overflow:hidden;color:rgba(var(--aka-rank-cream),.45);font:600 .44rem/1 "Space Grotesk",sans-serif;letter-spacing:.045em;text-overflow:ellipsis;white-space:nowrap; }
.aka-power-chase-foot strong { min-width:0;overflow:hidden;color:rgba(var(--aka-rank-cream),.83);font:600 .57rem/1 "Space Grotesk",sans-serif;letter-spacing:.025em;text-overflow:ellipsis;white-space:nowrap; }
.aka-power-chase-rail { min-width:0;height:.58rem;display:block; }
.aka-power-chase-rail svg { display:block;width:100%;height:100%;overflow:visible; }
.aka-power-chase-track,.aka-power-chase-fill,.aka-power-chase-target { fill:none;vector-effect:non-scaling-stroke; }
.aka-power-chase-track { stroke:rgba(var(--aka-rank-cream),.075);stroke-width:1.25; }
.aka-power-chase-fill { stroke:rgba(var(--aka-rank-cyan),.92);stroke-width:1.55;stroke-linecap:round;filter:drop-shadow(0 0 2.4px rgba(var(--aka-rank-cyan),.56));animation:akaPowerChaseWake 620ms cubic-bezier(.16,1,.3,1) both; }
.aka-power-chase-target { stroke:rgba(var(--aka-rank-gold),.66);stroke-width:.72;filter:drop-shadow(0 0 2px rgba(var(--aka-rank-gold),.24)); }
.aka-power-chase-node { fill:rgba(var(--aka-rank-cream),.98);stroke:rgba(var(--aka-rank-cyan),.95);stroke-width:.55;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 3.5px rgba(var(--aka-rank-cyan),.88));animation:akaPowerLeadNode 1.95s ease-in-out infinite; }
@keyframes akaPowerChaseWake { from{opacity:.28;stroke-dashoffset:100}to{opacity:1;stroke-dashoffset:0} }
@keyframes akaPowerLeadNode { 0%,100%{opacity:.72}50%{opacity:1} }
.aka-power-overview.is-number-one .aka-power-command { border-color:rgba(var(--aka-rank-cyan),.17);box-shadow:inset 0 1px 0 rgba(255,255,255,.02),0 0 10px rgba(var(--aka-rank-cyan),.025); }
.aka-power-overview.is-number-one .aka-power-chase { border-inline-start-color:rgba(var(--aka-rank-cyan),.68);background:radial-gradient(circle at 92% 50%,rgba(var(--aka-rank-cyan),.10),transparent 32%),linear-gradient(90deg,rgba(var(--aka-rank-cyan),.060),transparent 76%); }
.aka-power-overview.is-number-one .aka-power-chase-fill { stroke-width:1.9; }
.aka-power-overview.is-number-one .aka-power-chase-node { animation-duration:2.8s; }
/* Referral / network */
.aka-network-overview { height:100%;display:grid;grid-template-rows:2.34rem 2.08rem minmax(0,1fr);gap:.26rem; }
.aka-referral-copy {
min-width:0;
width:100%;
display:grid;
grid-template-columns:minmax(0,1fr) 4.20rem;
align-items:stretch;
padding:0;
overflow:hidden;
border:1px solid rgba(var(--aka-rank-gold),.22);
border-radius:4px;
color:inherit;
background:linear-gradient(90deg,rgba(var(--aka-rank-gold),.042),rgba(0,0,0,.30));
cursor:pointer;
}
.aka-referral-copy > span:first-child { min-width:0;display:flex;flex-direction:column;justify-content:center;padding:.26rem .48rem .20rem;text-align:left; }
.aka-referral-copy small { color:rgba(var(--aka-rank-gold),.68);font:600 .54rem/1 "Space Grotesk",sans-serif;letter-spacing:.08em; }
.aka-referral-copy strong { margin-top:.26rem;overflow:hidden;color:rgba(var(--aka-rank-cream),.90);font:600 .68rem/1 "Space Grotesk",sans-serif;letter-spacing:.035em;text-overflow:ellipsis;white-space:nowrap; }
.aka-referral-copy-face { display:flex;align-items:center;justify-content:center;gap:.25rem;border-inline-start:1px solid rgba(var(--aka-rank-gold),.16);background:linear-gradient(180deg,rgba(var(--aka-rank-gold),.07),rgba(0,0,0,.24));transition:background-color .16s ease,box-shadow .16s ease,transform .10s ease; }
.aka-referral-copy-face svg { width:.82rem;height:.82rem;fill:none;stroke:rgba(var(--aka-rank-gold),.82);stroke-width:1.7; }
.aka-referral-copy-face b { color:rgba(var(--aka-rank-cream),.78);font:600 .52rem/1 "Space Grotesk",sans-serif;letter-spacing:.07em; }
.aka-referral-copy:is(:hover,:focus-visible) { outline:0;border-color:rgba(var(--aka-rank-gold),.47); }
.aka-referral-copy:active .aka-referral-copy-face { transform:translateY(1px);box-shadow:inset 0 2px 4px rgba(0,0,0,.45); }
.aka-referral-copy.is-copied .aka-referral-copy-face { background:rgba(var(--aka-rank-emerald),.09); }
.aka-network-stats { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.28rem; }
.aka-network-stats > span { align-items:center;padding:.16rem .20rem .12rem;text-align:center; }
.aka-network-stats strong { margin-top:.18rem;color:rgba(var(--aka-rank-cream),.90);font:400 .86rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.05em; }
.aka-network-tiers { min-height:0;display:grid;grid-template-rows:repeat(3,minmax(0,1fr));gap:.14rem; }
.aka-network-tier { min-width:0;display:grid;grid-template-columns:1.1fr .78fr 1fr;align-items:center;gap:.22rem;padding:.07rem .42rem;border-inline-start:1px solid rgba(var(--aka-rank-violet),.44);background:linear-gradient(90deg,rgba(var(--aka-rank-violet),.060),transparent); }
.aka-network-tier-name { color:rgba(var(--aka-rank-cream),.78);font:600 .58rem/1 "Space Grotesk",sans-serif;letter-spacing:.055em; }
.aka-network-tier-name small { display:inline;margin-inline-start:.18rem;color:rgba(var(--aka-rank-cyan),.64);font-size:.49rem;letter-spacing:.015em; }
.aka-network-tier > strong,
.aka-network-tier > b { color:rgba(var(--aka-rank-cream),.86);font:600 .64rem/1 "Space Grotesk",sans-serif;text-align:right;white-space:nowrap; }
.aka-network-tier > strong small,
.aka-network-tier > b small { display:block;margin-top:.04rem;color:rgba(var(--aka-rank-cream),.40);font-size:.47rem;line-height:.95;letter-spacing:.035em; }
/* Shared Regalia artwork. The catalogue and inspector live only in Fan Club. */
.aka-regalia-image { display:block;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center; }
/* Expanded Fan Club challenge. */
.aka-regalia-challenge { min-width:0;display:grid;grid-template-columns:1fr 1.18fr;gap:.24rem;padding:.32rem .38rem;border:1px solid rgba(var(--aka-rank-red),.18);border-radius:3px;background:linear-gradient(90deg,rgba(var(--aka-rank-red),.065),rgba(var(--aka-rank-cyan),.025)); }
.aka-regalia-challenge > span { min-width:0;display:flex;flex-direction:column; }
.aka-regalia-challenge > span:last-child { text-align:right; }
.aka-regalia-challenge small { overflow:hidden;color:rgba(var(--aka-rank-red),.80);font:600 .54rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-regalia-challenge strong { margin-top:.17rem;overflow:hidden;color:rgba(var(--aka-rank-cream),.79);font:600 .61rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-regalia-challenge.is-settling { border-color:rgba(var(--aka-rank-gold),.22);background:rgba(var(--aka-rank-gold),.035); }
/* Fan Club world command center. */
.aka-world-rank-hub {
position:relative;
isolation:isolate;
max-width:64rem;
margin:0 auto 4rem;
padding:.76rem;
overflow:hidden;
border:1px solid rgba(var(--aka-rank-gold),.20);
border-radius:8px;
color:rgba(var(--aka-rank-cream),.86);
background:
radial-gradient(circle at 0 0,rgba(var(--aka-rank-ruby),.085),transparent 34%),
radial-gradient(circle at 100% 100%,rgba(var(--aka-rank-cyan),.045),transparent 36%),
linear-gradient(145deg,rgba(13,10,9,.94),rgba(3,7,8,.97));
box-shadow:0 28px 66px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.025);
}
.aka-world-rank-hub::before { content:"";position:absolute;z-index:-1;inset:0 auto 0 0;width:1px;background:linear-gradient(transparent,rgba(var(--aka-rank-gold),.76),transparent);box-shadow:0 0 10px rgba(var(--aka-rank-gold),.25); }
.aka-world-rank-header { min-width:0;display:grid;grid-template-columns:minmax(0,1fr) repeat(3,minmax(6rem,.52fr));align-items:stretch;border-bottom:1px solid rgba(var(--aka-rank-gold),.11); }
.aka-world-rank-title { min-width:0;display:flex;flex-direction:column;justify-content:center;padding:.56rem .70rem; }
.aka-world-rank-title small { color:rgba(var(--aka-rank-gold),.68);font:600 .66rem/1 "Space Grotesk",sans-serif;letter-spacing:.18em; }
.aka-world-rank-title strong { margin-top:.28rem;color:rgba(var(--aka-rank-cream),.94);font:400 1.38rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.11em; }
.aka-world-stat { display:flex;flex-direction:column;justify-content:center;padding:.46rem .62rem;border-inline-start:1px solid rgba(var(--aka-rank-gold),.08); }
.aka-world-stat small { color:rgba(var(--aka-rank-gold),.56);font:600 .58rem/1 "Space Grotesk",sans-serif;letter-spacing:.09em; }
.aka-world-stat strong { margin-top:.28rem;color:rgba(var(--aka-rank-cream),.84);font:400 1rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.06em; }
.aka-world-tabs { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.22rem;margin:.62rem 0 .46rem; }
.aka-world-tab { height:2.18rem;border:1px solid transparent;border-radius:3px;color:rgba(var(--aka-rank-cream),.44);background:transparent;font:600 .66rem/1 "Space Grotesk",sans-serif;letter-spacing:.12em;cursor:pointer; }
.aka-world-tab:is(:hover,:focus-visible),.aka-world-tab.is-active { outline:0;color:rgba(var(--aka-rank-cream),.90);border-color:rgba(var(--aka-rank-gold),.16);background:linear-gradient(180deg,rgba(var(--aka-rank-gold),.045),rgba(0,0,0,.16));box-shadow:inset 0 -1px rgba(var(--aka-rank-gold),.60); }
.aka-world-rank-body { min-height:8.60rem; }
.aka-world-rank-list,.aka-world-team-list,.aka-world-regalia-list { display:grid;gap:.20rem; }
.aka-world-scroll { min-height:0;max-height:24.8rem;display:grid;align-content:start;gap:.20rem;overflow-x:hidden;overflow-y:auto;padding-right:.18rem;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(var(--aka-rank-gold),.28) rgba(255,255,255,.025); }
.aka-world-scroll::-webkit-scrollbar { width:5px; }
.aka-world-scroll::-webkit-scrollbar-track { background:rgba(255,255,255,.018); }
.aka-world-scroll::-webkit-scrollbar-thumb { border-radius:10px;background:rgba(var(--aka-rank-gold),.25); }
.aka-world-scroll::-webkit-scrollbar-thumb:hover { background:rgba(var(--aka-rank-gold),.38); }
.aka-world-rank-head,.aka-world-rank-row { min-width:0;display:grid;grid-template-columns:4rem minmax(14rem,1.4fr) minmax(8rem,.76fr) 4.5rem;align-items:center;gap:.40rem; }
.aka-world-rank-head,.aka-world-team-head { min-height:1.78rem;padding:0 .62rem;color:rgba(var(--aka-rank-cream),.36);font:600 .57rem/1 "Space Grotesk",sans-serif;letter-spacing:.11em; }
.aka-world-rank-row,.aka-world-team-row { appearance:none;width:100%;color:inherit;text-align:left;cursor:pointer;transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease,transform .12s ease; }
.aka-world-rank-row { min-height:3.28rem;padding:.30rem .62rem;border:1px solid rgba(var(--aka-rank-gold),.075);border-radius:4px;background:linear-gradient(90deg,rgba(var(--aka-rank-gold),.022),rgba(0,0,0,.19)); }
.aka-world-rank-row:is(:hover,:focus-visible),.aka-world-team-row:is(:hover,:focus-visible) { outline:0;border-color:rgba(var(--aka-rank-gold),.24);background:linear-gradient(90deg,rgba(var(--aka-rank-gold),.045),rgba(0,0,0,.22));box-shadow:inset 0 0 0 1px rgba(var(--aka-rank-gold),.018),0 7px 20px rgba(0,0,0,.12); }
.aka-world-rank-row:active,.aka-world-team-row:active { transform:translateY(1px); }
.aka-world-rank-row.is-own,.aka-world-team-row.is-own { border-color:rgba(var(--aka-rank-cyan),.26);background:linear-gradient(90deg,rgba(var(--aka-rank-cyan),.055),rgba(0,0,0,.18));box-shadow:inset 2px 0 rgba(var(--aka-rank-cyan),.50); }
.aka-world-rank-row > strong,.aka-world-team-row > strong { color:rgba(var(--aka-rank-gold),.84);font:400 1rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.08em; }
.aka-world-player { min-width:0;display:grid;grid-template-columns:2.28rem minmax(0,1fr);align-items:center;gap:.50rem; }
.aka-world-player-copy { min-width:0;display:flex;flex-direction:column;justify-content:center;gap:.20rem; }
.aka-world-player-line { min-width:0;display:flex;align-items:center;gap:.32rem; }
.aka-world-player-line > b { max-width:12rem;overflow:hidden;color:rgba(var(--aka-rank-cream),.92);font:600 .76rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-player-copy > small { color:rgba(var(--aka-rank-cream),.40);font:600 .51rem/1 "Space Grotesk",sans-serif;letter-spacing:.05em; }
.aka-world-avatar { position:relative;box-sizing:border-box;display:grid;place-items:center;width:2.28rem;height:2.28rem;overflow:hidden;flex:0 0 auto;border:1px solid rgba(var(--aka-rank-gold),.19);border-radius:5px;background:linear-gradient(145deg,rgba(var(--aka-rank-gold),.07),rgba(4,7,8,.96));box-shadow:inset 0 1px rgba(255,255,255,.025),0 4px 12px rgba(0,0,0,.18); }
.aka-world-avatar.is-team { border-color:rgba(var(--aka-rank-cyan),.20);background:linear-gradient(145deg,rgba(var(--aka-rank-cyan),.07),rgba(4,7,8,.96)); }
.aka-world-avatar img { width:100%;height:100%;object-fit:cover; }
.aka-world-avatar > b { color:rgba(var(--aka-rank-cream),.68);font:600 .62rem/1 "Space Grotesk",sans-serif;letter-spacing:.06em; }
.aka-world-avatar.is-team > b { color:rgba(var(--aka-rank-cyan),.74); }
.aka-world-avatar.is-large { width:7.1rem;height:7.1rem;border-radius:8px;box-shadow:inset 0 1px rgba(255,255,255,.035),0 12px 30px rgba(0,0,0,.28); }
.aka-world-avatar.is-large > b { font-size:1.35rem;letter-spacing:.10em; }
.aka-world-regalia-badges { min-width:0;display:inline-flex;align-items:center;gap:.20rem; }
.aka-world-regalia-mini { --aka-regalia-mini:212,168,67;position:relative;display:inline-grid;place-items:center;width:1.42rem;height:1.42rem;overflow:visible;border:1px solid rgba(var(--aka-regalia-mini),.27);border-radius:3px;background:#050607; }
.aka-world-regalia-mini.is-noble { --aka-regalia-mini:196,211,221; }
.aka-world-regalia-mini.is-valor { --aka-regalia-mini:191,115,68; }
.aka-world-regalia-mini.is-current { border-color:rgba(var(--aka-regalia-mini),.58);box-shadow:0 0 8px rgba(var(--aka-regalia-mini),.14); }
.aka-world-regalia-mini.is-earned::after { content:"";position:absolute;right:-.11rem;bottom:-.10rem;width:.32rem;height:.32rem;border:1px solid rgba(4,5,5,.96);border-radius:50%;background:rgb(var(--aka-rank-emerald));box-shadow:0 0 5px rgba(var(--aka-rank-emerald),.45); }
.aka-world-regalia-mini > b { position:absolute;right:-.32rem;top:-.22rem;min-width:.70rem;padding:.08rem .12rem .06rem;border:1px solid rgba(var(--aka-regalia-mini),.32);border-radius:7px;color:rgba(var(--aka-rank-cream),.91);background:rgba(3,4,4,.96);font:600 .44rem/1 "Space Grotesk",sans-serif;text-align:center; }
.aka-regalia-image.is-mini { width:auto;height:1.30rem; }
.aka-world-power { display:flex;flex-direction:column;color:rgba(var(--aka-rank-cream),.82);font:600 .70rem/1 "Space Grotesk",sans-serif; }
.aka-world-power small { margin-top:.18rem;color:rgba(var(--aka-rank-cream),.36);font:600 .49rem/1 "Space Grotesk",sans-serif;letter-spacing:.055em; }
.aka-rank-movement { justify-self:end;color:rgba(var(--aka-rank-cream),.35);font:600 .54rem/1 "Space Grotesk",sans-serif;white-space:nowrap; }
.aka-rank-movement.is-up { color:rgba(var(--aka-rank-emerald),.84); }
.aka-rank-movement.is-down { color:rgba(var(--aka-rank-red),.84); }
.aka-world-own-position { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.22rem;margin:0 0 .38rem;padding:.34rem;border:1px solid rgba(var(--aka-rank-cyan),.15);border-radius:4px;background:linear-gradient(90deg,rgba(var(--aka-rank-cyan),.045),rgba(0,0,0,.16)); }
.aka-world-own-position > span { min-width:0;display:flex;align-items:center;justify-content:space-between;gap:.36rem;padding:.24rem .34rem;border-inline-start:1px solid rgba(var(--aka-rank-cyan),.11); }
.aka-world-own-position > span:first-child { border-inline-start:0; }
.aka-world-own-position small { color:rgba(var(--aka-rank-cyan),.55);font:600 .50rem/1 "Space Grotesk",sans-serif;letter-spacing:.075em; }
.aka-world-own-position strong { color:rgba(var(--aka-rank-cream),.82);font:600 .64rem/1 "Space Grotesk",sans-serif;white-space:nowrap; }
.aka-world-empty { min-height:8.60rem;display:flex;align-items:center;flex-direction:column;justify-content:center;text-align:center; }
.aka-world-empty span { color:rgba(var(--aka-rank-gold),.58);font:600 .60rem/1 "Space Grotesk",sans-serif;letter-spacing:.16em; }
.aka-world-empty strong { margin-top:.48rem;color:rgba(var(--aka-rank-cyan),.64);font:400 1.25rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.12em; }
.aka-world-empty small { max-width:24rem;margin-top:.58rem;color:rgba(var(--aka-rank-cream),.38);font:600 .56rem/1.5 "Space Grotesk",sans-serif;letter-spacing:.05em; }
.aka-world-team-head { display:grid;grid-template-columns:3.8rem minmax(0,1fr) 8rem;align-items:center;gap:.52rem; }
.aka-world-team-row { min-height:3.62rem;display:grid;grid-template-columns:3.8rem minmax(0,1fr) 8rem;align-items:center;gap:.52rem;padding:.34rem .62rem;border:1px solid rgba(var(--aka-rank-gold),.075);border-radius:4px;background:rgba(0,0,0,.18); }
.aka-world-team-identity { min-width:0;display:grid;grid-template-columns:2.42rem minmax(0,1fr);align-items:center;gap:.52rem; }
.aka-world-team-identity > span { min-width:0;display:flex;flex-direction:column; }
.aka-world-team-identity b { overflow:hidden;color:rgba(var(--aka-rank-cream),.90);font:600 .72rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-team-identity small { margin-top:.18rem;overflow:hidden;color:rgba(var(--aka-rank-gold),.53);font:600 .49rem/1 "Space Grotesk",sans-serif;letter-spacing:.045em;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-team-identity em { margin-top:.18rem;color:rgba(var(--aka-rank-cream),.37);font:normal 600 .50rem/1 "Space Grotesk",sans-serif;letter-spacing:.025em; }
.aka-world-team-power { min-width:0;display:flex;flex-direction:column;align-items:flex-end; }
.aka-world-team-power strong { color:rgba(var(--aka-rank-cyan),.78);font:600 .70rem/1 "Space Grotesk",sans-serif; }
.aka-world-team-power small { margin-top:.18rem;color:rgba(var(--aka-rank-cyan),.38);font:600 .47rem/1 "Space Grotesk",sans-serif;letter-spacing:.05em; }
.aka-world-inspect { position:relative;max-height:26rem;display:grid;align-content:start;gap:.48rem;overflow-x:hidden;overflow-y:auto;padding:.08rem .14rem .12rem;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:rgba(var(--aka-rank-gold),.28) rgba(255,255,255,.025); }
.aka-world-inspect::-webkit-scrollbar { width:5px; }
.aka-world-inspect::-webkit-scrollbar-thumb { border-radius:10px;background:rgba(var(--aka-rank-gold),.25); }
.aka-world-inspect-nav { min-height:2rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:0 .14rem;border-bottom:1px solid rgba(var(--aka-rank-gold),.08); }
.aka-world-inspect-nav > span { color:rgba(var(--aka-rank-gold),.48);font:600 .52rem/1 "Space Grotesk",sans-serif;letter-spacing:.11em; }
.aka-world-inspect-back { appearance:none;display:inline-flex;align-items:center;gap:.32rem;border:0;color:rgba(var(--aka-rank-cream),.55);background:transparent;font:600 .54rem/1 "Space Grotesk",sans-serif;letter-spacing:.08em;cursor:pointer; }
.aka-world-inspect-back:is(:hover,:focus-visible) { outline:0;color:rgba(var(--aka-rank-cream),.90); }
.aka-world-inspect-hero { min-width:0;display:grid;grid-template-columns:7.1rem minmax(0,1fr) auto;align-items:center;gap:.72rem;padding:.66rem;border:1px solid rgba(var(--aka-rank-gold),.10);border-radius:5px;background:linear-gradient(110deg,rgba(var(--aka-rank-gold),.038),rgba(0,0,0,.20)); }
.aka-world-inspect.is-team .aka-world-inspect-hero { border-color:rgba(var(--aka-rank-cyan),.12);background:linear-gradient(110deg,rgba(var(--aka-rank-cyan),.035),rgba(0,0,0,.20)); }
.aka-world-inspect-identity { min-width:0;display:flex;align-items:flex-start;flex-direction:column; }
.aka-world-inspect-identity > small { color:rgba(var(--aka-rank-gold),.53);font:600 .50rem/1 "Space Grotesk",sans-serif;letter-spacing:.085em; }
.aka-world-inspect-identity > strong { max-width:100%;margin-top:.30rem;overflow:hidden;color:rgba(var(--aka-rank-cream),.94);font:400 1.56rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.065em;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-inspect-identity > span { margin-top:.26rem;color:rgba(var(--aka-rank-cream),.46);font:600 .56rem/1 "Space Grotesk",sans-serif;letter-spacing:.055em; }
.aka-world-inspect-identity > .aka-world-regalia-badges { margin-top:.42rem; }
.aka-world-inspect-rank { min-width:7rem;display:flex;align-items:flex-end;flex-direction:column;padding-inline-start:.68rem;border-inline-start:1px solid rgba(var(--aka-rank-gold),.09);text-align:right; }
.aka-world-inspect-rank small { color:rgba(var(--aka-rank-gold),.52);font:600 .49rem/1 "Space Grotesk",sans-serif;letter-spacing:.08em; }
.aka-world-inspect-rank strong { margin-top:.28rem;color:rgba(var(--aka-rank-cyan),.80);font:400 1.42rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.06em; }
.aka-world-inspect-stats { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.28rem; }
.aka-world-inspect-stats > span { min-width:0;display:flex;flex-direction:column;padding:.42rem .48rem;border-inline-start:1px solid rgba(var(--aka-rank-gold),.16);background:rgba(255,255,255,.012); }
.aka-world-inspect-stats.is-team { grid-template-columns:repeat(5,minmax(0,1fr)); }
.aka-world-inspect-stats small { color:rgba(var(--aka-rank-gold),.50);font:600 .48rem/1 "Space Grotesk",sans-serif;letter-spacing:.055em; }
.aka-world-inspect-stats strong { margin-top:.25rem;color:rgba(var(--aka-rank-cream),.84);font:600 .68rem/1 "Space Grotesk",sans-serif; }
.aka-world-inspect-stats .aka-rank-movement { justify-self:start;font-size:.62rem; }
.aka-world-inspect-action { appearance:none;min-height:2.18rem;display:flex;align-items:center;justify-content:space-between;padding:0 .62rem;border:1px solid rgba(var(--aka-rank-cyan),.20);border-radius:4px;color:rgba(var(--aka-rank-cream),.78);background:linear-gradient(90deg,rgba(var(--aka-rank-cyan),.035),rgba(0,0,0,.22));font:600 .56rem/1 "Space Grotesk",sans-serif;letter-spacing:.09em;cursor:pointer; }
.aka-world-inspect-action:is(:hover,:focus-visible) { outline:0;border-color:rgba(var(--aka-rank-cyan),.38);color:rgba(var(--aka-rank-cream),.94); }
.aka-world-inspect-action span { color:rgba(var(--aka-rank-cyan),.68);font-size:.9rem; }
.aka-world-inspect-note,.aka-world-tree-empty { padding:.54rem .62rem;border:1px dashed rgba(var(--aka-rank-gold),.12);border-radius:4px;color:rgba(var(--aka-rank-cream),.34);background:rgba(0,0,0,.12);font:600 .49rem/1.45 "Space Grotesk",sans-serif;letter-spacing:.045em;text-align:center; }
.aka-world-inspect-status { margin-bottom:.28rem;padding:.34rem .48rem;border-inline-start:1px solid rgba(var(--aka-rank-cyan),.35);color:rgba(var(--aka-rank-cyan),.66);background:rgba(var(--aka-rank-cyan),.025);font:600 .49rem/1 "Space Grotesk",sans-serif;letter-spacing:.07em; }
.aka-world-inspect-status.is-error { border-inline-start-color:rgba(var(--aka-rank-red),.45);color:rgba(var(--aka-rank-red),.72);background:rgba(var(--aka-rank-red),.025); }
.aka-world-tree { display:grid;gap:.42rem;padding:.54rem;border:1px solid rgba(var(--aka-rank-cyan),.10);border-radius:5px;background:rgba(0,0,0,.14); }
.aka-world-tree-caption { display:flex;align-items:center;justify-content:space-between;gap:.5rem; }
.aka-world-tree-caption span { color:rgba(var(--aka-rank-cyan),.68);font:600 .55rem/1 "Space Grotesk",sans-serif;letter-spacing:.09em; }
.aka-world-tree-caption small { color:rgba(var(--aka-rank-cream),.32);font:600 .46rem/1 "Space Grotesk",sans-serif;letter-spacing:.045em; }
.aka-world-tree-captain { justify-self:center;min-width:9.4rem;display:grid;grid-template-columns:2.28rem minmax(0,1fr);align-items:center;gap:.42rem;padding:.36rem .48rem;border:1px solid rgba(var(--aka-rank-gold),.16);border-radius:4px;background:linear-gradient(145deg,rgba(var(--aka-rank-gold),.04),rgba(0,0,0,.20)); }
.aka-world-tree-captain > span { min-width:0;display:flex;flex-direction:column; }
.aka-world-tree-captain small,.aka-world-tree-node small { color:rgba(var(--aka-rank-gold),.55);font:600 .45rem/1 "Space Grotesk",sans-serif;letter-spacing:.06em; }
.aka-world-tree-captain strong,.aka-world-tree-node strong { margin-top:.17rem;overflow:hidden;color:rgba(var(--aka-rank-cream),.79);font:600 .57rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-tree-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.34rem; }
.aka-world-tree-branch { min-width:0;display:grid;gap:.24rem; }
.aka-world-tree-node { min-width:0;display:grid;grid-template-columns:2.28rem minmax(0,1fr);align-items:center;gap:.38rem;padding:.34rem;border:1px solid rgba(var(--aka-rank-cyan),.10);border-radius:4px;background:rgba(var(--aka-rank-cyan),.020); }
.aka-world-tree-node > span { min-width:0;display:flex;flex-direction:column; }
.aka-world-tree-node em { margin-top:.17rem;overflow:hidden;color:rgba(var(--aka-rank-cream),.34);font:normal 600 .44rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-tree-children { display:grid;gap:.18rem;padding-inline-start:.42rem;border-inline-start:1px solid rgba(var(--aka-rank-cyan),.12); }
.aka-world-tree-children .aka-world-tree-node { grid-template-columns:1.80rem minmax(0,1fr);padding:.25rem .28rem; }
.aka-world-tree-children .aka-world-avatar { width:1.80rem;height:1.80rem; }
.aka-world-tree-children .aka-world-avatar > b { font-size:.48rem; }
.aka-world-regalia-row { appearance:none;width:100%;min-height:3.82rem;display:grid;grid-template-columns:2.1rem 1fr 1.12fr .86fr 1.2rem;align-items:center;gap:.50rem;padding:.30rem .60rem;border:1px solid rgba(var(--aka-rank-gold),.085);border-radius:4px;color:inherit;background:rgba(0,0,0,.18);text-align:left;cursor:pointer;transition:border-color .18s ease,background-color .18s ease,box-shadow .18s ease; }
.aka-world-regalia-row:is(:hover,:focus-visible),.aka-world-regalia-row.is-expanded { outline:0;border-color:rgba(var(--aka-rank-gold),.30);background:linear-gradient(90deg,rgba(var(--aka-rank-gold),.045),rgba(0,0,0,.20));box-shadow:inset 0 0 0 1px rgba(var(--aka-rank-gold),.025); }
.aka-world-regalia-row > .aka-world-regalia-mini { width:1.72rem;height:2.62rem;border:0;background:#050607; }
.aka-world-regalia-row .aka-regalia-image.is-mini { height:2.56rem; }
.aka-world-regalia-row > span:not(.aka-world-regalia-mini) { min-width:0;display:flex;flex-direction:column; }
.aka-world-regalia-row small { color:rgba(var(--aka-rank-gold),.59);font:600 .57rem/1 "Space Grotesk",sans-serif;letter-spacing:.055em; }
.aka-world-regalia-row strong { margin-top:.22rem;overflow:hidden;color:rgba(var(--aka-rank-cream),.84);font:600 .71rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-regalia-row > i { color:rgba(var(--aka-rank-gold),.62);font:normal 400 1rem/1 "Space Grotesk",sans-serif;text-align:center; }
.aka-world-regalia-record {
--aka-regalia-tone:212,168,67;
display:grid;
gap:.56rem;
margin:-.08rem .24rem .34rem;
padding:.68rem;
overflow:hidden;
border:1px solid rgba(var(--aka-regalia-tone),.22);
border-top:0;
border-radius:0 0 7px 7px;
background:
radial-gradient(circle at 13% 30%,rgba(var(--aka-regalia-tone),.075),transparent 31%),
radial-gradient(circle at 96% 0,rgba(var(--aka-rank-cyan),.035),transparent 34%),
linear-gradient(145deg,rgba(10,9,9,.985),rgba(2,6,7,.985));
box-shadow:inset 0 1px 0 rgba(255,255,255,.022),0 18px 34px rgba(0,0,0,.20);
animation:akaWorldRecordIn 240ms cubic-bezier(.22,1,.36,1) both;
}
.aka-world-regalia-record.is-noble { --aka-regalia-tone:196,211,221; }
.aka-world-regalia-record.is-valor { --aka-regalia-tone:191,115,68; }
@keyframes akaWorldRecordIn { from{opacity:0;transform:translateY(-5px) scale(.995)}to{opacity:1;transform:none} }
.aka-world-regalia-detail { min-width:0;min-height:14.8rem;display:grid;grid-template-columns:12.8rem minmax(0,1fr);gap:.72rem; }
.aka-world-regalia-portrait { position:relative;isolation:isolate;min-width:0;min-height:0;display:grid;grid-template-rows:1.40rem minmax(0,1fr) 1.40rem;overflow:hidden;border:1px solid rgba(var(--aka-regalia-tone),.24);border-radius:5px;background:radial-gradient(circle at 50% 43%,rgba(var(--aka-regalia-tone),.10),transparent 52%),linear-gradient(160deg,rgba(8,8,8,.98),rgba(1,4,5,.99));box-shadow:inset 0 1px 0 rgba(255,255,255,.025),inset 0 0 24px rgba(var(--aka-regalia-tone),.025); }
.aka-world-regalia-portrait::before { content:"";position:absolute;z-index:-1;inset:4px;border:1px solid rgba(var(--aka-regalia-tone),.055);border-radius:3px;pointer-events:none; }
.aka-world-regalia-portrait-kicker,.aka-world-regalia-portrait-status { display:grid;place-items:center;padding:.08rem .34rem;color:rgba(var(--aka-regalia-tone),.78);font:600 .52rem/1 "Space Grotesk",sans-serif;letter-spacing:.10em;text-align:center;white-space:nowrap; }
.aka-world-regalia-portrait-kicker { border-bottom:1px solid rgba(var(--aka-regalia-tone),.12); }
.aka-world-regalia-portrait-status { border-top:1px solid rgba(var(--aka-regalia-tone),.12);color:rgba(var(--aka-rank-cream),.66);background:rgba(0,0,0,.16); }
.aka-world-regalia-portrait-visual { min-width:0;min-height:0;display:grid;place-items:center;padding:0 .50rem;overflow:hidden; }
.aka-regalia-image.is-world-detail { width:100%;height:100%;max-height:none;filter:drop-shadow(0 14px 15px rgba(0,0,0,.60)) drop-shadow(0 0 8px rgba(var(--aka-regalia-tone),.11));animation:akaWorldRegaliaImageIn 360ms cubic-bezier(.16,1,.3,1) both; }
@keyframes akaWorldRegaliaImageIn { from{opacity:.45;transform:translateY(8px) scale(.95)}to{opacity:1;transform:none} }
.aka-world-regalia-information { min-width:0;min-height:0;display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto;align-content:start;gap:.38rem; }
.aka-world-regalia-detail-head { min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.42rem;padding:.08rem 0 .38rem;border-bottom:1px solid rgba(var(--aka-regalia-tone),.17); }
.aka-world-regalia-detail-head > span { min-width:0;display:flex;flex-direction:column;gap:.18rem; }
.aka-world-regalia-detail-head small { color:rgba(var(--aka-regalia-tone),.70);font:600 .55rem/1 "Space Grotesk",sans-serif;letter-spacing:.10em; }
.aka-world-regalia-detail-head strong { overflow:hidden;color:rgba(var(--aka-rank-cream),.95);font:400 1.28rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.09em;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-regalia-detail-head em { color:rgba(var(--aka-rank-cyan),.75);font:normal 600 .54rem/1 "Space Grotesk",sans-serif;letter-spacing:.055em;text-align:right;white-space:nowrap; }
.aka-world-regalia-specs { min-width:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.28rem; }
.aka-world-regalia-specs > span,.aka-world-regalia-holder > span { min-width:0;display:flex;flex-direction:column;justify-content:center;padding:.38rem .46rem;border-inline-start:1px solid rgba(var(--aka-regalia-tone),.24);background:linear-gradient(90deg,rgba(var(--aka-regalia-tone),.047),transparent); }
.aka-world-regalia-specs small,.aka-world-regalia-holder small { color:rgba(var(--aka-regalia-tone),.68);font:600 .51rem/1 "Space Grotesk",sans-serif;letter-spacing:.06em; }
.aka-world-regalia-specs strong,.aka-world-regalia-holder strong { margin-top:.20rem;overflow:hidden;color:rgba(var(--aka-rank-cream),.87);font:600 .65rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-regalia-holder { min-width:0;display:grid;grid-template-columns:1.35fr .65fr;gap:.28rem; }
.aka-world-regalia-physical-quest { min-width:0;display:grid;grid-template-rows:auto auto .34rem auto;align-content:center;gap:.28rem;padding:.42rem .48rem;border:1px solid rgba(var(--aka-regalia-tone),.12);border-radius:4px;background:rgba(0,0,0,.20); }
.aka-world-regalia-quest-head { min-width:0;display:flex;align-items:center;justify-content:space-between;gap:.40rem; }
.aka-world-regalia-quest-head span,.aka-world-regalia-quest-head strong { font:600 .54rem/1 "Space Grotesk",sans-serif;letter-spacing:.055em;white-space:nowrap; }
.aka-world-regalia-quest-head span { color:rgba(var(--aka-regalia-tone),.72); }
.aka-world-regalia-quest-head strong { color:rgba(var(--aka-rank-cream),.68); }
.aka-world-regalia-quest-steps { min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.24rem; }
.aka-world-regalia-quest-steps > span { min-width:0;display:grid;grid-template-columns:1.35rem minmax(0,1fr);align-items:center;overflow:hidden;border:1px solid rgba(var(--aka-regalia-tone),.10);border-radius:3px;background:rgba(255,255,255,.012); }
.aka-world-regalia-quest-steps i { align-self:stretch;display:grid;place-items:center;border-inline-end:1px solid rgba(var(--aka-regalia-tone),.14);color:rgba(var(--aka-regalia-tone),.62);font:normal 600 .48rem/1 "Space Grotesk",sans-serif; }
.aka-world-regalia-quest-steps b { overflow:hidden;padding:.07rem .30rem 0;color:rgba(var(--aka-rank-cream),.58);font:600 .51rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-regalia-quest-steps > span.is-complete { border-color:rgba(var(--aka-rank-emerald),.20);background:rgba(var(--aka-rank-emerald),.025); }
.aka-world-regalia-quest-steps > span.is-complete :is(i,b) { color:rgba(var(--aka-rank-emerald),.78); }
.aka-world-regalia-progress { display:block;height:.34rem;overflow:hidden;border-radius:10px;background:rgba(var(--aka-rank-cream),.075);box-shadow:inset 0 1px 2px rgba(0,0,0,.65); }
.aka-world-regalia-progress i { display:block;width:var(--aka-world-regalia-progress,0%);height:100%;background:linear-gradient(90deg,rgba(var(--aka-rank-ruby),.80),rgba(var(--aka-regalia-tone),.90));transform-origin:left center;animation:akaPowerFill 460ms cubic-bezier(.22,1,.36,1) both; }
.aka-world-regalia-physical-quest > small { color:rgba(var(--aka-rank-cream),.43);font:600 .49rem/1 "Space Grotesk",sans-serif;letter-spacing:.045em;text-align:right; }
.aka-world-regalia-information > .aka-regalia-challenge,.aka-world-regalia-rule { min-height:2.30rem;align-self:end; }
.aka-world-regalia-rule { display:flex;align-items:center;justify-content:space-between;gap:.40rem;padding:.42rem .50rem;border-inline-start:1px solid rgba(var(--aka-rank-cyan),.38);background:rgba(var(--aka-rank-cyan),.035); }
.aka-world-regalia-rule span,.aka-world-regalia-rule strong { font:600 .58rem/1 "Space Grotesk",sans-serif;letter-spacing:.045em; }
.aka-world-regalia-rule span { color:rgba(var(--aka-rank-cyan),.68); }
.aka-world-regalia-rule strong { color:rgba(var(--aka-rank-cream),.70);text-align:right; }
.aka-world-regalia-record-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.30rem; }
.aka-world-regalia-record-grid > span { min-width:0;display:flex;flex-direction:column;padding:.38rem .44rem;border-inline-start:1px solid rgba(var(--aka-regalia-tone),.20);background:rgba(255,255,255,.012); }
.aka-world-regalia-record-grid small,.aka-world-regalia-history > small { color:rgba(var(--aka-rank-gold),.61);font:600 .55rem/1 "Space Grotesk",sans-serif;letter-spacing:.06em; }
.aka-world-regalia-record-grid strong { margin-top:.23rem;overflow:hidden;color:rgba(var(--aka-rank-cream),.86);font:600 .70rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-regalia-history { display:grid;grid-template-columns:8.5rem repeat(3,minmax(0,1fr));align-items:center;gap:.34rem; }
.aka-world-regalia-history > span { min-width:0;display:flex;flex-direction:column;padding:.30rem .38rem;border:1px solid rgba(var(--aka-rank-gold),.075);border-radius:3px; }
.aka-world-regalia-history b { overflow:hidden;color:rgba(var(--aka-rank-cream),.79);font:600 .66rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-world-regalia-history em { margin-top:.17rem;color:rgba(var(--aka-rank-cream),.42);font:normal 600 .53rem/1 "Space Grotesk",sans-serif; }
.aka-world-regalia-holder-note { color:rgba(var(--aka-rank-cream),.41);font:600 .55rem/1.35 "Space Grotesk",sans-serif;letter-spacing:.05em;text-align:right; }
/* Exclusive and Secret share one compact header, but keep distinct identities. */
.aka-hidden-collection-head { min-width:0;display:grid;grid-template-columns:3.75rem minmax(0,1fr);align-items:center;gap:.28rem;margin:0 0 .13rem;padding:0 0 .15rem;border-bottom:1px solid rgba(212,168,67,.10); }
.aka-hidden-collection-title { max-width:3.75rem;color:rgba(212,168,67,.70);font:600 .45rem/1.04 "Space Grotesk",sans-serif;letter-spacing:.055em;white-space:normal; }
.aka-hidden-collection-tabs { min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.12rem;overflow:visible; }
.aka-hidden-collection-tab { --aka-hidden-tab-tone:182,74,118;box-sizing:border-box;min-width:0;width:100%;height:1.08rem;padding:.07rem .05rem .03rem;overflow:hidden;border:1px solid transparent;border-radius:3px;color:rgba(232,213,183,.44);background:transparent;font:600 .42rem/1 "Space Grotesk",sans-serif;letter-spacing:.005em;text-overflow:clip;white-space:nowrap; }
.aka-hidden-collection-tab[data-hidden-collection-tab="secret"] { --aka-hidden-tab-tone:91,205,231; }
.aka-hidden-collection-tab:is(:hover,:focus-visible),.aka-hidden-collection-tab.is-active { outline:0;color:rgba(240,224,190,.94);border-color:rgba(var(--aka-hidden-tab-tone),.46);background:linear-gradient(180deg,rgba(var(--aka-hidden-tab-tone),.105),rgba(var(--aka-hidden-tab-tone),.035));box-shadow:inset 0 0 0 1px rgba(var(--aka-hidden-tab-tone),.045),inset 0 -1px rgba(var(--aka-hidden-tab-tone),.78); }
.aka-hidden-collection-tab[data-hidden-collection-tab="secret"].is-active { color:rgba(207,241,255,.96); }
.aka-hidden-collection-tab[data-hidden-collection-tab="exclusive"].is-active { color:rgba(250,220,238,.94); }
/* Hidden Collections uses one fixed content rail. SECRET POSTERS and EXCLUSIVE
now share the same summary footprint; only their pigment/iconography differs. */
.aka-wallet-signal-drawer .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-diamond-summary,.aka-wallet-activity-summary) {
display:grid !important;
grid-template-columns:repeat(2,minmax(0,1fr)) !important;
align-items:stretch !important;
width:100% !important;
min-width:0 !important;
height:1.68rem !important;
min-height:1.68rem !important;
max-height:1.68rem !important;
gap:.30rem !important;
margin:0 !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-diamond-summary,.aka-wallet-activity-summary) > :is(.aka-wallet-diamond-stat,.aka-wallet-activity-stat) {
box-sizing:border-box !important;
height:1.68rem !important;
min-height:1.68rem !important;
max-height:1.68rem !important;
padding:.31rem .38rem !important;
}
/* Hidden Collections reuses the exact command baseline and footprint in both
EXCLUSIVE and SECRET POSTERS. Header content can no longer push it down. */
.aka-wallet-signal-drawer .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) { position:relative !important; }
.aka-wallet-signal-drawer .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) {
position:absolute !important;
right:.62rem !important;
bottom:calc(.56rem - 6px) !important;
left:.62rem !important;
width:auto !important;
height:2.46rem !important;
min-height:2.46rem !important;
margin:0 !important;
grid-template-columns:4.08rem minmax(0,1fr) 4.08rem !important;
align-items:center !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) > :is(.aka-wallet-track-command,.aka-wallet-gallery-command) {
width:4.08rem !important;
min-width:4.08rem !important;
max-width:4.08rem !important;
height:2.46rem !important;
min-height:2.46rem !important;
max-height:2.46rem !important;
margin:0 !important;
transform:none !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) > .aka-wallet-track-command { grid-column:1 !important;justify-self:start !important; }
.aka-wallet-signal-drawer .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) > .aka-wallet-gallery-command { grid-column:3 !important;justify-self:end !important;display:inline-flex !important;align-items:center !important;justify-content:flex-end !important;gap:.22rem !important; }
.aka-wallet-signal-drawer .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) :is(.aka-wallet-track-face,.aka-wallet-gallery-face) {
width:1.50rem !important;
min-width:1.50rem !important;
max-width:1.50rem !important;
height:1.50rem !important;
min-height:1.50rem !important;
max-height:1.50rem !important;
flex:0 0 1.50rem !important;
padding:.16rem !important;
border-radius:.27rem !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) :is(.aka-wallet-track-command-label,.aka-wallet-gallery-command-label) { font:600 .58rem/1 "Special Elite",monospace !important;letter-spacing:.06em !important;transform:none !important; }
@media (max-width:768px) {
.aka-mobile-wallet-signal-strip { grid-template-columns:repeat(6,minmax(0,1fr)) !important; }
.aka-wallet-rank-action {
-webkit-tap-highlight-color:transparent;
transition:border-color .18s ease,box-shadow .20s ease,color .16s ease !important;
}
.aka-wallet-rank-action:active:not(:disabled) { transform:none; }
.aka-mobile-wallet-signal-strip .aka-wallet-rank-action { width:2.02rem !important;min-width:2.02rem !important;height:2.02rem !important;min-height:2.02rem !important;justify-self:center; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-rank-drawer { width:100%;height:13.08rem;min-height:13.08rem;max-height:13.08rem;padding:.42rem .46rem .46rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-overview { grid-template-rows:3.12rem minmax(0,1fr) 2.34rem;gap:.28rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-command em { margin-top:.24rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-command-rank.is-calibrating strong { font-size:.84rem;letter-spacing:.035em; }
.aka-wallet-signal-drawer.is-mobile .aka-power-command { grid-template-columns:minmax(0,1fr) 5.18rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-core-panel { grid-template-columns:4.02rem minmax(0,1fr);gap:.38rem;padding-inline:.26rem .38rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-core { width:3.44rem;height:3.44rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-feed { grid-template-columns:1.08rem minmax(0,1fr);gap:.24rem; }
.aka-alias-address-line.is-mobile { display:inline-flex; }
.aka-alias-input-shell input { font-size:.69rem; }
.aka-alias-fee { font-size:.48rem; }
.aka-alias-actions button { min-width:2.85rem; }
.aka-alias-actions .aka-alias-accept { min-width:4rem; }
.aka-world-rank-hub { margin-bottom:3rem;padding:.58rem; }
.aka-world-rank-header { grid-template-columns:repeat(3,minmax(0,1fr)); }
.aka-world-rank-title { grid-column:1/-1;padding:.52rem .48rem .62rem;border-bottom:1px solid rgba(var(--aka-rank-gold),.08);text-align:center; }
.aka-world-stat { min-width:0;padding:.44rem .30rem;text-align:center; }
.aka-world-stat:nth-of-type(2) { border-inline-start:0; }
.aka-world-rank-title small { font-size:.56rem;letter-spacing:.14em; }
.aka-world-rank-title strong { font-size:1.22rem;letter-spacing:.09em; }
.aka-world-stat small { font-size:.49rem;letter-spacing:.06em; }
.aka-world-stat strong { font-size:.88rem; }
.aka-world-rank-head { display:none; }
.aka-world-rank-row { grid-template-columns:2.65rem minmax(0,1fr) 4.7rem 2.8rem;min-height:3.28rem;padding:.30rem .34rem;gap:.26rem; }
.aka-world-player-line > b { max-width:8.4rem;font-size:.68rem; }
.aka-world-regalia-badges { gap:.15rem; }
.aka-world-regalia-mini { width:1.28rem;height:1.28rem; }
.aka-world-regalia-mini > b { right:-.24rem;top:-.17rem;font-size:.39rem; }
.aka-regalia-image.is-mini { height:1.18rem; }
.aka-world-power { font-size:.62rem;text-align:right; }
.aka-world-power small { display:none; }
.aka-world-scroll { max-height:21.9rem;padding-right:.10rem; }
.aka-world-player { grid-template-columns:2.05rem minmax(0,1fr);gap:.34rem; }
.aka-world-avatar { width:2.05rem;height:2.05rem; }
.aka-world-avatar > b { font-size:.54rem; }
.aka-world-own-position { grid-template-columns:1fr;gap:.12rem;padding:.24rem; }
.aka-world-own-position > span { border-inline-start:0;border-top:1px solid rgba(var(--aka-rank-cyan),.08); }
.aka-world-own-position > span:first-child { border-top:0; }
.aka-world-team-head { display:none; }
.aka-world-team-row { grid-template-columns:2.48rem minmax(0,1fr) 4.9rem;min-height:3.70rem;padding:.32rem .36rem;gap:.28rem; }
.aka-world-team-identity { grid-template-columns:2.10rem minmax(0,1fr);gap:.34rem; }
.aka-world-team-identity .aka-world-avatar { width:2.10rem;height:2.10rem; }
.aka-world-team-identity b { font-size:.64rem; }
.aka-world-team-identity small { font-size:.44rem; }
.aka-world-team-identity em { font-size:.43rem; }
.aka-world-team-power strong { font-size:.61rem; }
.aka-world-team-power small { display:none; }
.aka-world-inspect { max-height:24rem; }
.aka-world-inspect-hero { grid-template-columns:5.2rem minmax(0,1fr) auto;gap:.50rem;padding:.50rem; }
.aka-world-avatar.is-large { width:5.2rem;height:5.2rem; }
.aka-world-inspect-identity > strong { font-size:1.26rem; }
.aka-world-inspect-rank { min-width:4.8rem;padding-inline-start:.46rem; }
.aka-world-inspect-rank strong { font-size:1.10rem; }
.aka-world-inspect-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
.aka-world-inspect-stats.is-team { grid-template-columns:repeat(2,minmax(0,1fr)); }
.aka-world-tree-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.aka-world-regalia-row { grid-template-columns:1.8rem minmax(0,1fr) 1.2rem;gap:.18rem .36rem;padding:.38rem .42rem; }
.aka-world-regalia-row > .aka-world-regalia-mini { grid-row:1/4; }
.aka-world-regalia-row > span:nth-of-type(2),
.aka-world-regalia-row > span:nth-of-type(3),
.aka-world-regalia-row > span:nth-of-type(4) { grid-column:2; }
.aka-world-regalia-row > span:nth-of-type(3),
.aka-world-regalia-row > span:nth-of-type(4) { padding-top:.22rem;border-top:1px solid rgba(var(--aka-rank-gold),.06); }
.aka-world-regalia-row > i { grid-column:3;grid-row:1/4;align-self:center; }
.aka-world-regalia-row > .aka-world-regalia-mini { width:1.55rem;height:2.45rem; }
.aka-world-regalia-row .aka-regalia-image.is-mini { height:2.4rem; }
.aka-world-regalia-record { margin:-.08rem .12rem .28rem;padding:.58rem; }
.aka-world-regalia-detail { min-height:12.2rem;grid-template-columns:8.1rem minmax(0,1fr);gap:.52rem; }
.aka-world-regalia-portrait { grid-template-rows:1.28rem minmax(0,1fr) 1.28rem; }
.aka-regalia-image.is-world-detail { max-height:none; }
.aka-world-regalia-information { gap:.31rem; }
.aka-world-regalia-detail-head strong { font-size:1.08rem; }
.aka-world-regalia-specs { gap:.18rem; }
.aka-world-regalia-specs > span,.aka-world-regalia-holder > span { padding:.31rem .34rem; }
.aka-world-regalia-specs strong,.aka-world-regalia-holder strong { font-size:.58rem; }
.aka-world-regalia-physical-quest { padding:.34rem .38rem;gap:.23rem; }
.aka-world-regalia-record-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.aka-world-regalia-history { grid-template-columns:1fr; }
.aka-world-regalia-history > small { margin-bottom:.08rem; }
.aka-world-regalia-holder-note { line-height:1.35;text-align:left; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) { right:.56rem !important;bottom:calc(.56rem - 6px) !important;left:.56rem !important;height:2.75rem !important;min-height:2.75rem !important;grid-template-columns:4.16rem minmax(0,1fr) 4.16rem !important; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) > :is(.aka-wallet-track-command,.aka-wallet-gallery-command) { width:4.16rem !important;min-width:4.16rem !important;max-width:4.16rem !important;height:2.75rem !important;min-height:2.75rem !important;max-height:2.75rem !important; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) :is(.aka-wallet-track-face,.aka-wallet-gallery-face) { width:1.64rem !important;min-width:1.64rem !important;max-width:1.64rem !important;height:1.64rem !important;min-height:1.64rem !important;max-height:1.64rem !important;flex-basis:1.64rem !important; }
}
@media (max-width:360px) {
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-diamond-summary,.aka-wallet-activity-summary) { gap:.18rem !important; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-diamond-summary,.aka-wallet-activity-summary) > :is(.aka-wallet-diamond-stat,.aka-wallet-activity-stat) { padding-inline:.30rem !important; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) { grid-template-columns:4.02rem minmax(0,1fr) 4.02rem !important; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) > :is(.aka-wallet-track-command,.aka-wallet-gallery-command) { width:4.02rem !important;min-width:4.02rem !important;max-width:4.02rem !important; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-drawer-inner:has(> .aka-hidden-collection-head) > :is(.aka-wallet-drawer-footer,.aka-wallet-diamond-footer) :is(.aka-wallet-track-face,.aka-wallet-gallery-face) { width:1.58rem !important;min-width:1.58rem !important;max-width:1.58rem !important;height:1.58rem !important;min-height:1.58rem !important;max-height:1.58rem !important;flex-basis:1.58rem !important; }
}
@media (max-width:520px) {
.aka-world-regalia-detail { grid-template-columns:1fr;min-height:0; }
.aka-world-regalia-portrait { min-height:12.5rem;grid-template-rows:1.30rem 10rem 1.30rem; }
.aka-regalia-image.is-world-detail { max-height:none; }
.aka-world-regalia-specs { grid-template-columns:repeat(3,minmax(0,1fr)); }
.aka-world-regalia-holder { grid-template-columns:1.3fr .7fr; }
.aka-world-regalia-record-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.aka-world-regalia-quest-head { align-items:flex-start;flex-direction:column;gap:.18rem; }
.aka-world-regalia-quest-steps { grid-template-columns:1fr; }
.aka-world-inspect-hero { grid-template-columns:4.6rem minmax(0,1fr); }
.aka-world-avatar.is-large { width:4.6rem;height:4.6rem; }
.aka-world-inspect-rank { grid-column:1/-1;min-width:0;align-items:center;flex-direction:row;justify-content:space-between;padding:.42rem 0 0;border-inline-start:0;border-top:1px solid rgba(var(--aka-rank-gold),.08);text-align:left; }
.aka-world-inspect-rank strong { margin-top:0; }
.aka-world-tree-grid { grid-template-columns:1fr; }
.aka-world-tree-caption { align-items:flex-start;flex-direction:column;gap:.18rem; }
}
@media (max-width:360px) {
.aka-wallet-rank-summary-label { font-size:.54rem;letter-spacing:.12em; }
.aka-wallet-rank-summary-value { font-size:.70rem;letter-spacing:.055em; }
.aka-alias-editor-foot { gap:.22rem; }
.aka-alias-fee { font-size:.48rem;letter-spacing:.02em; }
.aka-alias-actions { gap:.22rem; }
.aka-alias-actions button { min-width:2.45rem;padding-inline:.28rem;font-size:.49rem; }
.aka-alias-actions .aka-alias-accept { min-width:3.48rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-rank-drawer { height:13.08rem;min-height:13.08rem;max-height:13.08rem;padding-inline:.36rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-command { grid-template-columns:minmax(0,1fr) 4.74rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-command > span { padding-inline:.36rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-command small { font-size:.48rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-command strong { font-size:1.06rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-command-rank strong { font-size:.92rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-command em { font-size:.40rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-core-panel { grid-template-columns:3.56rem minmax(0,1fr);gap:.26rem;padding-inline:.18rem .28rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-core { width:3.12rem;height:3.12rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-feed { grid-template-columns:.72rem minmax(0,1fr);gap:.18rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-feed small { font-size:.45rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-feed strong { font-size:.59rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-feed-note { font-size:.34rem;letter-spacing:.07em; }
.aka-wallet-signal-drawer.is-mobile .aka-power-chase { padding-inline:.38rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-chase-head span,.aka-wallet-signal-drawer.is-mobile .aka-power-chase-foot span { font-size:.40rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-chase-head strong { font-size:.39rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-chase-foot strong { font-size:.52rem; }
.aka-rank-tab { font-size:.56rem; }
.aka-hidden-collection-head { grid-template-columns:1fr;gap:.16rem; }
.aka-hidden-collection-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
.aka-hidden-collection-title { font-size:.43rem; }
.aka-world-regalia-detail-head { grid-template-columns:1fr;gap:.18rem; }
.aka-world-regalia-detail-head em { text-align:left; }
.aka-world-regalia-portrait-kicker,.aka-world-regalia-portrait-status { font-size:.47rem; }
.aka-world-regalia-specs small,.aka-world-regalia-holder small { font-size:.46rem; }
.aka-world-regalia-specs strong,.aka-world-regalia-holder strong { font-size:.54rem; }
.aka-network-tier { grid-template-columns:1.04fr .72fr .94fr;padding-inline:.28rem; }
.aka-network-tier-name small { display:none; }
.aka-regalia-challenge small { font-size:.42rem; }
.aka-regalia-challenge strong { font-size:.46rem; }
.aka-world-tab { font-size:.58rem;letter-spacing:.08em; }
.aka-world-rank-row { grid-template-columns:2.1rem minmax(0,1fr) 3.8rem 2.25rem;gap:.18rem; }
.aka-world-player { grid-template-columns:1.82rem minmax(0,1fr);gap:.24rem; }
.aka-world-avatar { width:1.82rem;height:1.82rem; }
.aka-world-player-line > b { max-width:5.3rem; }
.aka-world-team-row { grid-template-columns:2.10rem minmax(0,1fr) 4.2rem;gap:.18rem;padding-inline:.26rem; }
.aka-world-team-identity { grid-template-columns:1.82rem minmax(0,1fr);gap:.24rem; }
.aka-world-team-identity .aka-world-avatar { width:1.82rem;height:1.82rem; }
.aka-world-inspect-stats { grid-template-columns:1fr 1fr;gap:.18rem; }
}
@media (prefers-reduced-motion:reduce) {
.aka-wallet-rank-action,
.aka-wallet-rank-drawer,
.aka-alias-editor,
.aka-world-regalia-record,
.aka-regalia-image.is-world-detail,
.aka-world-regalia-progress i,
.aka-power-core-arc,
.aka-power-chase-fill,
.aka-power-chase-node { animation:none !important;transition:none !important; }
}
/* --------------------------------------------------------------------------
V0.42.72 · YOUR RANK uses a square Diamond-tone plate with one blue circular
SVG contour. The obsolete black circular backing is removed.
-------------------------------------------------------------------------- */
.aka-wallet-rank-summary {
grid-template-columns:1.18rem minmax(0,1fr) auto;
gap:.38rem;
padding-inline:.40rem .58rem;
}
.aka-rank-inline-emblem {
width:1.18rem;
height:1.18rem;
display:grid;
place-items:center;
padding:0;
border:1px solid rgba(var(--aka-rank-violet),.42);
border-radius:4px;
color:rgba(var(--aka-rank-cream),.62);
background:
linear-gradient(135deg,rgba(var(--aka-rank-ruby),.075),transparent 42%),
linear-gradient(145deg,rgba(var(--aka-rank-violet),.31),rgba(12,8,17,.96));
box-shadow:inset 1px 1px 0 rgba(255,255,255,.035),inset -1px -1px 0 rgba(0,0,0,.38),0 2px 4px rgba(0,0,0,.28);
opacity:.58;
filter:saturate(.64) brightness(.91);
cursor:default;
transition:opacity .24s ease,filter .24s ease,border-color .24s ease,box-shadow .28s ease,transform .12s ease;
}
.aka-rank-inline-emblem .aka-rank-medal-glyph { width:1.00rem !important;height:1.00rem !important; }
.aka-rank-inline-emblem.is-claim-ready {
opacity:1;
filter:none;
cursor:pointer;
border-color:rgba(var(--aka-rank-violet),.70);
box-shadow:inset 1px 1px 0 rgba(255,255,255,.045),inset -1px -1px 0 rgba(0,0,0,.42),0 0 9px rgba(var(--aka-rank-cyan),.24),0 2px 4px rgba(0,0,0,.30);
animation:akaRoyalClaimPulse 3.2s ease-in-out infinite;
}
.aka-rank-inline-emblem.is-claim-ready:is(:hover,:focus-visible) { outline:0;border-color:rgba(var(--aka-rank-cyan),.72);filter:brightness(1.10); }
.aka-rank-inline-emblem.is-claim-ready:active { transform:translateY(1px); }
.aka-wallet-rank-action .aka-rank-medal-glyph { width:1.14rem !important;height:1.14rem !important; }
.aka-wallet-rank-action:not(:disabled):is(:hover,:focus-visible),
.aka-wallet-rank-action.is-selected {
border-color:rgba(var(--aka-rank-ruby),.56) !important;
box-shadow:0 0 0 2px rgba(4,4,5,.96),0 0 0 3px rgba(var(--aka-rank-cyan),.42),0 0 11px rgba(var(--aka-rank-cyan),.15),inset 0 0 8px rgba(var(--aka-rank-violet),.06) !important;
}
.aka-rank-medal-ring.is-outer { stroke:#79D8EE;stroke-width:1.12;opacity:.90; }
.aka-rank-medal-ribbon.is-left { fill:#D45E91; }
.aka-rank-medal-ribbon.is-right { fill:#78669B; }
.aka-rank-medal-star { fill:#E2B852;stroke:#FFE1A0; }
.aka-rank-medal-core { fill:#B23568;stroke:rgba(255,234,178,.94); }
@keyframes akaRoyalClaimPulse {
0%,100% { box-shadow:inset 1px 1px 0 rgba(255,255,255,.045),inset -1px -1px 0 rgba(0,0,0,.42),0 0 7px rgba(var(--aka-rank-cyan),.18),0 2px 4px rgba(0,0,0,.30); }
50% { box-shadow:inset 1px 1px 0 rgba(255,255,255,.055),inset -1px -1px 0 rgba(0,0,0,.40),0 0 13px rgba(var(--aka-rank-cyan),.34),0 0 18px rgba(var(--aka-rank-gold),.08),0 2px 4px rgba(0,0,0,.30); }
}
/* Compact two-step delivery claim. No personal delivery data is persisted in
browser storage; the production bridge sends it directly to the backend. */
.aka-wallet-rank-drawer.is-regalia-claim {
height:13.25rem;
min-height:13.25rem;
max-height:13.25rem;
grid-template-rows:minmax(0,1fr);
}
.aka-rank-body.is-claim-only { padding-top:0; }
.aka-regalia-claim-screen { --aka-regalia-focus-tone:212,168,67;height:100%;min-height:0; }
.aka-regalia-claim-screen.is-noble { --aka-regalia-focus-tone:196,211,221; }
.aka-regalia-claim-screen.is-valor { --aka-regalia-focus-tone:191,115,68; }
.aka-regalia-claim-form {
height:100%;
min-height:0;
display:grid;
grid-template-rows:auto auto minmax(0,1fr) auto auto;
gap:.34rem;
padding:.06rem .02rem 0;
color:rgba(var(--aka-rank-cream),.84);
}
.aka-regalia-claim-head { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.40rem;padding-bottom:.30rem;border-bottom:1px solid rgba(var(--aka-regalia-focus-tone),.18); }
.aka-regalia-claim-head > span { min-width:0;display:flex;flex-direction:column;gap:.16rem; }
.aka-regalia-claim-head small { color:rgba(var(--aka-regalia-focus-tone),.74);font:600 .52rem/1 "Space Grotesk",sans-serif;letter-spacing:.10em; }
.aka-regalia-claim-head strong { overflow:hidden;color:rgba(var(--aka-rank-cream),.95);font:400 .90rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.08em;text-overflow:ellipsis;white-space:nowrap; }
.aka-regalia-claim-head em { color:rgba(var(--aka-rank-cyan),.78);font:normal 600 .50rem/1 "Space Grotesk",sans-serif;letter-spacing:.07em;white-space:nowrap; }
.aka-regalia-claim-award { min-width:0;display:grid;grid-template-columns:1.38rem minmax(0,1fr) auto;align-items:center;gap:.34rem;padding:.26rem .38rem;border:1px solid rgba(var(--aka-regalia-focus-tone),.14);border-radius:4px;background:linear-gradient(90deg,rgba(var(--aka-regalia-focus-tone),.055),rgba(0,0,0,.22)); }
.aka-regalia-claim-award img { width:1.30rem;height:1.68rem;object-fit:contain; }
.aka-regalia-claim-award > span { min-width:0;display:flex;flex-direction:column;gap:.13rem; }
.aka-regalia-claim-award small { color:rgba(var(--aka-rank-cream),.42);font:600 .48rem/1 "Space Grotesk",sans-serif;letter-spacing:.05em; }
.aka-regalia-claim-award strong { overflow:hidden;color:rgba(var(--aka-rank-cream),.87);font:600 .60rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-regalia-claim-award b { color:rgba(var(--aka-regalia-focus-tone),.84);font:600 .52rem/1 "Space Grotesk",sans-serif;white-space:nowrap; }
.aka-regalia-claim-fields { min-height:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:.30rem; }
.aka-regalia-claim-fields.is-delivery { grid-template-columns:1fr .72fr; }
.aka-regalia-claim-field { min-width:0;display:grid;gap:.14rem; }
.aka-regalia-claim-field.is-wide { grid-column:1/-1; }
.aka-regalia-claim-field > span { color:rgba(var(--aka-rank-gold),.64);font:600 .48rem/1 "Space Grotesk",sans-serif;letter-spacing:.065em; }
.aka-regalia-claim-field input {
width:100%;
min-width:0;
height:1.56rem;
box-sizing:border-box;
padding:.16rem .42rem .10rem;
border:1px solid rgba(var(--aka-regalia-focus-tone),.22);
border-radius:3px;
outline:0;
color:rgba(var(--aka-rank-cream),.93);
background:linear-gradient(180deg,rgba(1,3,4,.92),rgba(7,8,8,.78));
font:600 .62rem/1 "Space Grotesk",sans-serif;
}
.aka-regalia-claim-field input::placeholder { color:rgba(var(--aka-rank-cream),.25); }
.aka-regalia-claim-field input:focus { border-color:rgba(var(--aka-regalia-focus-tone),.64);box-shadow:0 0 0 1px rgba(var(--aka-regalia-focus-tone),.08); }
.aka-regalia-claim-message { min-height:.62rem;margin:0;color:rgba(var(--aka-rank-cream),.42);font:600 .48rem/1.25 "Space Grotesk",sans-serif;letter-spacing:.035em;text-align:center; }
.aka-regalia-claim-message.is-error { color:rgba(var(--aka-rank-red),.88); }
.aka-regalia-claim-actions { display:grid;grid-template-columns:4.25rem minmax(0,1fr);gap:.34rem;height:1.52rem; }
.aka-regalia-claim-actions button,.aka-world-regalia-claim-entry {
border:1px solid rgba(var(--aka-regalia-focus-tone),.22);
border-radius:3px;
color:rgba(var(--aka-rank-cream),.62);
background:rgba(1,3,4,.46);
font:600 .54rem/1 "Space Grotesk",sans-serif;
letter-spacing:.075em;
cursor:pointer;
transition:border-color .18s ease,color .18s ease,background-color .18s ease,transform .10s ease;
}
.aka-regalia-claim-actions button:last-child,.aka-world-regalia-claim-entry.is-ready { border-color:rgba(var(--aka-regalia-focus-tone),.48);color:rgba(var(--aka-rank-cream),.92);background:linear-gradient(180deg,rgba(var(--aka-regalia-focus-tone),.09),rgba(0,0,0,.34)); }
.aka-regalia-claim-actions button:is(:hover,:focus-visible),.aka-world-regalia-claim-entry:is(:hover,:focus-visible) { outline:0;border-color:rgba(var(--aka-regalia-focus-tone),.75);color:rgba(var(--aka-rank-cream),.96); }
.aka-regalia-claim-actions button:active,.aka-world-regalia-claim-entry:active { transform:translateY(1px); }
.aka-regalia-claim-success { height:100%;display:grid;place-items:center;padding:.60rem;text-align:center; }
.aka-regalia-claim-success > div { width:100%;max-width:18rem;padding:1rem;border:1px solid rgba(var(--aka-rank-emerald),.22);border-radius:5px;background:radial-gradient(circle at 50% 0,rgba(var(--aka-rank-emerald),.08),transparent 65%); }
.aka-regalia-claim-success span { color:rgba(var(--aka-rank-emerald),.78);font:600 .52rem/1 "Space Grotesk",sans-serif;letter-spacing:.12em; }
.aka-regalia-claim-success strong { display:block;margin-top:.45rem;color:rgba(var(--aka-rank-cream),.95);font:400 1.12rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.09em; }
.aka-regalia-claim-success p { margin:.50rem 0 0;color:rgba(var(--aka-rank-cream),.48);font:600 .54rem/1.45 "Space Grotesk",sans-serif; }
.aka-world-regalia-claim-entry { --aka-regalia-focus-tone:var(--aka-regalia-tone);width:100%;min-height:2.12rem;margin-top:.08rem; }
.aka-world-regalia-claim-host { --aka-regalia-focus-tone:var(--aka-regalia-tone);min-height:13rem;padding:.62rem;border:1px solid rgba(var(--aka-regalia-tone),.12);border-radius:5px;background:rgba(0,0,0,.18); }
.aka-world-regalia-claim-host .aka-regalia-claim-form { min-height:12rem; }
/* Royal one-time claim ceremony. */
.aka-regalia-ceremony[hidden] { display:none !important; }
.aka-regalia-ceremony {
position:fixed;
z-index:200000;
inset:0;
display:grid;
place-items:center;
padding:1rem;
overflow:hidden;
background:radial-gradient(circle at 50% 44%,rgba(28,52,70,.54),rgba(5,4,7,.96) 64%,#020203 100%);
opacity:0;
transition:opacity .48s ease;
}
.aka-regalia-ceremony.is-visible { opacity:1; }
.aka-regalia-ceremony::before { content:"";position:absolute;inset:-35% 28%;background:linear-gradient(90deg,transparent,rgba(127,221,242,.11),rgba(255,222,151,.16),rgba(127,221,242,.11),transparent);filter:blur(18px);transform:perspective(30rem) rotateX(63deg);animation:akaCeremonyBeam 5.6s ease-in-out infinite; }
.aka-regalia-ceremony::after { content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.010) 4px);pointer-events:none; }
.aka-regalia-ceremony-panel { --aka-regalia-focus-tone:212,168,67;position:relative;isolation:isolate;width:min(25rem,94vw);min-height:31rem;display:grid;grid-template-rows:auto 15.5rem auto auto auto;align-content:center;justify-items:center;gap:.56rem;padding:1.25rem 1.15rem 1.35rem;overflow:hidden;border:1px solid rgba(var(--aka-regalia-focus-tone),.40);border-radius:8px;background:radial-gradient(circle at 50% 35%,rgba(var(--aka-regalia-focus-tone),.085),transparent 46%),linear-gradient(155deg,rgba(14,11,12,.98),rgba(2,6,8,.99));box-shadow:0 34px 90px rgba(0,0,0,.72),0 0 34px rgba(var(--aka-rank-cyan),.10),inset 0 1px 0 rgba(255,255,255,.045);transform:translateY(12px) scale(.97);transition:transform .58s cubic-bezier(.16,1,.3,1); }
.aka-regalia-ceremony.is-visible .aka-regalia-ceremony-panel { transform:none; }
.aka-regalia-ceremony-panel.is-noble { --aka-regalia-focus-tone:196,211,221; }
.aka-regalia-ceremony-panel.is-valor { --aka-regalia-focus-tone:191,115,68; }
.aka-regalia-ceremony-kicker { color:rgba(var(--aka-rank-cyan),.78);font:600 .62rem/1 "Space Grotesk",sans-serif;letter-spacing:.20em; }
.aka-regalia-ceremony-visual { position:relative;width:13rem;height:15.5rem;display:grid;place-items:center; }
.aka-regalia-ceremony-visual::before,.aka-regalia-ceremony-visual::after { content:"";position:absolute;border:1px solid rgba(var(--aka-regalia-focus-tone),.30);border-radius:50%;animation:akaCeremonyOrbit 12s linear infinite; }
.aka-regalia-ceremony-visual::before { inset:1.05rem 0; }
.aka-regalia-ceremony-visual::after { inset:2rem .95rem;border-color:rgba(var(--aka-rank-cyan),.25);animation-direction:reverse;animation-duration:9s; }
.aka-regalia-ceremony-visual img { position:relative;z-index:2;width:10.2rem;height:15rem;object-fit:contain;filter:drop-shadow(0 15px 22px rgba(0,0,0,.70)) drop-shadow(0 0 13px rgba(var(--aka-regalia-focus-tone),.22));animation:akaCeremonyAward 1.05s cubic-bezier(.16,1,.3,1) both; }
.aka-regalia-ceremony-title { margin:0;color:rgba(var(--aka-rank-cream),.98);font:400 2.05rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.11em;text-align:center;text-shadow:0 0 18px rgba(var(--aka-regalia-focus-tone),.18); }
.aka-regalia-ceremony-name { color:rgba(var(--aka-regalia-focus-tone),.92);font:600 .72rem/1 "Space Grotesk",sans-serif;letter-spacing:.18em;text-align:center; }
.aka-regalia-ceremony-copy { max-width:20rem;margin:0;color:rgba(var(--aka-rank-cream),.52);font:600 .62rem/1.45 "Space Grotesk",sans-serif;letter-spacing:.045em;text-align:center; }
.aka-regalia-ceremony-open { width:min(16rem,100%);height:2.42rem;margin-top:.32rem;border:1px solid rgba(var(--aka-regalia-focus-tone),.62);border-radius:4px;color:rgba(var(--aka-rank-cream),.96);background:linear-gradient(180deg,rgba(var(--aka-regalia-focus-tone),.14),rgba(0,0,0,.52));box-shadow:0 0 17px rgba(var(--aka-regalia-focus-tone),.10),inset 0 1px 0 rgba(255,255,255,.04);font:600 .68rem/1 "Space Grotesk",sans-serif;letter-spacing:.15em;cursor:pointer; }
.aka-regalia-ceremony-open:is(:hover,:focus-visible) { outline:0;border-color:rgba(var(--aka-rank-cyan),.88);box-shadow:0 0 22px rgba(var(--aka-rank-cyan),.18),inset 0 1px 0 rgba(255,255,255,.05); }
.aka-regalia-ceremony-open:active { transform:translateY(1px); }
.aka-regalia-ceremony-close { position:absolute;z-index:3;top:.65rem;right:.65rem;width:1.7rem;height:1.7rem;border:0;color:rgba(var(--aka-rank-cream),.42);background:transparent;font:400 1.1rem/1 "Space Grotesk",sans-serif;cursor:pointer; }
.aka-regalia-ceremony-close:is(:hover,:focus-visible) { outline:0;color:rgba(var(--aka-rank-cream),.92); }
.aka-regalia-particle { position:absolute;left:var(--x);top:var(--y);width:2px;height:2px;border-radius:50%;background:rgba(var(--aka-regalia-focus-tone),.82);box-shadow:0 0 7px rgba(var(--aka-regalia-focus-tone),.65);animation:akaCeremonyDust var(--d) ease-in-out infinite;animation-delay:var(--delay); }
@keyframes akaCeremonyBeam { 0%,100%{opacity:.55;transform:perspective(30rem) rotateX(63deg) translateX(-3%)}50%{opacity:1;transform:perspective(30rem) rotateX(63deg) translateX(3%)} }
@keyframes akaCeremonyOrbit { to{transform:rotate(360deg)} }
@keyframes akaCeremonyAward { from{opacity:0;transform:translateY(22px) scale(.88);filter:blur(4px)}to{opacity:1;transform:none} }
@keyframes akaCeremonyDust { 0%,100%{opacity:.10;transform:translateY(7px)}50%{opacity:.92;transform:translateY(-9px)} }
/* V0.42.72 · NETWORK / GALLERY POLISH
Keep the fixed Wallet frame, reclaim unused Network spacing so TIER 3 remains
fully visible, and give EXCLUSIVE the same optical Gallery mark as SECRET. */
.aka-wallet-signal-drawer
.aka-wallet-drawer-inner:is(.is-diamond,.is-secret)
> .aka-wallet-diamond-footer
.aka-wallet-gallery-face > .aka-wallet-gallery-stack-glyph {
transform:scale(1.34) !important;
transform-origin:50% 50% !important;
}
@media (max-width:768px) {
.aka-wallet-rank-summary { grid-template-columns:1.18rem minmax(0,1fr) auto;gap:.36rem; }
.aka-rank-inline-emblem { width:1.18rem;height:1.18rem; }
.aka-wallet-signal-drawer.is-mobile .aka-wallet-rank-drawer.is-regalia-claim { height:13.55rem;min-height:13.55rem;max-height:13.55rem; }
.aka-world-regalia-claim-host { min-height:14rem;padding:.48rem; }
.aka-regalia-ceremony-panel { min-height:min(31rem,88vh);grid-template-rows:auto minmax(11rem,15rem) auto auto auto;padding-top:1rem; }
.aka-regalia-ceremony-visual { width:11.5rem;height:min(15rem,36vh); }
.aka-regalia-ceremony-visual img { width:9rem;height:100%; }
}
@media (max-width:360px) {
.aka-wallet-rank-summary { padding-inline:.32rem .44rem;gap:.25rem; }
.aka-rank-inline-emblem { width:1.14rem;height:1.14rem; }
.aka-regalia-claim-actions { grid-template-columns:3.65rem minmax(0,1fr); }
.aka-regalia-claim-field input { font-size:.58rem; }
.aka-regalia-ceremony-title { font-size:1.72rem; }
}
@media (prefers-reduced-motion:reduce) {
.aka-rank-inline-emblem,
.aka-regalia-ceremony,
.aka-regalia-ceremony-panel,
.aka-regalia-ceremony-visual::before,
.aka-regalia-ceremony-visual::after,
.aka-regalia-ceremony-visual img,
.aka-regalia-particle { animation:none !important;transition:none !important; }
}
/* ========================================================================== */
/* V0.42.74 — WALLET ICON HARMONY PASS */
/* Visual-only normalization. Signal semantics, layout and hit areas frozen. */
/* ========================================================================== */
/* One quiet neutral visibility level across every Wallet mechanism. */
.aka-wallet-signal-strip .aka-wallet-signal-action.is-neutral,
.aka-wallet-signal-strip .aka-wallet-rank-action.is-neutral {
opacity:.58 !important;
filter:saturate(.50) brightness(.87) !important;
}
/* Shared premium active frame: same ring weight and same perceived halo. */
.aka-wallet-signal-strip .aka-wallet-signal-action.is-stored {
opacity:.94 !important;
filter:none !important;
border-color:rgba(var(--aka-wallet-signal-rgb),.46) !important;
box-shadow:
0 0 8px rgba(var(--aka-wallet-signal-rgb),.18),
inset 0 0 8px rgba(var(--aka-wallet-signal-rgb),.045) !important;
}
.aka-wallet-signal-strip .aka-wallet-signal-action.is-actionable {
opacity:1 !important;
filter:none !important;
border-color:rgba(var(--aka-wallet-signal-rgb),.68) !important;
box-shadow:
0 0 10px rgba(var(--aka-wallet-signal-rgb),.25),
0 0 18px rgba(var(--aka-wallet-signal-rgb),.08),
inset 0 0 9px rgba(var(--aka-wallet-signal-rgb),.052) !important;
}
.aka-wallet-signal-strip .aka-wallet-signal-action.is-selected {
opacity:1 !important;
filter:none !important;
border-color:rgba(var(--aka-wallet-signal-rgb),.72) !important;
box-shadow:
0 0 0 2px rgba(4,4,5,.96),
0 0 0 3px rgba(var(--aka-wallet-signal-rgb),.34),
0 0 11px rgba(var(--aka-wallet-signal-rgb),.18),
inset 0 0 9px rgba(var(--aka-wallet-signal-rgb),.055) !important;
}
/* Optical glyph normalization: equal visual mass without changing buttons. */
.aka-wallet-signal-strip .aka-wallet-signal-action.is-diamond > svg,
.aka-wallet-signal-strip .aka-wallet-signal-action.is-key > svg {
width:.94rem !important;
height:.94rem !important;
stroke-width:1.95 !important;
}
.aka-wallet-signal-strip .aka-wallet-signal-action.is-magnifier > svg.aka-archive-magnifier-glyph {
width:.96rem !important;
height:.96rem !important;
stroke-width:2.02 !important;
filter:drop-shadow(0 0 2px rgba(113,225,232,.34)) !important;
}
.aka-wallet-signal-strip .aka-wallet-signal-action.is-bonus > svg.aka-archive-bonus-glyph {
width:.94rem !important;
height:.94rem !important;
stroke-width:1.98 !important;
filter:drop-shadow(0 0 1.5px rgba(235,186,61,.18)) !important;
}
/* Key keeps its copper identity, but no longer burns hotter than neighbours. */
.aka-wallet-signal-strip .aka-wallet-signal-action.is-key.is-selected,
.aka-wallet-signal-strip .aka-wallet-signal-action.is-key.is-actionable {
border-color:rgba(191,105,53,.68) !important;
}
/* Reward vault keeps gold/emerald identity while using the same halo envelope. */
.aka-wallet-signal-strip .aka-wallet-signal-action.is-vault.is-selected {
border-color:rgba(101,230,163,.76) !important;
box-shadow:
0 0 0 2px rgba(3,12,8,.98),
0 0 0 3px rgba(184,117,34,.38),
0 0 11px rgba(77,195,132,.17),
inset 0 0 9px rgba(77,195,132,.06) !important;
}
.aka-wallet-signal-strip .aka-wallet-dollar-glyph {
font-size:.92rem !important;
text-shadow:0 0 4px rgba(212,168,67,.28),0 0 8px rgba(65,190,125,.08) !important;
}
/* Rank / Regalia face follows the exact same active-frame geometry. */
.aka-wallet-signal-strip .aka-wallet-rank-action .aka-rank-medal-glyph {
width:1.08rem !important;
height:1.08rem !important;
}
.aka-wallet-signal-strip .aka-wallet-rank-action:not(:disabled):is(:hover,:focus-visible),
.aka-wallet-signal-strip .aka-wallet-rank-action.is-selected,
.aka-wallet-signal-strip .aka-wallet-rank-action.is-claim-ready {
opacity:1 !important;
filter:none !important;
border-color:rgba(var(--aka-rank-cyan),.64) !important;
box-shadow:
0 0 0 2px rgba(4,4,5,.96),
0 0 0 3px rgba(var(--aka-rank-cyan),.34),
0 0 12px rgba(var(--aka-rank-cyan),.28),
0 0 19px rgba(var(--aka-rank-cyan),.09),
inset 0 0 9px rgba(var(--aka-rank-violet),.055) !important;
}
@keyframes akaRankClaimBreath {
0%,100% {
box-shadow:0 0 0 2px rgba(4,4,5,.96),0 0 0 3px rgba(var(--aka-rank-cyan),.30),0 0 10px rgba(var(--aka-rank-cyan),.23),0 0 17px rgba(var(--aka-rank-cyan),.07),inset 0 0 8px rgba(var(--aka-rank-violet),.05) !important;
}
50% {
box-shadow:0 0 0 2px rgba(4,4,5,.96),0 0 0 3px rgba(var(--aka-rank-cyan),.38),0 0 14px rgba(var(--aka-rank-cyan),.31),0 0 21px rgba(var(--aka-rank-cyan),.10),inset 0 0 9px rgba(var(--aka-rank-violet),.06) !important;
}
}
/* ========================================================================== */
/* V0.42.78 — TARGETED CLEAN MICRO FIX */
/* Removes the stacked V0.42.76/77 overrides and keeps only verified fixes. */
/* ========================================================================== */
/* Hidden Collections: these two positions were visually verified in V0.42.76. */
.aka-wallet-signal-drawer .aka-wallet-drawer-inner.is-secret
.aka-wallet-activity-stat.is-available
.aka-wallet-activity-stat-icon > .aka-reel-glyph.aka-wallet-secret-reel {
transform:translateX(-.045rem) !important;
transform-origin:50% 50% !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner.is-diamond
.aka-wallet-diamond-stat.is-exclusive
.aka-wallet-diamond-stat-icon > svg {
transform:translateX(-.045rem) !important;
transform-origin:50% 50% !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner.is-diamond
.aka-wallet-diamond-stat.is-claimed
.aka-wallet-diamond-stat-icon > svg {
transform:none !important;
transform-origin:50% 50% !important;
}
/* V0.42.80 — Investigation: the large lens stays untouched. Only the small AVAILABLE
glyph/lens is optically corrected left, matching the user-marked screenshot. */
.aka-wallet-signal-strip .aka-wallet-signal-action.is-magnifier,
.aka-wallet-signal-strip .aka-wallet-signal-action.is-magnifier.is-selected {
background:
radial-gradient(circle at 44% 42%,rgba(180,247,249,.20) 0 20%,rgba(88,196,201,.045) 16% 26%,transparent 36%),
linear-gradient(145deg,rgba(20,36,38,.90),rgba(3,9,10,.96) 68%) !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner.is-magnifier
.aka-wallet-activity-stat.is-available
.aka-wallet-activity-stat-icon {
background:
radial-gradient(circle at 50% 50%,rgba(78,205,235,.34) 0 20%,rgba(78,205,235,.09) 40% 40%,transparent 35%),
rgba(var(--aka-activity-stat-rgb),.075) !important;
}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner.is-magnifier
.aka-wallet-activity-stat.is-available
.aka-wallet-activity-stat-icon > svg.aka-archive-magnifier-glyph {
transform:none !important;
transform-origin:50% 50% !important;
}
/* AKA balance dollar: remove the dark lower-right wedge itself instead of
masking it with offsets. No black inset edge, no diagonal dark final stop. */
.aka-wallet-balance-dollar {
box-sizing:border-box !important;
display:inline-grid !important;
place-items:center !important;
overflow:hidden !important;
border:1px solid rgba(212,168,67,.46) !important;
border-radius:4px !important;
background:
radial-gradient(circle at 34% 25%,rgba(255,245,188,.18),transparent 32%),
linear-gradient(145deg,rgba(87,66,20,.72),rgba(30,25,10,.94)) !important;
box-shadow:
inset 1px 1px 0 rgba(255,244,194,.08),
0 0 7px rgba(212,168,67,.16),
0 2px 4px rgba(0,0,0,.40) !important;
line-height:1 !important;
transform:none !important;
}
.aka-wallet-balance-dollar::before,
.aka-wallet-balance-dollar::after {
content:none !important;
display:none !important;
}
/* Regalia: preserve the cyan outer ring. The inner square and stronger inner
illumination are royal/diamond violet; no shared mechanism glow is changed. */
.aka-wallet-signal-strip .aka-wallet-rank-action:not(:disabled):is(:hover,:focus-visible),
.aka-wallet-signal-strip .aka-wallet-rank-action.is-selected,
.aka-wallet-signal-strip .aka-wallet-rank-action.is-claim-ready {
opacity:1 !important;
filter:none !important;
border-color:rgba(var(--aka-rank-violet),.90) !important;
background:
linear-gradient(145deg,rgba(var(--aka-rank-violet),.56),rgba(16,8,22,.97) 72%) !important;
box-shadow:
0 0 0 2px rgba(4,4,5,.96),
0 0 0 3px rgba(var(--aka-rank-cyan),.34),
inset 0 0 0 1px rgba(var(--aka-rank-violet),.72),
inset 0 0 12px rgba(var(--aka-rank-violet),.46),
0 0 9px rgba(var(--aka-rank-violet),.18) !important;
}
@keyframes akaRankClaimBreath {
0%,100% {
box-shadow:
0 0 0 2px rgba(4,4,5,.96),
0 0 0 3px rgba(var(--aka-rank-cyan),.30),
inset 0 0 0 1px rgba(var(--aka-rank-violet),.48),
inset 0 0 8px rgba(var(--aka-rank-violet),.24),
0 0 7px rgba(var(--aka-rank-violet),.15) !important;
}
50% {
box-shadow:
0 0 0 2px rgba(4,4,5,.96),
0 0 0 3px rgba(var(--aka-rank-cyan),.34),
inset 0 0 0 1px rgba(var(--aka-rank-violet),.60),
inset 0 0 11px rgba(var(--aka-rank-violet),.34),
0 0 10px rgba(var(--aka-rank-violet),.22) !important;
}
}
/* V0.42.79 — exact two-point correction only.
1) Small MAG AVAILABLE lens moves right.
2) Regalia active frame: outer halo remains cyan; inner button edge is royal violet. */
.aka-wallet-signal-strip .aka-wallet-rank-action:not(:disabled):is(:hover,:focus-visible),
.aka-wallet-signal-strip .aka-wallet-rank-action.is-selected,
.aka-wallet-signal-strip .aka-wallet-rank-action.is-claim-ready {
border-color:rgba(var(--aka-rank-violet),.78) !important;
}
/* V0.42.82 — targeted optical fix only: small AVAILABLE lens glow moved left;
Regalia inner royal square strengthened to match the active magnifier's visual weight. */
/* V0.42.82 — lens-only directional correction.
Upper MAG lens glass: left + up. Small AVAILABLE lens glass: right + down.
The magnifier glyphs themselves are not moved. */
/* V0.42.84 — REGALIA HARMONIZED ROYAL FRAME ONLY.
Keep the same 1px square weight and halo envelope as the neighbouring Wallet
mechanism icons. Hue stays pure Diamond royal (139,5,115); no white glow.
Existing 1.78rem desktop / 2.02rem mobile geometry and alignment are untouched. */
.aka-wallet-signal-strip .aka-wallet-rank-action:not(:disabled):is(:hover,:focus-visible),
.aka-wallet-signal-strip .aka-wallet-rank-action.is-selected,
.aka-wallet-signal-strip .aka-wallet-rank-action.is-claim-ready {
--aka-regalia-royal:139,5,115;
border-color:rgba(var(--aka-regalia-royal),.58) !important;
background:
linear-gradient(145deg,rgba(var(--aka-regalia-royal),.14),rgba(7,5,9,.96) 72%) !important;
box-shadow:
0 0 0 2px rgba(4,4,5,.96),
0 0 0 3px rgba(var(--aka-rank-cyan),.28),
0 0 8px rgba(var(--aka-regalia-royal),.18),
inset 0 0 8px rgba(var(--aka-regalia-royal),.055) !important;
}
@keyframes akaRankClaimBreath {
0%,100% {
box-shadow:
0 0 0 2px rgba(4,4,5,.96),
0 0 0 3px rgba(var(--aka-rank-cyan),.25),
0 0 7px rgba(139,5,115,.15),
inset 0 0 7px rgba(139,5,115,.045) !important;
}
50% {
box-shadow:
0 0 0 2px rgba(4,4,5,.96),
0 0 0 3px rgba(var(--aka-rank-cyan),.30),
0 0 10px rgba(139,5,115,.22),
inset 0 0 8px rgba(139,5,115,.060) !important;
}
}
/* ========================================================================== */
/* V0.42.84 — WALLET DORMANT ICON OPTICAL PARITY */
/* Inactive-only polish: no geometry/state changes, no active glow changes. */
/* ========================================================================== */
/* Every truly dormant mechanism uses the same quiet frame envelope.
IMPORTANT: a neutral mechanism can still become selected when the user opens it.
Interaction states must keep their original premium glow/effects. */
.aka-wallet-signal-strip .aka-wallet-signal-action.is-neutral:not(.is-selected):not(:hover):not(:focus-visible),
.aka-wallet-signal-strip .aka-wallet-rank-action.is-neutral:not(.is-selected):not(.is-claim-ready):not(:hover):not(:focus-visible) {
opacity:.58 !important;
filter:saturate(.46) brightness(.89) !important;
border-color:rgba(var(--aka-wallet-signal-rgb,164,160,153),.22) !important;
box-shadow:inset 0 1px 0 rgba(255,255,255,.025) !important;
}
/* Purple reads optically hotter at equal alpha, so trim only its truly dormant face. */
.aka-wallet-signal-strip .aka-wallet-signal-action.is-diamond.is-neutral:not(.is-selected):not(:hover):not(:focus-visible) {
opacity:.54 !important;
}
/* Dormant means dormant only until interaction: selected/hover/focus keeps the authored category glow. */
.aka-wallet-signal-strip .aka-wallet-signal-action.is-neutral:not(.is-selected):not(:hover):not(:focus-visible) > svg,
.aka-wallet-signal-strip .aka-wallet-rank-action.is-neutral:not(.is-selected):not(.is-claim-ready):not(:hover):not(:focus-visible) .aka-rank-medal-glyph {
filter:none !important;
}
.aka-wallet-signal-strip .aka-wallet-signal-action.is-neutral:not(.is-selected):not(:hover):not(:focus-visible) .aka-wallet-dollar-glyph {
text-shadow:none !important;
}
/* Slightly lift dormant glyph readability without creating a glow. */
.aka-wallet-signal-strip .aka-wallet-signal-action.is-neutral:not(.is-selected):not(:hover):not(:focus-visible) {
color:rgba(var(--aka-wallet-signal-rgb),.64) !important;
}
/* Investigation remains identifiable while dormant on desktop. Mobile now uses
the same canonical MAG material from style.css instead of a separate override. */
.aka-wallet-signal-strip .aka-wallet-signal-action.is-magnifier.is-neutral:not(.is-selected):not(:hover):not(:focus-visible) {
opacity:.61 !important;
filter:saturate(.62) brightness(.90) !important;
color:rgba(113,225,232,.58) !important;
background:
radial-gradient(circle at 44% 42%,rgba(180,247,249,.12) 0 20%,rgba(88,196,201,.035) 21% 35%,transparent 36%),
linear-gradient(145deg,rgba(14,27,29,.88),rgba(3,8,9,.96) 68%) !important;
}
.aka-wallet-signal-strip .aka-wallet-signal-action.is-magnifier.is-neutral:not(.is-selected):not(:hover):not(:focus-visible) > svg.aka-archive-magnifier-glyph {
opacity:.68 !important;
filter:none !important;
}
/* Source: css/v4287-wallet-power-polish.css — original cascade order preserved. */
/* GIZMO KAKA V0.42.87 — WALLET POWER POLISH
Surgical override only. No Wallet shell width/height changes. */
@media (min-width:769px) {
/* Use the existing calm space above DISCONNECT instead of growing Wallet. */
.aka-wallet-signal-drawer:has(.aka-wallet-rank-drawer) {
margin:-.28rem 0 .04rem;
}
.aka-wallet-rank-drawer {
height:13.08rem;
min-height:13.08rem;
max-height:13.08rem;
}
.aka-power-overview {
grid-template-rows:3.02rem minmax(0,1fr) 2.34rem;
gap:.36rem;
}
.aka-power-command > span { padding:.36rem .50rem .34rem; }
.aka-power-command strong { margin-top:.18rem; }
.aka-power-command em { margin-top:.24rem; }
.aka-power-core-panel { padding:.34rem .46rem .34rem .34rem; }
.aka-power-core-panel::after { bottom:.30rem; }
.aka-power-feeds {
gap:.14rem;
padding:.18rem 0 .28rem;
}
.aka-power-feed-note {
color:rgba(var(--aka-rank-cyan),.40);
line-height:1.12;
letter-spacing:.075em;
}
.aka-power-chase {
gap:.12rem;
padding:.28rem .50rem .25rem;
}
}
/* Large Gallery poster owns the Wallet canvas below TITLE.
Rank summary is deactivated, not merely covered by z-index. */
#walletDropdown:has(> .aka-wallet-gallery-preview-host.is-visible) > .aka-wallet-rank-summary,
.aka-mobile-identity-panel:has(> .aka-wallet-gallery-preview-host.is-visible) > .aka-wallet-rank-summary {
opacity:0 !important;
visibility:hidden !important;
pointer-events:none !important;
}
/* Source: css/v4288-wallet-network-polish.css — original cascade order preserved. */
/* GIZMO KAKA V0.42.88 — WALLET NETWORK KPI POLISH
Surgical visual pass for Wallet > NETWORK only.
Keeps the fixed Wallet geometry and existing Network drawer height. */
.aka-wallet-rank-drawer .aka-network-stats {
position:relative;
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:0;
min-width:0;
padding:0 .08rem;
border-block:1px solid rgba(var(--aka-rank-gold),.07);
background:linear-gradient(90deg,transparent,rgba(var(--aka-rank-gold),.018) 50%,transparent);
}
.aka-wallet-rank-drawer .aka-network-kpi {
position:relative;
min-width:0;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
padding:.18rem .12rem .13rem;
text-align:center;
}
.aka-wallet-rank-drawer .aka-network-kpi + .aka-network-kpi::before {
content:"";
position:absolute;
inset:.30rem auto .28rem 0;
width:1px;
background:linear-gradient(180deg,transparent,rgba(var(--aka-rank-gold),.14) 28%,rgba(var(--aka-rank-cyan),.08) 72%,transparent);
}
.aka-wallet-rank-drawer .aka-network-kpi small {
max-width:100%;
overflow:hidden;
color:rgba(var(--aka-rank-cream),.43);
font:600 .48rem/1 "Space Grotesk",sans-serif;
letter-spacing:.075em;
text-overflow:ellipsis;
white-space:nowrap;
}
.aka-wallet-rank-drawer .aka-network-kpi strong {
margin-top:.20rem;
max-width:100%;
overflow:hidden;
color:rgba(var(--aka-rank-cream),.82);
font:400 .94rem/.90 "Bebas Neue","Arial Narrow",sans-serif;
letter-spacing:.055em;
text-overflow:ellipsis;
white-space:nowrap;
transition:color .22s ease,text-shadow .22s ease,opacity .22s ease;
}
.aka-wallet-rank-drawer .aka-network-kpi.is-empty strong {
color:rgba(var(--aka-rank-cream),.42);
text-shadow:none;
}
.aka-wallet-rank-drawer .aka-network-kpi.is-members.is-live strong {
color:rgba(var(--aka-rank-cream),.91);
}
.aka-wallet-rank-drawer .aka-network-kpi.is-active.is-live strong {
color:rgba(var(--aka-rank-cyan),.86);
text-shadow:0 0 7px rgba(var(--aka-rank-cyan),.10);
}
.aka-wallet-rank-drawer .aka-network-kpi.is-power.is-live strong {
color:rgba(var(--aka-rank-cyan),.94);
text-shadow:0 0 8px rgba(var(--aka-rank-cyan),.16);
}
.aka-wallet-rank-drawer .aka-network-tier > strong.is-empty,
.aka-wallet-rank-drawer .aka-network-tier > b.is-empty {
color:rgba(var(--aka-rank-cream),.48);
}
.aka-wallet-rank-drawer .aka-network-tier > strong.is-live {
color:rgba(var(--aka-rank-cream),.90);
}
.aka-wallet-rank-drawer .aka-network-tier > b.is-live {
color:rgba(var(--aka-rank-cyan),.84);
text-shadow:0 0 6px rgba(var(--aka-rank-cyan),.08);
}
@media (max-width:360px) {
.aka-wallet-rank-drawer .aka-network-kpi { padding-inline:.08rem; }
.aka-wallet-rank-drawer .aka-network-kpi small { font-size:.46rem;letter-spacing:.055em; }
.aka-wallet-rank-drawer .aka-network-kpi strong { font-size:.90rem; }
}
/* Source: css/v4289-wallet-power-orbit.css — original cascade order preserved. */
/* GIZMO KAKA V0.42.89 — WALLET POWER ORBIT
Surgical desktop-only upgrade.
Inner green wallet rim remains the connection state.
The larger outer sapphire orbit carries live chase progress.
Mobile keeps its approved wallet geometry; a dedicated mobile Power Edge belongs to a later effect pass. */
@keyframes akaWalletPowerOrbitCalibrate {
from { stroke-dashoffset: 0; }
to { stroke-dashoffset: -100; }
}
@keyframes akaWalletPowerOrbitMarkerBreath {
0%,100% {
opacity:.78;
box-shadow:0 0 4px rgba(112,215,255,.58),0 0 9px rgba(45,156,255,.22);
transform:translate(-50%,-50%) scale(.90);
}
50% {
opacity:1;
box-shadow:0 0 6px rgba(216,246,255,.88),0 0 13px rgba(45,156,255,.42),0 0 20px rgba(32,88,185,.18);
transform:translate(-50%,-50%) scale(1.08);
}
}
@keyframes akaWalletPowerOrbitDominance {
from { stroke-dashoffset: 0; }
to { stroke-dashoffset: -100; }
}
@keyframes akaWalletPowerOrbitReceive {
0% { filter:brightness(1) saturate(1); }
35% { filter:brightness(1.42) saturate(1.18); }
100% { filter:brightness(1) saturate(1); }
}
@media (min-width:769px) {
#navbar .aka-topbar-actions .aka-wallet-power-orbit {
--aka-power-orbit-progress:38;
position:absolute;
left:50%;
top:50%;
width:2.82rem;
height:2.82rem;
border-radius:50%;
opacity:0;
pointer-events:none;
transform:translate(-50%,-50%) scale(.965);
transform-origin:center;
z-index:2;
transition:opacity .34s ease,transform .52s cubic-bezier(.16,1,.3,1),filter .28s ease;
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-power-orbit {
opacity:.96;
transform:translate(-50%,-50%) scale(1);
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit-svg {
width:100%;
height:100%;
overflow:visible;
display:block;
transform:rotate(-90deg);
filter:drop-shadow(0 0 2px rgba(45,156,255,.22));
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit-bed,
#navbar .aka-topbar-actions .aka-wallet-power-orbit-fill,
#navbar .aka-topbar-actions .aka-wallet-power-orbit-surge {
fill:none;
vector-effect:non-scaling-stroke;
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit-bed {
stroke:rgba(69,124,177,.23);
stroke-width:1.15;
opacity:.88;
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit-fill {
stroke:url(#akaWalletPowerOrbitGradient);
stroke-width:2.05;
stroke-linecap:round;
opacity:.94;
filter:drop-shadow(0 0 2.4px rgba(112,215,255,.62)) drop-shadow(0 0 5.8px rgba(45,156,255,.23));
transition:stroke-dasharray .78s cubic-bezier(.16,1,.3,1),opacity .30s ease,filter .30s ease;
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit-surge {
stroke:rgba(216,246,255,.94);
stroke-width:1.35;
stroke-linecap:round;
opacity:0;
filter:drop-shadow(0 0 3px rgba(112,215,255,.85)) drop-shadow(0 0 7px rgba(45,156,255,.38));
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit-marker {
position:absolute;
inset:0;
border-radius:50%;
transform:rotate(calc(var(--aka-power-orbit-progress) * 3.6deg));
transition:transform .78s cubic-bezier(.16,1,.3,1),opacity .30s ease;
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit-marker > i {
position:absolute;
left:50%;
top:0;
width:.29rem;
height:.29rem;
border-radius:50%;
background:radial-gradient(circle at 42% 38%,#f2fcff 0 20%,#7ddcff 43%,#2d9cff 72%,rgba(32,88,185,.18) 100%);
border:1px solid rgba(216,246,255,.74);
transform:translate(-50%,-50%);
box-shadow:0 0 5px rgba(112,215,255,.68),0 0 11px rgba(45,156,255,.30);
animation:akaWalletPowerOrbitMarkerBreath 2.65s ease-in-out infinite;
}
/* The old outer green ring becomes quiet. The wallet's actual 2px emerald rim remains connection. */
#navbar .aka-topbar-actions .aka-wallet-control.is-connected:not(.is-reward-pending) .aka-wallet-icon-wrap::after {
opacity:0 !important;
border-color:transparent !important;
box-shadow:none !important;
animation:none !important;
}
/* Reward-pending keeps the approved champagne recognition ring above the Power Orbit. */
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending .aka-wallet-power-orbit {
opacity:.42;
filter:saturate(.78) brightness(.88);
}
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending .aka-wallet-power-orbit-marker {
opacity:.30;
}
/* Until the backend has a verified rank/gap, show a living calibration trace rather than false progress. */
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-calibrating .aka-wallet-power-orbit-fill {
stroke:rgba(86,184,255,.72);
stroke-dasharray:14 86 !important;
stroke-width:1.7;
opacity:.70;
animation:akaWalletPowerOrbitCalibrate 3.8s linear infinite;
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-calibrating .aka-wallet-power-orbit-marker {
opacity:0;
}
/* Rank #1 closes the ring. A single restrained travelling highlight says YOU ARE THE TARGET. */
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-dominant .aka-wallet-power-orbit-fill {
stroke-dasharray:100 0 !important;
stroke-width:2.15;
opacity:1;
filter:drop-shadow(0 0 3px rgba(216,246,255,.58)) drop-shadow(0 0 7px rgba(45,156,255,.32));
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-dominant .aka-wallet-power-orbit-surge {
opacity:.82;
animation:akaWalletPowerOrbitDominance 4.8s linear infinite;
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-dominant .aka-wallet-power-orbit-marker {
opacity:0;
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-power-receiving {
animation:akaWalletPowerOrbitReceive .74s cubic-bezier(.16,1,.3,1) 1;
}
/* Preserve the wallet icon above both rings. */
#navbar .aka-topbar-actions .aka-wallet-icon-wrap > svg,
#navbar .aka-topbar-actions .aka-wallet-icon-wrap > i {
position:relative;
z-index:4;
}
}
@media (prefers-reduced-motion:reduce) {
#navbar .aka-topbar-actions .aka-wallet-power-orbit-fill,
#navbar .aka-topbar-actions .aka-wallet-power-orbit-surge,
#navbar .aka-topbar-actions .aka-wallet-power-orbit-marker,
#navbar .aka-topbar-actions .aka-wallet-power-orbit-marker > i,
#navbar .aka-topbar-actions .aka-wallet-power-orbit {
animation:none !important;
transition:none !important;
}
}
/* Existing Wallet rules intentionally target descendant SVGs because the original orb held only
the Lucide glyph. The new Orbit is also an inline SVG, so explicitly isolate it from those
inherited emerald/classified/reward glyph filters without changing any legacy selector. */
@media (min-width:769px) {
#navbar .aka-topbar-actions .aka-wallet-control .aka-wallet-icon-wrap .aka-wallet-power-orbit-svg,
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-icon-wrap .aka-wallet-power-orbit-svg,
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending .aka-wallet-icon-wrap .aka-wallet-power-orbit-svg,
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-classified-active .aka-wallet-icon-wrap .aka-wallet-power-orbit-svg {
position:static !important;
z-index:auto !important;
color:inherit !important;
filter:drop-shadow(0 0 2px rgba(45,156,255,.22)) !important;
animation:none !important;
}
}
/* Source: css/v4290-wallet-power-orbit-centerfix.css — original cascade order preserved. */
/* GIZMO KAKA V0.42.90 — POWER ORBIT CENTER FIX
The legacy Wallet glyph rule forces every descendant SVG to 1.04rem.
Power Orbit is not a glyph: restore its SVG to the full concentric orbit box. */
@media (min-width:769px) {
#navbar .aka-topbar-actions .aka-wallet-control .aka-wallet-icon-wrap .aka-wallet-power-orbit-svg,
#navbar .aka-topbar-actions .aka-wallet-control.is-connected .aka-wallet-icon-wrap .aka-wallet-power-orbit-svg,
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-reward-pending .aka-wallet-icon-wrap .aka-wallet-power-orbit-svg,
#navbar .aka-topbar-actions .aka-wallet-control.is-connected.is-classified-active .aka-wallet-icon-wrap .aka-wallet-power-orbit-svg {
width:100% !important;
height:100% !important;
min-width:100% !important;
min-height:100% !important;
display:block !important;
}
}
/* Source: css/v4292-wallet-mobile-orbit-correction.css — original cascade order preserved. */
/* GIZMO KAKA V0.42.92 — MOBILE CORE ORBIT + MICRO ORBIT REPLACEMENT
One chase signal, three scales:
desktop Wallet = circular Power Orbit (existing),
mobile Wallet icon core = compact rounded-square Power Frame,
Rank/Regalia glyphs = always-present Micro Orbit, dim when dormant and brighter when active.
No Wallet geometry is widened or lengthened. */
@keyframes akaMobilePowerFrameCalibrate {
from { stroke-dashoffset:0; }
to { stroke-dashoffset:-100; }
}
@keyframes akaMobilePowerFrameDominance {
from { stroke-dashoffset:0; }
to { stroke-dashoffset:-100; }
}
@keyframes akaMobilePowerFrameReceive {
0% { filter:brightness(1) saturate(1); }
34% { filter:brightness(1.38) saturate(1.16); }
100% { filter:brightness(1) saturate(1); }
}
@keyframes akaMicroOrbitCalibrate {
from { transform:translate(-50%,-50%) rotate(0deg); }
to { transform:translate(-50%,-50%) rotate(360deg); }
}
@keyframes akaMicroOrbitDominance {
0%,100% { filter:brightness(.96) drop-shadow(0 0 2px rgba(45,156,255,.20)); }
50% { filter:brightness(1.18) drop-shadow(0 0 4px rgba(112,215,255,.38)); }
}
/* -------------------------------------------------------------------------
MOBILE WALLET ICON CORE -> POWER FRAME
The large CONNECTED card stays untouched. Sapphire now belongs only to the
small Wallet icon core inside it. Emerald remains the connection material.
------------------------------------------------------------------------- */
@media (max-width:768px) {
#mobileWalletIconWrap {
isolation:isolate;
overflow:visible !important;
position:relative !important;
}
#mobileWalletIconWrap > #mobileWalletIcon,
#mobileWalletIconWrap > svg:not(.aka-mobile-wallet-power-frame-svg) {
position:relative;
z-index:2;
}
.aka-mobile-wallet-power-frame {
--aka-power-frame-progress:38;
position:absolute;
inset:-4px;
z-index:1;
pointer-events:none;
opacity:0;
border-radius:8px;
transition:opacity .32s ease,filter .28s ease,transform .46s cubic-bezier(.16,1,.3,1);
}
.aka-mobile-identity-panel.is-connected #mobileWalletConnectBtn.is-connected #mobileWalletIconWrap .aka-mobile-wallet-power-frame {
opacity:.90;
}
.aka-mobile-wallet-power-frame-svg {
display:block;
width:100% !important;
height:100% !important;
overflow:visible;
filter:drop-shadow(0 0 2px rgba(45,156,255,.18));
}
.aka-mobile-wallet-power-frame-bed,
.aka-mobile-wallet-power-frame-fill,
.aka-mobile-wallet-power-frame-head,
.aka-mobile-wallet-power-frame-surge {
fill:none;
vector-effect:non-scaling-stroke;
}
.aka-mobile-wallet-power-frame-bed {
stroke:rgba(66,116,169,.20);
stroke-width:1.0;
}
.aka-mobile-wallet-power-frame-fill {
stroke:url(#akaMobileWalletPowerFrameGradient);
stroke-width:1.55;
stroke-linecap:round;
opacity:.91;
filter:drop-shadow(0 0 2px rgba(112,215,255,.46)) drop-shadow(0 0 5px rgba(45,156,255,.14));
transition:stroke-dasharray .78s cubic-bezier(.16,1,.3,1),stroke-dashoffset .78s cubic-bezier(.16,1,.3,1),opacity .28s ease;
}
.aka-mobile-wallet-power-frame-head {
stroke:rgba(230,250,255,.98);
stroke-width:1.85;
stroke-linecap:round;
opacity:.90;
filter:drop-shadow(0 0 2.6px rgba(112,215,255,.90)) drop-shadow(0 0 5px rgba(45,156,255,.30));
transition:stroke-dashoffset .78s cubic-bezier(.16,1,.3,1),opacity .28s ease;
}
.aka-mobile-wallet-power-frame-surge {
stroke:rgba(216,246,255,.94);
stroke-width:1.15;
stroke-linecap:round;
opacity:0;
filter:drop-shadow(0 0 2.6px rgba(112,215,255,.76)) drop-shadow(0 0 5px rgba(45,156,255,.25));
}
.aka-mobile-wallet-power-frame.is-calibrating .aka-mobile-wallet-power-frame-fill {
stroke:rgba(86,184,255,.70);
stroke-dasharray:13 87 !important;
stroke-width:1.40;
opacity:.68;
animation:akaMobilePowerFrameCalibrate 4.1s linear infinite;
}
.aka-mobile-wallet-power-frame.is-calibrating .aka-mobile-wallet-power-frame-head { opacity:0; }
.aka-mobile-wallet-power-frame.is-dominant .aka-mobile-wallet-power-frame-fill {
stroke-dasharray:100 0 !important;
stroke-width:1.62;
opacity:1;
}
.aka-mobile-wallet-power-frame.is-dominant .aka-mobile-wallet-power-frame-head { opacity:0; }
.aka-mobile-wallet-power-frame.is-dominant .aka-mobile-wallet-power-frame-surge {
opacity:.78;
animation:akaMobilePowerFrameDominance 5.2s linear infinite;
}
#mobileWalletConnectBtn.is-reward-pending #mobileWalletIconWrap .aka-mobile-wallet-power-frame {
opacity:.34 !important;
filter:saturate(.78) brightness(.90);
}
.aka-mobile-wallet-power-frame.is-power-receiving {
animation:akaMobilePowerFrameReceive .74s cubic-bezier(.16,1,.3,1) 1;
}
}
/* -------------------------------------------------------------------------
MICRO ORBIT — same chase state around the medal glyph.
Always present while the Wallet is connected. Dormant = dim, active = vivid.
The square button itself stays part of the approved Wallet geometry.
------------------------------------------------------------------------- */
.aka-rank-inline-emblem,
.aka-wallet-rank-action {
--aka-micro-orbit-opacity:.28;
--aka-micro-orbit-glow:.14;
position:relative !important;
}
.aka-rank-inline-emblem::before,
.aka-wallet-rank-action::before {
content:"";
position:absolute;
left:50%;
top:50%;
border-radius:50%;
pointer-events:none;
z-index:1;
opacity:0;
background:
conic-gradient(from -90deg,
rgba(32,88,185,.82) 0deg,
rgba(45,156,255,.91) calc(var(--aka-power-chase-angle,136.8deg) - 10deg),
rgba(216,246,255,.98) calc(var(--aka-power-chase-angle,136.8deg) - 2.5deg),
rgba(112,215,255,.95) var(--aka-power-chase-angle,136.8deg),
rgba(56,102,151,.18) var(--aka-power-chase-angle,136.8deg),
rgba(56,102,151,.18) 360deg);
-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 1.35px),#000 calc(100% - 1.15px));
mask:radial-gradient(farthest-side,transparent calc(100% - 1.35px),#000 calc(100% - 1.15px));
filter:drop-shadow(0 0 2px rgba(45,156,255,var(--aka-micro-orbit-glow)));
transition:opacity .26s ease,filter .26s ease,transform .38s ease;
}
.aka-rank-inline-emblem::after,
.aka-wallet-rank-action::after {
content:none !important;
}
.aka-rank-inline-emblem::before {
width:1.08rem;
height:1.08rem;
transform:translate(-50%,-50%);
}
.aka-wallet-rank-action::before {
width:1.30rem;
height:1.30rem;
transform:translate(-50%,-50%);
}
/* Connected Wallet: dormant orbit is deliberately visible but restrained. */
html.aka-power-chase-connected .aka-rank-inline-emblem::before,
html.aka-power-chase-connected .aka-wallet-rank-action::before {
opacity:var(--aka-micro-orbit-opacity);
}
/* Active/selected/claimable raises the same orbit rather than swapping designs. */
.aka-rank-inline-emblem.is-claim-ready,
.aka-wallet-rank-action:is(.is-selected,.is-claim-ready):not(:disabled),
.aka-wallet-rank-action:not(:disabled):is(:hover,:focus-visible) {
--aka-micro-orbit-opacity:.98;
--aka-micro-orbit-glow:.42;
}
/* The normal enabled Rank button is still alive even when not selected. */
html.aka-power-chase-connected .aka-wallet-rank-action:not(:disabled):not(.is-selected):not(.is-claim-ready) {
--aka-micro-orbit-opacity:.40;
--aka-micro-orbit-glow:.18;
}
/* Calibration = a small travelling trace, not false progress. */
html.aka-power-chase-calibrating .aka-rank-inline-emblem::before,
html.aka-power-chase-calibrating .aka-wallet-rank-action::before {
background:conic-gradient(from -90deg,rgba(112,215,255,.78) 0 14%,rgba(56,102,151,.15) 14% 100%);
animation:akaMicroOrbitCalibrate 4.1s linear infinite;
}
/* Rank #1 closes every echo of the chase system. */
html.aka-power-chase-dominant .aka-rank-inline-emblem::before,
html.aka-power-chase-dominant .aka-wallet-rank-action::before {
background:conic-gradient(from -90deg,#d8f6ff 0,#70d7ff 12%,#2d9cff 47%,#2058b9 77%,#70d7ff 100%);
animation:akaMicroOrbitDominance 3.8s ease-in-out infinite;
}
/* Keep the medal artwork above the micro orbit. */
.aka-rank-inline-emblem .aka-rank-medal-glyph,
.aka-wallet-rank-action .aka-rank-medal-glyph {
position:relative;
z-index:2;
}
/* -------------------------------------------------------------------------
V0.42.92 — MICRO ORBIT REPLACES THE OLD FIXED CYAN RING.
The legacy medal rim stays as a quiet dark structural contour only; it no
longer glows blue. Active state is communicated by the dynamic Micro Orbit.
------------------------------------------------------------------------- */
.aka-rank-medal-ring.is-outer {
stroke:rgba(83,78,106,.42) !important;
stroke-width:.78 !important;
opacity:.52 !important;
filter:none !important;
}
.aka-wallet-signal-strip .aka-wallet-rank-action:not(:disabled):is(:hover,:focus-visible),
.aka-wallet-signal-strip .aka-wallet-rank-action.is-selected,
.aka-wallet-signal-strip .aka-wallet-rank-action.is-claim-ready {
border-color:rgba(91,83,112,.38) !important;
box-shadow:
inset 0 1px 0 rgba(255,255,255,.025),
inset 0 0 8px rgba(var(--aka-rank-violet),.045),
0 0 7px rgba(45,156,255,.08) !important;
}
.aka-rank-inline-emblem.is-claim-ready {
border-color:rgba(91,83,112,.44) !important;
box-shadow:
inset 1px 1px 0 rgba(255,255,255,.035),
inset -1px -1px 0 rgba(0,0,0,.40),
0 0 7px rgba(45,156,255,.08),
0 2px 4px rgba(0,0,0,.30) !important;
}
/* Because the old fixed cyan rim is gone, the dynamic orbit sits at the exact
visual radius of that former rim instead of becoming a second outer ring. */
.aka-rank-inline-emblem::before {
width:1.00rem;
height:1.00rem;
-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 1.22px),#000 calc(100% - 1.02px));
mask:radial-gradient(farthest-side,transparent calc(100% - 1.22px),#000 calc(100% - 1.02px));
}
.aka-wallet-rank-action::before {
width:1.09rem;
height:1.09rem;
-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 1.28px),#000 calc(100% - 1.06px));
mask:radial-gradient(farthest-side,transparent calc(100% - 1.28px),#000 calc(100% - 1.06px));
}
@media (prefers-reduced-motion:reduce) {
.aka-mobile-wallet-power-frame-fill,
.aka-mobile-wallet-power-frame-head,
.aka-mobile-wallet-power-frame-surge,
.aka-mobile-wallet-power-frame,
.aka-rank-inline-emblem::before,
.aka-wallet-rank-action::before {
animation:none !important;
transition:none !important;
}
}
/* Source: css/v4293-wallet-power-pulse.css — original cascade order preserved. */
/* GIZMO KAKA V0.42.93 — WALLET POWER ACTIVATION + PULSE
One Power language, no decorative motion after activation:
CALIBRATING moves until real Power/Rank exists.
ACTIVE CHASE holds still.
POWER RECEIVED sends one travelling sapphire impulse, grows the arc, then dims.
The lower Regalia navigation control is navigation only — no Power orbit. */
/* Bottom Regalia navigation: keep the approved button response, remove Power chase duplication. */
.aka-wallet-rank-action::before,
.aka-wallet-rank-action::after {
content:none !important;
display:none !important;
animation:none !important;
}
/* YOUR RANK is the only micro echo of Power inside Wallet. */
.aka-rank-inline-emblem::before {
transition:opacity .28s ease,filter .28s ease,transform .28s ease;
}
/* Active chase = static and restrained. No continuous travel. */
html.aka-power-chase-activated:not(.aka-power-chase-calibrating):not(.aka-power-chase-dominant) .aka-rank-inline-emblem::before {
opacity:.56;
animation:none !important;
filter:drop-shadow(0 0 1.8px rgba(45,156,255,.18));
}
/* A narrow travelling head appears only while a real Power pulse is being presented. */
.aka-rank-inline-emblem::after {
content:"" !important;
display:block !important;
position:absolute;
left:50%;
top:50%;
width:1.00rem;
height:1.00rem;
border-radius:50%;
pointer-events:none;
z-index:1;
opacity:0;
background:conic-gradient(from -90deg,
rgba(216,246,255,.98) 0deg,
rgba(112,215,255,.94) 9deg,
rgba(45,156,255,.42) 20deg,
transparent 31deg 360deg);
-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 1.24px),#000 calc(100% - 1.03px));
mask:radial-gradient(farthest-side,transparent calc(100% - 1.24px),#000 calc(100% - 1.03px));
transform:translate(-50%,-50%) rotate(var(--aka-power-pulse-angle,0deg));
filter:drop-shadow(0 0 2.5px rgba(112,215,255,.76)) drop-shadow(0 0 5px rgba(45,156,255,.20));
transition:opacity .16s ease;
}
html.aka-power-chase-pulsing .aka-rank-inline-emblem::before {
opacity:.96;
filter:drop-shadow(0 0 3px rgba(112,215,255,.42));
}
html.aka-power-chase-pulsing .aka-rank-inline-emblem::after { opacity:.96; }
/* Desktop: after activation the orbit is a quiet held arc. */
@media (min-width:769px) {
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-activated:not(.is-power-receiving):not(.is-dominant) .aka-wallet-power-orbit-fill {
opacity:.69;
filter:drop-shadow(0 0 1.8px rgba(112,215,255,.42)) drop-shadow(0 0 4.2px rgba(45,156,255,.14));
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-activated:not(.is-power-receiving):not(.is-dominant) .aka-wallet-power-orbit-marker > i {
animation:none !important;
opacity:.78;
transform:translate(-50%,-50%) scale(.91);
box-shadow:0 0 4px rgba(112,215,255,.44),0 0 8px rgba(45,156,255,.15);
}
/* During the event JS drives both the travelling surge and the actual arc growth. */
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-power-receiving .aka-wallet-power-orbit-fill,
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-power-receiving .aka-wallet-power-orbit-marker {
transition:none !important;
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-power-receiving .aka-wallet-power-orbit-fill {
opacity:1;
filter:drop-shadow(0 0 3px rgba(216,246,255,.48)) drop-shadow(0 0 7px rgba(45,156,255,.30));
}
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-power-receiving .aka-wallet-power-orbit-surge { opacity:.94; }
#navbar .aka-topbar-actions .aka-wallet-power-orbit.is-power-receiving .aka-wallet-power-orbit-marker > i {
animation:none !important;
opacity:1;
transform:translate(-50%,-50%) scale(1.05);
box-shadow:0 0 6px rgba(216,246,255,.80),0 0 13px rgba(45,156,255,.34);
}
}
/* Mobile small Wallet core: same state machine, square path instead of a circle. */
@media (max-width:768px) {
.aka-mobile-wallet-power-frame.is-activated:not(.is-power-receiving):not(.is-dominant) .aka-mobile-wallet-power-frame-fill {
opacity:.67;
filter:drop-shadow(0 0 1.7px rgba(112,215,255,.36)) drop-shadow(0 0 4px rgba(45,156,255,.12));
}
.aka-mobile-wallet-power-frame.is-activated:not(.is-power-receiving):not(.is-dominant) .aka-mobile-wallet-power-frame-head {
opacity:.72;
filter:drop-shadow(0 0 2px rgba(112,215,255,.46));
}
.aka-mobile-wallet-power-frame.is-power-receiving .aka-mobile-wallet-power-frame-fill,
.aka-mobile-wallet-power-frame.is-power-receiving .aka-mobile-wallet-power-frame-head {
transition:none !important;
}
.aka-mobile-wallet-power-frame.is-power-receiving .aka-mobile-wallet-power-frame-fill { opacity:1; }
.aka-mobile-wallet-power-frame.is-power-receiving .aka-mobile-wallet-power-frame-surge { opacity:.94; }
.aka-mobile-wallet-power-frame.is-power-receiving .aka-mobile-wallet-power-frame-head {
opacity:1;
filter:drop-shadow(0 0 3px rgba(216,246,255,.72)) drop-shadow(0 0 6px rgba(45,156,255,.26));
}
}
/* Power Core has no fake 100% Network state when Total Power is zero. */
.aka-power-overview.is-empty-power .aka-power-core-arc { opacity:0 !important; }
.aka-power-overview.is-empty-power .aka-power-core-node {
opacity:.38;
filter:drop-shadow(0 0 2px rgba(var(--aka-rank-cyan),.24));
}
.aka-power-overview.is-empty-power .aka-power-feed strong b { color:rgba(var(--aka-rank-cream),.34); }
/* The existing instrument's left column is the centered, reachable claim control. */
.aka-wallet-rank-drawer .aka-power-core-panel {
grid-template-columns:4.38rem minmax(0,1fr);
gap:.34rem;
padding-inline:.40rem .46rem;
}
.aka-wallet-rank-drawer .aka-power-core {
appearance:none;
border:0;
padding:0;
color:inherit;
background:radial-gradient(circle,rgba(var(--aka-rank-cyan),.045),transparent 66%);
align-self:center;
justify-self:center;
border-radius:50%;
cursor:pointer;
-webkit-tap-highlight-color:transparent;
}
.aka-wallet-rank-drawer .aka-power-core:disabled { cursor:default; }
.aka-wallet-rank-drawer .aka-power-core.is-stage-0:not(:disabled) {
box-shadow:0 0 0 1px rgba(var(--aka-rank-cyan),.09);
}
.aka-wallet-rank-drawer .aka-power-core.is-stage-1 {
box-shadow:0 0 0 1px rgba(var(--aka-rank-cyan),.15);
}
.aka-wallet-rank-drawer .aka-power-core.is-stage-2 {
background:radial-gradient(circle,rgba(var(--aka-rank-cyan),.10),transparent 67%);
box-shadow:0 0 0 1px rgba(var(--aka-rank-cyan),.27),0 0 8px rgba(var(--aka-rank-cyan),.09);
}
.aka-wallet-rank-drawer .aka-power-core:is(:hover,:focus-visible):not(:disabled) {
outline:1px solid rgba(var(--aka-rank-cyan),.45);
outline-offset:2px;
filter:drop-shadow(0 0 7px rgba(var(--aka-rank-cyan),.30));
}
.aka-wallet-rank-drawer .aka-power-core.is-stage-3,
.aka-wallet-rank-drawer .aka-power-core.is-stage-4 {
background:radial-gradient(circle,rgba(var(--aka-rank-cyan),.13),transparent 68%);
box-shadow:0 0 0 1px rgba(var(--aka-rank-cyan),.34),0 0 11px rgba(var(--aka-rank-cyan),.14);
}
.aka-wallet-rank-drawer .aka-power-core.is-stage-4 {
background:radial-gradient(circle,rgba(42,135,111,.15),rgba(var(--aka-rank-cyan),.10) 43%,transparent 70%);
box-shadow:0 0 0 1px rgba(var(--aka-rank-cyan),.48),0 0 14px rgba(var(--aka-rank-cyan),.20);
}
.aka-wallet-rank-drawer .aka-power-core.is-stage-4 .aka-power-core-node {
fill:#45b99b;
filter:drop-shadow(0 0 5px rgba(45,151,113,.55));
}
.aka-wallet-rank-drawer .aka-power-core::before {
content:"";
position:absolute;
inset:-.18rem;
border:1px solid transparent;
border-radius:50%;
pointer-events:none;
}
.aka-wallet-rank-drawer .aka-power-core.is-stage-2::before {
border-color:rgba(var(--aka-rank-cyan),.32);
box-shadow:inset 0 0 8px rgba(var(--aka-rank-cyan),.06);
}
.aka-wallet-rank-drawer .aka-power-core.is-stage-3::before {
inset:-.08rem;
border-color:rgba(var(--aka-rank-cyan),.52);
box-shadow:0 0 0 2px rgba(var(--aka-rank-cyan),.08),0 0 6px rgba(var(--aka-rank-cyan),.16);
}
.aka-wallet-rank-drawer .aka-power-core.is-stage-4::before {
inset:-.08rem;
border-color:rgba(var(--aka-rank-gold),.68);
box-shadow:0 0 0 1px rgba(var(--aka-rank-cyan),.22),0 0 0 2px rgba(var(--aka-rank-gold),.11),0 0 6px rgba(var(--aka-rank-gold),.22);
}
.aka-wallet-rank-drawer .aka-power-core-caption b {
max-width:90%;
margin:.12rem 0;
overflow:hidden;
font:600 .50rem/1 "Space Grotesk",sans-serif;
font-variant-numeric:tabular-nums;
letter-spacing:-.04em;
text-overflow:ellipsis;
white-space:nowrap;
}
.aka-wallet-rank-drawer .aka-power-core-caption small:last-child {
color:rgba(var(--aka-rank-cyan),.78);
font-size:.34rem;
}
.aka-wallet-rank-drawer .aka-power-core-panel::after { left:5.18rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-core-panel {
grid-template-columns:3.56rem minmax(0,1fr);
gap:.26rem;
padding-inline:.18rem .28rem;
}
.aka-wallet-signal-drawer.is-mobile .aka-power-core-panel::after { left:4.06rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-core { width:3.04rem;height:3.04rem; }
.aka-wallet-signal-drawer.is-mobile .aka-power-core.is-stage-3::before,
.aka-wallet-signal-drawer.is-mobile .aka-power-core.is-stage-4::before { inset:0; }
.aka-wallet-signal-drawer.is-mobile .aka-network-tier-name small {
display:inline;
margin-inline-start:.10rem;
font-size:.40rem;
}
.elm-core-receipt {
position:fixed;
z-index:10002;
max-width:190px;
padding:.36rem .50rem;
border:1px solid rgba(101,184,233,.38);
border-left:2px solid rgba(125,219,249,.75);
border-radius:4px;
background:rgba(5,12,23,.94);
color:#d9f1ff;
box-shadow:0 4px 15px rgba(0,0,0,.45);
font:600 .62rem/1.15 "Space Grotesk",sans-serif;
pointer-events:none;
}
.elm-core-receipt::after { content:attr(data-intensity);display:block;margin-top:.22rem;color:rgba(130,216,232,.70);font-size:.45rem;letter-spacing:.15em; }
.elm-core-receipt.is-stage-3 { border-color:rgba(153,218,234,.60);box-shadow:0 4px 16px rgba(0,0,0,.49),0 0 12px rgba(85,184,219,.13); }
.elm-core-receipt.is-stage-4 { border-color:rgba(212,168,67,.57);border-left-color:rgba(213,190,126,.95);box-shadow:0 4px 18px rgba(0,0,0,.54),0 0 15px rgba(212,168,67,.18); }
.elm-core-receipt.is-stage-4::after { color:rgba(229,195,112,.87); }
@media (prefers-reduced-motion:reduce) {
.aka-wallet-rank-drawer .aka-power-core-svg { animation:none !important; }
}
/* Chase rail with no verified target is neutral rather than a fake 38% progress. */
.aka-power-chase.is-calibrating .aka-power-chase-fill,
.aka-power-chase.is-calibrating .aka-power-chase-node { opacity:0; }
.aka-power-chase.is-calibrating .aka-power-chase-target { opacity:.34; }
@media (prefers-reduced-motion:reduce) {
.aka-rank-inline-emblem::before,
.aka-rank-inline-emblem::after,
.aka-wallet-power-orbit-fill,
.aka-wallet-power-orbit-surge,
.aka-wallet-power-orbit-marker,
.aka-mobile-wallet-power-frame-fill,
.aka-mobile-wallet-power-frame-head,
.aka-mobile-wallet-power-frame-surge {
animation:none !important;
transition:none !important;
}
}
/* Source: css/v4294-wallet-rank-micro-cinematic.css — original cascade order preserved. */
/* GIZMO KAKA V0.42.94 — WALLET RANK MICRO CINEMATIC
Scope is deliberately narrow:
1) lower Regalia navigation = clean medal only, no circular rim/orbit;
2) YOUR RANK = the only internal Rank micro-instrument;
3) rank advance can play a quiet in-wallet cinematic without replacing the
TOP 100 full-screen ceremony that will be wired later. */
/* -------------------------------------------------------------------------
LOWER REGALIA NAVIGATION — MEDAL ONLY
Keep the approved square button/selected aura, remove every circular ring.
------------------------------------------------------------------------- */
.aka-wallet-rank-action::before,
.aka-wallet-rank-action::after {
content:none !important;
display:none !important;
animation:none !important;
}
.aka-wallet-rank-action .aka-rank-medal-ring.is-outer {
display:none !important;
opacity:0 !important;
stroke:none !important;
filter:none !important;
}
.aka-wallet-signal-strip .aka-wallet-rank-action .aka-rank-medal-glyph,
.aka-mobile-wallet-signal-strip .aka-wallet-rank-action .aka-rank-medal-glyph {
width:1.30rem !important;
height:1.30rem !important;
}
/* -------------------------------------------------------------------------
YOUR RANK MICRO INSTRUMENT
The filled arc mirrors Chase progress. A separate tiny comet keeps this one
Rank instrument subtly alive even while the main Wallet Orbit is resting.
------------------------------------------------------------------------- */
.aka-rank-inline-emblem {
overflow:visible;
}
.aka-rank-inline-emblem::before {
z-index:1;
}
.aka-rank-inline-emblem::after {
content:none !important;
display:none !important;
}
.aka-rank-inline-emblem .aka-rank-micro-comet,
.aka-rank-inline-emblem .aka-rank-micro-complete {
position:absolute;
left:50%;
top:50%;
width:1.08rem;
height:1.08rem;
transform:translate(-50%,-50%);
pointer-events:none;
z-index:1;
}
.aka-rank-inline-emblem .aka-rank-micro-comet {
border-radius:50%;
opacity:0;
background:conic-gradient(from -90deg,
rgba(216,246,255,.96) 0deg,
rgba(112,215,255,.88) 8deg,
rgba(45,156,255,.28) 19deg,
transparent 31deg 360deg);
-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 1.20px),#000 calc(100% - 1.02px));
mask:radial-gradient(farthest-side,transparent calc(100% - 1.20px),#000 calc(100% - 1.02px));
filter:drop-shadow(0 0 2.1px rgba(112,215,255,.36));
}
html.aka-power-chase-connected:not(.aka-power-chase-calibrating) .aka-rank-inline-emblem .aka-rank-micro-comet {
opacity:.48;
animation:akaRankMicroComet 5.8s linear infinite;
}
html.aka-power-chase-pulsing .aka-rank-inline-emblem .aka-rank-micro-comet {
opacity:.88;
animation-duration:1.55s;
filter:drop-shadow(0 0 3px rgba(216,246,255,.66)) drop-shadow(0 0 6px rgba(45,156,255,.22));
}
html.aka-power-chase-dominant .aka-rank-inline-emblem .aka-rank-micro-comet {
opacity:.64;
animation-duration:7.2s;
}
.aka-rank-inline-emblem .aka-rank-micro-complete {
overflow:visible;
opacity:0;
filter:drop-shadow(0 0 2px rgba(112,215,255,.36));
}
.aka-rank-inline-emblem .aka-rank-micro-complete circle {
fill:none;
stroke:url(#akaRankMicroCompleteGradient);
stroke-width:1.22;
stroke-linecap:round;
stroke-dasharray:100;
stroke-dashoffset:100;
transform:rotate(-90deg);
transform-origin:12px 12px;
}
/* -------------------------------------------------------------------------
MINI RANK ADVANCE CINEMATIC — only visible while Wallet itself is open.
------------------------------------------------------------------------- */
.aka-wallet-rank-summary {
position:relative;
isolation:isolate;
}
.aka-wallet-rank-summary::after {
content:"";
position:absolute;
z-index:4;
left:-12%;
top:0;
width:18%;
height:100%;
pointer-events:none;
opacity:0;
background:linear-gradient(90deg,transparent,rgba(112,215,255,.08),rgba(216,246,255,.42),rgba(112,215,255,.08),transparent);
transform:translateX(-140%) skewX(-14deg);
filter:blur(.2px);
}
.aka-wallet-rank-summary.is-rank-advancing::after {
animation:akaRankSummaryLightSweep .78s cubic-bezier(.18,.75,.22,1) 1;
}
.aka-wallet-rank-summary.is-rank-advancing .aka-rank-inline-emblem {
opacity:1;
filter:none;
border-color:rgba(var(--aka-rank-cyan),.74);
box-shadow:
inset 1px 1px 0 rgba(255,255,255,.05),
inset -1px -1px 0 rgba(0,0,0,.40),
0 0 7px rgba(112,215,255,.28),
0 0 15px rgba(45,156,255,.12),
0 2px 4px rgba(0,0,0,.28);
}
.aka-wallet-rank-summary.is-rank-advancing .aka-rank-micro-complete {
opacity:1;
animation:akaRankMicroCompleteFade 1.05s ease-out 1;
}
.aka-wallet-rank-summary.is-rank-advancing .aka-rank-micro-complete circle {
animation:akaRankMicroCompleteDraw .54s cubic-bezier(.18,.78,.22,1) forwards;
}
.aka-wallet-rank-summary.is-rank-advancing .aka-wallet-rank-summary-label {
animation:akaRankLabelCinematic .86s ease-out 1;
}
.aka-wallet-rank-summary.is-rank-advancing .aka-wallet-rank-summary-value {
animation:akaRankValueCinematic .72s cubic-bezier(.16,1,.30,1) 1;
}
.aka-wallet-rank-summary.is-rank-top100 {
box-shadow:inset 0 0 12px rgba(45,156,255,.035);
}
@keyframes akaRankMicroComet {
to { transform:translate(-50%,-50%) rotate(360deg); }
}
@keyframes akaRankMicroCompleteDraw {
0% { stroke-dashoffset:100; opacity:.58; }
72% { stroke-dashoffset:0; opacity:1; }
100% { stroke-dashoffset:0; opacity:1; }
}
@keyframes akaRankMicroCompleteFade {
0%,58% { opacity:1; filter:drop-shadow(0 0 3px rgba(216,246,255,.72)) drop-shadow(0 0 7px rgba(45,156,255,.26)); }
100% { opacity:0; filter:drop-shadow(0 0 1px rgba(45,156,255,.08)); }
}
@keyframes akaRankSummaryLightSweep {
0% { opacity:0; transform:translateX(-140%) skewX(-14deg); }
15% { opacity:.88; }
72% { opacity:.58; }
100% { opacity:0; transform:translateX(720%) skewX(-14deg); }
}
@keyframes akaRankLabelCinematic {
0%,100% { color:rgba(var(--aka-rank-gold),.66); text-shadow:none; }
34% { color:rgba(216,246,255,.94); text-shadow:0 0 5px rgba(112,215,255,.54),0 0 12px rgba(45,156,255,.18); }
64% { color:rgba(var(--aka-rank-cream),.92); text-shadow:0 0 3px rgba(112,215,255,.28); }
}
@keyframes akaRankValueCinematic {
0% { transform:translateY(0) scale(1); filter:none; }
30% { transform:translateY(-.02rem) scale(1.055); color:rgba(216,246,255,.98); text-shadow:0 0 6px rgba(112,215,255,.48); }
72% { transform:translateY(0) scale(1.015); }
100% { transform:translateY(0) scale(1); filter:none; }
}
@media (max-width:768px) {
.aka-wallet-signal-strip .aka-wallet-rank-action .aka-rank-medal-glyph,
.aka-mobile-wallet-signal-strip .aka-wallet-rank-action .aka-rank-medal-glyph {
width:1.32rem !important;
height:1.32rem !important;
}
}
@media (prefers-reduced-motion:reduce) {
.aka-rank-micro-comet,
.aka-rank-micro-complete,
.aka-rank-micro-complete circle,
.aka-wallet-rank-summary::after,
.aka-wallet-rank-summary-label,
.aka-wallet-rank-summary-value {
animation:none !important;
transition:none !important;
}
}
/* Source: css/v4296-wallet-rank-controlled-asymmetry.css — original cascade order preserved. */
/* GIZMO KAKA V0.42.96 — WALLET RANK CONTROLLED ASYMMETRY
Desktop-only micro polish for YOUR RANK / HOLDERS / AKA.
Intentionally keeps YOUR RANK slightly more prominent while preserving the
same 8.00rem total vertical budget of the three-row zone. */
@media (min-width:769px) {
/* YOUR RANK is the live competitive instrument: a touch taller, softer. */
#walletDropdown > #walletDropdownRank {
box-sizing:border-box;
width:100%;
height:2.26rem;
min-height:2.26rem;
max-height:2.26rem;
margin-bottom:.62rem !important;
padding-block:.39rem;
border-radius:4px;
}
/* HOLDERS + AKA remain the quieter, stricter information pair. */
#walletDropdown > #walletDropdownHolders,
#walletDropdown > #walletDropdownAkaBalance {
box-sizing:border-box;
width:100%;
height:2.02rem;
min-height:2.02rem;
max-height:2.02rem;
}
#walletDropdown > #walletDropdownHolders {
margin-bottom:.36rem !important;
border-radius:0;
}
#walletDropdown > #walletDropdownAkaBalance {
margin-bottom:.72rem !important;
border-radius:2px;
}
}
/* Source: css/v4297-fanclub-regalia-reign-seal.css — original cascade order preserved. */
/* V0.42.97 — Fan Club REGALIA / premium Reign Seal only. */
.aka-world-regalia-reign-seal {
--aka-reign-tone:var(--aka-regalia-tone);
min-width:0;
display:grid;
grid-template-columns:5.25rem minmax(0,1fr);
align-items:center;
gap:.58rem;
padding:.42rem .48rem;
border:1px solid rgba(var(--aka-reign-tone),.13);
border-radius:4px;
background:
radial-gradient(circle at 2.62rem 50%,rgba(var(--aka-reign-tone),.075),transparent 31%),
linear-gradient(90deg,rgba(0,0,0,.27),rgba(255,255,255,.009));
box-shadow:inset 0 1px 0 rgba(255,255,255,.018),inset 0 0 22px rgba(var(--aka-reign-tone),.018);
}
.aka-regalia-reign-dial {
position:relative;
width:5.05rem;
height:5.05rem;
display:grid;
place-items:center;
isolation:isolate;
}
.aka-regalia-reign-dial::before,
.aka-regalia-reign-dial::after {
content:"";
position:absolute;
pointer-events:none;
border-radius:50%;
}
.aka-regalia-reign-dial::before {
inset:.28rem;
border:1px solid rgba(var(--aka-reign-tone),.08);
box-shadow:inset 0 0 18px rgba(0,0,0,.72),0 0 15px rgba(var(--aka-reign-tone),.025);
}
.aka-regalia-reign-dial::after {
inset:1.02rem;
border:1px solid rgba(var(--aka-reign-tone),.055);
}
.aka-regalia-reign-dial svg { width:100%;height:100%;overflow:visible;filter:drop-shadow(0 7px 10px rgba(0,0,0,.22)); }
.aka-regalia-reign-track,
.aka-regalia-reign-inner,
.aka-regalia-reign-core,
.aka-regalia-reign-challenge { fill:none;vector-effect:non-scaling-stroke; }
.aka-regalia-reign-track { stroke:rgba(var(--aka-reign-tone),.09);stroke-width:1; }
.aka-regalia-reign-inner { stroke:rgba(var(--aka-rank-cream),.045);stroke-width:.75; }
.aka-regalia-reign-core { fill:rgba(3,5,5,.82);stroke:rgba(var(--aka-reign-tone),.12);stroke-width:.8; }
.aka-regalia-reign-tick {
stroke:rgba(var(--aka-reign-tone),.15);
stroke-width:1.25;
stroke-linecap:round;
vector-effect:non-scaling-stroke;
transition:stroke .3s ease,filter .3s ease,opacity .3s ease;
}
.aka-regalia-reign-tick:nth-child(5n+1) { stroke-width:1.75; }
.aka-regalia-reign-tick.is-complete {
stroke:rgba(var(--aka-reign-tone),.88);
filter:drop-shadow(0 0 1.7px rgba(var(--aka-reign-tone),.40));
}
.aka-regalia-reign-tick.is-current {
stroke:rgba(244,232,198,.98);
stroke-width:2.1;
filter:drop-shadow(0 0 2.8px rgba(var(--aka-reign-tone),.72));
animation:akaRegaliaReignCurrent 2.5s ease-in-out infinite;
}
.aka-regalia-reign-tick.is-current.is-paused { animation:none;opacity:.52;stroke:rgba(var(--aka-rank-red),.82);filter:drop-shadow(0 0 2px rgba(var(--aka-rank-red),.34)); }
@keyframes akaRegaliaReignCurrent { 0%,100%{opacity:.68}50%{opacity:1} }
.aka-regalia-reign-challenge {
stroke:rgba(var(--aka-rank-red),.78);
stroke-width:1.55;
stroke-linecap:round;
filter:drop-shadow(0 0 2px rgba(var(--aka-rank-red),.26));
animation:akaRegaliaChallengeBreath 2.1s ease-in-out infinite;
}
.aka-regalia-reign-challenge.is-settling { stroke:rgba(var(--aka-rank-gold),.84);animation:none; }
@keyframes akaRegaliaChallengeBreath { 0%,100%{opacity:.55}50%{opacity:.96} }
.aka-regalia-reign-count {
position:absolute;
inset:0;
display:grid;
grid-template-columns:auto auto;
grid-template-rows:auto auto;
align-content:center;
justify-content:center;
column-gap:.12rem;
color:rgba(var(--aka-rank-cream),.78);
text-align:center;
pointer-events:none;
}
.aka-regalia-reign-count strong { font:600 1.02rem/.95 "Space Grotesk",sans-serif;letter-spacing:-.045em; }
.aka-regalia-reign-count i { align-self:end;padding-bottom:.05rem;color:rgba(var(--aka-reign-tone),.66);font:normal 600 .43rem/1 "Space Grotesk",sans-serif; }
.aka-regalia-reign-count small { grid-column:1/-1;margin-top:.17rem;color:rgba(var(--aka-rank-cream),.34);font:600 .36rem/1 "Space Grotesk",sans-serif;letter-spacing:.12em; }
.aka-regalia-reign-data { min-width:0;display:grid;align-content:center;gap:.26rem; }
.aka-regalia-reign-head { min-width:0;display:flex;align-items:center;justify-content:space-between;gap:.38rem;padding-bottom:.28rem;border-bottom:1px solid rgba(var(--aka-reign-tone),.09); }
.aka-regalia-reign-head span { color:rgba(var(--aka-reign-tone),.78);font:600 .54rem/1 "Space Grotesk",sans-serif;letter-spacing:.09em; }
.aka-regalia-reign-head strong { overflow:hidden;color:rgba(var(--aka-rank-cream),.55);font:600 .49rem/1 "Space Grotesk",sans-serif;letter-spacing:.045em;text-overflow:ellipsis;white-space:nowrap; }
.aka-regalia-reign-condition { min-width:0;display:flex;align-items:center;justify-content:space-between;gap:.36rem;padding:.22rem 0;border-bottom:1px solid rgba(var(--aka-reign-tone),.055); }
.aka-regalia-reign-condition > span { min-width:0;display:flex;align-items:center;gap:.30rem; }
.aka-regalia-reign-condition i { display:grid;place-items:center;width:1.16rem;height:1.16rem;border:1px solid rgba(var(--aka-reign-tone),.16);border-radius:50%;color:rgba(var(--aka-reign-tone),.63);font:normal 600 .42rem/1 "Space Grotesk",sans-serif; }
.aka-regalia-reign-condition b { overflow:hidden;color:rgba(var(--aka-rank-cream),.61);font:600 .51rem/1 "Space Grotesk",sans-serif;letter-spacing:.025em;text-overflow:ellipsis;white-space:nowrap; }
.aka-regalia-reign-condition > strong { flex:0 0 auto;color:rgba(var(--aka-rank-cream),.42);font:600 .46rem/1 "Space Grotesk",sans-serif;letter-spacing:.045em;text-align:right; }
.aka-regalia-reign-condition.is-complete i { border-color:rgba(var(--aka-rank-emerald),.26);color:rgba(var(--aka-rank-emerald),.86);box-shadow:inset 0 0 8px rgba(var(--aka-rank-emerald),.035); }
.aka-regalia-reign-condition.is-complete > strong { color:rgba(var(--aka-rank-emerald),.72); }
.aka-regalia-reign-condition.is-paused i,.aka-regalia-reign-condition.is-paused > strong { color:rgba(var(--aka-rank-red),.72);border-color:rgba(var(--aka-rank-red),.20); }
.aka-regalia-reign-readout { min-width:0;display:flex;align-items:center;justify-content:space-between;gap:.36rem;padding-top:.07rem; }
.aka-regalia-reign-readout span { color:rgba(var(--aka-reign-tone),.82);font:600 .54rem/1 "Space Grotesk",sans-serif;letter-spacing:.04em; }
.aka-regalia-reign-readout strong { overflow:hidden;color:rgba(var(--aka-rank-cream),.42);font:600 .45rem/1 "Space Grotesk",sans-serif;letter-spacing:.035em;text-overflow:ellipsis;white-space:nowrap;text-align:right; }
.aka-world-regalia-reign-seal.is-earned .aka-regalia-reign-dial { filter:drop-shadow(0 0 8px rgba(var(--aka-reign-tone),.08)); }
.aka-world-regalia-reign-seal.is-earned .aka-regalia-reign-tick.is-complete { stroke:rgba(var(--aka-reign-tone),.96); }
/* One engraved ledger, not four dashboard cards. */
.aka-world-regalia-record-grid {
gap:0;
overflow:hidden;
border:1px solid rgba(var(--aka-regalia-tone),.095);
border-radius:3px;
background:linear-gradient(90deg,rgba(var(--aka-regalia-tone),.018),rgba(255,255,255,.008),rgba(var(--aka-regalia-tone),.014));
box-shadow:inset 0 1px 0 rgba(255,255,255,.012);
}
.aka-world-regalia-record-grid > span {
position:relative;
padding:.40rem .50rem;
border-inline-start:0;
background:transparent;
}
.aka-world-regalia-record-grid > span + span::before {
content:"";
position:absolute;
top:.28rem;
bottom:.28rem;
left:0;
width:1px;
background:linear-gradient(180deg,transparent,rgba(var(--aka-regalia-tone),.20),transparent);
}
@media (max-width:760px) {
.aka-world-regalia-reign-seal { grid-template-columns:4.65rem minmax(0,1fr);gap:.45rem;padding:.34rem .38rem; }
.aka-regalia-reign-dial { width:4.45rem;height:4.45rem; }
.aka-regalia-reign-count strong { font-size:.90rem; }
.aka-regalia-reign-head span { font-size:.49rem; }
.aka-regalia-reign-head strong,.aka-regalia-reign-condition > strong,.aka-regalia-reign-readout strong { font-size:.43rem; }
.aka-regalia-reign-condition b,.aka-regalia-reign-readout span { font-size:.47rem; }
.aka-regalia-reign-condition i { width:1.05rem;height:1.05rem;font-size:.39rem; }
.aka-world-regalia-record-grid > span + span:nth-child(odd)::before { display:none; }
}
@media (max-width:520px) {
.aka-world-regalia-reign-seal { grid-template-columns:4.55rem minmax(0,1fr);gap:.40rem; }
.aka-regalia-reign-dial { width:4.35rem;height:4.35rem; }
.aka-regalia-reign-head { align-items:flex-start;flex-direction:column;gap:.14rem; }
.aka-regalia-reign-condition { gap:.24rem; }
.aka-regalia-reign-condition > strong { max-width:6.7rem;white-space:normal;line-height:1.12; }
.aka-regalia-reign-readout { align-items:flex-start;flex-direction:column;gap:.13rem; }
.aka-regalia-reign-readout strong { white-space:normal;text-align:left;line-height:1.15; }
}
@media (prefers-reduced-motion:reduce) {
.aka-regalia-reign-tick.is-current,.aka-regalia-reign-challenge { animation:none !important; }
}
/* Source: css/v4298-fanclub-teams-network-signal.css — original cascade order preserved. */
/* GIZMO KAKA V0.42.98 — FAN CLUB TEAMS / NETWORK SIGNAL */
/* TEAMS stays a ranking instrument, not another card dashboard. */
.aka-world-team-head {
grid-template-columns:3.65rem minmax(0,1fr) 7.4rem 7rem 3.8rem;
gap:.46rem;
}
.aka-world-team-row {
position:relative;
min-height:4rem;
grid-template-columns:3.65rem minmax(0,1fr) 7.4rem 7rem 3.8rem;
gap:.46rem;
padding:.38rem .62rem;
overflow:hidden;
background:
linear-gradient(90deg,rgba(var(--aka-rank-cyan),.018),rgba(0,0,0,.19) 42%,rgba(0,0,0,.22));
}
.aka-world-team-row::before {
content:"";
position:absolute;
inset:.35rem auto .35rem 0;
width:1px;
opacity:.32;
background:linear-gradient(transparent,rgba(var(--aka-rank-cyan),.68),transparent);
box-shadow:0 0 8px rgba(var(--aka-rank-cyan),.16);
}
.aka-world-team-row.is-own::before { width:2px;opacity:.92;box-shadow:0 0 12px rgba(var(--aka-rank-cyan),.26); }
.aka-world-team-row.is-top {
background:
radial-gradient(circle at 2.2rem 50%,rgba(var(--aka-rank-gold),.045),transparent 17%),
linear-gradient(90deg,rgba(var(--aka-rank-gold),.025),rgba(var(--aka-rank-cyan),.018) 48%,rgba(0,0,0,.21));
}
.aka-world-team-row.is-top-1 {
border-color:rgba(var(--aka-rank-gold),.17);
box-shadow:inset 0 1px rgba(255,255,255,.016),inset 0 0 0 1px rgba(var(--aka-rank-gold),.012);
}
.aka-world-team-rank {
position:relative;
align-self:center;
justify-self:start;
min-width:2.9rem;
display:flex;
align-items:baseline;
gap:.20rem;
}
.aka-world-team-row.is-top-1 .aka-world-team-rank { color:rgba(var(--aka-rank-gold),.98);text-shadow:0 0 11px rgba(var(--aka-rank-gold),.12); }
.aka-world-team-row.is-top-2 .aka-world-team-rank { color:rgba(210,220,226,.86); }
.aka-world-team-row.is-top-3 .aka-world-team-rank { color:rgba(199,131,84,.88); }
.aka-world-team-row.is-top-1 .aka-world-team-rank::after {
content:"LEAD";
color:rgba(var(--aka-rank-gold),.42);
font:600 .42rem/1 "Space Grotesk",sans-serif;
letter-spacing:.07em;
}
.aka-world-team-identity { grid-template-columns:2.52rem minmax(0,1fr);gap:.58rem; }
.aka-world-team-identity .aka-world-avatar { width:2.52rem;height:2.52rem;border-radius:5px; }
.aka-world-team-row.is-top-1 .aka-world-avatar.is-team { border-color:rgba(var(--aka-rank-gold),.24);box-shadow:inset 0 1px rgba(255,255,255,.028),0 0 13px rgba(var(--aka-rank-gold),.065); }
.aka-world-team-identity b { font-size:.75rem;letter-spacing:.012em; }
.aka-world-team-identity small { color:rgba(var(--aka-rank-gold),.55); }
.aka-world-team-identity em { color:rgba(var(--aka-rank-cream),.35); }
/* The activity ratio is shown as a signal lattice, never as a generic progress bar. */
.aka-world-team-signal {
min-width:0;
display:flex;
align-items:flex-start;
flex-direction:column;
justify-content:center;
gap:.16rem;
}
.aka-world-team-signal svg { width:100%;height:.62rem;display:block;overflow:visible; }
.aka-team-signal-track {
fill:none;
stroke:rgba(var(--aka-rank-cyan),.10);
stroke-width:.65;
}
.aka-team-signal-node {
fill:rgba(var(--aka-rank-cyan),.11);
stroke:rgba(var(--aka-rank-cyan),.16);
stroke-width:.55;
}
.aka-team-signal-node.is-live {
fill:rgba(var(--aka-rank-cyan),.72);
stroke:rgba(205,247,255,.42);
filter:drop-shadow(0 0 2px rgba(var(--aka-rank-cyan),.34));
}
.aka-world-team-signal small {
color:rgba(var(--aka-rank-cyan),.43);
font:600 .44rem/1 "Space Grotesk",sans-serif;
letter-spacing:.045em;
white-space:nowrap;
}
.aka-world-team-signal.is-large { width:min(100%,10.2rem);gap:.22rem; }
.aka-world-team-signal.is-large svg { height:.72rem; }
.aka-world-team-signal.is-large small { color:rgba(var(--aka-rank-cyan),.55);font-size:.47rem;letter-spacing:.055em; }
.aka-world-team-power { padding-inline-start:.34rem;border-inline-start:1px solid rgba(var(--aka-rank-cyan),.075); }
.aka-world-team-power strong { color:rgba(var(--aka-rank-cyan),.84);font-size:.73rem;letter-spacing:.02em; }
.aka-world-team-power small { color:rgba(var(--aka-rank-cyan),.36); }
.aka-world-team-row > .aka-rank-movement { justify-self:end; }
/* Team inspect gets one coherent signal core before the branch tree. */
.aka-world-inspect-rank > em { margin-top:.26rem;font-style:normal; }
.aka-world-inspect-rank > em .aka-rank-movement { font-size:.52rem; }
.aka-world-team-core {
min-width:0;
display:grid;
grid-template-columns:minmax(8rem,.85fr) minmax(9rem,1.2fr) minmax(5.6rem,.58fr);
align-items:center;
gap:.72rem;
padding:.56rem .66rem;
border:1px solid rgba(var(--aka-rank-cyan),.12);
border-radius:5px;
background:
radial-gradient(circle at 52% 50%,rgba(var(--aka-rank-cyan),.045),transparent 42%),
linear-gradient(90deg,rgba(var(--aka-rank-cyan),.025),rgba(0,0,0,.18));
box-shadow:inset 0 1px rgba(255,255,255,.014);
}
.aka-world-team-core-copy,.aka-world-team-core-power { min-width:0;display:flex;flex-direction:column; }
.aka-world-team-core-copy small,.aka-world-team-core-power small { color:rgba(var(--aka-rank-cyan),.48);font:600 .47rem/1 "Space Grotesk",sans-serif;letter-spacing:.08em; }
.aka-world-team-core-copy strong { margin-top:.26rem;color:rgba(var(--aka-rank-cream),.88);font:400 1.03rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.08em; }
.aka-world-team-core-copy em { margin-top:.20rem;color:rgba(var(--aka-rank-cream),.34);font:normal 600 .46rem/1 "Space Grotesk",sans-serif;letter-spacing:.035em; }
.aka-world-team-core-power { align-items:flex-end;padding-inline-start:.68rem;border-inline-start:1px solid rgba(var(--aka-rank-cyan),.09);text-align:right; }
.aka-world-team-core-power strong { margin-top:.26rem;color:rgba(var(--aka-rank-cyan),.82);font:400 1rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.065em; }
.aka-world-inspect.is-team .aka-world-inspect-stats {
gap:0;
overflow:hidden;
border:1px solid rgba(var(--aka-rank-cyan),.08);
border-radius:4px;
background:rgba(0,0,0,.10);
}
.aka-world-inspect.is-team .aka-world-inspect-stats > span {
border-inline-start:1px solid rgba(var(--aka-rank-cyan),.07);
background:transparent;
}
.aka-world-inspect.is-team .aka-world-inspect-stats > span:first-child { border-inline-start:0; }
.aka-world-tree {
position:relative;
background:
linear-gradient(90deg,rgba(var(--aka-rank-cyan),.018),rgba(0,0,0,.15)),
rgba(0,0,0,.08);
}
.aka-world-tree::before {
content:"";
position:absolute;
top:2.72rem;
left:50%;
width:1px;
height:.72rem;
transform:translateX(-50%);
background:linear-gradient(rgba(var(--aka-rank-gold),.25),rgba(var(--aka-rank-cyan),.12));
box-shadow:0 0 7px rgba(var(--aka-rank-cyan),.10);
pointer-events:none;
}
.aka-world-tree-captain { position:relative;z-index:1; }
.aka-world-tree-node { transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease; }
.aka-world-tree-node:hover { border-color:rgba(var(--aka-rank-cyan),.18);background:rgba(var(--aka-rank-cyan),.032);box-shadow:inset 0 0 12px rgba(var(--aka-rank-cyan),.018); }
@media (max-width:720px) {
.aka-world-team-row {
min-height:3.84rem;
grid-template-columns:2.42rem minmax(0,1fr) 4.75rem 2.85rem;
gap:.28rem;
padding:.32rem .36rem;
}
.aka-world-team-row > .aka-world-team-signal { display:none; }
.aka-world-team-identity { grid-template-columns:2.08rem minmax(0,1fr);gap:.34rem; }
.aka-world-team-identity .aka-world-avatar { width:2.08rem;height:2.08rem; }
.aka-world-team-rank { min-width:0; }
.aka-world-team-row.is-top-1 .aka-world-team-rank::after { display:none; }
.aka-world-team-power { padding-inline-start:.24rem; }
.aka-world-team-core { grid-template-columns:minmax(0,1fr) minmax(6.2rem,.8fr);gap:.48rem; }
.aka-world-team-core .aka-world-team-signal { grid-column:1 / -1;width:100%;max-width:none; }
.aka-world-team-core-power { padding-inline-start:.44rem; }
}
@media (max-width:430px) {
.aka-world-team-row {
grid-template-columns:2.06rem minmax(0,1fr) 4.15rem 2.48rem;
gap:.18rem;
padding-inline:.26rem;
}
.aka-world-team-identity { grid-template-columns:1.82rem minmax(0,1fr);gap:.24rem; }
.aka-world-team-identity .aka-world-avatar { width:1.82rem;height:1.82rem; }
.aka-world-team-power strong { font-size:.60rem; }
.aka-world-team-core { grid-template-columns:minmax(0,1fr) 4.7rem;padding:.48rem .50rem; }
.aka-world-team-core-copy strong { font-size:.94rem; }
.aka-world-team-core-copy em { font-size:.42rem; }
}
@media (prefers-reduced-motion:reduce) {
.aka-team-signal-node.is-live { filter:none; }
}
/* Source: css/v4303-fanclub-meme-throne-live.css — original cascade order preserved. */
/* GIZMO KAKA V0.43.03 — FAN CLUB / MEME THRONE LIVE + SAFE PORTRAIT FRAMING */
/* Fourth Fan Club view stays inside the existing WORLD command center. */
.aka-world-tabs { grid-template-columns:repeat(4,minmax(0,1fr)); }
.aka-world-tab[data-world-tab="meme-throne"].is-active {
color:rgba(var(--aka-rank-gold),.95);
border-color:rgba(var(--aka-rank-gold),.24);
background:
radial-gradient(circle at 50% 120%,rgba(var(--aka-rank-gold),.08),transparent 56%),
linear-gradient(180deg,rgba(var(--aka-rank-gold),.055),rgba(0,0,0,.18));
box-shadow:inset 0 -1px rgba(var(--aka-rank-gold),.78),0 0 16px rgba(var(--aka-rank-gold),.025);
}
.aka-meme-throne {
--aka-throne-gold:220,176,74;
--aka-throne-cream:229,217,191;
min-width:0;
display:grid;
gap:.52rem;
}
.aka-meme-throne-banner {
min-width:0;
min-height:2.44rem;
display:flex;
align-items:center;
justify-content:space-between;
gap:.7rem;
padding:.36rem .58rem;
border:1px solid rgba(var(--aka-throne-gold),.105);
border-radius:4px;
background:
linear-gradient(90deg,rgba(var(--aka-throne-gold),.026),transparent 45%,rgba(var(--aka-throne-gold),.014)),
rgba(0,0,0,.14);
}
.aka-meme-throne-banner > span:first-child { min-width:0;display:flex;flex-direction:column; }
.aka-meme-throne-banner small {
color:rgba(var(--aka-throne-gold),.48);
font:600 .46rem/1 "Space Grotesk",sans-serif;
letter-spacing:.10em;
}
.aka-meme-throne-banner > span:first-child strong {
margin-top:.20rem;
color:rgba(var(--aka-throne-cream),.84);
font:400 .88rem/1 "Bebas Neue","Arial Narrow",sans-serif;
letter-spacing:.105em;
}
.aka-meme-throne-feed { display:grid;grid-template-columns:.42rem auto;align-items:center;gap:.16rem .32rem;text-align:right; }
.aka-meme-throne-feed i { grid-row:1/3;width:.34rem;height:.34rem;border:1px solid rgba(var(--aka-throne-gold),.24);border-radius:50%;background:rgba(var(--aka-throne-gold),.18); }
.aka-meme-throne-feed b { color:rgba(var(--aka-throne-gold),.66);font:600 .48rem/1 "Space Grotesk",sans-serif;letter-spacing:.085em; }
.aka-meme-throne-feed small { color:rgba(var(--aka-throne-cream),.29);font-size:.40rem;letter-spacing:.045em; }
.aka-meme-throne-feed.is-live i { background:rgba(65,209,139,.72);border-color:rgba(122,243,181,.44);box-shadow:0 0 8px rgba(65,209,139,.34); }
.aka-meme-throne-feed.is-live b { color:rgba(110,224,171,.78); }
/* TOP 3 is a stage, not three generic cards. */
.aka-meme-throne-stage {
position:relative;
min-width:0;
min-height:10.25rem;
display:grid;
grid-template-columns:minmax(0,.92fr) minmax(0,1.13fr) minmax(0,.92fr);
align-items:end;
gap:.42rem;
padding:.80rem .78rem .62rem;
overflow:hidden;
border:1px solid rgba(var(--aka-throne-gold),.13);
border-radius:6px;
background:
radial-gradient(ellipse at 50% 12%,rgba(var(--aka-throne-gold),.072),transparent 38%),
linear-gradient(180deg,rgba(255,255,255,.009),rgba(0,0,0,.16)),
#050707;
box-shadow:inset 0 1px rgba(255,255,255,.017),inset 0 -20px 45px rgba(0,0,0,.18);
}
.aka-meme-throne-stage::before {
content:"";
position:absolute;
left:50%;
top:-5.4rem;
width:18rem;
height:18rem;
transform:translateX(-50%);
border:1px solid rgba(var(--aka-throne-gold),.07);
border-radius:50%;
box-shadow:0 0 0 2.5rem rgba(var(--aka-throne-gold),.010),0 0 0 5.4rem rgba(var(--aka-throne-gold),.006);
pointer-events:none;
}
.aka-meme-throne-stage::after {
content:"";
position:absolute;
inset:auto 8% .58rem;
height:1px;
background:linear-gradient(90deg,transparent,rgba(var(--aka-throne-gold),.12),rgba(var(--aka-throne-gold),.34),rgba(var(--aka-throne-gold),.12),transparent);
box-shadow:0 0 10px rgba(var(--aka-throne-gold),.08);
}
.aka-meme-throne-hero {
position:relative;
z-index:1;
min-width:0;
min-height:7.5rem;
display:grid;
grid-template-rows:auto auto 1fr auto auto;
justify-items:center;
align-content:end;
padding:.46rem .42rem .54rem;
border:1px solid rgba(var(--aka-throne-gold),.09);
border-radius:5px;
background:linear-gradient(180deg,rgba(var(--aka-throne-gold),.018),rgba(0,0,0,.15));
box-shadow:inset 0 1px rgba(255,255,255,.012);
}
.aka-meme-throne-hero.is-place-1 {
min-height:8.85rem;
border-color:rgba(var(--aka-throne-gold),.20);
background:
radial-gradient(circle at 50% 39%,rgba(var(--aka-throne-gold),.09),transparent 38%),
linear-gradient(180deg,rgba(var(--aka-throne-gold),.043),rgba(0,0,0,.16));
box-shadow:inset 0 1px rgba(255,255,255,.022),0 10px 28px rgba(0,0,0,.20);
}
.aka-meme-throne-role { color:rgba(var(--aka-throne-gold),.42);font:600 .42rem/1 "Space Grotesk",sans-serif;letter-spacing:.14em; }
.aka-meme-throne-hero.is-place-1 .aka-meme-throne-role { color:rgba(var(--aka-throne-gold),.77); }
.aka-meme-throne-rank { margin-top:.18rem;color:rgba(var(--aka-throne-gold),.74);font:400 .92rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.06em; }
.aka-meme-throne-hero.is-place-1 .aka-meme-throne-rank { color:rgba(var(--aka-throne-gold),.98);font-size:1.18rem;text-shadow:0 0 12px rgba(var(--aka-throne-gold),.12); }
.aka-meme-throne-portrait-wrap { position:relative;display:grid;place-items:center;width:4.25rem;height:4.25rem;margin:.30rem 0 .28rem; }
.aka-meme-throne-hero.is-place-1 .aka-meme-throne-portrait-wrap { width:5.15rem;height:5.15rem; }
.aka-meme-throne-portrait-wrap::before,
.aka-meme-throne-portrait-wrap::after {
content:"";
position:absolute;
inset:-.28rem;
border:1px solid rgba(var(--aka-throne-gold),.11);
border-radius:50%;
}
.aka-meme-throne-portrait-wrap::after { inset:-.50rem;opacity:.42;border-style:dashed; }
.aka-meme-throne-hero.is-place-1 .aka-meme-throne-portrait-wrap::before { border-color:rgba(var(--aka-throne-gold),.27);box-shadow:0 0 17px rgba(var(--aka-throne-gold),.08); }
.aka-meme-portrait {
position:relative;
box-sizing:border-box;
display:grid;
place-items:center;
width:3rem;
height:3rem;
overflow:hidden;
flex:0 0 auto;
border:1px solid rgba(var(--aka-throne-gold),.18);
border-radius:50%;
background:
radial-gradient(circle at 35% 24%,rgba(255,255,255,.045),transparent 30%),
linear-gradient(145deg,rgba(var(--aka-throne-gold),.055),rgba(4,6,7,.98));
box-shadow:inset 0 1px rgba(255,255,255,.024),0 4px 14px rgba(0,0,0,.24);
}
.aka-meme-portrait.is-hero { width:100%;height:100%;border-color:rgba(var(--aka-throne-gold),.26);box-shadow:inset 0 1px rgba(255,255,255,.03),0 7px 20px rgba(0,0,0,.26); }
.aka-meme-portrait.is-aka { border-color:transparent;box-shadow:none;background:#000;overflow:visible; }
.aka-meme-portrait img {
position:absolute;
inset:0;
display:block;
width:100%;
height:100%;
object-fit:cover;
object-position:50% 50%;
background:#050607;
image-rendering:auto;
transform:none;
filter:none;
}
.aka-meme-portrait.is-aka img { border-radius:50%; }
.aka-meme-portrait > b { max-width:90%;overflow:hidden;color:rgba(var(--aka-throne-cream),.56);font:600 .56rem/1 "Space Grotesk",sans-serif;letter-spacing:.035em;text-overflow:ellipsis;white-space:nowrap; }
.aka-meme-portrait.is-hero > b { font-size:.72rem; }
.aka-meme-throne-name { min-width:0;max-width:100%;display:flex;align-items:center;flex-direction:column;gap:.11rem;text-align:center; }
.aka-meme-throne-name strong { max-width:100%;overflow:hidden;color:rgba(var(--aka-throne-cream),.90);font:600 .62rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-meme-throne-hero.is-place-1 .aka-meme-throne-name strong { font-size:.72rem; }
.aka-meme-throne-hero.is-aka .aka-meme-throne-name strong {
overflow:visible;
font-size:.67rem;
letter-spacing:.012em;
text-overflow:clip;
}
.aka-meme-throne-row.is-aka .aka-meme-throne-identity b {
overflow:visible;
font-size:.65rem;
letter-spacing:.01em;
text-overflow:clip;
}
.aka-meme-throne-name small { color:rgba(var(--aka-throne-gold),.52);font:600 .45rem/1 "Space Grotesk",sans-serif;letter-spacing:.065em; }
.aka-meme-throne-hero-metrics { width:100%;display:grid;grid-template-columns:1fr auto;gap:.24rem;margin-top:.34rem;padding-top:.33rem;border-top:1px solid rgba(var(--aka-throne-gold),.075); }
.aka-meme-throne-hero-metrics > span { min-width:0;display:flex;flex-direction:column; }
.aka-meme-throne-hero-metrics > span:last-child { text-align:right; }
.aka-meme-throne-hero-metrics small { color:rgba(var(--aka-throne-gold),.35);font:600 .39rem/1 "Space Grotesk",sans-serif;letter-spacing:.045em; }
.aka-meme-throne-hero-metrics strong { margin-top:.16rem;color:rgba(var(--aka-throne-cream),.74);font:600 .52rem/1 "Space Grotesk",sans-serif; }
/* #4–#30: same visual language for every meme, including AKA when it enters the board. */
.aka-meme-throne-board { min-width:0;display:grid;gap:.16rem; }
.aka-meme-throne-head,.aka-meme-throne-row {
min-width:0;
display:grid;
grid-template-columns:3.25rem minmax(12rem,1.4fr) 7.4rem 4.3rem 4.6rem;
align-items:center;
gap:.38rem;
}
.aka-meme-throne-head { min-height:1.54rem;padding:0 .56rem;color:rgba(var(--aka-throne-cream),.30);font:600 .50rem/1 "Space Grotesk",sans-serif;letter-spacing:.085em; }
.aka-meme-throne-row {
position:relative;
min-height:3.55rem;
padding:.28rem .56rem;
overflow:hidden;
border:1px solid rgba(var(--aka-throne-gold),.070);
border-radius:4px;
background:linear-gradient(90deg,rgba(var(--aka-throne-gold),.016),rgba(0,0,0,.19) 62%,rgba(0,0,0,.21));
}
.aka-meme-throne-row::before { content:"";position:absolute;inset:.38rem auto .38rem 0;width:1px;background:linear-gradient(transparent,rgba(var(--aka-throne-gold),.44),transparent);opacity:.22; }
.aka-meme-throne-row.is-aka { border-color:rgba(var(--aka-rank-cyan),.23);background:linear-gradient(90deg,rgba(var(--aka-rank-cyan),.048),rgba(var(--aka-throne-gold),.014) 42%,rgba(0,0,0,.21));box-shadow:inset 2px 0 rgba(var(--aka-rank-cyan),.48); }
.aka-meme-throne-row-rank { color:rgba(var(--aka-throne-gold),.76);font:400 .93rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.07em; }
.aka-meme-throne-identity { min-width:0;display:grid;grid-template-columns:3rem minmax(0,1fr);align-items:center;gap:.54rem; }
.aka-meme-throne-identity > span:last-child { min-width:0;display:flex;flex-direction:column;gap:.17rem; }
.aka-meme-throne-identity b { max-width:100%;overflow:hidden;color:rgba(var(--aka-throne-cream),.88);font:600 .69rem/1 "Space Grotesk",sans-serif;text-overflow:ellipsis;white-space:nowrap; }
.aka-meme-throne-identity small { color:rgba(var(--aka-throne-gold),.48);font:600 .47rem/1 "Space Grotesk",sans-serif;letter-spacing:.055em; }
.aka-meme-throne-mc,.aka-meme-throne-change,.aka-meme-throne-movement { min-width:0;display:flex;flex-direction:column;gap:.14rem; }
.aka-meme-throne-change,.aka-meme-throne-movement { align-items:flex-end;text-align:right; }
.aka-meme-throne-mc strong { color:rgba(var(--aka-throne-cream),.82);font:600 .65rem/1 "Space Grotesk",sans-serif; }
.aka-meme-throne-row small { color:rgba(var(--aka-throne-cream),.28);font:600 .40rem/1 "Space Grotesk",sans-serif;letter-spacing:.04em; }
.aka-meme-change,.aka-meme-rank-move { display:inline-flex;align-items:center;justify-content:flex-end;min-width:0;color:rgba(var(--aka-throne-cream),.46);font:600 .53rem/1 "Space Grotesk",sans-serif;white-space:nowrap; }
.aka-meme-change.is-up,.aka-meme-rank-move.is-up { color:rgba(95,217,157,.72); }
.aka-meme-change.is-down,.aka-meme-rank-move.is-down { color:rgba(var(--aka-rank-red),.72); }
.aka-meme-change.is-flat,.aka-meme-rank-move.is-flat { color:rgba(var(--aka-throne-cream),.27); }
.aka-meme-throne-scroll { max-height:17.9rem;gap:.16rem; }
/* Pinned AKA row uses the exact same row geometry as the Top 30. */
.aka-meme-aka-ascent {
min-width:0;
display:grid;
gap:.22rem;
padding:.44rem 0;
border:1px solid rgba(var(--aka-rank-cyan),.14);
border-radius:5px;
background:
radial-gradient(circle at 0 50%,rgba(var(--aka-rank-cyan),.045),transparent 26%),
linear-gradient(90deg,rgba(var(--aka-rank-cyan),.025),rgba(0,0,0,.18));
box-shadow:inset 0 1px rgba(255,255,255,.012);
}
.aka-meme-aka-ascent.is-gate { border-color:rgba(var(--aka-throne-gold),.26);background:radial-gradient(circle at 0 50%,rgba(var(--aka-throne-gold),.065),transparent 28%),linear-gradient(90deg,rgba(var(--aka-throne-gold),.035),rgba(0,0,0,.18)); }
.aka-meme-aka-ascent-head { min-width:0;display:flex;align-items:flex-end;justify-content:space-between;gap:.8rem;padding:0 .54rem .18rem; }
.aka-meme-aka-ascent-head > span { min-width:0;display:flex;flex-direction:column; }
.aka-meme-aka-ascent-head small { color:rgba(var(--aka-rank-cyan),.62);font:600 .45rem/1 "Space Grotesk",sans-serif;letter-spacing:.105em; }
.aka-meme-aka-ascent.is-gate .aka-meme-aka-ascent-head small { color:rgba(var(--aka-throne-gold),.76); }
.aka-meme-aka-ascent-head strong { margin-top:.18rem;color:rgba(var(--aka-throne-cream),.88);font:400 .88rem/1 "Bebas Neue","Arial Narrow",sans-serif;letter-spacing:.08em; }
.aka-meme-aka-ascent-head em { max-width:58%;color:rgba(var(--aka-throne-cream),.33);font:normal 600 .43rem/1.25 "Space Grotesk",sans-serif;letter-spacing:.045em;text-align:right; }
.aka-meme-throne-row.is-pinned { border-color:rgba(var(--aka-rank-cyan),.20); }
.aka-meme-aka-ascent-foot { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1px solid rgba(var(--aka-rank-cyan),.07); }
.aka-meme-aka-ascent-foot > span { min-width:0;display:flex;flex-direction:column;padding:.30rem .42rem;border-inline-start:1px solid rgba(var(--aka-rank-cyan),.065); }
.aka-meme-aka-ascent-foot > span:first-child { border-inline-start:0; }
.aka-meme-aka-ascent-foot small { color:rgba(var(--aka-rank-cyan),.38);font:600 .40rem/1 "Space Grotesk",sans-serif;letter-spacing:.05em; }
.aka-meme-aka-ascent-foot strong { margin-top:.18rem;color:rgba(var(--aka-throne-cream),.68);font:600 .54rem/1 "Space Grotesk",sans-serif; }
@media (max-width:720px) {
.aka-world-tabs { gap:.10rem; }
.aka-world-tab { padding-inline:.12rem;font-size:.50rem;letter-spacing:.045em; }
.aka-meme-throne { gap:.42rem; }
.aka-meme-throne-banner { padding:.34rem .40rem; }
.aka-meme-throne-banner > span:first-child strong { font-size:.78rem;letter-spacing:.07em; }
.aka-meme-throne-stage { min-height:6.95rem;grid-template-columns:1fr 1.08fr 1fr;gap:.26rem;padding:.52rem .30rem .44rem;align-items:stretch; }
.aka-meme-throne-hero,.aka-meme-throne-hero.is-place-1 { min-height:5.75rem;padding:.34rem .18rem .36rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.16rem;text-align:center; }
.aka-meme-throne-role,.aka-meme-throne-rank,.aka-meme-throne-hero-metrics { display:none; }
.aka-meme-throne-portrait-wrap { width:3.15rem;height:3.15rem;margin:0 0 .18rem; }
.aka-meme-throne-hero.is-place-1 .aka-meme-throne-portrait-wrap { width:3.60rem;height:3.60rem; }
.aka-meme-throne-name { margin:0;gap:.08rem; }
.aka-meme-throne-name strong,.aka-meme-throne-hero.is-place-1 .aka-meme-throne-name strong,.aka-meme-throne-hero.is-aka .aka-meme-throne-name strong { display:none; }
.aka-meme-throne-name small { display:block;font-size:.46rem;letter-spacing:.075em;color:rgba(var(--aka-throne-gold),.68); }
.aka-meme-throne-row.is-aka .aka-meme-throne-identity b { font-size:.57rem; }
.aka-meme-throne-head { display:none; }
.aka-meme-throne-row { grid-template-columns:2.25rem minmax(0,1fr) 4.9rem 2.8rem;gap:.24rem;padding:.28rem .34rem;min-height:3.42rem; }
.aka-meme-throne-row > .aka-meme-throne-movement { display:none; }
.aka-meme-throne-identity { grid-template-columns:2.42rem minmax(0,1fr);gap:.32rem; }
.aka-meme-portrait { width:2.42rem;height:2.42rem; }
.aka-meme-throne-identity b { font-size:.60rem; }
.aka-meme-throne-mc { text-align:right;align-items:flex-end; }
.aka-meme-throne-mc strong { font-size:.56rem; }
.aka-meme-throne-scroll { max-height:18.8rem; }
.aka-meme-aka-ascent-head { align-items:flex-start;flex-direction:column;gap:.18rem; }
.aka-meme-aka-ascent-head em { max-width:none;text-align:left; }
.aka-meme-aka-ascent-foot { grid-template-columns:repeat(2,minmax(0,1fr)); }
.aka-meme-aka-ascent-foot > span:nth-child(3) { border-inline-start:0;border-top:1px solid rgba(var(--aka-rank-cyan),.065); }
.aka-meme-aka-ascent-foot > span:nth-child(4) { border-top:1px solid rgba(var(--aka-rank-cyan),.065); }
}
@media (max-width:430px) {
.aka-world-tab { font-size:.45rem;letter-spacing:.025em; }
.aka-meme-throne-banner { align-items:flex-start; }
.aka-meme-throne-feed small { display:none; }
.aka-meme-throne-stage { min-height:6.45rem;gap:.20rem;padding-inline:.22rem; }
.aka-meme-throne-hero,.aka-meme-throne-hero.is-place-1 { min-height:5.25rem;padding-inline:.12rem; }
.aka-meme-throne-portrait-wrap { width:2.78rem;height:2.78rem; }
.aka-meme-throne-hero.is-place-1 .aka-meme-throne-portrait-wrap { width:3.18rem;height:3.18rem; }
.aka-meme-throne-row.is-aka .aka-meme-throne-identity b { font-size:.51rem; }
.aka-meme-throne-name small { font-size:.40rem; }
.aka-meme-throne-row { grid-template-columns:1.85rem minmax(0,1fr) 4.15rem 2.35rem;gap:.18rem;padding-inline:.25rem; }
.aka-meme-throne-identity { grid-template-columns:2.06rem minmax(0,1fr);gap:.24rem; }
.aka-meme-portrait { width:2.06rem;height:2.06rem; }
.aka-meme-throne-row-rank { font-size:.78rem; }
.aka-meme-throne-identity b { font-size:.54rem; }
.aka-meme-throne-identity small { font-size:.39rem; }
.aka-meme-throne-mc strong { font-size:.49rem; }
.aka-meme-change { font-size:.45rem; }
}
@media (prefers-reduced-motion:reduce) {
.aka-meme-throne-feed.is-live i { box-shadow:none; }
}
/* V0.43.00 — authority / readability polish. No new layout architecture. */
/* The #1 card should feel seated in the throne, not merely enlarged. */
.aka-meme-throne-hero.is-place-1 {
isolation:isolate;
overflow:hidden;
}
.aka-meme-throne-hero.is-place-1 > * {
position:relative;
z-index:2;
}
.aka-meme-throne-hero.is-place-1::before {
content:"";
position:absolute;
z-index:0;
inset:0;
pointer-events:none;
background:
linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.20) 58%,rgba(0,0,0,.62) 100%),
radial-gradient(circle at 50% 38%,rgba(var(--aka-throne-gold),.10),transparent 42%),
url("../images/ui/meme-throne-seat.webp") center 56% / cover no-repeat;
opacity:.52;
}
.aka-meme-throne-hero.is-place-1::after {
content:"";
position:absolute;
z-index:1;
left:14%;
right:14%;
bottom:.18rem;
height:1.58rem;
pointer-events:none;
border-top:1px solid rgba(var(--aka-throne-gold),.12);
border-radius:50% 50% 0 0;
background:radial-gradient(ellipse at 50% 0,rgba(var(--aka-throne-gold),.052),transparent 68%);
box-shadow:0 -8px 22px rgba(var(--aka-throne-gold),.018);
}
.aka-meme-throne-hero.is-place-1 .aka-meme-throne-portrait-wrap {
filter:drop-shadow(0 7px 12px rgba(0,0,0,.25));
}
/* Portrait geometry intentionally stays on the proven V0.42.99 system.
No inner rim overlay or inset image override here: provider artwork remains centered
inside the existing circular orbit geometry. */
/* Primary market data gets more authority; micro labels recede. */
.aka-meme-throne-head {
color:rgba(var(--aka-throne-cream),.34);
letter-spacing:.095em;
}
.aka-meme-throne-row {
min-height:3.55rem;
border-color:rgba(var(--aka-throne-gold),.082);
background:
linear-gradient(90deg,rgba(var(--aka-throne-gold),.019),rgba(0,0,0,.18) 60%,rgba(0,0,0,.215));
box-shadow:inset 0 1px rgba(255,255,255,.006);
}
.aka-meme-throne-row-rank { color:rgba(var(--aka-throne-gold),.82); }
.aka-meme-throne-identity b {
color:rgba(var(--aka-throne-cream),.93);
font-size:.72rem;
}
.aka-meme-throne-identity small {
color:rgba(var(--aka-throne-gold),.53);
font-size:.48rem;
}
.aka-meme-throne-mc strong {
color:rgba(var(--aka-throne-cream),.88);
font-size:.68rem;
}
.aka-meme-change,.aka-meme-rank-move { font-size:.56rem; }
.aka-meme-throne-row small {
color:rgba(var(--aka-throne-cream),.25);
font-size:.38rem;
letter-spacing:.052em;
}
/* The scroll thumb belongs to the terminal, not the browser chrome. */
.aka-meme-throne-scroll {
padding-right:.24rem;
scrollbar-width:thin;
scrollbar-color:rgba(var(--aka-throne-gold),.36) rgba(var(--aka-throne-gold),.025);
}
.aka-meme-throne-scroll::-webkit-scrollbar { width:4px; }
.aka-meme-throne-scroll::-webkit-scrollbar-track {
background:linear-gradient(180deg,transparent,rgba(var(--aka-throne-gold),.025),transparent);
}
.aka-meme-throne-scroll::-webkit-scrollbar-thumb {
border-radius:999px;
background:linear-gradient(180deg,rgba(var(--aka-throne-gold),.16),rgba(var(--aka-throne-gold),.55),rgba(var(--aka-throne-gold),.18));
box-shadow:0 0 7px rgba(var(--aka-throne-gold),.08);
}
/* AKA is identifiable, but not visually privileged over the market board. */
.aka-meme-aka-ascent {
border-color:rgba(var(--aka-rank-cyan),.10);
background:
radial-gradient(circle at 0 50%,rgba(var(--aka-rank-cyan),.030),transparent 24%),
linear-gradient(90deg,rgba(var(--aka-rank-cyan),.017),rgba(0,0,0,.18));
box-shadow:inset 0 1px rgba(255,255,255,.009);
}
.aka-meme-throne-row.is-aka {
border-color:rgba(var(--aka-rank-cyan),.18);
background:linear-gradient(90deg,rgba(var(--aka-rank-cyan),.034),rgba(var(--aka-throne-gold),.012) 42%,rgba(0,0,0,.21));
box-shadow:inset 1px 0 rgba(var(--aka-rank-cyan),.42);
}
.aka-meme-throne-row.is-pinned { border-color:rgba(var(--aka-rank-cyan),.17); }
.aka-meme-throne-row.is-pinned .aka-meme-throne-identity { position:relative;left:-2px; }
@media (max-width:720px) {
.aka-meme-throne-identity b { font-size:.62rem; }
.aka-meme-throne-mc strong { font-size:.58rem; }
.aka-meme-throne-scroll { padding-right:.14rem; }
}
@media (max-width:430px) {
.aka-meme-throne-identity b { font-size:.55rem; }
.aka-meme-throne-mc strong { font-size:.50rem; }
.aka-meme-throne-hero.is-place-1::before { left:-6%;right:-6%;top:-5%;bottom:-8%;background-position:center 58%;background-size:cover;opacity:.56; }
}
/* Pinned AKA uses the same avatar geometry as every #4–#30 market row.
Only its identification treatment differs; size never changes when it enters Top 30. */
.aka-meme-throne-row.is-pinned .aka-meme-portrait.is-aka {
border-color:transparent;
background:#000;
box-shadow:none;
}
.aka-meme-aka-orbit {
position:absolute;
z-index:3;
inset:-2px;
display:block;
width:calc(100% + 4px);
height:calc(100% + 4px);
pointer-events:none;
overflow:visible;
shape-rendering:geometricPrecision;
}
.aka-meme-aka-orbit circle {
fill:none;
stroke:url(#akaMemeOrbitGradient);
stroke-width:.72;
vector-effect:non-scaling-stroke;
}
/* Desktop already has column headers, so repeating microscopic metric labels in every
row only adds noise. Let the numbers carry the board. */
@media (min-width:721px) {
.aka-meme-throne-mc > small,
.aka-meme-throne-change > small,
.aka-meme-throne-movement > small { display:none; }
.aka-meme-throne-mc,.aka-meme-throne-change,.aka-meme-throne-movement { gap:0; }
.aka-meme-throne-head { font-size:.54rem;letter-spacing:.10em;color:rgba(var(--aka-throne-cream),.39); }
.aka-meme-throne-row-rank { font-size:.98rem; }
.aka-meme-throne-identity b { font-size:.75rem; }
.aka-meme-throne-identity small { font-size:.50rem; }
.aka-meme-throne-mc strong { font-size:.73rem; }
.aka-meme-change,.aka-meme-rank-move { font-size:.61rem; }
}
/* Top-three copy must remain readable without turning the stage into a dashboard. */
.aka-meme-throne-role { font-size:.45rem; }
.aka-meme-throne-rank { font-size:.98rem; }
.aka-meme-throne-name strong { font-size:.69rem; }
.aka-meme-throne-name small { font-size:.46rem; }
.aka-meme-throne-hero-metrics small { font-size:.42rem; }
.aka-meme-throne-hero-metrics strong { font-size:.56rem; }
.aka-meme-throne-banner small { font-size:.49rem; }
.aka-meme-throne-feed b { font-size:.50rem; }
.aka-meme-throne-feed small { font-size:.42rem; }
.aka-meme-aka-ascent-head small { font-size:.48rem; }
.aka-meme-aka-ascent-head em { font-size:.46rem; }
.aka-meme-aka-ascent-foot small { font-size:.43rem; }
.aka-meme-aka-ascent-foot strong { font-size:.59rem; }
@media (max-width:720px) {
/* Mobile hides the board header, therefore local metric labels stay visible. */
.aka-meme-throne-hero-metrics small { font-size:.39rem; }
.aka-meme-aka-ascent-foot small { font-size:.41rem; }
}
/* V0.43.17 — OUR ASCENT uses the exact live-board column axis.
AKA gets only a small optical portrait lift; rank/avatar/name alignment is
identical to the #4–#30 rows. */
@media (max-width:720px) {
.aka-meme-throne-row.is-pinned {
grid-template-columns:2.25rem minmax(0,1fr) 4.9rem 2.8rem;
}
.aka-meme-throne-row.is-pinned .aka-meme-throne-identity {
grid-template-columns:2.52rem minmax(0,1fr);
gap:.22rem;
}
.aka-meme-throne-row.is-pinned .aka-meme-portrait.is-aka {
width:2.52rem;
height:2.52rem;
}
}
@media (max-width:430px) {
.aka-meme-throne-row.is-pinned {
grid-template-columns:1.85rem minmax(0,1fr) 4.15rem 2.35rem;
}
.aka-meme-throne-row.is-pinned .aka-meme-throne-identity {
grid-template-columns:2.16rem minmax(0,1fr);
gap:.14rem;
}
.aka-meme-throne-row.is-pinned .aka-meme-portrait.is-aka {
width:2.16rem;
height:2.16rem;
}
}
/* V0.43.28 — LIVE FEED ORB ROW ALIGNMENT ONLY.
Preserve original LIVE MARKET FEED wording, green state, orb size/glow.
Move only the orb's grid row so its centre matches the green label. */
@media (min-width:769px) {
.aka-meme-throne-feed i {
grid-column:1 !important;
grid-row:1 !important;
align-self:center !important;
transform:none !important;
}
.aka-meme-throne-feed b {
grid-column:2 !important;
grid-row:1 !important;
}
.aka-meme-throne-feed small {
grid-column:2 !important;
grid-row:2 !important;
}
}
/* ========================================================================== */
/* EL MULLERO — ARCHIVE ROOM */
/* One scroll surface, projector backlight and the original sealed Reel wall. */
/* ========================================================================== */
#cinematicModal .modal-box.archive-modal-wide:has(.elm-archive-room) {
--room-height:min(90dvh,980px);
width:min(94vw,1240px) !important;
max-width:1240px !important;
max-height:var(--room-height) !important;
padding:0 !important;
overflow:hidden !important;
border:1px solid rgba(208,164,98,.32) !important;
border-radius:8px !important;
background:#090607 !important;
box-shadow:0 32px 120px rgba(0,0,0,.9),0 0 70px rgba(119,22,31,.12),0 0 0 1px rgba(255,221,167,.025) !important;
}
/* The reel wall owns scrolling. The generic modal must not scroll it a second time. */
#cinematicModal:has(.elm-archive-room) { overflow:hidden !important; }
#cinematicModal #modalContent:has(> .elm-archive-room) {
max-height:none !important;
overflow:hidden !important;
padding:0 !important;
}
#cinematicModal #modalContent .elm-archive-room {
--room-accent:178,48,49;
--room-gold:219,179,112;
position:relative !important;
isolation:isolate;
max-height:calc(var(--room-height) - 2px) !important;
overflow-x:hidden !important;
overflow-y:auto !important;
overscroll-behavior:contain;
border:0 !important;
border-radius:7px !important;
background:#090607 !important;
box-shadow:none !important;
scrollbar-width:thin;
scrollbar-color:#594234 #090607;
font-family:"Space Grotesk",Arial,sans-serif;
}
#cinematicModal #modalContent .elm-archive-room[data-archive-key="night"] { --room-accent:147,28,44; }
#cinematicModal #modalContent .elm-archive-room[data-archive-key="rise"] { --room-accent:166,87,39; }
#cinematicModal #modalContent .elm-archive-room[data-archive-key="lost"] { --room-accent:126,57,45; }
#cinematicModal #modalContent .elm-archive-room[data-archive-key="dominion"] { --room-accent:188,44,31; }
#cinematicModal #modalContent .elm-archive-room[data-archive-key="finale"] { --room-accent:151,53,73; }
#cinematicModal #modalContent .elm-archive-room::-webkit-scrollbar { width:5px; }
#cinematicModal #modalContent .elm-archive-room::-webkit-scrollbar-track { background:#090607; }
#cinematicModal #modalContent .elm-archive-room::-webkit-scrollbar-thumb { border-radius:9px;background:#594234; }
#cinematicModal #modalContent .elm-archive-room > .aka-vault-topbar {
position:sticky;
top:0;
z-index:20;
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
min-height:42px;
margin:0;
padding:12px 60px 12px 30px !important;
border:0 !important;
border-bottom:1px solid rgba(var(--room-gold),.12) !important;
background:linear-gradient(90deg,#180c0e,#0d0809 65%) !important;
box-shadow:none !important;
}
.elm-archive-room-actions {
display:flex;
align-items:center;
gap:12px;
flex:0 0 auto;
}
.aka-sound-toggle.is-archive {
width:44px;
height:44px;
flex-basis:44px;
margin-block:-6px;
border-radius:5px;
border-color:transparent;
background:transparent;
color:rgba(222,200,170,.82);
box-shadow:none;
filter:none;
transition:color 180ms ease,border-color 180ms ease,background 180ms ease,transform 145ms ease;
}
.aka-sound-toggle.is-archive .aka-sound-icon {
width:18px;
height:18px;
stroke-width:1.7;
}
.aka-sound-toggle.is-archive.is-muted {
color:rgba(190,175,153,.58);
border-color:transparent;
}
.aka-sound-toggle.is-archive:hover,
.aka-sound-toggle.is-archive:focus-visible {
color:#f0dab6;
border-color:rgba(var(--room-gold),.16);
background:rgba(var(--room-gold),.045);
filter:none;
}
.aka-sound-toggle.is-archive:focus-visible {
outline:1px solid rgba(var(--room-gold),.48);
outline-offset:1px;
}
.aka-sound-toggle.is-archive:active { transform:translateY(1px); }
#cinematicModal .modal-box.archive-modal-wide:has(.elm-archive-room) > .modal-close {
top:6px !important;
right:8px !important;
width:44px !important;
min-width:44px !important;
height:44px !important;
min-height:44px !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-vault-topbar-left,
#cinematicModal #modalContent .elm-archive-room .aka-vault-topbar-right {
font-family:"Space Grotesk",Arial,sans-serif !important;
font-size:11px !important;
font-weight:500;
line-height:1.2;
letter-spacing:.16em !important;
color:#b29c83 !important;
text-shadow:none !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-vault-topbar-left {
color:#ead0a7 !important;
font-weight:600;
letter-spacing:.25em !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-vault-topbar-left::before {
content:"";
display:block;
width:18px;
height:2px;
background:#b74442;
box-shadow:0 0 12px rgba(196,48,53,.55);
}
#cinematicModal #modalContent .elm-archive-room > .elm-archive-hero {
position:relative !important;
z-index:2;
display:flex;
align-items:flex-end;
min-height:0 !important;
height:238px;
margin:0 !important;
padding:32px !important;
overflow:hidden;
isolation:isolate;
border:0 !important;
border-bottom:1px solid rgba(var(--room-gold),.25) !important;
background:#100809 !important;
}
#cinematicModal #modalContent .elm-archive-room > .elm-archive-hero::after {
content:"";
position:absolute;
inset:auto 0 0;
height:1px;
background:linear-gradient(90deg,transparent,rgba(255,208,128,.7) 24%,rgba(180,45,42,.6) 55%,transparent 92%);
box-shadow:0 -2px 14px rgba(196,75,46,.26);
pointer-events:none;
}
#cinematicModal #modalContent .elm-archive-room .elm-archive-hero > .night-kaka-cinematic-bg {
position:absolute !important;
inset:0 !important;
width:100% !important;
height:100% !important;
z-index:0 !important;
overflow:hidden !important;
pointer-events:none !important;
}
#cinematicModal #modalContent .elm-archive-room .elm-archive-hero .aka-archive-hero-img {
position:absolute !important;
top:0 !important;
right:0 !important;
bottom:0 !important;
left:auto !important;
width:100% !important;
height:100% !important;
max-width:none !important;
max-height:none !important;
margin:0 !important;
padding:0 !important;
transform:none !important;
object-fit:cover !important;
object-position:62% 36% !important;
opacity:.95 !important;
filter:saturate(.84) brightness(.86) sepia(.12) !important;
}
#cinematicModal #modalContent .elm-archive-room .elm-archive-hero .night-kaka-cinematic-bg::after {
position:absolute;
inset:0;
background:
radial-gradient(ellipse at 16% 75%,rgba(var(--room-accent),.19),transparent 52%),
linear-gradient(90deg,#100809 0%,rgba(16,8,9,.95) 18%,rgba(16,8,9,.61) 43%,rgba(16,8,9,.04) 78%),
linear-gradient(0deg,rgba(9,6,7,.89),transparent 73%) !important;
}
#cinematicModal #modalContent .elm-archive-room .elm-archive-hero-copy {
position:relative;
z-index:2;
width:100%;
min-width:0;
text-align:left;
}
#cinematicModal #modalContent .elm-archive-room .aka-vault-chapter {
display:flex;
align-items:center;
gap:14px;
margin:0 0 12px !important;
color:rgb(var(--room-gold)) !important;
font-family:"Space Grotesk",Arial,sans-serif !important;
font-size:10px !important;
font-weight:500;
letter-spacing:.28em !important;
line-height:1.3 !important;
text-shadow:none !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-vault-chapter::before {
content:"";
flex:0 0 26px;
height:1px;
background:linear-gradient(90deg,#b74c42,rgba(var(--room-gold),.8));
box-shadow:0 0 8px rgba(184,61,49,.24);
}
#cinematicModal #modalContent .elm-archive-room .aka-vault-title {
max-width:90%;
margin:0 0 15px !important;
color:#f5dfb8 !important;
font-family:"Bebas Neue",Impact,sans-serif !important;
font-size:clamp(42px,5vw,66px) !important;
font-weight:400 !important;
line-height:.98 !important;
letter-spacing:.085em !important;
transform:none !important;
transform-origin:left center !important;
-webkit-text-stroke:0 !important;
text-shadow:0 2px 2px rgba(0,0,0,.75),0 0 26px rgba(223,159,75,.16),0 8px 28px rgba(0,0,0,.7) !important;
}
#cinematicModal #modalContent .elm-archive-room .elm-archive-hero-meta {
display:flex;
align-items:center;
flex-wrap:wrap;
gap:12px 22px;
}
#cinematicModal #modalContent .elm-archive-room .aka-vault-state-label {
display:inline-flex;
align-items:center;
gap:7px;
margin:0 !important;
color:#d0b18f !important;
font-family:"Space Grotesk",Arial,sans-serif !important;
font-size:11px !important;
font-weight:400;
line-height:1.3;
letter-spacing:.12em !important;
text-shadow:none !important;
}
#cinematicModal #modalContent .elm-archive-room > .aka-vault-content {
position:relative;
z-index:2;
padding:23px 28px 32px !important;
background:
radial-gradient(ellipse 72% 240px at 50% -36px,rgba(236,183,120,.085),transparent 85%),
radial-gradient(ellipse 30% 700px at 0% 300px,rgba(var(--room-accent),.15),transparent 100%),
radial-gradient(ellipse 28% 700px at 100% 340px,rgba(var(--room-accent),.11),transparent 100%),
#080607 !important;
}
#cinematicModal #modalContent .elm-archive-room .elm-archive-progress { margin:0 0 22px; }
#cinematicModal #modalContent .elm-archive-room .elm-archive-progress-head {
display:flex;
align-items:baseline;
justify-content:space-between;
gap:16px;
margin:0 0 11px;
color:#e5c9a3;
font-family:"Bebas Neue",Impact,sans-serif;
font-size:20px;
font-weight:400;
letter-spacing:.12em;
}
#cinematicModal #modalContent .elm-archive-room #archiveCompletionCount {
color:#c6b5a4 !important;
font-family:"Space Grotesk",Arial,sans-serif !important;
font-size:12px !important;
font-variant-numeric:tabular-nums;
letter-spacing:.045em !important;
text-shadow:none !important;
}
#cinematicModal #modalContent .elm-archive-room .elm-archive-meter {
appearance:none;
-webkit-appearance:none;
display:block;
width:100%;
height:2px;
margin:0;
overflow:hidden;
border:0;
border-radius:2px;
background:rgba(var(--room-gold),.12);
color:rgb(var(--room-gold));
}
#cinematicModal #modalContent .elm-archive-room .elm-archive-meter::-webkit-progress-bar { background:rgba(var(--room-gold),.12); }
#cinematicModal #modalContent .elm-archive-room .elm-archive-meter::-webkit-progress-value { background:linear-gradient(90deg,#8f3330,#e7bf7b); }
#cinematicModal #modalContent .elm-archive-room .elm-archive-meter::-moz-progress-bar { background:linear-gradient(90deg,#8f3330,#e7bf7b); }
#cinematicModal #modalContent .elm-archive-room .aka-archive-grid {
display:grid !important;
grid-template-columns:repeat(4,minmax(0,1fr)) !important;
gap:20px !important;
margin:0 !important;
padding:0 !important;
align-items:start;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card {
--elm-sleeve-light:226,178,103;
--elm-sleeve-light-opacity:.055;
--room-card-hover-rgb:var(--room-gold);
--room-card-hover-alpha:.44;
--aka-sealed-card-border:rgba(181,151,111,.23);
--aka-sealed-card-shadow:0 2px 4px rgba(0,0,0,.85),0 18px 36px -10px rgba(0,0,0,.8),inset 0 1px 0 rgba(244,223,185,.1);
position:relative !important;
width:100% !important;
min-width:0;
max-width:none !important;
height:auto !important;
aspect-ratio:2 / 3 !important;
margin:0 !important;
padding:0 !important;
overflow:hidden !important;
isolation:isolate;
container-type:inline-size;
border:1px solid var(--aka-sealed-card-border) !important;
border-radius:5px !important;
background:#0c0708 !important;
box-shadow:var(--aka-sealed-card-shadow) !important;
transform:none !important;
translate:none !important;
scale:none !important;
transition:border-color 180ms ease,box-shadow 180ms ease !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card::before,
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card::after { content:none !important;display:none !important; }
/* A restrained inner seam makes the sealed cover feel assembled rather than
drawn. It stays behind the Reel and disappears with the sleeve on reveal. */
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-sealed:not(.is-main-silver-seal)::before {
content:"" !important;
display:block !important;
position:absolute;
inset:clamp(6px,3.2cqw,10px);
z-index:4;
border:1px solid rgba(235,211,171,.065);
border-right-color:rgba(0,0,0,.42);
border-bottom-color:rgba(0,0,0,.55);
border-radius:3px;
box-shadow:inset 0 1px 0 rgba(255,242,214,.025),0 1px 0 rgba(255,239,205,.018);
pointer-events:none;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-sealed:not(.is-main-silver-seal)::after {
content:"" !important;
display:block !important;
position:absolute;
top:clamp(6px,3.2cqw,10px);
right:18%;
left:18%;
z-index:4;
height:1px;
background:linear-gradient(90deg,transparent,rgba(var(--elm-sleeve-light),.16),transparent);
pointer-events:none;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-route-current {
--elm-sleeve-light-opacity:.13;
--room-card-hover-alpha:.82;
border-color:rgba(var(--room-gold),.72) !important;
box-shadow:0 0 0 1px rgba(var(--room-gold),.06),0 16px 38px rgba(0,0,0,.55),0 0 22px rgba(var(--room-gold),.10) !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-classified {
--elm-sleeve-light:24,78,132;
--room-card-hover-rgb:74,168,255;
--room-card-hover-alpha:.58;
border-color:rgba(74,168,255,.35) !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-new-trace {
--room-card-hover-rgb:103,215,242;
--room-card-hover-alpha:.78;
border-color:rgba(103,215,242,.64) !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-completed {
--room-card-hover-rgb:114,173,124;
--room-card-hover-alpha:.7;
border-color:rgba(114,173,124,.52) !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.has-key-ready-lock {
animation:none !important;
will-change:auto;
}
#cinematicModal #modalContent .elm-archive-room .elm-reel-sleeve {
position:absolute;
inset:0;
z-index:3;
overflow:hidden;
pointer-events:none;
color:rgb(var(--room-gold));
background:
radial-gradient(ellipse 110% 90% at -14% -12%,rgba(var(--elm-sleeve-light),var(--elm-sleeve-light-opacity)),transparent 75%),
radial-gradient(ellipse 80% 60% at 105% 100%,rgba(var(--room-accent),.04),transparent 76%),
linear-gradient(155deg,#1a181b 0%,#111015 28%,#0a090c 58%,#050506 100%);
box-shadow:inset 1px 1px 0 rgba(255,236,202,.075),inset -1px -2px 1px rgba(0,0,0,.85),inset 0 -28px 50px rgba(0,0,0,.35);
}
#cinematicModal #modalContent .elm-archive-room .elm-reel-sleeve::before {
content:"";
position:absolute;
inset:0;
opacity:.9;
background:
radial-gradient(ellipse 34% 22% at 50% 46%,rgba(var(--elm-sleeve-light),.21),rgba(var(--elm-sleeve-light),.075) 48%,transparent 100%),
radial-gradient(ellipse 74% 58% at 30% 16%,rgba(var(--elm-sleeve-light),.09),transparent 82%),
linear-gradient(124deg,rgba(var(--elm-sleeve-light),.055),transparent 46%);
transition:opacity 240ms ease;
}
#cinematicModal #modalContent .elm-archive-room .elm-reel-sleeve::after {
content:"";
position:absolute;
inset:0;
opacity:.34;
background:
radial-gradient(ellipse 58% 42% at 92% 72%,rgba(var(--room-gold),.04),transparent 78%),
linear-gradient(118deg,rgba(248,232,200,.06),rgba(248,232,200,.022) 27%,transparent 52%),
repeating-linear-gradient(125deg,rgba(238,205,167,.014) 0 1px,transparent 1px 4px);
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:not(.is-sealed) .elm-reel-sleeve { display:none; }
#cinematicModal #modalContent .elm-archive-room .elm-reel-sleeve ~ .aka-sealed-poster-veil { background:none !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-inner {
z-index:5 !important;
background:none !important;
box-shadow:none !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-inner::before,
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-inner::after { display:none !important;content:none !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-film-reel {
width:clamp(54px,30cqw,70px) !important;
height:clamp(54px,30cqw,70px) !important;
color:rgb(var(--aka-reel-rgb)) !important;
filter:drop-shadow(0 2px 2px rgba(0,0,0,.8)) drop-shadow(0 0 6px rgba(var(--aka-reel-rgb),.26)) !important;
animation:none !important;
transition:filter 180ms ease;
}
/* Use the original tone variables: Ordinary gold; Secret blue body/red lines. */
#cinematicModal #modalContent .elm-archive-room .aka-archive-film-reel .aka-reel-rim {
fill:var(--elm-reel-face,rgba(var(--aka-reel-fill-rgb,var(--aka-reel-rgb)),.13)) !important;
stroke:currentColor !important;
stroke-width:1;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-film-reel .aka-reel-aperture {
fill:rgba(var(--aka-reel-dark),.98) !important;
stroke:currentColor !important;
stroke-width:.45;
filter:drop-shadow(0 .22px 0 rgba(255,232,191,.2));
}
#cinematicModal #modalContent .elm-archive-room .aka-reel-material-depth { fill:#030202;stroke:#030202;stroke-width:.6; }
#cinematicModal #modalContent .elm-archive-room .aka-reel-material-sheen { fill:var(--elm-reel-sheen);stroke:none; }
#cinematicModal #modalContent .elm-archive-room .aka-reel-material-edge { fill:none;stroke:#fff0d0;stroke-width:.24;stroke-linecap:round;opacity:.54; }
/* The reel index is printed into the cover, then becomes a compact colophon
when the poster is revealed. Its identity is never repeated in a top badge. */
#cinematicModal #modalContent .elm-archive-room .elm-reel-inscription {
position:absolute;
z-index:13;
right:clamp(8px,6cqw,22px);
bottom:clamp(50px,27cqw,78px);
display:flex;
flex-direction:column;
align-items:flex-end;
gap:7px;
margin:0;
padding:0;
pointer-events:none;
user-select:none;
}
#cinematicModal #modalContent .elm-archive-room .elm-reel-word {
color:#ad9067;
font-family:"Space Grotesk",Arial,sans-serif;
font-size:9px;
font-weight:500;
line-height:1;
letter-spacing:.27em;
}
#cinematicModal #modalContent .elm-archive-room .elm-reel-number {
color:#a1855e;
font-family:"Bebas Neue",Impact,sans-serif;
font-size:clamp(34px,30cqw,86px);
font-weight:400;
font-variant-numeric:tabular-nums;
line-height:.88;
letter-spacing:.005em;
background:linear-gradient(155deg,#bba27b 12%,#8b704d 55%,#58442e);
background-clip:text;
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
filter:drop-shadow(0 1px 0 rgba(0,0,0,.85));
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-route-current .elm-reel-number {
background-image:linear-gradient(155deg,#dbc294 12%,#af8b53 55%,#705333);
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:not(.is-sealed) .elm-reel-inscription,
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-sealed.has-mastery-preview .elm-reel-inscription {
right:16px;
bottom:17px;
gap:3px;
align-items:center;
text-shadow:0 1px 4px #000,0 0 8px #000;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:not(.is-sealed) .elm-reel-word,
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-sealed.has-mastery-preview .elm-reel-word { color:#eed9b8;font-size:7px;letter-spacing:.13em; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:not(.is-sealed) .elm-reel-number,
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-sealed.has-mastery-preview .elm-reel-number {
color:#eed9b8;
font-size:21px;
background:none;
-webkit-text-fill-color:currentColor;
filter:none;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-sealed.has-mastery-preview .elm-reel-inscription { top:16px;bottom:auto; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-id-badge {
top:12px !important;
left:12px !important;
z-index:12 !important;
padding:7px 9px !important;
border:0 !important;
border-radius:3px !important;
background:rgba(12,7,8,.8) !important;
box-shadow:none !important;
backdrop-filter:blur(8px);
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-id-badge span {
color:#ddc09a !important;
font-family:"Space Grotesk",Arial,sans-serif !important;
font-size:11px !important;
font-weight:500;
letter-spacing:.14em !important;
text-shadow:none !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-progression-action {
display:flex;
justify-content:flex-start;
z-index:14 !important;
left:0 !important;
right:0 !important;
bottom:0 !important;
width:100% !important;
max-width:none !important;
padding:12px !important;
background:linear-gradient(0deg,rgba(6,4,5,.98),rgba(8,5,6,.62) 58%,transparent) !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-recover-btn,
#cinematicModal #modalContent .elm-archive-room .aka-archive-inspect-btn,
#cinematicModal #modalContent .elm-archive-room .aka-archive-main-seal-btn,
#cinematicModal #modalContent .elm-archive-room .aka-archive-recovered-badge {
min-width:104px !important;
width:auto !important;
inline-size:auto !important;
max-width:100% !important;
height:37px !important;
min-height:37px !important;
padding:0 8px !important;
border-radius:3px !important;
font-family:"Space Grotesk",Arial,sans-serif !important;
font-size:11px !important;
font-weight:500 !important;
letter-spacing:.065em !important;
line-height:1.2 !important;
text-shadow:none !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-recover-btn,
#cinematicModal #modalContent .elm-archive-room .aka-archive-inspect-btn {
overflow:hidden;
border:1px solid rgba(var(--room-gold),.44) !important;
background:linear-gradient(180deg,rgba(176,133,72,.28),rgba(67,43,23,.82)) !important;
color:#f3d9ad !important;
box-shadow:inset 0 1px 0 rgba(255,231,185,.14),inset 0 -1px 0 rgba(0,0,0,.48),0 6px 16px rgba(0,0,0,.24) !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-recovered-badge {
left:12px !important;
bottom:12px !important;
max-width:calc(100% - 24px) !important;
}
/* Longer translated labels can grow inside the same footer slot. Cyrillic uses
natural tracking so a complete word remains readable on narrow covers. */
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:lang(ru)
:is(.aka-archive-recover-btn,.aka-archive-inspect-btn,.aka-archive-main-seal-btn,.aka-archive-recovered-badge) {
padding-inline:4px !important;
letter-spacing:0 !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-locked-btn {
border-color:rgba(151,75,72,.4) !important;
background:linear-gradient(180deg,rgba(79,30,34,.56),rgba(27,11,14,.92)) !important;
color:#d3b5a7 !important;
box-shadow:inset 0 1px 0 rgba(241,190,168,.075),inset 0 -1px 0 rgba(0,0,0,.52),0 6px 16px rgba(0,0,0,.22) !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-recover-btn span,
#cinematicModal #modalContent .elm-archive-room .aka-archive-inspect-btn span,
#cinematicModal #modalContent .elm-archive-room .aka-archive-main-seal-btn span,
#cinematicModal #modalContent .elm-archive-room .aka-archive-recovered-badge span {
font:inherit !important;
letter-spacing:inherit !important;
text-shadow:none !important;
}
/* A hover may acknowledge focus with light, never move the poster or its artwork. */
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:is(:hover,:focus-within,:active) {
transform:none !important;
translate:none !important;
scale:none !important;
}
@media (hover:hover) and (pointer:fine) {
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:hover { border-color:rgba(var(--room-card-hover-rgb),var(--room-card-hover-alpha)) !important;box-shadow:0 3px 5px rgba(0,0,0,.82),0 20px 38px -10px rgba(0,0,0,.82),0 0 22px rgba(var(--room-card-hover-rgb),.075),inset 0 1px 0 rgba(255,231,187,.11) !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:hover .elm-reel-sleeve::before { opacity:1; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:hover .aka-archive-film-reel { filter:drop-shadow(0 2px 2px rgba(0,0,0,.82)) drop-shadow(0 0 8px rgba(var(--aka-reel-rgb),.31)) !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-recover-btn:not(.aka-archive-locked-btn):hover,
#cinematicModal #modalContent .elm-archive-room .aka-archive-inspect-btn:hover { background:linear-gradient(180deg,rgba(190,145,78,.34),rgba(76,48,24,.88)) !important;box-shadow:inset 0 1px 0 rgba(255,235,194,.18),0 6px 18px rgba(0,0,0,.3),0 0 13px rgba(var(--room-gold),.07) !important; }
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:focus-within .elm-reel-sleeve::before { opacity:1; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-sealed-feedback-active {
border-color:rgba(222,76,83,.7) !important;
box-shadow:0 0 22px rgba(191,35,47,.22),0 15px 35px rgba(0,0,0,.5) !important;
}
@media (max-width:960px) {
#cinematicModal #modalContent .elm-archive-room .aka-archive-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:14px !important; }
#cinematicModal #modalContent .elm-archive-room > .elm-archive-hero { height:222px;padding:27px !important; }
}
@media (max-width:640px) {
#cinematicModal .modal-box.archive-modal-wide:has(.elm-archive-room) { --room-height:calc(100dvh - 28px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));width:calc(100vw - 20px) !important;border-radius:7px !important; }
#cinematicModal #modalContent .elm-archive-room { border-radius:6px !important; }
#cinematicModal #modalContent .elm-archive-room > .aka-vault-topbar { flex-direction:row;align-items:center;justify-content:space-between;min-height:38px;padding:12px 56px 12px 17px !important; }
#cinematicModal #modalContent .elm-archive-room .aka-vault-topbar-left { font-size:10px !important;letter-spacing:.1em !important; }
#cinematicModal #modalContent .elm-archive-room .aka-vault-topbar-right { display:none; }
.aka-sound-toggle.is-archive { margin-block:-4px; }
#cinematicModal .modal-box.archive-modal-wide:has(.elm-archive-room) > .modal-close { top:8px !important; }
#cinematicModal #modalContent .elm-archive-room > .elm-archive-hero { height:190px;padding:22px 18px !important; }
#cinematicModal #modalContent .elm-archive-room .elm-archive-hero .aka-archive-hero-img { width:100% !important;object-position:68% 30% !important;opacity:.9 !important; }
#cinematicModal #modalContent .elm-archive-room .elm-archive-hero .night-kaka-cinematic-bg::after { background:linear-gradient(90deg,rgba(16,8,9,.88),rgba(16,8,9,.12)),linear-gradient(0deg,#090607,transparent 95%) !important; }
#cinematicModal #modalContent .elm-archive-room .aka-vault-title { max-width:100%;font-size:clamp(37px,10.5vw,58px) !important;margin-bottom:14px !important; }
#cinematicModal #modalContent .elm-archive-room .aka-vault-chapter { font-size:10px !important;margin-bottom:10px !important; }
#cinematicModal #modalContent .elm-archive-room .aka-vault-state-label { font-size:10px !important;letter-spacing:.07em !important; }
#cinematicModal #modalContent .elm-archive-room .elm-archive-hero-meta { gap:10px 14px; }
#cinematicModal #modalContent .elm-archive-room > .aka-vault-content { padding:18px 14px 24px !important; }
#cinematicModal #modalContent .elm-archive-room .elm-archive-progress { margin-bottom:18px; }
#cinematicModal #modalContent .elm-archive-room .elm-archive-progress-head { font-size:17px;letter-spacing:.08em;gap:10px; }
#cinematicModal #modalContent .elm-archive-room #archiveCompletionCount { font-size:11px !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card { border-radius:4px !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-id-badge { top:8px !important;left:8px !important;padding:5px 7px !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-id-badge span { font-size:10px !important; }
#cinematicModal #modalContent .elm-archive-room .elm-reel-inscription { gap:4px; }
#cinematicModal #modalContent .elm-archive-room .elm-reel-word { font-size:7px;letter-spacing:.2em; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:not(.is-sealed) .elm-reel-inscription { right:11px;bottom:15px;gap:2px; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:not(.is-sealed) .elm-reel-word { font-size:6px; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:not(.is-sealed) .elm-reel-number { font-size:17px; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-sealed.has-mastery-preview .elm-reel-inscription { top:12px;right:11px;gap:2px; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-sealed.has-mastery-preview .elm-reel-word { font-size:6px; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-sealed.has-mastery-preview .elm-reel-number { font-size:17px; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-progression-action { padding:9px !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-recover-btn,
#cinematicModal #modalContent .elm-archive-room .aka-archive-inspect-btn,
#cinematicModal #modalContent .elm-archive-room .aka-archive-main-seal-btn,
#cinematicModal #modalContent .elm-archive-room .aka-archive-recovered-badge { min-width:96px !important;width:auto !important;inline-size:auto !important;min-height:36px !important;height:36px !important;padding:0 6px !important;font-size:10.5px !important;letter-spacing:.055em !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-recovered-badge { left:9px !important;bottom:9px !important;max-width:calc(100% - 18px) !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card:lang(ru)
:is(.aka-archive-recover-btn,.aka-archive-inspect-btn,.aka-archive-main-seal-btn,.aka-archive-recovered-badge) { font-size:clamp(10px,6.5cqw,10.5px) !important; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-film-reel { width:clamp(38px,31cqw,44px) !important;height:clamp(38px,31cqw,44px) !important; }
}
@container (max-width:144px) {
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-recovered .elm-reel-inscription { bottom:52px; }
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card.is-sealed.has-mastery-preview .elm-reel-inscription { top:6px;flex-direction:row;gap:4px; }
}
@media (prefers-reduced-motion:reduce) {
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card,
#cinematicModal #modalContent .elm-archive-room .elm-reel-sleeve::before,
#cinematicModal #modalContent .elm-archive-room .aka-archive-film-reel { transition:none !important; }
}
/* ========================================================================== */
/* V20 — LIVING CINEMA MICRO-INTERACTIONS */
/* Tactile poster hardware, a staged UNSEAL and quieter theatrical titles. */
/* ========================================================================== */
/* Poster-side actions use one small round piece of dark cinema hardware. Semantic
colour identifies the mechanism; material and depth stay consistent. */
#cinematicModal #modalContent .elm-archive-room .aka-archive-file-card {
--aka-poster-side-start:.55rem;
--aka-poster-download-size:1.82rem;
--aka-poster-side-gap:.34rem;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-task-icons {
gap:var(--aka-poster-side-gap) !important;
}
#cinematicModal #modalContent .elm-archive-room
.aka-archive-task-icons > .aka-archive-task-icon:not([data-archive-maze-kind="reel_signal"]),
#cinematicModal #modalContent .elm-archive-room .aka-archive-download-btn {
width:var(--aka-poster-download-size) !important;
min-width:var(--aka-poster-download-size) !important;
height:var(--aka-poster-download-size) !important;
min-height:var(--aka-poster-download-size) !important;
flex-basis:var(--aka-poster-download-size) !important;
border-width:1px !important;
border-radius:50% !important;
background:
linear-gradient(180deg,rgba(255,239,205,.075),transparent 23%),
radial-gradient(circle at 50% 44%,rgba(var(--aka-task-accent,212,168,67),.105),transparent 67%),
linear-gradient(155deg,rgba(27,23,20,.97),rgba(7,6,6,.995) 64%) !important;
box-shadow:
inset 0 1px 0 rgba(255,240,211,.10),
inset 0 -3px 5px rgba(0,0,0,.68),
0 1px 0 rgba(255,225,184,.025),
0 5px 11px rgba(0,0,0,.44) !important;
transform:translateY(0) !important;
transition:transform 145ms cubic-bezier(.22,1,.36,1),border-color 175ms ease,color 175ms ease,box-shadow 175ms ease,background 175ms ease !important;
}
#cinematicModal #modalContent .elm-archive-room .aka-archive-download-btn {
--aka-task-accent:212,168,67;
border-color:rgba(212,168,67,.46) !important;
color:rgba(239,201,112,.94) !important;
}
#cinematicModal #modalContent .elm-archive-room
.aka-archive-task-icons > .aka-archive-task-icon:not([data-archive-maze-kind="reel_signal"]) > svg,
#cinematicModal #modalContent .elm-archive-room .aka-archive-download-btn > svg {
width:.88rem !important;
height:.88rem !important;
opacity:.92 !important;
stroke-width:2 !important;
filter:drop-shadow(0 1px 0 rgba(0,0,0,.92)) !important;
}
#cinematicModal #modalContent .elm-archive-room
.aka-archive-task-icons > .aka-archive-task-icon.is-complete:not([data-archive-maze-kind="reel_signal"]) {
border:1px solid rgba(101,226,137,.72) !important;
border-radius:50% !important;
background:
linear-gradient(180deg,rgba(225,255,231,.055),transparent 24%),
radial-gradient(circle at 50% 48%,rgba(var(--aka-task-accent),.10),transparent 69%),
linear-gradient(155deg,rgba(15,25,18,.98),rgba(3,8,5,.995) 66%) !important;
box-shadow:
inset 0 1px 0 rgba(225,255,233,.08),
inset 0 -3px 5px rgba(0,0,0,.62),
0 0 0 1px rgba(0,0,0,.76),
0 0 7px rgba(74,222,128,.17) !important;
}
@media (hover:hover) and (pointer:fine) {
#cinematicModal #modalContent .elm-archive-room
button.aka-archive-task-icon:not([data-archive-maze-kind="reel_signal"]):not(:disabled):hover,
#cinematicModal #modalContent .elm-archive-room
button.aka-archive-task-icon:not([data-archive-maze-kind="reel_signal"]):not(:disabled):focus-visible,
#cinematicModal #modalContent .elm-archive-room .aka-archive-download-btn:hover,
#cinematicModal #modalContent .elm-archive-room .aka-archive-download-btn:focus-visible {
transform:translateY(-1px) !important;
border-color:rgba(var(--aka-task-accent,212,168,67),.76) !important;
box-shadow:
inset 0 1px 0 rgba(255,241,213,.14),
inset 0 -3px 5px rgba(0,0,0,.62),
0 7px 13px rgba(0,0,0,.48),
0 0 9px rgba(var(--aka-task-accent,212,168,67),.13) !important;
}
}
#cinematicModal #modalContent .elm-archive-room
button.aka-archive-task-icon:not([data-archive-maze-kind="reel_signal"]):not(:disabled):active,
#cinematicModal #modalContent .elm-archive-room .aka-archive-download-btn:active {
transform:translateY(1px) scale(.965) !important;
box-shadow:
inset 0 3px 7px rgba(0,0,0,.76),
inset 0 0 8px rgba(var(--aka-task-accent,212,168,67),.055),
0 2px 4px rgba(0,0,0,.36) !important;
}
/* The transferred payload and receiver always draw their own symbols. This
prevents the wallet's decorative orbit from becoming a black centre dot. */
.aka-key-wallet-flyer {
width:1.78rem;
height:1.78rem;
overflow:visible;
}
.aka-key-wallet-flyer::after {
content:"";
position:absolute;
z-index:-1;
right:52%;
top:50%;
width:1.35rem;
height:1px;
background:linear-gradient(90deg,transparent,rgba(var(--aka-key-transfer-rgb),.12),rgba(var(--aka-key-transfer-rgb),.62));
box-shadow:0 0 6px rgba(var(--aka-key-transfer-rgb),.28);
transform:translateY(-50%);
pointer-events:none;
}
.aka-key-wallet-flyer .aka-key-flight-symbol,
.aka-key-wallet-receiver .aka-key-wallet-symbol {
display:block !important;
fill:none !important;
stroke:currentColor !important;
stroke-linecap:round !important;
stroke-linejoin:round !important;
opacity:1 !important;
}
.aka-key-wallet-flyer .aka-key-flight-symbol {
width:1.48rem !important;
height:1.48rem !important;
color:rgb(var(--aka-key-transfer-rgb)) !important;
stroke-width:2.25 !important;
filter:drop-shadow(0 0 2px rgba(var(--aka-key-transfer-rgb),.92)) drop-shadow(0 0 8px rgba(var(--aka-key-transfer-rgb),.44)) !important;
}
.aka-key-wallet-receiver .aka-key-wallet-symbol {
width:1.03rem !important;
height:1.03rem !important;
color:#b9f6d0 !important;
stroke-width:2.15 !important;
filter:drop-shadow(0 0 3px rgba(74,222,128,.72)) !important;
}
/* UNSEAL starts the original reel immediately, then softly reveals the poster.
Only the apertures rotate; the rim, material and light stay in place. */
#cinematicModal #modalContent .elm-archive-room
.aka-archive-file-card.is-unseal-priming .aka-archive-inspect-btn {
pointer-events:none !important;
opacity:.78 !important;
transform:translateY(1px) scale(.985) !important;
border-color:rgba(var(--room-gold),.58) !important;
box-shadow:inset 0 3px 7px rgba(0,0,0,.58),0 2px 6px rgba(0,0,0,.28) !important;
}
#cinematicModal #modalContent .elm-archive-room
.aka-archive-file-card.is-unseal-priming .aka-archive-film-reel {
transform:translateY(calc(0rem - var(--aka-sealed-reel-lift,.60rem))) scale(var(--aka-sealed-reel-scale,1.22)) translateZ(0) !important;
margin-bottom:0 !important;
filter:brightness(1.08) drop-shadow(0 2px 2px rgba(0,0,0,.8)) drop-shadow(0 0 8px rgba(var(--aka-reel-rgb),.32)) !important;
}
#cinematicModal #modalContent .elm-archive-room
.aka-archive-file-card.is-inspect-transitioning .elm-reel-sleeve {
display:block !important;
opacity:1;
transition:opacity var(--aka-unseal-composition-duration) var(--aka-unseal-composition-ease) !important;
will-change:opacity;
}
#cinematicModal #modalContent .elm-archive-room
.aka-archive-file-card.is-inspect-transitioning.is-inspect-revealing .elm-reel-sleeve {
opacity:0 !important;
}
#cinematicModal #modalContent .elm-archive-room
.aka-archive-file-card.is-inspect-transitioning .aka-archive-file-inner {
transition:
opacity var(--aka-unseal-composition-duration) var(--aka-unseal-composition-ease),
filter var(--aka-unseal-composition-duration) var(--aka-unseal-composition-ease) !important;
}
/* Archive-name scenes keep the website present like a dim auditorium behind
the titles. Muted colour and a focus-pull replace the old broad neon fog. */
.elm-archive-entry-cinematic {
background-color:rgba(2,4,7,.47) !important;
backdrop-filter:blur(1.15px) saturate(.78) brightness(.68);
-webkit-backdrop-filter:blur(1.15px) saturate(.78) brightness(.68);
}
.elm-archive-entry-vignette {
background:radial-gradient(ellipse at 50% 47%,transparent 25%,rgba(2,3,5,.11) 61%,rgba(2,3,5,.62) 100%),linear-gradient(180deg,rgba(0,0,0,.32),transparent 24%,transparent 76%,rgba(0,0,0,.42));
}
.elm-archive-entry-resonance {
background:radial-gradient(ellipse at 50% 51%,color-mix(in srgb,var(--elm-face) 13%,transparent),transparent 51%);
}
.elm-archive-entry-word,
.elm-archive-entry-word::before {
-webkit-text-stroke:.42px var(--elm-contour);
text-shadow:0 1px 0 var(--elm-inner),0 2px 0 rgba(0,0,0,.82),0 7px 14px rgba(0,0,0,.46);
}
@keyframes elmEntryArrival {
0% { opacity:0;transform:translateY(14px) scale(.94);filter:blur(9px); }
23% { opacity:.28;transform:translateY(9px) scale(.958);filter:blur(6px); }
52% { opacity:.82;transform:translateY(2px) scale(.99);filter:blur(2.2px); }
74% { opacity:1;transform:translateY(0) scale(1.012);filter:blur(0); }
88% { opacity:1;transform:translateY(0) scale(1.002);filter:blur(0); }
100% { opacity:1;transform:translateY(0) scale(1);filter:blur(0); }
}
/* V0.62 — Meme Throne finish pass: prevent last-row / ERO pin clipping. */
.aka-meme-throne-scroll{
box-sizing:border-box;
padding-bottom:.34rem;
scroll-padding-block:.18rem .34rem;
}
[data-elm-own]{
min-width:0;
margin-top:.28rem;
}
.aka-meme-aka-ascent{
box-sizing:border-box;
overflow:visible;
}
.aka-meme-throne-row.is-pinned{
overflow:visible;
margin-inline:1px;
}
@media(max-width:720px){
.aka-meme-throne-scroll{padding-bottom:.42rem;scroll-padding-bottom:.42rem}
[data-elm-own]{margin-top:.34rem}
.aka-meme-throne-row.is-pinned{min-height:3.64rem;padding-block:.34rem}
}
/* V0.43.64 — SHARED SOUNDTRACK REACTIVITY.
Fan Club, room identity and Wallet reuse the Hero analyser. No second RAF. */
#community .aka-meme-throne-row.is-pinned .aka-meme-portrait.is-aka{
transform:scale(var(--elm-audio-fanclub-scale,1));
transform-origin:center;
box-shadow:
0 0 var(--elm-audio-fanclub-blur,0px) rgba(83,171,222,.32),
0 0 calc(var(--elm-audio-fanclub-blur,0px) + 2px) rgba(212,168,67,.08);
will-change:transform,box-shadow;
}
#community .aka-meme-throne-row.is-pinned .aka-meme-aka-orbit{
opacity:var(--elm-audio-fanclub-orbit-opacity,.62);
filter:drop-shadow(0 0 var(--elm-audio-fanclub-blur,0px) rgba(114,199,238,.28));
will-change:opacity,filter;
}
/* Earned title seal breathes only while its panel is actually consuming the
soundtrack. The award animation still owns the stronger one-shot reveal. */
.aka-wallet-authenticity-seal:not(.is-title-seal-revealing){
transform:scale(var(--elm-audio-ring-scale,1));
transform-origin:center;
filter:
drop-shadow(0 0 2px var(--aka-wallet-seal-glow,rgba(151,132,101,.18)))
drop-shadow(0 0 var(--elm-audio-ring-blur,0px) var(--aka-wallet-seal-glow,rgba(151,132,101,.18)));
will-change:transform,filter;
}
.aka-mobile-identity-panel .aka-wallet-authenticity-seal:not(.is-title-seal-revealing){
transform:translateY(-50%) scale(var(--elm-audio-ring-scale,1));
}
@media(prefers-reduced-motion:reduce){
#community .aka-meme-throne-row.is-pinned .aka-meme-portrait.is-aka,
.aka-wallet-authenticity-seal:not(.is-title-seal-revealing){transform:none!important;filter:none!important}
.aka-mobile-identity-panel .aka-wallet-authenticity-seal:not(.is-title-seal-revealing){transform:translateY(-50%)!important}
#community .aka-meme-throne-row.is-pinned .aka-meme-aka-orbit{filter:none!important;opacity:.62!important}
}
/* v77.7 — RANK / POWER semantic color separation.
RANK = platinum/smoked ivory. POWER keeps its electric-blue language.
Rank motion never borrows POWER cyan; gold medal/crown metal stays gold. */
:root{
--elm-rank-platinum:210,206,196;
--elm-rank-platinum-bright:241,235,221;
--elm-rank-platinum-edge:139,135,126;
--elm-rank-platinum-glow:218,211,197;
}
.aka-wallet-rank-summary-value,
.aka-wallet-rank-summary-value.is-up,
.aka-wallet-rank-summary-value.is-down{
color:rgba(var(--elm-rank-platinum),.94)!important;
text-shadow:0 1px 0 rgba(0,0,0,.72),0 0 4px rgba(var(--elm-rank-platinum-glow),.08)!important;
}
.aka-wallet-rank-summary-mark{
color:rgba(var(--elm-rank-platinum),.62)!important;
filter:drop-shadow(0 0 3px rgba(var(--elm-rank-platinum-glow),.08))!important;
}
.aka-wallet-rank-summary.is-rank-advancing .aka-rank-inline-emblem{
border-color:rgba(var(--elm-rank-platinum-edge),.72)!important;
box-shadow:inset 1px 1px 0 rgba(255,255,255,.05),inset -1px -1px 0 rgba(0,0,0,.40),0 0 7px rgba(var(--elm-rank-platinum-glow),.17),0 0 14px rgba(var(--elm-rank-platinum-glow),.07),0 2px 4px rgba(0,0,0,.28)!important;
}
.aka-wallet-rank-summary.is-rank-top100{
box-shadow:inset 0 0 12px rgba(var(--elm-rank-platinum-glow),.026)!important;
}
@keyframes akaRankLabelCinematic{
0%,100%{color:rgba(var(--aka-rank-gold),.66);text-shadow:none}
34%{color:rgba(var(--elm-rank-platinum-bright),.96);text-shadow:0 0 5px rgba(var(--elm-rank-platinum-glow),.25),0 0 11px rgba(var(--elm-rank-platinum-glow),.08)}
64%{color:rgba(var(--elm-rank-platinum),.92);text-shadow:0 0 3px rgba(var(--elm-rank-platinum-glow),.12)}
}
@keyframes akaRankValueCinematic{
0%{transform:translateY(0) scale(1);filter:none}
30%{transform:translateY(-.02rem) scale(1.055);color:rgba(var(--elm-rank-platinum-bright),.98);text-shadow:0 0 6px rgba(var(--elm-rank-platinum-glow),.28)}
72%{transform:translateY(0) scale(1.015)}
100%{transform:translateY(0) scale(1);filter:none}
}
/* v77.65 R4: CORE owns its complete halo, including inside the fixed mobile drawer. */
.aka-wallet-rank-drawer .aka-power-core-panel {
grid-template-columns:4.2rem minmax(0,1fr);gap:.30rem;
padding:.28rem .42rem;overflow:hidden;
}
.aka-wallet-rank-drawer .aka-power-core,
.aka-wallet-signal-drawer.is-mobile .aka-power-core {
width:3rem;height:3rem;min-width:44px;min-height:44px;
filter:none;box-shadow:none;
}
.aka-wallet-rank-drawer .aka-power-core::before,
.aka-wallet-rank-drawer .aka-power-core.is-stage-3::before,
.aka-wallet-rank-drawer .aka-power-core.is-stage-4::before,
.aka-wallet-signal-drawer.is-mobile .aka-power-core.is-stage-3::before,
.aka-wallet-signal-drawer.is-mobile .aka-power-core.is-stage-4::before { inset:2px; }
.aka-wallet-rank-drawer .aka-power-core:is(:hover,:focus-visible):not(:disabled) {
filter:none;outline-offset:0;box-shadow:inset 0 0 9px rgba(108,195,230,.09);
}
.aka-wallet-rank-drawer .aka-power-core-panel::after {left:4.9rem;}
.aka-wallet-rank-drawer .aka-power-core-caption b{max-width:98%;font-size:.48rem;letter-spacing:-.035em;}
.aka-wallet-rank-drawer .aka-power-core-caption{gap:.05rem;}
.aka-wallet-rank-drawer .aka-power-core-node,.aka-wallet-rank-drawer .aka-power-core-diamond{opacity:.12;}
.aka-power-overview.is-empty-power .aka-power-core-arc{opacity:.6!important;}
.aka-wallet-rank-drawer .aka-power-core:disabled .aka-power-core-arc{opacity:.2!important;}
.aka-wallet-rank-drawer .aka-power-feed-note {font-size:.38rem;letter-spacing:.015em;white-space:normal;line-height:1.3;}
.aka-wallet-rank-drawer .aka-network-overview{grid-template-rows:2.1rem 1.85rem minmax(0,1fr) 1.3rem;gap:.18rem;}
.aka-wallet-rank-drawer .aka-network-bank{display:flex;align-items:center;justify-content:space-between;gap:.2rem;border-top:1px solid rgba(160,151,102,.16);font:500 .45rem/1.3 "Space Grotesk",sans-serif;color:#9ab8ba;letter-spacing:.025em;}
.aka-network-bank b{color:#e2dbbb;font-weight:600;}
.aka-network-bank button{padding:.25rem .3rem;color:#dfc58a;background:transparent;border:1px solid rgba(210,181,114,.24);border-radius:3px;font-size:.44rem;white-space:nowrap;cursor:pointer;}
.aka-network-bank button:focus-visible{outline:1px solid #9bd3e7;outline-offset:1px;}
.elm-world-list{max-height:540px;overflow:auto;overscroll-behavior:auto;scrollbar-width:thin;scrollbar-color:#6d5d3b #101217;}
.elm-world-list li{border-bottom:1px solid #dacda315;}
.elm-world-list li:nth-child(-n+3)>b{color:#ecd096;}
.elm-world-list li.is-self{background:linear-gradient(90deg,#33526d40,#142d3920);box-shadow:inset 2px 0 #80b5d0;}
.elm-world-list li small{display:block;margin-top:5px;font:500 .55rem/1.4 "Space Grotesk",sans-serif;letter-spacing:.07em;color:#a1aaa6;}
.elm-world-list li strong{text-align:right;}
.elm-world-list li>span{min-width:0;overflow-wrap:anywhere;}
.elm-world-empty,.elm-world-own{padding:22px 14px;color:#c7bfa7;font:.75rem/1.6 "Space Grotesk",sans-serif;}
.elm-world-view[data-sync=stale] h3::after{content:" · RECONNECTING";font:.58rem "Space Grotesk",sans-serif;color:#c5a776;}
.elm-team-action{appearance:none;border:1px solid #8d795846;border-radius:5px;background:#13191c;color:#dac397;padding:9px 14px;font:600 .6rem "Space Grotesk",sans-serif;letter-spacing:.09em;cursor:pointer;}
.elm-team-action:disabled{opacity:.35;cursor:default;}
.elm-team-sheet{padding:clamp(20px,5vw,44px);background:radial-gradient(ellipse at 15% 0,#17323877,transparent 65%),#090d10;border:1px solid #a48a5055;border-radius:10px;color:#eee3c9;}
.elm-team-sheet>small{color:#bfa979;letter-spacing:.2em;font:.6rem "Space Grotesk",sans-serif;}
.elm-team-sheet h2{margin:10px 0 12px;font:400 clamp(1.7rem,5vw,2.6rem) "Bebas Neue",sans-serif;letter-spacing:.13em;}
.elm-team-sheet p{color:#a9b8b4;font:.72rem/1.6 "Space Grotesk",sans-serif;}
.elm-team-sheet>strong{display:block;font:.64rem "Space Grotesk",sans-serif;color:#d1b777;letter-spacing:.1em;}
.elm-team-sheet nav{display:flex;justify-content:space-between;margin-top:16px;}
.elm-team-sheet .elm-world-list{max-height:45vh;padding:0;list-style:none;}
.elm-team-sheet .elm-world-list li{display:grid;grid-template-columns:2rem minmax(0,1fr) auto;align-items:center;gap:10px;padding:13px 8px;font:.74rem "Space Grotesk",sans-serif;}
.elm-team-sheet .elm-team-key-note{color:#b58c79;border-top:1px solid #ad805029;padding-top:14px;margin-bottom:0;}
@media(max-width:768px){
.aka-wallet-signal-drawer.is-mobile .aka-power-core-panel{grid-template-columns:3.5rem minmax(0,1fr);padding:.25rem .32rem;gap:.24rem;}
.aka-wallet-signal-drawer.is-mobile .aka-power-core-panel::after{left:4.1rem;}
.aka-wallet-signal-drawer.is-mobile .aka-power-core{width:2.8rem;height:2.8rem;}
.elm-world-list{max-height:460px;}
.elm-team-sheet .elm-world-list li{font-size:.65rem;gap:6px;}
}
.aka-wallet-rank-drawer .aka-power-command > span{padding:.17rem .45rem;}
.aka-wallet-rank-drawer .aka-power-command em{margin-top:.10rem;font-size:.43rem;}
.aka-wallet-rank-drawer .aka-power-chase.is-calibrating .aka-power-chase-fill,
.aka-wallet-rank-drawer .aka-power-chase.is-calibrating .aka-power-chase-node{opacity:0!important;animation:none!important;}
/* R4: preserve the full ORIGIN lock status and used count in compact wallets. */
.aka-wallet-signal-drawer .aka-wallet-drawer-inner.is-key > .aka-wallet-drawer-footer{grid-template-columns:4.70rem minmax(0,1fr) 3rem!important;}
.aka-wallet-signal-drawer .aka-wallet-drawer-inner.is-key .aka-wallet-drawer-footer-status{font-size:.55rem;letter-spacing:.035em;}