.ayloti-calculator-page.ayloti-calculator-hide-theme-title .entry-title,
.ayloti-calculator-page.ayloti-calculator-hide-theme-title .page-title,
.ayloti-calculator-page.ayloti-calculator-hide-theme-title .wp-block-post-title {
    display: none !important;
}

.ayloti-calculator-wrap {
    --ayloti-bg: #f3f5f9;
    --ayloti-card: #ffffff;
    --ayloti-panel: #f7f8fb;
    --ayloti-panel-strong: #e9edf5;
    --ayloti-text: #141722;
    --ayloti-muted: #6b7280;
    --ayloti-border: rgba(20, 23, 34, 0.11);
    --ayloti-grid: rgba(20, 23, 34, 0.09);
    --ayloti-accent-soft: rgba(108, 92, 231, 0.13);
    --ayloti-accent-medium: rgba(108, 92, 231, 0.24);
    --ayloti-accent-soft: color-mix(in srgb, var(--ayloti-accent) 13%, transparent);
    --ayloti-accent-medium: color-mix(in srgb, var(--ayloti-accent) 24%, transparent);
    --ayloti-danger: #d63031;
    --ayloti-success: #008f72;
    --ayloti-shadow: 0 28px 90px rgba(28, 33, 56, 0.15);
    width: 100%;
    margin: 32px auto;
    color: var(--ayloti-text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.45;
}

.ayloti-calculator-wrap.is-dark {
    --ayloti-bg: #080b12;
    --ayloti-card: #121722;
    --ayloti-panel: #0e131d;
    --ayloti-panel-strong: #1b2230;
    --ayloti-text: #f4f7fb;
    --ayloti-muted: #a3abba;
    --ayloti-border: rgba(255, 255, 255, 0.11);
    --ayloti-grid: rgba(255, 255, 255, 0.09);
    --ayloti-accent-soft: rgba(108, 92, 231, 0.22);
    --ayloti-accent-medium: rgba(108, 92, 231, 0.34);
    --ayloti-accent-soft: color-mix(in srgb, var(--ayloti-accent) 22%, transparent);
    --ayloti-accent-medium: color-mix(in srgb, var(--ayloti-accent) 34%, transparent);
    --ayloti-shadow: 0 30px 100px rgba(0, 0, 0, 0.48);
}

.ayloti-calculator-wrap *,
.ayloti-calculator-wrap *::before,
.ayloti-calculator-wrap *::after { box-sizing: border-box; }

.ayloti-calculator-wrap button,
.ayloti-calculator-wrap input,
.ayloti-calculator-wrap select,
.ayloti-calculator-wrap output { font: inherit; }

.ayloti-calculator-wrap button { -webkit-tap-highlight-color: transparent; }

.ayloti-calculator-wrap .screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.ayloti-calculator-shell {
    position: relative;
    max-width: 1320px;
    margin: 0 auto;
    padding: 26px;
    overflow: hidden;
    border: 1px solid var(--ayloti-border);
    border-radius: 32px;
    background:
        radial-gradient(circle at 96% 3%, var(--ayloti-accent-soft), transparent 31%),
        radial-gradient(circle at 2% 98%, color-mix(in srgb, var(--ayloti-accent) 8%, transparent), transparent 25%),
        var(--ayloti-bg);
    box-shadow: var(--ayloti-shadow);
}

.ayloti-calculator-wrap.is-fullscreen,
.ayloti-calculator-wrap.is-pseudo-fullscreen {
    margin: 0;
    padding: 18px;
    overflow: auto;
    background: var(--ayloti-bg);
}

.ayloti-calculator-wrap.is-fullscreen .ayloti-calculator-shell,
.ayloti-calculator-wrap.is-pseudo-fullscreen .ayloti-calculator-shell {
    max-width: 1500px;
    min-height: calc(100vh - 36px);
}

.ayloti-calculator-wrap.is-pseudo-fullscreen {
    position: fixed;
    inset: 0;
    z-index: 999999;
}

.ayloti-calculator-wrap.is-focus-mode .ayloti-calculator-header,
.ayloti-calculator-wrap.is-focus-mode .ayloti-workspace-tabs {
    display: none;
}

.ayloti-calculator-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.ayloti-heading-copy { max-width: 860px; }

.ayloti-calculator-kicker,
.ayloti-section-kicker {
    display: block;
    margin-bottom: 7px;
    color: var(--ayloti-accent);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.ayloti-calculator-header h1,
.ayloti-tool-heading h2 {
    margin: 0;
    color: var(--ayloti-text);
    font-size: clamp(28px, 4vw, 46px);
    font-weight: 880;
    letter-spacing: -.045em;
    line-height: 1.04;
}

.ayloti-calculator-header p,
.ayloti-tool-heading p {
    max-width: 780px;
    margin: 10px 0 0;
    color: var(--ayloti-muted);
    font-size: 14px;
}

.ayloti-header-actions {
    display: flex;
    gap: 8px;
    flex: 0 0 auto;
}

.ayloti-icon-btn {
    width: 45px;
    height: 45px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--ayloti-border);
    border-radius: 14px;
    background: var(--ayloti-card);
    color: var(--ayloti-text);
    font-size: 19px;
    cursor: pointer;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .04);
}

.ayloti-icon-btn[aria-pressed="true"] {
    background: var(--ayloti-accent);
    color: #fff;
}

.ayloti-workspace-tabs {
    display: inline-flex;
    max-width: 100%;
    gap: 6px;
    padding: 5px;
    margin-bottom: 19px;
    overflow-x: auto;
    border: 1px solid var(--ayloti-border);
    border-radius: 16px;
    background: var(--ayloti-card);
    scrollbar-width: none;
}

.ayloti-workspace-tabs::-webkit-scrollbar { display: none; }

.ayloti-workspace-tabs button {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 41px;
    padding: 8px 16px;
    white-space: nowrap;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: var(--ayloti-muted);
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}

.ayloti-workspace-tabs button.is-active {
    background: var(--ayloti-accent);
    color: #fff;
    box-shadow: 0 10px 24px var(--ayloti-accent-soft);
}

.ayloti-workspace[hidden] { display: none !important; }

.ayloti-calculator-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 18px;
}

.ayloti-calculator-grid.has-no-history { grid-template-columns: minmax(0, 1fr); }

.ayloti-calculator-main,
.ayloti-history-panel,
.ayloti-converter-card,
.ayloti-graph-card,
.ayloti-mini-tool {
    min-width: 0;
    border: 1px solid var(--ayloti-border);
    background: var(--ayloti-card);
}

.ayloti-calculator-main,
.ayloti-history-panel,
.ayloti-converter-card,
.ayloti-graph-card { border-radius: 24px; }

.ayloti-calculator-main { padding: 18px; }

.ayloti-calculator-statusbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}

.ayloti-angle-controls,
.ayloti-format-controls {
    display: flex;
    gap: 4px;
    padding: 3px;
    border: 1px solid var(--ayloti-border);
    border-radius: 10px;
    background: var(--ayloti-panel);
}

.ayloti-angle-controls button,
.ayloti-format-controls button {
    min-width: 46px;
    min-height: 30px;
    padding: 5px 8px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--ayloti-muted);
    font-size: 10px;
    font-weight: 900;
    cursor: pointer;
}

.ayloti-angle-controls button.is-active,
.ayloti-format-controls button.is-active {
    background: var(--ayloti-card);
    color: var(--ayloti-accent);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}

.ayloti-status-pills {
    display: flex;
    gap: 6px;
    margin-left: auto;
}

.ayloti-status-pills span {
    min-width: 30px;
    padding: 4px 8px;
    border-radius: 999px;
    background: var(--ayloti-accent-soft);
    color: var(--ayloti-accent);
    font-size: 10px;
    font-weight: 900;
    text-align: center;
}

.ayloti-display {
    min-height: 162px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 18px;
    padding: 20px;
    margin-bottom: 12px;
    overflow: hidden;
    border: 1px solid var(--ayloti-border);
    border-radius: 19px;
    background: linear-gradient(145deg, var(--ayloti-panel), var(--ayloti-card));
    text-align: right;
}

.ayloti-expression-input {
    width: 100%;
    min-height: 42px;
    padding: 0;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--ayloti-muted);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 18px;
    text-align: right;
}

.ayloti-expression-input::placeholder { color: color-mix(in srgb, var(--ayloti-muted) 70%, transparent); }

.ayloti-result-label {
    display: block;
    margin-bottom: 2px;
    color: var(--ayloti-muted);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.ayloti-result {
    display: block;
    min-height: 53px;
    overflow-wrap: anywhere;
    color: var(--ayloti-text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: clamp(35px, 5.7vw, 58px);
    font-weight: 880;
    letter-spacing: -.055em;
    line-height: 1.02;
}

.ayloti-calculator-wrap.has-error .ayloti-result {
    color: var(--ayloti-danger);
    font-size: clamp(19px, 3vw, 29px);
    letter-spacing: -.02em;
}

.ayloti-toolbar {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 7px;
    margin-bottom: 9px;
}

.ayloti-toolbar button,
.ayloti-calculator-footer button,
.ayloti-history-heading button,
.ayloti-history-footer button,
.ayloti-converter-summary button,
.ayloti-graph-actions button,
.ayloti-mini-tool > button {
    min-height: 36px;
    padding: 7px 9px;
    border: 1px solid var(--ayloti-border);
    border-radius: 10px;
    background: var(--ayloti-panel);
    color: var(--ayloti-text);
    font-size: 11px;
    font-weight: 820;
    cursor: pointer;
}

.ayloti-keypad {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
}

.ayloti-keypad button {
    min-width: 0;
    min-height: 54px;
    padding: 7px 4px;
    border: 1px solid var(--ayloti-border);
    border-radius: 13px;
    background: var(--ayloti-panel);
    color: var(--ayloti-text);
    font-size: 16px;
    font-weight: 790;
    cursor: pointer;
    transition: transform .12s ease, border-color .12s ease, background .12s ease, box-shadow .12s ease;
    touch-action: manipulation;
}

.ayloti-keypad button:hover,
.ayloti-toolbar button:hover,
.ayloti-icon-btn:hover,
.ayloti-calculator-footer button:hover,
.ayloti-history-heading button:hover,
.ayloti-history-footer button:hover,
.ayloti-converter-summary button:hover,
.ayloti-graph-actions button:hover,
.ayloti-mini-tool > button:hover { border-color: var(--ayloti-accent); }

.ayloti-keypad button:active { transform: scale(.965); }
.ayloti-keypad button.fn { color: var(--ayloti-accent); }

.ayloti-keypad button.utility,
.ayloti-keypad button.operator {
    background: var(--ayloti-accent-soft);
    color: var(--ayloti-accent);
}

.ayloti-keypad button.utility.is-active {
    background: var(--ayloti-accent);
    color: #fff;
}

.ayloti-keypad button.operator { font-size: 21px; }

.ayloti-keypad button.equals {
    border-color: var(--ayloti-accent);
    background: var(--ayloti-accent);
    color: #fff;
    font-size: 23px;
    box-shadow: 0 10px 24px var(--ayloti-accent-soft);
}

.ayloti-calculator-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 11px;
    color: var(--ayloti-muted);
    font-size: 11px;
}

.ayloti-history-panel {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 17px;
}

.ayloti-history-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 11px;
}

.ayloti-history-heading h2 {
    margin: 0;
    color: var(--ayloti-text);
    font-size: 19px;
    font-weight: 850;
}

.ayloti-history-heading span {
    color: var(--ayloti-muted);
    font-size: 11px;
}

.ayloti-history-search input {
    width: 100%;
    min-height: 40px;
    padding: 9px 11px;
    border: 1px solid var(--ayloti-border);
    border-radius: 11px;
    outline: 0;
    background: var(--ayloti-panel);
    color: var(--ayloti-text);
    font-size: 12px;
}

.ayloti-history-search input:focus,
.ayloti-expression-input:focus,
.ayloti-calculator-wrap input:focus,
.ayloti-calculator-wrap select:focus {
    border-color: var(--ayloti-accent);
    box-shadow: 0 0 0 3px var(--ayloti-accent-soft);
}

.ayloti-expression-input:focus { box-shadow: none; }

.ayloti-history-list {
    flex: 1;
    min-height: 120px;
    max-height: 570px;
    margin-top: 10px;
    overflow-y: auto;
    scrollbar-width: thin;
}

.ayloti-empty-history {
    margin: 30px 8px;
    color: var(--ayloti-muted);
    font-size: 12px;
    text-align: center;
}

.ayloti-history-item {
    position: relative;
    padding: 11px;
    margin-bottom: 8px;
    border: 1px solid var(--ayloti-border);
    border-radius: 12px;
    background: var(--ayloti-panel);
}

.ayloti-history-item.is-pinned {
    border-color: var(--ayloti-accent);
    background: var(--ayloti-accent-soft);
}

.ayloti-history-expression {
    width: 100%;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: transparent;
    color: var(--ayloti-muted);
    font-family: ui-monospace, monospace;
    font-size: 12px;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
}

.ayloti-history-item strong {
    display: block;
    margin-top: 4px;
    overflow-wrap: anywhere;
    color: var(--ayloti-text);
    font-family: ui-monospace, monospace;
    font-size: 17px;
}

.ayloti-history-item > span {
    display: block;
    margin-top: 5px;
    color: var(--ayloti-muted);
    font-size: 9px;
}

.ayloti-history-actions {
    display: flex;
    gap: 5px;
    margin-top: 8px;
}

.ayloti-history-actions button {
    min-height: 26px;
    padding: 4px 7px;
    border: 1px solid var(--ayloti-border);
    border-radius: 7px;
    background: var(--ayloti-card);
    color: var(--ayloti-muted);
    font-size: 9px;
    font-weight: 800;
    cursor: pointer;
}

.ayloti-history-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-top: 11px;
    margin-top: 8px;
    border-top: 1px solid var(--ayloti-border);
}

.ayloti-history-footer span {
    color: var(--ayloti-muted);
    font-size: 9px;
    text-align: right;
}

.ayloti-tool-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 20px;
}

.ayloti-tool-heading h2 { font-size: clamp(25px, 3.4vw, 38px); }

.ayloti-converter-card,
.ayloti-graph-card { padding: 24px; }

.ayloti-category-select {
    min-width: 240px;
}

.ayloti-category-select span,
.ayloti-converter-field > span,
.ayloti-range-grid span,
.ayloti-stacked-field > span,
.ayloti-two-field-row label > span,
.ayloti-coefficient-row label > span {
    display: block;
    margin-bottom: 6px;
    color: var(--ayloti-muted);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ayloti-category-select select,
.ayloti-converter-field input,
.ayloti-converter-field select,
.ayloti-range-grid input,
.ayloti-function-row input[type="text"],
.ayloti-mini-tool input,
.ayloti-mini-tool select {
    width: 100%;
    min-height: 45px;
    padding: 10px 12px;
    border: 1px solid var(--ayloti-border);
    border-radius: 12px;
    outline: 0;
    background: var(--ayloti-panel);
    color: var(--ayloti-text);
}

.ayloti-converter-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 18px;
}

.ayloti-converter-field {
    display: block;
    padding: 18px;
    border: 1px solid var(--ayloti-border);
    border-radius: 18px;
    background: var(--ayloti-panel);
}

.ayloti-converter-field input,
.ayloti-converter-field output {
    display: block;
    width: 100%;
    min-height: 78px;
    padding: 9px 0 15px;
    overflow-wrap: anywhere;
    border: 0;
    background: transparent;
    color: var(--ayloti-text);
    font-family: ui-monospace, monospace;
    font-size: clamp(31px, 5vw, 50px);
    font-weight: 850;
    line-height: 1;
}

.ayloti-converter-field input:focus { box-shadow: none; }

.ayloti-swap-btn {
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--ayloti-accent);
    border-radius: 50%;
    background: var(--ayloti-accent);
    color: #fff;
    font-size: 22px;
    cursor: pointer;
    box-shadow: 0 10px 24px var(--ayloti-accent-soft);
}

.ayloti-converter-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px;
    margin-top: 16px;
    border-radius: 13px;
    background: var(--ayloti-accent-soft);
    color: var(--ayloti-text);
    font-size: 13px;
}

.ayloti-graph-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 7px;
}

.ayloti-graph-actions button:first-child {
    border-color: var(--ayloti-accent);
    background: var(--ayloti-accent);
    color: #fff;
}

.ayloti-graph-layout {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 18px;
}

.ayloti-graph-controls {
    padding: 17px;
    border: 1px solid var(--ayloti-border);
    border-radius: 18px;
    background: var(--ayloti-panel);
}

.ayloti-function-list {
    display: grid;
    gap: 9px;
}

.ayloti-function-row {
    display: grid;
    grid-template-columns: auto 42px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding: 8px;
    border: 1px solid var(--ayloti-border);
    border-radius: 12px;
    background: var(--ayloti-card);
}

.ayloti-function-row input[type="checkbox"] {
    width: 17px;
    height: 17px;
    accent-color: var(--plot-colour, var(--ayloti-accent));
}

.ayloti-function-row span {
    color: var(--plot-colour, var(--ayloti-accent));
    font-size: 12px;
    font-weight: 900;
}

.ayloti-function-row input[type="text"] {
    min-height: 39px;
    padding: 8px 9px;
    font-family: ui-monospace, monospace;
    font-size: 12px;
}

.ayloti-function-row.plot-one { --plot-colour: var(--ayloti-accent); }
.ayloti-function-row.plot-two { --plot-colour: #00a884; }
.ayloti-function-row.plot-three { --plot-colour: #e17055; }

.ayloti-range-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 14px;
}

.ayloti-range-grid input {
    min-height: 40px;
    padding: 8px 9px;
}

.ayloti-graph-help {
    margin: 14px 0 0;
    color: var(--ayloti-muted);
    font-size: 11px;
}

.ayloti-graph-help code {
    padding: 2px 4px;
    border-radius: 5px;
    background: var(--ayloti-card);
    color: var(--ayloti-text);
}

.ayloti-canvas-wrap {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--ayloti-border);
    border-radius: 18px;
    background: var(--ayloti-card);
}

.ayloti-canvas-wrap canvas {
    display: block;
    max-width: 100%;
    cursor: crosshair;
}

.ayloti-graph-trace {
    min-height: 38px;
    padding: 10px 13px;
    border-top: 1px solid var(--ayloti-border);
    color: var(--ayloti-muted);
    font-family: ui-monospace, monospace;
    font-size: 11px;
}

.ayloti-quick-tools-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.ayloti-mini-tool {
    padding: 20px;
    border-radius: 20px;
}

.ayloti-mini-tool h3 {
    margin: 0;
    color: var(--ayloti-text);
    font-size: 20px;
    font-weight: 850;
    letter-spacing: -.02em;
}

.ayloti-mini-tool > p {
    margin: 5px 0 15px;
    color: var(--ayloti-muted);
    font-size: 12px;
}

.ayloti-mini-tool > button {
    width: 100%;
    min-height: 43px;
    margin-top: 13px;
    border-color: var(--ayloti-accent);
    background: var(--ayloti-accent);
    color: #fff;
}

.ayloti-coefficient-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.ayloti-two-field-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 11px;
}

.ayloti-stacked-field { display: block; }

.ayloti-fraction-input {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.ayloti-fraction-input span {
    color: var(--ayloti-muted);
    font-size: 24px;
}

.ayloti-tool-output {
    display: block;
    min-height: 67px;
    padding: 14px;
    margin-top: 13px;
    overflow-wrap: anywhere;
    border: 1px solid var(--ayloti-border);
    border-radius: 13px;
    background: var(--ayloti-panel);
    color: var(--ayloti-text);
    font-family: ui-monospace, monospace;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.55;
}

.ayloti-toast {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 1000001;
    max-width: min(340px, calc(100vw - 44px));
    padding: 12px 15px;
    border: 1px solid var(--ayloti-border);
    border-radius: 12px;
    background: var(--ayloti-text);
    color: var(--ayloti-card);
    font-size: 12px;
    font-weight: 780;
    box-shadow: 0 18px 50px rgba(0, 0, 0, .24);
}

.ayloti-toast.is-error { background: var(--ayloti-danger); color: #fff; }

@media (max-width: 1050px) {
    .ayloti-calculator-grid { grid-template-columns: minmax(0, 1fr); }
    .ayloti-history-panel { max-height: none; }
    .ayloti-history-list { max-height: 330px; }
    .ayloti-graph-layout { grid-template-columns: minmax(0, 1fr); }
    .ayloti-graph-controls { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 14px; }
    .ayloti-range-grid { margin-top: 0; }
    .ayloti-graph-help { grid-column: 1 / -1; margin-top: 0; }
}

@media (max-width: 760px) {
    .ayloti-calculator-wrap { margin: 14px auto; }
    .ayloti-calculator-shell { padding: 16px; border-radius: 23px; }
    .ayloti-calculator-header { align-items: center; }
    .ayloti-header-actions { gap: 5px; }
    .ayloti-icon-btn { width: 39px; height: 39px; border-radius: 11px; }
    .ayloti-calculator-header h1 { font-size: 30px; }
    .ayloti-calculator-header p { font-size: 12px; }
    .ayloti-workspace-tabs { display: flex; width: 100%; }
    .ayloti-workspace-tabs button { flex: 1 0 auto; justify-content: center; padding-inline: 12px; }
    .ayloti-calculator-statusbar { flex-wrap: wrap; }
    .ayloti-status-pills { order: 3; width: 100%; justify-content: flex-end; }
    .ayloti-toolbar { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .ayloti-keypad { gap: 6px; }
    .ayloti-keypad button { min-height: 50px; border-radius: 11px; font-size: 14px; }
    .ayloti-calculator-footer { align-items: flex-start; flex-direction: column; }
    .ayloti-calculator-footer button { width: 100%; }
    .ayloti-tool-heading { flex-direction: column; }
    .ayloti-category-select { width: 100%; min-width: 0; }
    .ayloti-converter-grid { grid-template-columns: minmax(0, 1fr); }
    .ayloti-swap-btn { margin: -7px auto; transform: rotate(90deg); }
    .ayloti-converter-summary { align-items: flex-start; flex-direction: column; }
    .ayloti-converter-summary button { width: 100%; }
    .ayloti-graph-actions { width: 100%; justify-content: stretch; }
    .ayloti-graph-actions button { flex: 1; }
    .ayloti-graph-controls { display: block; }
    .ayloti-range-grid { margin-top: 14px; }
    .ayloti-graph-help { margin-top: 14px; }
    .ayloti-quick-tools-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 520px) {
    .ayloti-calculator-shell { padding: 11px; border-radius: 19px; }
    .ayloti-calculator-header { gap: 10px; margin: 7px 3px 16px; }
    .ayloti-calculator-kicker { font-size: 9px; }
    .ayloti-calculator-header h1 { font-size: 25px; }
    .ayloti-calculator-header p { display: none; }
    .ayloti-header-actions .ayloti-icon-btn:first-child { display: none; }
    .ayloti-workspace-tabs { margin-bottom: 12px; border-radius: 13px; }
    .ayloti-workspace-tabs button { min-height: 38px; font-size: 11px; }
    .ayloti-workspace-tabs button span { display: none; }
    .ayloti-calculator-main,
    .ayloti-history-panel,
    .ayloti-converter-card,
    .ayloti-graph-card { border-radius: 18px; }
    .ayloti-calculator-main { padding: 11px; }
    .ayloti-display { min-height: 138px; padding: 15px; }
    .ayloti-expression-input { font-size: 14px; }
    .ayloti-result { font-size: 36px; }
    .ayloti-angle-controls button,
    .ayloti-format-controls button { min-width: 39px; padding-inline: 5px; }
    .ayloti-toolbar { gap: 5px; }
    .ayloti-toolbar button { padding-inline: 4px; font-size: 9px; }
    .ayloti-keypad { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; }
    .ayloti-keypad button { min-height: 45px; padding-inline: 1px; border-radius: 9px; font-size: 12px; }
    .ayloti-keypad button.operator { font-size: 17px; }
    .ayloti-keypad button.equals { font-size: 19px; }
    .ayloti-calculator-footer span { font-size: 9px; }
    .ayloti-converter-card,
    .ayloti-graph-card { padding: 15px; }
    .ayloti-converter-field { padding: 14px; }
    .ayloti-converter-field input,
    .ayloti-converter-field output { min-height: 62px; font-size: 34px; }
    .ayloti-function-row { grid-template-columns: auto 35px minmax(0, 1fr); }
    .ayloti-graph-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .ayloti-graph-actions button:first-child { grid-column: 1 / -1; }
    .ayloti-coefficient-row { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; }
    .ayloti-mini-tool { padding: 16px; }
}

@media (prefers-reduced-motion: reduce) {
    .ayloti-calculator-wrap *,
    .ayloti-calculator-wrap *::before,
    .ayloti-calculator-wrap *::after {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
    }
}

/* Version 4 learning labs */
.ayloti-calculator-wrap textarea { font: inherit; }

.ayloti-precision-control {
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--ayloti-muted);
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.ayloti-precision-control select {
    min-height: 32px;
    padding: 4px 26px 4px 9px;
    border: 1px solid var(--ayloti-border);
    border-radius: 9px;
    background: var(--ayloti-panel);
    color: var(--ayloti-text);
    font-size: 11px;
    font-weight: 800;
}

.ayloti-status-pills button[data-action="exam-mode"] {
    min-height: 30px;
    padding: 4px 9px;
    border: 1px solid var(--ayloti-border);
    border-radius: 999px;
    background: var(--ayloti-panel);
    color: var(--ayloti-muted);
    font-size: 10px;
    font-weight: 850;
    cursor: pointer;
}

.ayloti-status-pills button[data-action="exam-mode"].is-active {
    border-color: var(--ayloti-accent);
    background: var(--ayloti-accent);
    color: #fff;
}

.ayloti-calculator-wrap.is-exam-mode .ayloti-display {
    box-shadow: inset 0 0 0 1px var(--ayloti-accent-medium);
}

.ayloti-function-library {
    margin-top: 11px;
    border: 1px solid var(--ayloti-border);
    border-radius: 14px;
    background: var(--ayloti-panel);
}

.ayloti-function-library summary {
    padding: 11px 13px;
    color: var(--ayloti-muted);
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
    user-select: none;
}

.ayloti-function-chip-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 6px;
    padding: 0 10px 10px;
}

.ayloti-function-chip-grid button {
    min-height: 34px;
    padding: 5px 6px;
    border: 1px solid var(--ayloti-border);
    border-radius: 9px;
    background: var(--ayloti-card);
    color: var(--ayloti-text);
    font-size: 10px;
    font-weight: 800;
    cursor: pointer;
}

.ayloti-function-chip-grid button:hover { border-color: var(--ayloti-accent); color: var(--ayloti-accent); }

.ayloti-lab-card {
    min-width: 0;
    padding: 22px;
    border: 1px solid var(--ayloti-border);
    border-radius: 24px;
    background: var(--ayloti-card);
}

.ayloti-lab-grid { align-items: stretch; }

.ayloti-stat-layout {
    display: grid;
    grid-template-columns: minmax(270px, .72fr) minmax(0, 1.55fr);
    gap: 18px;
    margin-top: 20px;
}

.ayloti-data-entry-panel {
    padding: 17px;
    border: 1px solid var(--ayloti-border);
    border-radius: 18px;
    background: var(--ayloti-panel);
}

.ayloti-data-entry-panel textarea {
    width: 100%;
    min-height: 190px;
    resize: vertical;
    padding: 13px;
    border: 1px solid var(--ayloti-border);
    border-radius: 12px;
    background: var(--ayloti-card);
    color: var(--ayloti-text);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 13px;
    line-height: 1.65;
}

.ayloti-input-help {
    margin: 12px 0 0;
    color: var(--ayloti-muted);
    font-size: 11px;
}

.ayloti-stat-results { min-width: 0; }

.ayloti-metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.ayloti-metric-card {
    min-width: 0;
    padding: 11px;
    border: 1px solid var(--ayloti-border);
    border-radius: 12px;
    background: var(--ayloti-panel);
}

.ayloti-metric-card span {
    display: block;
    margin-bottom: 4px;
    color: var(--ayloti-muted);
    font-size: 9px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .07em;
}

.ayloti-metric-card strong {
    display: block;
    overflow-wrap: anywhere;
    color: var(--ayloti-text);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 14px;
}

.ayloti-stat-canvas-wrap { margin-top: 12px; }

.ayloti-equation-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 5px;
    margin-top: 12px;
}

.ayloti-equation-grid span {
    color: var(--ayloti-muted);
    font-size: 11px;
    font-weight: 800;
}

.ayloti-matrix-area {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;
    margin: 13px 0;
}

.ayloti-matrix-area > div > span {
    display: block;
    margin-bottom: 5px;
    color: var(--ayloti-muted);
    font-size: 11px;
    font-weight: 850;
}

.ayloti-matrix-inputs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
    padding: 7px;
    border-left: 2px solid var(--ayloti-text);
    border-right: 2px solid var(--ayloti-text);
    border-radius: 5px;
}

.ayloti-solid-inputs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-top: 11px;
}

.ayloti-solid-inputs label,
.ayloti-coordinate-grid label {
    min-width: 0;
}

.ayloti-solid-inputs span,
.ayloti-coordinate-grid span {
    display: block;
    margin-bottom: 5px;
    color: var(--ayloti-muted);
    font-size: 10px;
    font-weight: 800;
}

.ayloti-coordinate-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    margin-top: 11px;
}

@media (max-width: 1050px) {
    .ayloti-stat-layout { grid-template-columns: minmax(0, 1fr); }
    .ayloti-metric-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .ayloti-lab-card { padding: 16px; border-radius: 18px; }
    .ayloti-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ayloti-function-chip-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .ayloti-precision-control { order: 3; }
    .ayloti-coordinate-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 520px) {
    .ayloti-function-chip-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ayloti-lab-card { padding: 12px; }
    .ayloti-data-entry-panel { padding: 12px; }
    .ayloti-metric-grid { gap: 6px; }
    .ayloti-metric-card { padding: 9px; }
    .ayloti-equation-grid { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); gap: 3px; }
    .ayloti-matrix-area { gap: 8px; }
    .ayloti-solid-inputs { grid-template-columns: minmax(0, 1fr); }
    .ayloti-status-pills button[data-action="exam-mode"] { font-size: 9px; padding-inline: 7px; }
}

/* Version 5: command centre, accessibility, advanced labs and richer graphing */
.ayloti-command-bar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: -7px 0 19px;
}

.ayloti-tool-search-wrap {
    position: relative;
    flex: 1 1 420px;
    max-width: 620px;
}

.ayloti-tool-search-wrap input,
.ayloti-formula-toolbar input,
.ayloti-formula-toolbar select,
.ayloti-graph-table-controls input {
    width: 100%;
    min-height: 43px;
    border: 1px solid var(--ayloti-border);
    border-radius: 13px;
    background: var(--ayloti-card);
    color: var(--ayloti-text);
    padding: 10px 13px;
    outline: none;
}

.ayloti-tool-search-wrap input:focus,
.ayloti-formula-toolbar input:focus,
.ayloti-formula-toolbar select:focus,
.ayloti-graph-table-controls input:focus {
    border-color: var(--ayloti-accent);
    box-shadow: 0 0 0 3px var(--ayloti-accent-soft);
}

.ayloti-tool-search-results {
    position: absolute;
    z-index: 80;
    top: calc(100% + 7px);
    left: 0;
    right: 0;
    max-height: 370px;
    padding: 7px;
    overflow: auto;
    border: 1px solid var(--ayloti-border);
    border-radius: 16px;
    background: var(--ayloti-card);
    box-shadow: 0 20px 55px rgba(0,0,0,.18);
}

.ayloti-tool-search-results button {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 12px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--ayloti-text);
    text-align: left;
    cursor: pointer;
}

.ayloti-tool-search-results button:hover,
.ayloti-tool-search-results button:focus-visible { background: var(--ayloti-accent-soft); }
.ayloti-tool-search-results button span { color: var(--ayloti-muted); font-size: 11px; text-transform: capitalize; }
.ayloti-tool-search-results p { margin: 8px; color: var(--ayloti-muted); }

.ayloti-command-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.ayloti-command-actions button,
.ayloti-import-label {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    border: 1px solid var(--ayloti-border);
    border-radius: 11px;
    background: var(--ayloti-card);
    color: var(--ayloti-text);
    font-size: 11px;
    font-weight: 800;
    cursor: pointer;
}
.ayloti-command-actions button[aria-pressed="true"] { background: var(--ayloti-accent); border-color: var(--ayloti-accent); color: #fff; }

.ayloti-working-panel {
    margin: 10px 0 14px;
    padding: 14px 16px;
    border: 1px solid var(--ayloti-accent-medium);
    border-radius: 15px;
    background: var(--ayloti-accent-soft);
    color: var(--ayloti-text);
}
.ayloti-working-title { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.ayloti-working-title button { border: 0; background: transparent; color: var(--ayloti-accent); font-weight: 850; cursor: pointer; }
.ayloti-working-panel ol { margin: 10px 0 0 20px; padding: 0; }
.ayloti-working-panel li + li { margin-top: 6px; }

.ayloti-function-row.plot-four { --plot-colour: #0984e3; }
.ayloti-function-row.plot-five { --plot-colour: #d63031; }

.ayloti-graph-analysis {
    margin-top: 11px;
    padding: 11px 12px;
    border: 1px solid var(--ayloti-border);
    border-radius: 12px;
    background: var(--ayloti-panel);
    color: var(--ayloti-muted);
    font-size: 11px;
    line-height: 1.55;
}

.ayloti-canvas-wrap canvas { touch-action: none; }
.ayloti-canvas-wrap canvas.is-panning { cursor: grabbing; }
.ayloti-canvas-wrap canvas:not(.is-panning) { cursor: crosshair; }

.ayloti-graph-table-controls {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    gap: 8px;
    align-items: end;
    margin-top: 13px;
}
.ayloti-graph-table-controls label span { display: block; margin-bottom: 4px; color: var(--ayloti-muted); font-size: 10px; font-weight: 800; }
.ayloti-graph-table-controls button {
    min-height: 43px;
    padding: 9px 13px;
    border: 0;
    border-radius: 12px;
    background: var(--ayloti-accent);
    color: #fff;
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
}

.ayloti-value-table-wrap {
    max-width: 100%;
    margin-top: 12px;
    overflow: auto;
    border-radius: 13px;
}
.ayloti-value-table-wrap:empty { display: none; }
.ayloti-value-table-wrap table { width: 100%; border-collapse: collapse; min-width: 440px; background: var(--ayloti-card); }
.ayloti-value-table-wrap th,
.ayloti-value-table-wrap td { padding: 8px 10px; border: 1px solid var(--ayloti-border); text-align: right; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; white-space: nowrap; }
.ayloti-value-table-wrap th { background: var(--ayloti-panel-strong); color: var(--ayloti-text); font-family: inherit; font-weight: 850; }

.ayloti-vector-grid { display: grid; gap: 9px; margin: 12px 0; }
.ayloti-vector-grid > div { display: grid; grid-template-columns: 24px repeat(3, minmax(0,1fr)); gap: 7px; align-items: center; }
.ayloti-vector-grid strong { color: var(--ayloti-accent); font-size: 14px; }

.ayloti-formula-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 210px;
    gap: 10px;
    margin: 18px 0;
}
.ayloti-formula-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 13px; }
.ayloti-formula-card {
    min-width: 0;
    padding: 16px;
    border: 1px solid var(--ayloti-border);
    border-radius: 16px;
    background: var(--ayloti-card);
    box-shadow: 0 8px 24px rgba(0,0,0,.035);
}
.ayloti-formula-card > div { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; }
.ayloti-formula-card > div span { padding: 4px 8px; border-radius: 999px; background: var(--ayloti-accent-soft); color: var(--ayloti-accent); font-size: 9px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.ayloti-formula-card h3 { margin: 0; color: var(--ayloti-text); font-size: 16px; }
.ayloti-formula-expression { display: block; margin: 14px 0 10px; overflow-wrap: anywhere; color: var(--ayloti-text); font-family: Georgia, "Times New Roman", serif; font-size: 18px; line-height: 1.35; }
.ayloti-formula-card p { min-height: 34px; margin: 0 0 13px; color: var(--ayloti-muted); font-size: 11px; }
.ayloti-formula-card button { min-height: 37px; padding: 7px 11px; border: 1px solid var(--ayloti-accent-medium); border-radius: 10px; background: var(--ayloti-accent-soft); color: var(--ayloti-accent); font-size: 10px; font-weight: 850; cursor: pointer; }
.ayloti-formula-empty { grid-column: 1 / -1; padding: 30px; border: 1px dashed var(--ayloti-border); border-radius: 16px; color: var(--ayloti-muted); text-align: center; }

.ayloti-calculator-wrap.is-large-text { font-size: 112%; }
.ayloti-calculator-wrap.is-large-text .ayloti-mini-tool p,
.ayloti-calculator-wrap.is-large-text .ayloti-tool-output,
.ayloti-calculator-wrap.is-large-text .ayloti-input-help { font-size: 12px; }

.ayloti-calculator-wrap.is-high-contrast {
    --ayloti-bg: #fff;
    --ayloti-card: #fff;
    --ayloti-panel: #f4f4f4;
    --ayloti-panel-strong: #e7e7e7;
    --ayloti-text: #000;
    --ayloti-muted: #272727;
    --ayloti-border: rgba(0,0,0,.48);
    --ayloti-grid: rgba(0,0,0,.25);
}
.ayloti-calculator-wrap.is-dark.is-high-contrast {
    --ayloti-bg: #000;
    --ayloti-card: #000;
    --ayloti-panel: #111;
    --ayloti-panel-strong: #1e1e1e;
    --ayloti-text: #fff;
    --ayloti-muted: #e4e4e4;
    --ayloti-border: rgba(255,255,255,.62);
    --ayloti-grid: rgba(255,255,255,.28);
}
.ayloti-calculator-wrap.is-high-contrast button:focus-visible,
.ayloti-calculator-wrap.is-high-contrast input:focus-visible,
.ayloti-calculator-wrap.is-high-contrast select:focus-visible,
.ayloti-calculator-wrap.is-high-contrast textarea:focus-visible { outline: 3px solid var(--ayloti-accent); outline-offset: 2px; }

.ayloti-calculator-wrap.is-focus-mode .ayloti-command-bar { display: none; }

@media (max-width: 1050px) {
    .ayloti-command-bar { align-items: stretch; flex-direction: column; }
    .ayloti-tool-search-wrap { max-width: none; flex-basis: auto; }
    .ayloti-command-actions { justify-content: flex-start; }
    .ayloti-formula-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 760px) {
    .ayloti-command-actions { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); }
    .ayloti-command-actions button,
    .ayloti-import-label { width: 100%; }
    .ayloti-graph-table-controls { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .ayloti-graph-table-controls button { grid-column: 1 / -1; }
    .ayloti-formula-toolbar { grid-template-columns: minmax(0,1fr); }
    .ayloti-formula-grid { grid-template-columns: minmax(0,1fr); }
}

@media (max-width: 520px) {
    .ayloti-command-bar { margin-top: -3px; }
    .ayloti-command-actions { grid-template-columns: minmax(0,1fr); }
    .ayloti-graph-table-controls { grid-template-columns: minmax(0,1fr); }
    .ayloti-graph-table-controls button { grid-column: auto; }
    .ayloti-vector-grid > div { grid-template-columns: 20px repeat(3, minmax(0,1fr)); gap: 4px; }
}


/* Version 6: softer premium visual redesign */
.ayloti-calculator-wrap {
    --ayloti-bg: #f7f7fc;
    --ayloti-card: #ffffff;
    --ayloti-panel: #fbfbfe;
    --ayloti-panel-strong: #eef1f8;
    --ayloti-text: #1a2033;
    --ayloti-muted: #6f7890;
    --ayloti-border: rgba(44, 56, 92, 0.10);
    --ayloti-grid: rgba(44, 56, 92, 0.08);
    --ayloti-danger: #d65b6a;
    --ayloti-success: #2b9c87;
    --ayloti-shadow: 0 30px 100px rgba(76, 87, 125, 0.14);
}
.ayloti-calculator-wrap.is-dark {
    --ayloti-bg: #0f1420;
    --ayloti-card: #171f2e;
    --ayloti-panel: #121927;
    --ayloti-panel-strong: #212b3f;
    --ayloti-text: #eef2ff;
    --ayloti-muted: #a9b2c8;
    --ayloti-border: rgba(255, 255, 255, 0.09);
    --ayloti-grid: rgba(255, 255, 255, 0.08);
    --ayloti-shadow: 0 30px 100px rgba(0, 0, 0, 0.46);
}
.ayloti-calculator-shell {
    padding: 30px;
    border-radius: 38px;
    border-color: color-mix(in srgb, var(--ayloti-accent) 10%, var(--ayloti-border));
    background:
        radial-gradient(circle at 8% 0%, rgba(255,255,255,.92), transparent 34%),
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--ayloti-accent) 16%, transparent), transparent 24%),
        radial-gradient(circle at 0% 100%, color-mix(in srgb, var(--ayloti-accent) 10%, transparent), transparent 24%),
        linear-gradient(180deg, rgba(255,255,255,.70), rgba(255,255,255,.26)),
        var(--ayloti-bg);
    box-shadow: var(--ayloti-shadow), inset 0 1px 0 rgba(255,255,255,.62);
}
.ayloti-calculator-header { margin-bottom: 24px; }
.ayloti-calculator-header h1,
.ayloti-tool-heading h2 { letter-spacing: -.05em; }
.ayloti-calculator-header p,
.ayloti-tool-heading p { font-size: 14px; line-height: 1.6; }
.ayloti-icon-btn,
.ayloti-workspace-tabs,
.ayloti-angle-controls,
.ayloti-format-controls,
.ayloti-calculator-main,
.ayloti-history-panel,
.ayloti-converter-card,
.ayloti-graph-card,
.ayloti-mini-tool,
.ayloti-display,
.ayloti-tool-search input,
.ayloti-history-search input,
.ayloti-converter-card select,
.ayloti-converter-card input,
.ayloti-mini-tool input,
.ayloti-mini-tool select,
.ayloti-mini-tool textarea,
.ayloti-graph-card input,
.ayloti-graph-card select,
.ayloti-graph-card textarea,
.ayloti-formula-card,
.ayloti-command-palette,
.ayloti-working-panel,
.ayloti-graph-table,
.ayloti-tool-search-results {
    box-shadow: 0 12px 35px rgba(55, 66, 102, 0.05), inset 0 1px 0 rgba(255,255,255,.55);
}
.ayloti-calculator-main,
.ayloti-history-panel,
.ayloti-converter-card,
.ayloti-graph-card,
.ayloti-mini-tool {
    border-radius: 28px;
    border-color: color-mix(in srgb, var(--ayloti-accent) 7%, var(--ayloti-border));
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92));
}
.ayloti-workspace-tabs {
    gap: 7px;
    padding: 7px;
    border-radius: 20px;
    background: rgba(255,255,255,.72);
    backdrop-filter: blur(18px);
}
.ayloti-workspace-tabs button {
    min-height: 44px;
    padding: 9px 16px;
    border-radius: 14px;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.ayloti-workspace-tabs button:hover {
    background: var(--ayloti-accent-soft);
    color: var(--ayloti-accent);
    transform: translateY(-1px);
}
.ayloti-workspace-tabs button.is-active {
    box-shadow: 0 12px 28px color-mix(in srgb, var(--ayloti-accent) 26%, transparent), inset 0 1px 0 rgba(255,255,255,.25);
}
.ayloti-icon-btn {
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(250,251,255,.9));
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.ayloti-icon-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(76, 87, 125, .10);
}
.ayloti-display {
    min-height: 172px;
    padding: 22px;
    border-radius: 24px;
    background:
        radial-gradient(circle at 0% 0%, rgba(255,255,255,.82), transparent 36%),
        linear-gradient(145deg, color-mix(in srgb, var(--ayloti-accent) 4%, var(--ayloti-panel)), var(--ayloti-card));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8), inset 0 -18px 30px rgba(124, 140, 246, 0.03);
}
.ayloti-expression-input { font-size: 17px; }
.ayloti-result { text-shadow: 0 1px 0 rgba(255,255,255,.3); }
.ayloti-toolbar button,
.ayloti-calculator-footer button,
.ayloti-history-heading button,
.ayloti-history-footer button,
.ayloti-converter-summary button,
.ayloti-graph-actions button,
.ayloti-mini-tool > button,
.ayloti-graph-table-controls button,
.ayloti-command-actions button,
.ayloti-formula-card button,
.ayloti-status-pills button[data-action="exam-mode"] {
    border-radius: 13px;
    background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(246,248,254,.92));
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease;
}
.ayloti-toolbar button:hover,
.ayloti-calculator-footer button:hover,
.ayloti-history-heading button:hover,
.ayloti-history-footer button:hover,
.ayloti-converter-summary button:hover,
.ayloti-graph-actions button:hover,
.ayloti-mini-tool > button:hover,
.ayloti-graph-table-controls button:hover,
.ayloti-command-actions button:hover,
.ayloti-formula-card button:hover,
.ayloti-status-pills button[data-action="exam-mode"]:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(76, 87, 125, .08);
}
.ayloti-keypad { gap: 10px; }
.ayloti-keypad button {
    min-height: 56px;
    border-radius: 17px;
    border-color: color-mix(in srgb, var(--ayloti-accent) 6%, var(--ayloti-border));
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(245,247,253,.92));
    box-shadow: 0 10px 25px rgba(76, 87, 125, .05), inset 0 1px 0 rgba(255,255,255,.72);
}
.ayloti-keypad button:hover,
.ayloti-toolbar button:hover,
.ayloti-icon-btn:hover,
.ayloti-calculator-footer button:hover,
.ayloti-history-heading button:hover,
.ayloti-history-footer button:hover,
.ayloti-converter-summary button:hover,
.ayloti-graph-actions button:hover,
.ayloti-mini-tool > button:hover {
    border-color: color-mix(in srgb, var(--ayloti-accent) 45%, var(--ayloti-border));
    background: linear-gradient(180deg, rgba(255,255,255,1), color-mix(in srgb, var(--ayloti-accent) 6%, #f7f8ff));
}
.ayloti-keypad button.fn { color: color-mix(in srgb, var(--ayloti-accent) 88%, #394b7a); }
.ayloti-keypad button.utility,
.ayloti-keypad button.operator {
    background: linear-gradient(180deg, color-mix(in srgb, var(--ayloti-accent) 18%, #ffffff), color-mix(in srgb, var(--ayloti-accent) 10%, #f7f8ff));
    color: color-mix(in srgb, var(--ayloti-accent) 92%, #253458);
}
.ayloti-keypad button.utility.is-active,
.ayloti-workspace-tabs button.is-active,
.ayloti-command-actions button[aria-pressed="true"],
.ayloti-status-pills button[data-action="exam-mode"].is-active {
    background: linear-gradient(180deg, color-mix(in srgb, var(--ayloti-accent) 92%, white), color-mix(in srgb, var(--ayloti-accent) 100%, black 2%));
    color: #fff;
}
.ayloti-keypad button.equals {
    border-color: color-mix(in srgb, var(--ayloti-accent) 92%, white);
    background: linear-gradient(180deg, color-mix(in srgb, var(--ayloti-accent) 88%, white), color-mix(in srgb, var(--ayloti-accent) 100%, black 4%));
    box-shadow: 0 14px 28px color-mix(in srgb, var(--ayloti-accent) 30%, transparent), inset 0 1px 0 rgba(255,255,255,.28);
}
.ayloti-status-pills span {
    padding-inline: 10px;
    background: color-mix(in srgb, var(--ayloti-accent) 12%, white);
}
.ayloti-history-panel,
.ayloti-converter-card,
.ayloti-graph-card,
.ayloti-mini-tool { overflow: hidden; }
.ayloti-history-list li,
.ayloti-tool-search-results button,
.ayloti-formula-card,
.ayloti-working-step,
.ayloti-graph-table,
.ayloti-command-palette {
    border-radius: 18px;
}
.ayloti-history-list li,
.ayloti-formula-card,
.ayloti-working-step,
.ayloti-graph-table {
    background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(247,248,253,.9));
    border-color: color-mix(in srgb, var(--ayloti-accent) 6%, var(--ayloti-border));
}
.ayloti-tool-search input,
.ayloti-history-search input,
.ayloti-converter-card select,
.ayloti-converter-card input,
.ayloti-mini-tool input,
.ayloti-mini-tool select,
.ayloti-mini-tool textarea,
.ayloti-graph-card input,
.ayloti-graph-card select,
.ayloti-graph-card textarea {
    border-radius: 15px;
    border-color: color-mix(in srgb, var(--ayloti-accent) 8%, var(--ayloti-border));
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(249,250,254,.94));
}
.ayloti-tool-search input:focus,
.ayloti-history-search input:focus,
.ayloti-converter-card select:focus,
.ayloti-converter-card input:focus,
.ayloti-mini-tool input:focus,
.ayloti-mini-tool select:focus,
.ayloti-mini-tool textarea:focus,
.ayloti-graph-card input:focus,
.ayloti-graph-card select:focus,
.ayloti-graph-card textarea:focus,
.ayloti-expression-input:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--ayloti-accent) 40%, var(--ayloti-border));
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--ayloti-accent) 12%, transparent);
}
.ayloti-angle-controls,
.ayloti-format-controls {
    padding: 4px;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(246,247,252,.9));
}
.ayloti-angle-controls button,
.ayloti-format-controls button { border-radius: 10px; }
.ayloti-angle-controls button.is-active,
.ayloti-format-controls button.is-active {
    box-shadow: 0 8px 18px rgba(76, 87, 125, .08), inset 0 1px 0 rgba(255,255,255,.75);
}
.ayloti-calculator-wrap.is-dark .ayloti-calculator-shell {
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--ayloti-accent) 18%, transparent), transparent 24%),
        radial-gradient(circle at 0% 100%, color-mix(in srgb, var(--ayloti-accent) 12%, transparent), transparent 24%),
        linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01)),
        var(--ayloti-bg);
    box-shadow: var(--ayloti-shadow), inset 0 1px 0 rgba(255,255,255,.04);
}
.ayloti-calculator-wrap.is-dark .ayloti-calculator-main,
.ayloti-calculator-wrap.is-dark .ayloti-history-panel,
.ayloti-calculator-wrap.is-dark .ayloti-converter-card,
.ayloti-calculator-wrap.is-dark .ayloti-graph-card,
.ayloti-calculator-wrap.is-dark .ayloti-mini-tool,
.ayloti-calculator-wrap.is-dark .ayloti-display,
.ayloti-calculator-wrap.is-dark .ayloti-workspace-tabs,
.ayloti-calculator-wrap.is-dark .ayloti-icon-btn,
.ayloti-calculator-wrap.is-dark .ayloti-angle-controls,
.ayloti-calculator-wrap.is-dark .ayloti-format-controls,
.ayloti-calculator-wrap.is-dark .ayloti-keypad button,
.ayloti-calculator-wrap.is-dark .ayloti-toolbar button,
.ayloti-calculator-wrap.is-dark .ayloti-calculator-footer button,
.ayloti-calculator-wrap.is-dark .ayloti-history-heading button,
.ayloti-calculator-wrap.is-dark .ayloti-history-footer button,
.ayloti-calculator-wrap.is-dark .ayloti-converter-summary button,
.ayloti-calculator-wrap.is-dark .ayloti-graph-actions button,
.ayloti-calculator-wrap.is-dark .ayloti-mini-tool > button,
.ayloti-calculator-wrap.is-dark .ayloti-formula-card,
.ayloti-calculator-wrap.is-dark .ayloti-tool-search-results,
.ayloti-calculator-wrap.is-dark .ayloti-history-list li,
.ayloti-calculator-wrap.is-dark .ayloti-working-step,
.ayloti-calculator-wrap.is-dark .ayloti-graph-table,
.ayloti-calculator-wrap.is-dark .ayloti-command-palette,
.ayloti-calculator-wrap.is-dark .ayloti-converter-card select,
.ayloti-calculator-wrap.is-dark .ayloti-converter-card input,
.ayloti-calculator-wrap.is-dark .ayloti-mini-tool input,
.ayloti-calculator-wrap.is-dark .ayloti-mini-tool select,
.ayloti-calculator-wrap.is-dark .ayloti-mini-tool textarea,
.ayloti-calculator-wrap.is-dark .ayloti-graph-card input,
.ayloti-calculator-wrap.is-dark .ayloti-graph-card select,
.ayloti-calculator-wrap.is-dark .ayloti-graph-card textarea {
    background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
    box-shadow: 0 14px 35px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.03);
}
.ayloti-calculator-wrap.is-dark .ayloti-keypad button.utility,
.ayloti-calculator-wrap.is-dark .ayloti-keypad button.operator,
.ayloti-calculator-wrap.is-dark .ayloti-status-pills span {
    background: color-mix(in srgb, var(--ayloti-accent) 24%, rgba(255,255,255,.02));
}
.ayloti-calculator-wrap.is-dark .ayloti-keypad button:hover,
.ayloti-calculator-wrap.is-dark .ayloti-toolbar button:hover,
.ayloti-calculator-wrap.is-dark .ayloti-icon-btn:hover,
.ayloti-calculator-wrap.is-dark .ayloti-calculator-footer button:hover,
.ayloti-calculator-wrap.is-dark .ayloti-history-heading button:hover,
.ayloti-calculator-wrap.is-dark .ayloti-history-footer button:hover,
.ayloti-calculator-wrap.is-dark .ayloti-converter-summary button:hover,
.ayloti-calculator-wrap.is-dark .ayloti-graph-actions button:hover,
.ayloti-calculator-wrap.is-dark .ayloti-mini-tool > button:hover {
    background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
}
@media (max-width: 760px) {
    .ayloti-calculator-shell { padding: 18px; border-radius: 28px; }
    .ayloti-calculator-main,
    .ayloti-history-panel,
    .ayloti-converter-card,
    .ayloti-graph-card,
    .ayloti-mini-tool { border-radius: 22px; }
    .ayloti-display { border-radius: 20px; }
    .ayloti-keypad { gap: 8px; }
    .ayloti-keypad button { border-radius: 14px; }
}


/* Version 7 — Light Studio */
.ayloti-calculator-wrap {
    --ayloti-bg: #fffaf7;
    --ayloti-card: #fffefd;
    --ayloti-panel: #fdf9ff;
    --ayloti-panel-strong: #f3eefb;
    --ayloti-text: #29263a;
    --ayloti-muted: #777287;
    --ayloti-border: rgba(88, 70, 112, .095);
    --ayloti-grid: rgba(88, 70, 112, .075);
    --ayloti-accent-soft: color-mix(in srgb, var(--ayloti-accent) 11%, transparent);
    --ayloti-accent-medium: color-mix(in srgb, var(--ayloti-accent) 22%, transparent);
    --ayloti-shadow: 0 30px 90px rgba(101, 82, 126, .105);
    margin-block: 24px;
}
.ayloti-calculator-wrap[data-palette="pearl"] {
    --ayloti-bg: #fffaf7; --ayloti-card: #fffefd; --ayloti-panel: #fdf9ff; --ayloti-panel-strong: #f3eefb;
    --ayloti-text: #29263a; --ayloti-muted: #777287; --ayloti-border: rgba(88,70,112,.095); --ayloti-grid: rgba(88,70,112,.075);
}
.ayloti-calculator-wrap[data-palette="lavender"] {
    --ayloti-bg: #fbf9ff; --ayloti-card: #ffffff; --ayloti-panel: #f8f4ff; --ayloti-panel-strong: #eee7fb;
    --ayloti-text: #302a42; --ayloti-muted: #766f88; --ayloti-border: rgba(94,69,135,.10); --ayloti-grid: rgba(94,69,135,.075);
}
.ayloti-calculator-wrap[data-palette="mint"] {
    --ayloti-bg: #f7fcfa; --ayloti-card: #ffffff; --ayloti-panel: #f2faf6; --ayloti-panel-strong: #e3f3eb;
    --ayloti-text: #243630; --ayloti-muted: #6c7e78; --ayloti-border: rgba(45,106,85,.10); --ayloti-grid: rgba(45,106,85,.075);
}
.ayloti-calculator-wrap[data-palette="blush"] {
    --ayloti-bg: #fff9fa; --ayloti-card: #fffefe; --ayloti-panel: #fff4f7; --ayloti-panel-strong: #f9e8ee;
    --ayloti-text: #3b2930; --ayloti-muted: #836f77; --ayloti-border: rgba(126,69,91,.10); --ayloti-grid: rgba(126,69,91,.075);
}
.ayloti-calculator-wrap[data-palette="sky"] {
    --ayloti-bg: #f8fcff; --ayloti-card: #ffffff; --ayloti-panel: #f2f9fd; --ayloti-panel-strong: #e3f1f9;
    --ayloti-text: #27343e; --ayloti-muted: #6e7b84; --ayloti-border: rgba(53,99,126,.10); --ayloti-grid: rgba(53,99,126,.075);
}
.ayloti-calculator-wrap[data-palette="peach"] {
    --ayloti-bg: #fffaf5; --ayloti-card: #fffefd; --ayloti-panel: #fff7f0; --ayloti-panel-strong: #f9eadf;
    --ayloti-text: #3a2e28; --ayloti-muted: #83756e; --ayloti-border: rgba(126,81,56,.10); --ayloti-grid: rgba(126,81,56,.075);
}
.ayloti-calculator-wrap.is-light .ayloti-calculator-shell {
    background:
        radial-gradient(circle at 8% -8%, rgba(255,255,255,.98), transparent 31%),
        radial-gradient(circle at 103% -3%, color-mix(in srgb, var(--ayloti-accent) 14%, transparent), transparent 25%),
        radial-gradient(circle at -4% 104%, color-mix(in srgb, var(--ayloti-accent) 7%, transparent), transparent 27%),
        linear-gradient(155deg, rgba(255,255,255,.67), rgba(255,255,255,.18)),
        var(--ayloti-bg);
}
.ayloti-calculator-shell::before,
.ayloti-calculator-shell::after {
    content: ""; position: absolute; pointer-events: none; border-radius: 999px; filter: blur(4px); opacity: .5;
}
.ayloti-calculator-shell::before { width: 170px; height: 170px; top: -105px; right: 15%; background: color-mix(in srgb, var(--ayloti-accent) 11%, transparent); }
.ayloti-calculator-shell::after { width: 130px; height: 130px; bottom: -88px; left: 10%; background: color-mix(in srgb, var(--ayloti-accent) 7%, transparent); }
.ayloti-calculator-header,
.ayloti-workspace-tabs,
.ayloti-command-bar,
.ayloti-workspace { position: relative; z-index: 1; }
.ayloti-calculator-kicker,
.ayloti-section-kicker { color: color-mix(in srgb, var(--ayloti-accent) 84%, #554b6c); }
.ayloti-calculator-header h1,
.ayloti-tool-heading h2 { color: var(--ayloti-text); text-wrap: balance; }
.ayloti-header-actions { gap: 9px; }
.ayloti-icon-btn { width: 47px; height: 47px; color: color-mix(in srgb, var(--ayloti-text) 88%, var(--ayloti-accent)); }
.ayloti-icon-btn:hover { color: var(--ayloti-accent); }
.ayloti-theme-studio {
    position: absolute; z-index: 40; top: 91px; right: 29px; width: min(560px, calc(100% - 40px)); padding: 18px;
    border: 1px solid color-mix(in srgb, var(--ayloti-accent) 13%, var(--ayloti-border)); border-radius: 24px;
    background: color-mix(in srgb, var(--ayloti-card) 91%, transparent); backdrop-filter: blur(24px) saturate(125%);
    box-shadow: 0 28px 70px rgba(74,58,94,.18), inset 0 1px 0 rgba(255,255,255,.8);
}
.ayloti-theme-studio[hidden] { display: none !important; }
.ayloti-theme-studio-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:14px; }
.ayloti-theme-studio-heading div { display:grid; gap:2px; }
.ayloti-theme-studio-heading span { color:var(--ayloti-accent); font-size:10px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.ayloti-theme-studio-heading strong { font-size:18px; letter-spacing:-.02em; }
.ayloti-theme-studio-heading > button { width:34px; height:34px; border:1px solid var(--ayloti-border); border-radius:12px; background:var(--ayloti-panel); color:var(--ayloti-muted); font-size:22px; cursor:pointer; }
.ayloti-palette-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.ayloti-palette-grid > button {
    display:grid; grid-template-columns:34px minmax(0,1fr); grid-template-rows:auto auto; column-gap:10px; align-items:center; padding:10px;
    border:1px solid var(--ayloti-border); border-radius:16px; background:rgba(255,255,255,.62); color:var(--ayloti-text); text-align:left; cursor:pointer;
    transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.ayloti-palette-grid > button:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--ayloti-accent) 40%,var(--ayloti-border)); box-shadow:0 12px 25px rgba(74,58,94,.08); }
.ayloti-palette-grid > button.is-active { border-color:var(--ayloti-accent); background:color-mix(in srgb,var(--ayloti-accent) 8%,white); box-shadow:0 0 0 3px color-mix(in srgb,var(--ayloti-accent) 10%,transparent); }
.ayloti-palette-grid strong { grid-column:2; font-size:12px; }
.ayloti-palette-grid small { grid-column:2; color:var(--ayloti-muted); font-size:9px; }
.ayloti-palette-swatch { grid-column:1; grid-row:1/3; width:34px; height:34px; border-radius:12px; box-shadow:inset 0 0 0 1px rgba(0,0,0,.05),0 5px 12px rgba(0,0,0,.06); }
.ayloti-palette-swatch.is-pearl { background:linear-gradient(135deg,#fffaf3 0 50%,#9277e8 50%); }
.ayloti-palette-swatch.is-lavender { background:linear-gradient(135deg,#f3edff 0 50%,#9a78e8 50%); }
.ayloti-palette-swatch.is-mint { background:linear-gradient(135deg,#eaf8f1 0 50%,#48a98f 50%); }
.ayloti-palette-swatch.is-blush { background:linear-gradient(135deg,#fff0f4 0 50%,#d97d9d 50%); }
.ayloti-palette-swatch.is-sky { background:linear-gradient(135deg,#ecf8ff 0 50%,#64a6d8 50%); }
.ayloti-palette-swatch.is-peach { background:linear-gradient(135deg,#fff1e6 0 50%,#dc8a68 50%); }
.ayloti-theme-mode-row { display:flex; align-items:center; gap:7px; margin-top:13px; padding-top:13px; border-top:1px solid var(--ayloti-border); }
.ayloti-theme-mode-row > span { margin-right:auto; color:var(--ayloti-muted); font-size:11px; font-weight:800; }
.ayloti-theme-mode-row button { min-height:34px; padding:6px 10px; border:1px solid var(--ayloti-border); border-radius:11px; background:var(--ayloti-panel); color:var(--ayloti-muted); font-size:10px; font-weight:850; cursor:pointer; }
.ayloti-theme-mode-row button.is-active { border-color:var(--ayloti-accent); background:var(--ayloti-accent-soft); color:var(--ayloti-accent); }
.ayloti-workspace-tabs { width:100%; display:flex; background:rgba(255,255,255,.62); }
.ayloti-workspace-tabs button { flex:0 0 auto; }
.ayloti-workspace-tabs button.is-active { color:#fff; }
.ayloti-calculator-main,
.ayloti-history-panel,
.ayloti-converter-card,
.ayloti-graph-card,
.ayloti-mini-tool { box-shadow:0 18px 48px rgba(91,73,115,.07),inset 0 1px 0 rgba(255,255,255,.85); }
.ayloti-display { border-color:color-mix(in srgb,var(--ayloti-accent) 9%,var(--ayloti-border)); background:linear-gradient(150deg,rgba(255,255,255,.93),color-mix(in srgb,var(--ayloti-accent) 4%,#fff)); }
.ayloti-keypad button { box-shadow:0 7px 18px rgba(90,72,111,.045),inset 0 1px 0 rgba(255,255,255,.9); }
.ayloti-keypad button:hover { transform:translateY(-2px); box-shadow:0 12px 25px rgba(90,72,111,.08),inset 0 1px 0 rgba(255,255,255,.95); }
.ayloti-keypad button:active { transform:translateY(0) scale(.975); }
.ayloti-keypad button.equals { box-shadow:0 14px 28px color-mix(in srgb,var(--ayloti-accent) 25%,transparent),inset 0 1px 0 rgba(255,255,255,.28); }
.ayloti-history-item.is-pinned { border-color:color-mix(in srgb,var(--ayloti-accent) 30%,var(--ayloti-border)); background:color-mix(in srgb,var(--ayloti-accent) 5%,white); }
.ayloti-calculator-wrap:not(.is-dark) .ayloti-calculator-main,
.ayloti-calculator-wrap:not(.is-dark) .ayloti-history-panel,
.ayloti-calculator-wrap:not(.is-dark) .ayloti-converter-card,
.ayloti-calculator-wrap:not(.is-dark) .ayloti-graph-card,
.ayloti-calculator-wrap:not(.is-dark) .ayloti-mini-tool { background:rgba(255,255,255,.84); backdrop-filter:blur(14px); }
.ayloti-calculator-wrap.is-dark { --ayloti-bg:#18151d; --ayloti-card:#211d27; --ayloti-panel:#29232f; --ayloti-panel-strong:#342d3b; --ayloti-text:#f6f1fa; --ayloti-muted:#bcb2c4; --ayloti-border:rgba(255,255,255,.09); --ayloti-grid:rgba(255,255,255,.075); }
.ayloti-calculator-wrap.is-dark .ayloti-theme-studio { background:rgba(33,29,39,.92); }
.ayloti-calculator-wrap.is-dark .ayloti-palette-grid > button { background:rgba(255,255,255,.035); }
.ayloti-calculator-wrap.is-dark .ayloti-palette-grid > button.is-active { background:color-mix(in srgb,var(--ayloti-accent) 20%,transparent); }
@media (prefers-reduced-motion: reduce) {
    .ayloti-calculator-wrap *, .ayloti-calculator-wrap *::before, .ayloti-calculator-wrap *::after { scroll-behavior:auto !important; transition-duration:.001ms !important; animation-duration:.001ms !important; }
}
@media (max-width:760px) {
    .ayloti-theme-studio { position:fixed; inset:auto 12px 12px; width:auto; max-height:min(75vh,620px); overflow:auto; border-radius:24px; }
    .ayloti-palette-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .ayloti-theme-mode-row { flex-wrap:wrap; }
    .ayloti-theme-mode-row > span { flex-basis:100%; }
}
@media (max-width:420px) {
    .ayloti-calculator-shell { padding:14px; }
    .ayloti-header-actions { gap:6px; }
    .ayloti-icon-btn { width:42px; height:42px; border-radius:14px; }
    .ayloti-palette-grid { grid-template-columns:1fr; }
}

/* Version 8 — Student Super-Suite */
.ayloti-toolbar {
    grid-template-columns: repeat(auto-fit, minmax(68px, 1fr));
}

.ayloti-wide-tool {
    grid-column: 1 / -1;
}

.ayloti-recurring-mark {
    text-decoration: overline;
    text-decoration-thickness: 1px;
}

.ayloti-triangle-entry {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 15px;
}

.ayloti-triangle-entry > div {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    padding: 14px;
    border: 1px solid var(--ayloti-border);
    border-radius: 18px;
    background: color-mix(in srgb, var(--ayloti-panel) 78%, white);
}

.ayloti-triangle-entry strong {
    grid-column: 1 / -1;
    color: var(--ayloti-accent);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.ayloti-triangle-entry label {
    display: grid;
    gap: 5px;
    color: var(--ayloti-muted);
    font-size: 11px;
    font-weight: 800;
}

.ayloti-study-dashboard {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.ayloti-study-timer-card,
.ayloti-study-stats-card,
.ayloti-study-scratch-card,
.ayloti-study-goals-card,
.ayloti-practice-card {
    position: relative;
}

.ayloti-study-timer-card::after,
.ayloti-practice-card::after {
    content: "";
    position: absolute;
    width: 120px;
    height: 120px;
    right: -50px;
    top: -55px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--ayloti-accent) 9%, transparent);
    pointer-events: none;
}

.ayloti-timer-display {
    margin: 20px 0 14px;
    color: var(--ayloti-text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: clamp(46px, 8vw, 72px);
    font-weight: 900;
    letter-spacing: -.07em;
    line-height: 1;
    text-align: center;
}

.ayloti-timer-presets,
.ayloti-study-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ayloti-timer-presets button,
.ayloti-study-actions button,
.ayloti-goal-entry button,
.ayloti-practice-controls button,
.ayloti-goal-check,
.ayloti-goal-delete {
    min-height: 38px;
    padding: 7px 12px;
    border: 1px solid var(--ayloti-border);
    border-radius: 12px;
    background: color-mix(in srgb, var(--ayloti-accent) 7%, white);
    color: var(--ayloti-accent);
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
}

.ayloti-study-actions {
    margin-top: 12px;
}

.ayloti-study-actions button:first-child,
.ayloti-practice-controls button,
.ayloti-goal-entry button {
    border-color: var(--ayloti-accent);
    background: var(--ayloti-accent);
    color: #fff;
}

.ayloti-timer-progress {
    height: 9px;
    margin-top: 16px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--ayloti-panel-strong);
}

.ayloti-timer-progress span {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, color-mix(in srgb, var(--ayloti-accent) 72%, white), var(--ayloti-accent));
    transition: width .3s linear;
}

.ayloti-study-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 18px 0 4px;
}

.ayloti-study-metrics > div {
    display: grid;
    gap: 4px;
    min-height: 105px;
    align-content: center;
    padding: 12px;
    border: 1px solid var(--ayloti-border);
    border-radius: 18px;
    background: color-mix(in srgb, var(--ayloti-accent) 5%, white);
    text-align: center;
}

.ayloti-study-metrics strong {
    color: var(--ayloti-text);
    font-size: 27px;
    font-weight: 900;
    letter-spacing: -.04em;
}

.ayloti-study-metrics span,
.ayloti-study-note-status {
    color: var(--ayloti-muted);
    font-size: 10px;
    font-weight: 750;
}

.ayloti-study-scratch-card textarea {
    width: 100%;
    min-height: 190px;
    margin-top: 15px;
    resize: vertical;
}

.ayloti-study-note-status {
    margin-top: 8px;
    text-align: right;
}

.ayloti-goal-entry {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    margin-top: 15px;
}

.ayloti-goal-entry input {
    width: 100%;
}

.ayloti-goal-list {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}

.ayloti-goal-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    padding: 9px;
    border: 1px solid var(--ayloti-border);
    border-radius: 14px;
    background: rgba(255,255,255,.54);
}

.ayloti-goal-item span {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--ayloti-text);
    font-size: 12px;
    font-weight: 700;
}

.ayloti-goal-item.is-done span {
    color: var(--ayloti-muted);
    text-decoration: line-through;
}

.ayloti-goal-check,
.ayloti-goal-delete {
    width: 34px;
    min-height: 34px;
    padding: 0;
}

.ayloti-goal-item.is-done .ayloti-goal-check {
    border-color: var(--ayloti-success);
    background: color-mix(in srgb, var(--ayloti-success) 12%, white);
    color: var(--ayloti-success);
}

.ayloti-goal-delete {
    color: var(--ayloti-danger);
}

.ayloti-empty-goals {
    margin: 8px 0;
    color: var(--ayloti-muted);
    font-size: 11px;
}

.ayloti-practice-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
    gap: 10px;
    align-items: end;
    margin-top: 15px;
}

.ayloti-practice-controls label {
    display: grid;
    gap: 5px;
}

.ayloti-practice-controls label > span {
    color: var(--ayloti-muted);
    font-size: 10px;
    font-weight: 850;
}

.ayloti-practice-question,
.ayloti-practice-answer {
    margin-top: 14px;
    padding: 18px;
    border: 1px solid var(--ayloti-border);
    border-radius: 18px;
    background: color-mix(in srgb, var(--ayloti-accent) 5%, white);
    color: var(--ayloti-text);
    font-size: clamp(18px, 3vw, 25px);
    font-weight: 850;
    letter-spacing: -.02em;
}

.ayloti-practice-answer {
    background: color-mix(in srgb, var(--ayloti-success) 8%, white);
    color: color-mix(in srgb, var(--ayloti-success) 80%, var(--ayloti-text));
    font-size: 16px;
}

.ayloti-calculator-wrap.is-dark .ayloti-triangle-entry > div,
.ayloti-calculator-wrap.is-dark .ayloti-study-metrics > div,
.ayloti-calculator-wrap.is-dark .ayloti-goal-item,
.ayloti-calculator-wrap.is-dark .ayloti-practice-question,
.ayloti-calculator-wrap.is-dark .ayloti-practice-answer {
    background: rgba(255,255,255,.035);
}

.ayloti-calculator-wrap.is-dark .ayloti-timer-presets button,
.ayloti-calculator-wrap.is-dark .ayloti-study-actions button,
.ayloti-calculator-wrap.is-dark .ayloti-goal-entry button,
.ayloti-calculator-wrap.is-dark .ayloti-goal-check,
.ayloti-calculator-wrap.is-dark .ayloti-goal-delete {
    background: color-mix(in srgb, var(--ayloti-accent) 20%, transparent);
}

@media (max-width: 900px) {
    .ayloti-study-dashboard,
    .ayloti-triangle-entry {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 620px) {
    .ayloti-study-metrics,
    .ayloti-practice-controls {
        grid-template-columns: minmax(0, 1fr);
    }
    .ayloti-study-metrics > div {
        min-height: 78px;
    }
    .ayloti-triangle-entry > div {
        grid-template-columns: minmax(0, 1fr);
    }
    .ayloti-timer-presets button,
    .ayloti-study-actions button {
        flex: 1 1 calc(50% - 8px);
    }
}

@media (min-width: 621px) {
    .ayloti-wide-tool .ayloti-coefficient-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}


/* Version 9 advanced lab expansion */
.ayloti-complex-pair,
.ayloti-four-field-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}
.ayloti-complex-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ayloti-complex-pair label,
.ayloti-four-field-row label,
.ayloti-three-field-row label,
.ayloti-textarea-row label { min-width: 0; }
.ayloti-visual-tool { min-height: 380px; }
.ayloti-compact-canvas { min-height: 280px; }
.ayloti-long-output { white-space: normal; line-height: 1.72; }
.ayloti-regression-layout {
    display: grid;
    grid-template-columns: minmax(280px, .78fr) minmax(0, 1.35fr);
    gap: 18px;
    align-items: start;
}
.ayloti-textarea-row textarea { min-height: 180px; resize: vertical; }
.ayloti-regression-canvas-wrap { min-height: 320px; }
.ayloti-regression-layout .ayloti-data-entry-panel,
.ayloti-regression-layout .ayloti-stat-results {
    min-width: 0;
}
.ayloti-workspace-tabs button[data-workspace="complex"] span,
.ayloti-workspace-tabs button[data-workspace="polynomial"] span {
    min-width: 22px;
    font-family: ui-serif, Georgia, serif;
    font-style: italic;
    font-weight: 900;
}
.ayloti-tool-output + .ayloti-canvas-wrap { margin-top: 14px; }
@media (max-width: 900px) {
    .ayloti-regression-layout { grid-template-columns: 1fr; }
    .ayloti-four-field-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
    .ayloti-complex-pair,
    .ayloti-four-field-row { grid-template-columns: 1fr 1fr; }
    .ayloti-textarea-row { grid-template-columns: 1fr; }
    .ayloti-textarea-row textarea { min-height: 130px; }
    .ayloti-compact-canvas { min-height: 240px; }
}


/* Version 10: universal step-by-step solution engine */
.ayloti-command-actions [data-action="auto-steps"] {
    min-width: 82px;
    border-color: color-mix(in srgb, var(--ayloti-accent) 24%, var(--ayloti-border));
    background: color-mix(in srgb, var(--ayloti-accent) 8%, var(--ayloti-card));
}
.ayloti-command-actions [data-action="auto-steps"][aria-pressed="true"] {
    background: var(--ayloti-accent);
    border-color: var(--ayloti-accent);
    color: #fff;
    box-shadow: 0 8px 22px var(--ayloti-accent-soft);
}
.ayloti-working-panel,
.ayloti-tool-steps-panel {
    position: relative;
    overflow: hidden;
    margin-top: 12px;
    padding: 17px;
    border: 1px solid color-mix(in srgb, var(--ayloti-accent) 24%, var(--ayloti-border));
    border-radius: 20px;
    background:
        radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--ayloti-accent) 12%, transparent), transparent 36%),
        linear-gradient(180deg, color-mix(in srgb, var(--ayloti-accent) 5%, #fff), #fff);
    box-shadow: 0 14px 40px rgba(70, 76, 110, .07), inset 0 1px 0 rgba(255,255,255,.85);
}
.ayloti-working-title,
.ayloti-tool-step-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 12px;
}
.ayloti-working-title > div:first-child,
.ayloti-tool-step-heading > div:first-child { display: grid; gap: 3px; }
.ayloti-solution-kicker,
.ayloti-tool-step-heading span {
    color: var(--ayloti-accent);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .13em;
}
.ayloti-working-title strong,
.ayloti-tool-step-heading strong { font-size: 15px; font-weight: 900; }
.ayloti-step-actions { display: flex; gap: 7px; }
.ayloti-working-title button,
.ayloti-tool-step-heading button,
.ayloti-inline-step-controls button {
    min-height: 32px;
    padding: 6px 10px;
    border: 1px solid color-mix(in srgb, var(--ayloti-accent) 25%, var(--ayloti-border));
    border-radius: 10px;
    background: color-mix(in srgb, var(--ayloti-accent) 8%, #fff);
    color: var(--ayloti-accent);
    font-size: 10px;
    font-weight: 850;
    cursor: pointer;
}
.ayloti-inline-step-controls {
    display: flex;
    justify-content: flex-end;
    margin-top: 8px;
}
.ayloti-inline-step-controls button { min-height: 30px; }
.ayloti-solution-list {
    display: grid;
    gap: 8px;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    counter-reset: none;
}
.ayloti-solution-step {
    display: grid;
    grid-template-columns: minmax(70px, auto) minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    margin: 0 !important;
    padding: 10px 12px;
    border: 1px solid var(--ayloti-border);
    border-radius: 13px;
    background: rgba(255,255,255,.72);
}
.ayloti-step-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 4px 8px;
    border-radius: 999px;
    background: var(--ayloti-accent-soft);
    color: var(--ayloti-accent);
    font-size: 9px;
    font-weight: 900;
    white-space: nowrap;
}
.ayloti-step-body {
    min-width: 0;
    overflow-wrap: anywhere;
    color: var(--ayloti-text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 12px;
    line-height: 1.6;
}
.ayloti-solution-step.is-answer {
    border-color: color-mix(in srgb, var(--ayloti-accent) 35%, var(--ayloti-border));
    background: color-mix(in srgb, var(--ayloti-accent) 10%, #fff);
}
.ayloti-solution-step.is-answer .ayloti-step-body { font-size: 14px; font-weight: 900; }
.ayloti-tool-output + .ayloti-inline-step-controls { margin-bottom: 0; }
.ayloti-calculator-wrap.is-dark .ayloti-working-panel,
.ayloti-calculator-wrap.is-dark .ayloti-tool-steps-panel {
    background: linear-gradient(180deg, color-mix(in srgb, var(--ayloti-accent) 10%, var(--ayloti-card)), var(--ayloti-card));
    box-shadow: 0 16px 42px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04);
}
.ayloti-calculator-wrap.is-dark .ayloti-solution-step { background: rgba(255,255,255,.025); }
.ayloti-calculator-wrap.is-dark .ayloti-working-title button,
.ayloti-calculator-wrap.is-dark .ayloti-tool-step-heading button,
.ayloti-calculator-wrap.is-dark .ayloti-inline-step-controls button { background: rgba(255,255,255,.04); }
@media (max-width: 600px) {
    .ayloti-solution-step { grid-template-columns: 1fr; gap: 7px; }
    .ayloti-step-badge { justify-self: start; }
    .ayloti-working-title,
    .ayloti-tool-step-heading { align-items: stretch; }
    .ayloti-step-actions { flex-direction: column; }
}
@media print {
    .ayloti-calculator-wrap * { visibility: hidden; }
    .ayloti-working-panel:not([hidden]),
    .ayloti-working-panel:not([hidden]) *,
    .ayloti-tool-steps-panel:not([hidden]),
    .ayloti-tool-steps-panel:not([hidden]) * { visibility: visible; }
    .ayloti-working-panel:not([hidden]),
    .ayloti-tool-steps-panel:not([hidden]) { position: absolute; inset: 0 auto auto 0; width: 100%; box-shadow: none; }
    .ayloti-working-title button,
    .ayloti-tool-step-heading button,
    .ayloti-inline-step-controls { display: none !important; }
}

/* Version 11: mega learning labs */
.ayloti-three-field-row,
.ayloti-four-field-row {
    display: grid;
    gap: 10px;
    margin: 10px 0;
}
.ayloti-three-field-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ayloti-four-field-row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ayloti-three-field-row label,
.ayloti-four-field-row label { min-width: 0; }
.ayloti-three-field-row span,
.ayloti-four-field-row span {
    display: block;
    margin-bottom: 5px;
    color: var(--ayloti-muted);
    font-size: 10px;
    font-weight: 800;
}
.ayloti-three-field-row input,
.ayloti-four-field-row input { width: 100%; }

.ayloti-function-canvas-wrap {
    min-height: 320px;
    margin-top: 14px;
    border: 1px solid var(--ayloti-border);
    border-radius: 20px;
    overflow: hidden;
    background: var(--ayloti-card);
}
.ayloti-function-canvas-wrap canvas { display: block; width: 100%; }

.ayloti-pascal-triangle {
    display: grid;
    gap: 7px;
    margin-top: 14px;
    padding: 16px;
    max-height: 330px;
    overflow: auto;
    border: 1px solid var(--ayloti-border);
    border-radius: 18px;
    background: var(--ayloti-panel);
    color: var(--ayloti-text);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 12px;
    text-align: center;
    white-space: pre;
}
.ayloti-pascal-triangle div {
    padding: 3px 8px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--ayloti-accent) 7%, transparent);
}

.ayloti-exam-coach { padding: 20px; }
.ayloti-exam-layout {
    display: grid;
    grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr);
    gap: 18px;
}
.ayloti-exam-score {
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    gap: 4px 12px;
    min-width: 150px;
    padding: 12px 15px;
    border: 1px solid var(--ayloti-border);
    border-radius: 18px;
    background: var(--ayloti-panel);
}
.ayloti-exam-score span {
    color: var(--ayloti-muted);
    font-size: 10px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .08em;
}
.ayloti-exam-score strong {
    color: var(--ayloti-accent);
    font-size: 18px;
    text-align: right;
}
.ayloti-exam-question-card {
    padding: 22px;
    border: 1px solid color-mix(in srgb, var(--ayloti-accent) 12%, var(--ayloti-border));
    border-radius: 24px;
    background:
        radial-gradient(circle at 100% 0%, var(--ayloti-accent-soft), transparent 36%),
        var(--ayloti-card);
    box-shadow: 0 16px 45px rgba(55, 66, 102, .07);
}
.ayloti-exam-question-card h3 {
    min-height: 58px;
    margin: 4px 0 18px;
    color: var(--ayloti-text);
    font-size: clamp(20px, 3vw, 29px);
    line-height: 1.25;
}
.ayloti-exam-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 12px;
}
.ayloti-exam-actions button {
    min-height: 40px;
    padding: 8px 13px;
    border: 1px solid var(--ayloti-border);
    border-radius: 13px;
    background: var(--ayloti-panel);
    color: var(--ayloti-text);
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
}
.ayloti-exam-actions button:first-child {
    border-color: var(--ayloti-accent);
    background: var(--ayloti-accent);
    color: #fff;
}
.ayloti-exam-working {
    margin-top: 15px;
    padding: 17px;
    border: 1px solid var(--ayloti-accent-medium);
    border-radius: 18px;
    background: var(--ayloti-accent-soft);
    color: var(--ayloti-text);
}
.ayloti-exam-working ol { margin: 10px 0 8px 20px; padding: 0; }
.ayloti-exam-working li { margin: 7px 0; }

@media (max-width: 900px) {
    .ayloti-exam-layout { grid-template-columns: 1fr; }
    .ayloti-exam-score { width: 100%; }
}
@media (max-width: 680px) {
    .ayloti-three-field-row,
    .ayloti-four-field-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ayloti-exam-coach { padding: 14px; }
    .ayloti-exam-question-card { padding: 17px; border-radius: 20px; }
}
@media (max-width: 430px) {
    .ayloti-three-field-row,
    .ayloti-four-field-row { grid-template-columns: 1fr; }
    .ayloti-exam-actions { display: grid; grid-template-columns: 1fr; }
    .ayloti-exam-actions button { width: 100%; }
}

/* Version 12: Power Suite workspaces */
.ayloti-pre-output {
    white-space: pre-wrap;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    line-height: 1.7;
}

.ayloti-conic-layout,
.ayloti-project-layout {
    display: grid;
    grid-template-columns: minmax(300px, 420px) minmax(0, 1fr);
    gap: 18px;
    align-items: stretch;
}

.ayloti-conic-graph-card,
.ayloti-project-list-card {
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--ayloti-border);
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92));
    box-shadow: 0 12px 35px rgba(55,66,102,.05), inset 0 1px 0 rgba(255,255,255,.6);
}

.ayloti-conic-graph-card canvas {
    width: 100%;
    min-height: 320px;
    display: block;
    border: 1px solid var(--ayloti-border);
    border-radius: 20px;
    background: var(--ayloti-card);
}

.ayloti-conic-graph-card p {
    margin: 12px 4px 0;
    color: var(--ayloti-muted);
    font-size: 11px;
    text-align: center;
}

.ayloti-project-actions,
.ayloti-project-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ayloti-project-actions button,
.ayloti-project-card-actions button {
    min-height: 38px;
    padding: 8px 13px;
    border: 1px solid var(--ayloti-border);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(246,248,254,.92));
    color: var(--ayloti-text);
    font-size: 11px;
    font-weight: 850;
    cursor: pointer;
}

.ayloti-project-actions button:first-child,
.ayloti-project-card-actions button:first-child {
    border-color: var(--ayloti-accent);
    background: var(--ayloti-accent);
    color: #fff;
}

.ayloti-project-list {
    display: grid;
    gap: 10px;
    max-height: 620px;
    overflow: auto;
    padding-right: 3px;
}

.ayloti-project-card {
    padding: 15px;
    border: 1px solid var(--ayloti-border);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(247,248,253,.92));
}

.ayloti-project-card > div:first-child {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.ayloti-project-card strong {
    color: var(--ayloti-text);
    font-size: 14px;
}

.ayloti-project-card span,
.ayloti-project-card p {
    color: var(--ayloti-muted);
    font-size: 10px;
}

.ayloti-project-card p {
    margin: 8px 0 12px;
    line-height: 1.55;
    text-transform: capitalize;
}

.ayloti-calculator-wrap.is-dark .ayloti-conic-graph-card,
.ayloti-calculator-wrap.is-dark .ayloti-project-list-card,
.ayloti-calculator-wrap.is-dark .ayloti-project-card,
.ayloti-calculator-wrap.is-dark .ayloti-project-actions button,
.ayloti-calculator-wrap.is-dark .ayloti-project-card-actions button {
    background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
}

@media (max-width: 900px) {
    .ayloti-conic-layout,
    .ayloti-project-layout { grid-template-columns: 1fr; }
    .ayloti-conic-graph-card canvas { min-height: 280px; }
}

@media (max-width: 520px) {
    .ayloti-conic-graph-card,
    .ayloti-project-list-card { padding: 13px; border-radius: 21px; }
    .ayloti-conic-graph-card canvas { min-height: 240px; border-radius: 15px; }
    .ayloti-project-actions button,
    .ayloti-project-card-actions button { flex: 1 1 auto; }
}


/* Version 13: exact maths, inference, differential equations, physics and mistake detective */
.ayloti-five-field-row{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.ayloti-five-field-row label{min-width:0}
.ayloti-fraction-operation{display:grid;grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr);gap:12px;align-items:center;margin:12px 0 14px}
.ayloti-fraction-operation>div{display:grid;grid-template-rows:1fr auto 1fr;gap:3px;text-align:center}
.ayloti-fraction-operation>div span{color:var(--ayloti-muted);font-weight:900;line-height:.5}
.ayloti-fraction-operation select{height:48px;text-align:center;font-size:20px;font-weight:900}
.ayloti-mistake-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 28px;margin-bottom:18px;border:1px solid color-mix(in srgb,var(--ayloti-accent) 14%,var(--ayloti-border));border-radius:28px;background:linear-gradient(135deg,color-mix(in srgb,var(--ayloti-accent) 10%,#fff),#fff);box-shadow:0 18px 48px rgba(75,70,120,.07)}
.ayloti-mistake-hero h2{margin:0;color:var(--ayloti-text);font-size:clamp(28px,4vw,44px);letter-spacing:-.045em}
.ayloti-mistake-hero p{max-width:850px;margin:8px 0 0;color:var(--ayloti-muted)}
.ayloti-detective-mark{width:76px;height:76px;display:grid;place-items:center;flex:0 0 auto;border-radius:24px;background:linear-gradient(145deg,var(--ayloti-accent),color-mix(in srgb,var(--ayloti-accent) 75%,#fff));color:#fff;font-size:42px;font-weight:950;box-shadow:0 16px 34px var(--ayloti-accent-soft)}
.ayloti-workspace[data-workspace-panel="physics"] .ayloti-mini-tool{background:linear-gradient(180deg,#fffdf8,#fff)}
.ayloti-workspace[data-workspace-panel="inference"] .ayloti-mini-tool{background:linear-gradient(180deg,#fbfffd,#fff)}
.ayloti-workspace[data-workspace-panel="exact"] .ayloti-mini-tool{background:linear-gradient(180deg,#fdfbff,#fff)}
.ayloti-workspace[data-workspace-panel="differential"] .ayloti-mini-tool{background:linear-gradient(180deg,#fbfcff,#fff)}
.ayloti-value-table-wrap table{width:100%;border-collapse:separate;border-spacing:0;margin-top:12px;overflow:hidden;border:1px solid var(--ayloti-border);border-radius:16px;background:var(--ayloti-card)}
.ayloti-value-table-wrap th,.ayloti-value-table-wrap td{padding:9px 11px;border-bottom:1px solid var(--ayloti-border);text-align:right;font-size:12px}
.ayloti-value-table-wrap th{background:var(--ayloti-panel);color:var(--ayloti-muted);font-weight:900}
.ayloti-value-table-wrap tr:last-child td{border-bottom:0}
@media(max-width:900px){.ayloti-five-field-row{grid-template-columns:repeat(2,minmax(0,1fr))}.ayloti-five-field-row label:last-child{grid-column:1/-1}}
@media(max-width:560px){.ayloti-five-field-row{grid-template-columns:1fr}.ayloti-five-field-row label:last-child{grid-column:auto}.ayloti-fraction-operation{grid-template-columns:1fr}.ayloti-fraction-operation select{width:100%}.ayloti-mistake-hero{padding:20px;align-items:flex-start}.ayloti-detective-mark{width:56px;height:56px;border-radius:18px;font-size:30px}}


/* Version 14: Mistake Detective Pro */
.ayloti-detective-pills{display:flex;flex-wrap:wrap;gap:7px;margin-top:15px}
.ayloti-detective-pills span,.ayloti-case-badge,.ayloti-hint-level{display:inline-flex;align-items:center;min-height:28px;padding:5px 10px;border:1px solid color-mix(in srgb,var(--ayloti-accent) 20%,var(--ayloti-border));border-radius:999px;background:color-mix(in srgb,var(--ayloti-accent) 8%,#fff);color:color-mix(in srgb,var(--ayloti-accent) 80%,var(--ayloti-text));font-size:9px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.ayloti-mistake-layout{display:grid;grid-template-columns:minmax(0,.92fr) minmax(420px,1.08fr);gap:18px;align-items:start}
.ayloti-mistake-input-card{position:sticky;top:18px;padding:22px!important;background:linear-gradient(180deg,#fff,#fdfcff)!important}
.ayloti-card-heading-row{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.ayloti-card-heading-row h3{margin:0}
.ayloti-card-heading-row .ayloti-section-kicker{margin-bottom:4px}
.ayloti-stacked-field small,.ayloti-two-field-row small,.ayloti-three-field-row small{color:var(--ayloti-muted);font-size:9px;font-weight:650;text-transform:none;letter-spacing:0}
.ayloti-mistake-primary-actions{margin-top:16px}
.ayloti-mistake-primary-actions .ayloti-primary-action{background:linear-gradient(135deg,var(--ayloti-accent),color-mix(in srgb,var(--ayloti-accent) 72%,#fff));border-color:var(--ayloti-accent);color:#fff;box-shadow:0 12px 24px var(--ayloti-accent-soft)}
.ayloti-mistake-secondary-actions{margin-top:8px}
.ayloti-mistake-report-shell{min-height:620px;padding:18px;border:1px solid color-mix(in srgb,var(--ayloti-accent) 12%,var(--ayloti-border));border-radius:28px;background:linear-gradient(180deg,#fff,#fafaff);box-shadow:0 18px 48px rgba(75,70,120,.06)}
.ayloti-mistake-empty{min-height:580px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;text-align:center;color:var(--ayloti-muted)}
.ayloti-mistake-empty>span{width:72px;height:72px;display:grid;place-items:center;margin-bottom:18px;border-radius:25px;background:var(--ayloti-accent-soft);color:var(--ayloti-accent);font-size:38px;font-weight:950}
.ayloti-mistake-empty strong{color:var(--ayloti-text);font-size:22px}
.ayloti-mistake-empty p{max-width:460px;margin:8px 0 0}
.ayloti-mistake-report{display:grid;gap:14px}
.ayloti-diagnosis-verdict{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px;border:1px solid color-mix(in srgb,#d18b3c 22%,var(--ayloti-border));border-radius:22px;background:linear-gradient(135deg,#fffaf2,#fff)}
.ayloti-diagnosis-verdict.is-correct{border-color:color-mix(in srgb,var(--ayloti-success) 25%,var(--ayloti-border));background:linear-gradient(135deg,#f4fffb,#fff)}
.ayloti-diagnosis-verdict h3{margin:0;color:var(--ayloti-text);font-size:23px;letter-spacing:-.025em}
.ayloti-diagnosis-verdict p{margin:6px 0 0;color:var(--ayloti-muted);font-size:12px}
.ayloti-confidence-ring{--confidence:50;position:relative;width:88px;height:88px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:conic-gradient(var(--ayloti-accent) calc(var(--confidence)*1%),var(--ayloti-panel-strong) 0)}
.ayloti-confidence-ring:before{content:"";position:absolute;inset:8px;border-radius:50%;background:#fff}
.ayloti-confidence-ring strong,.ayloti-confidence-ring span{position:relative;z-index:1;grid-column:1;grid-row:1}
.ayloti-confidence-ring strong{margin-top:-12px;color:var(--ayloti-text);font-size:19px}.ayloti-confidence-ring span{margin-top:22px;color:var(--ayloti-muted);font-size:8px;font-weight:900;text-transform:uppercase}
.ayloti-answer-comparison{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.ayloti-answer-comparison>div{min-width:0;padding:12px;border:1px solid var(--ayloti-border);border-radius:16px;background:#fff}
.ayloti-answer-comparison span{display:block;color:var(--ayloti-muted);font-size:9px;font-weight:850;text-transform:uppercase}.ayloti-answer-comparison strong{display:block;margin-top:4px;overflow-wrap:anywhere;color:var(--ayloti-text);font-size:15px}
.ayloti-diagnostic-section{padding:16px;border:1px solid var(--ayloti-border);border-radius:20px;background:#fff}.ayloti-diagnostic-section h4{margin:0 0 11px;color:var(--ayloti-text);font-size:14px}
.ayloti-line-audit{display:grid;gap:7px}.ayloti-audit-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px;border:1px solid var(--ayloti-border);border-radius:13px;background:var(--ayloti-panel)}
.ayloti-audit-row.is-correct{border-color:color-mix(in srgb,var(--ayloti-success) 22%,var(--ayloti-border));background:#f5fffb}.ayloti-audit-row.is-wrong{border-color:color-mix(in srgb,var(--ayloti-danger) 32%,var(--ayloti-border));background:#fff7f8}
.ayloti-audit-number{width:25px;height:25px;display:grid;place-items:center;border-radius:8px;background:#fff;color:var(--ayloti-muted);font-size:10px;font-weight:900}.ayloti-audit-row code{min-width:0;overflow-wrap:anywhere;color:var(--ayloti-text);font-size:11px}.ayloti-audit-status{font-size:9px;font-weight:900;text-transform:uppercase}.ayloti-audit-row small{grid-column:2/-1;color:var(--ayloti-muted);font-size:10px}
.ayloti-candidate-grid{display:grid;gap:8px}.ayloti-candidate-card{padding:12px;border:1px solid var(--ayloti-border);border-radius:15px;background:var(--ayloti-panel)}.ayloti-candidate-card.is-primary{border-color:color-mix(in srgb,var(--ayloti-accent) 30%,var(--ayloti-border));background:color-mix(in srgb,var(--ayloti-accent) 6%,#fff)}
.ayloti-candidate-head{display:flex;justify-content:space-between;gap:10px}.ayloti-candidate-head strong{color:var(--ayloti-text);font-size:12px}.ayloti-candidate-head span{color:var(--ayloti-accent);font-size:11px;font-weight:900}.ayloti-candidate-card p{margin:6px 0;color:var(--ayloti-text);font-size:11px}.ayloti-candidate-card small{display:block;color:var(--ayloti-muted);font-size:10px}.ayloti-fix-line{margin-top:8px;padding-top:8px;border-top:1px dashed var(--ayloti-border);color:var(--ayloti-success);font-size:10px;font-weight:800}
.ayloti-verification-list{margin:0;padding-left:19px;color:var(--ayloti-muted);font-size:11px}.ayloti-verification-list li+li{margin-top:5px}
.ayloti-mistake-lower-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:18px}.ayloti-mistake-lower-grid>.ayloti-mini-tool{min-height:250px}
.ayloti-small-action{min-height:31px!important;padding:5px 9px!important;font-size:9px!important}.ayloti-mistake-panel-content{color:var(--ayloti-muted);font-size:12px;line-height:1.65}.ayloti-mistake-panel-content>strong{color:var(--ayloti-text)}
.ayloti-correction-list,.ayloti-repair-practice-list{margin:10px 0 0;padding-left:21px}.ayloti-correction-list li,.ayloti-repair-practice-list li{padding:7px 0;color:var(--ayloti-text);font-size:11px}.ayloti-correction-list li+li,.ayloti-repair-practice-list li+li{border-top:1px dashed var(--ayloti-border)}.ayloti-correction-list .is-answer{color:var(--ayloti-success);font-weight:900}.ayloti-repair-practice-list li span,.ayloti-repair-practice-list li strong{display:block}.ayloti-repair-practice-list li strong{margin-top:4px;color:var(--ayloti-success)}
.ayloti-mastery-summary{display:grid;grid-template-columns:80px 80px minmax(0,1fr);gap:7px}.ayloti-mastery-summary>div{padding:10px;border-radius:13px;background:var(--ayloti-panel);color:var(--ayloti-text);font-size:10px;font-weight:850;white-space:pre-line}.ayloti-mastery-bars{display:grid;gap:9px;margin-top:14px}.ayloti-mastery-row>div{display:flex;justify-content:space-between;gap:10px;margin-bottom:4px;color:var(--ayloti-muted);font-size:10px}.ayloti-mastery-track{display:block;height:7px;overflow:hidden;border-radius:999px;background:var(--ayloti-panel-strong)}.ayloti-mastery-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--ayloti-accent),color-mix(in srgb,var(--ayloti-accent) 55%,#fff))}.ayloti-mistake-recent{display:grid;gap:7px;margin-top:14px}.ayloti-mistake-recent>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto;gap:8px;padding:8px;border-top:1px dashed var(--ayloti-border);font-size:9px}.ayloti-mistake-recent strong{color:var(--ayloti-text)}.ayloti-mistake-recent span,.ayloti-mistake-recent small{color:var(--ayloti-muted)}
@media(max-width:1050px){.ayloti-mistake-layout{grid-template-columns:1fr}.ayloti-mistake-input-card{position:static}.ayloti-mistake-report-shell{min-height:0}.ayloti-mistake-empty{min-height:300px}}
@media(max-width:720px){.ayloti-mistake-lower-grid{grid-template-columns:1fr}.ayloti-answer-comparison{grid-template-columns:repeat(2,minmax(0,1fr))}.ayloti-audit-row{grid-template-columns:28px minmax(0,1fr)}.ayloti-audit-status{grid-column:2}.ayloti-audit-row small{grid-column:2}.ayloti-mastery-summary{grid-template-columns:1fr 1fr}.ayloti-mastery-summary>div:last-child{grid-column:1/-1}}
@media(max-width:480px){.ayloti-diagnosis-verdict{align-items:flex-start;padding:15px}.ayloti-confidence-ring{width:70px;height:70px}.ayloti-answer-comparison{grid-template-columns:1fr}.ayloti-mistake-report-shell{padding:11px;border-radius:21px}.ayloti-diagnostic-section{padding:12px}.ayloti-mistake-recent>div{grid-template-columns:1fr}.ayloti-detective-pills{display:none}}
.ayloti-audit-row.is-equation{border-color:color-mix(in srgb,var(--ayloti-accent) 22%,var(--ayloti-border));background:color-mix(in srgb,var(--ayloti-accent) 5%,#fff)}