@font-face {
    font-family: "Tajoka Montserrat";
    src: url("fonts/montserrat-latin-ext-800-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
    font-family: "Tajoka Montserrat";
    src: url("fonts/montserrat-latin-800-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
    font-family: "Tajoka Holtwood One SC";
    src: url("fonts/holtwood-one-sc-latin-ext-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
    font-family: "Tajoka Holtwood One SC";
    src: url("fonts/holtwood-one-sc-latin-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
    font-family: "Tajoka Rye";
    src: url("fonts/rye-latin-ext-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
    font-family: "Tajoka Rye";
    src: url("fonts/rye-latin-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
    font-family: "Tajoka Germania One";
    src: url("fonts/germania-one-latin-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: "Tajoka Courgette";
    src: url("fonts/courgette-latin-ext-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
    font-family: "Tajoka Courgette";
    src: url("fonts/courgette-latin-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
    font-family: "Tajoka Sancreek";
    src: url("fonts/sancreek-latin-ext-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
    font-family: "Tajoka Sancreek";
    src: url("fonts/sancreek-latin-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
    font-family: "Tajoka Oleo Script";
    src: url("fonts/oleo-script-latin-ext-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
    font-family: "Tajoka Oleo Script";
    src: url("fonts/oleo-script-latin-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face {
    font-family: "Tajoka Caveat Brush";
    src: url("fonts/caveat-brush-latin-ext-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
    font-family: "Tajoka Caveat Brush";
    src: url("fonts/caveat-brush-latin-400-normal.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

.tajoka-ornament-configurator {
    display: grid;
    grid-template-columns: minmax(280px, 330px) minmax(300px, 1fr);
    gap: 18px;
    width: 100%;
    max-width: 1180px;
    clear: both;
    margin: 32px auto 18px;
    padding: 26px;
    border: 1px solid #d7dce3;
    border-radius: 14px;
    background: #fff;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
    align-items: start;
    overflow: hidden;
}

.tajoka-ornament-configurator * { box-sizing: border-box; }
.tajoka-ornament-controls h2 { margin: 0 0 8px; font-size: 23px; line-height: 1.25; }
.tajoka-ornament-intro { margin: 0 0 18px; color: #4f5967; line-height: 1.55; }
.tajoka-ornament-model-field { min-width: 0; margin: 0 0 18px; padding: 0; border: 0; }
.tajoka-ornament-model-field legend { margin-bottom: 7px; color: #1d2633; font-weight: 700; }
.tajoka-ornament-model-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 5px; }
.tajoka-ornament-model-option { position: relative; min-width: 0; cursor: pointer; }
.tajoka-ornament-model-option input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}
.tajoka-ornament-model-card {
    display: flex;
    height: 100%;
    min-height: 76px;
    flex-direction: column;
    overflow: hidden;
    border: 2px solid #d6dce4;
    border-radius: 8px;
    background: #f7f9fb;
    color: #364152;
    font-size: 9px;
    line-height: 1.2;
    text-align: center;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.tajoka-ornament-model-card canvas { display: block; width: 100%; aspect-ratio: 1 / 1; background: #111827; }
.tajoka-ornament-model-card > span { display: flex; min-height: 30px; align-items: center; justify-content: center; padding: 3px 2px; }
.tajoka-ornament-model-option:hover .tajoka-ornament-model-card { border-color: #6f8ca0; transform: translateY(-1px); }
.tajoka-ornament-model-option input:checked + .tajoka-ornament-model-card {
    border-color: #0073aa;
    box-shadow: 0 0 0 2px rgba(0, 115, 170, .18);
}
.tajoka-ornament-model-option input:focus-visible + .tajoka-ornament-model-card { outline: 3px solid #2271b1; outline-offset: 2px; }
.tajoka-ornament-field { display: block; margin: 0 0 17px; }
.tajoka-ornament-field > span,
.tajoka-ornament-size-field > label { display: block; margin-bottom: 6px; color: #1d2633; font-weight: 700; }
.tajoka-ornament-field input[type="text"],
.tajoka-ornament-field select {
    width: 100%;
    min-height: 44px;
    padding: 8px 11px;
    border: 1px solid #9ba5b2;
    border-radius: 7px;
    background: #fff;
    color: #18202c;
    font-size: 16px;
}
.tajoka-ornament-field select option:nth-child(1) { font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif; }
.tajoka-ornament-field select option:nth-child(2) { font-family: "Tajoka Montserrat", sans-serif; font-weight: 800; }
.tajoka-ornament-field select option:nth-child(3) { font-family: "Tajoka Holtwood One SC", serif; }
.tajoka-ornament-field select option:nth-child(4) { font-family: "Tajoka Rye", serif; }
.tajoka-ornament-field select option:nth-child(5) { font-family: "Tajoka Germania One", serif; }
.tajoka-ornament-field select option:nth-child(6) { font-family: "Tajoka Courgette", cursive; }
.tajoka-ornament-field select option:nth-child(7) { font-family: "Tajoka Sancreek", serif; }
.tajoka-ornament-field select option:nth-child(8) { font-family: "Tajoka Oleo Script", cursive; }
.tajoka-ornament-field select option:nth-child(9) { font-family: "Tajoka Caveat Brush", cursive; }
.tajoka-ornament-field small { display: block; margin-top: 6px; color: #66717f; line-height: 1.4; }
.tajoka-ornament-size-row { display: grid; grid-template-columns: 1fr 78px; gap: 12px; align-items: center; }
.tajoka-ornament-size-row input[type="range"] { width: 100%; accent-color: #157aa6; }
.tajoka-ornament-size-row output {
    padding: 8px 7px;
    border: 1px solid #9ba5b2;
    border-radius: 7px;
    background: #f7f9fb;
    font-weight: 700;
    text-align: center;
}
.tajoka-ornament-price {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 20px;
    padding: 14px 15px;
    border-radius: 9px;
    background: #eef8fc;
    color: #143448;
}
.tajoka-ornament-price strong { color: #0073aa; font-size: 22px; white-space: nowrap; }
.tajoka-ornament-preview { width: 100%; min-width: 0; max-width: 100%; overflow: hidden; }
.tajoka-ornament-stage {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: clamp(440px, 46vw, 560px);
    min-height: 0;
    overflow: hidden;
    border-radius: 12px;
    background: radial-gradient(circle at 50% 40%, #233149 0, #111827 64%, #0b101b 100%);
}
.tajoka-ornament-stage canvas {
    display: block;
    width: 100% !important;
    height: 100% !important;
    min-height: 0;
    max-width: none !important;
    touch-action: none;
    cursor: grab;
}
.tajoka-ornament-stage canvas:active { cursor: grabbing; }
.tajoka-ornament-loading,
.tajoka-ornament-fallback {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    color: #fff;
    text-align: center;
}
.tajoka-ornament-loading[hidden],
.tajoka-ornament-fallback[hidden] { display: none; }
.tajoka-ornament-hint,
.tajoka-ornament-dimensions { margin: 8px 0 0; color: #626d7a; font-size: 13px; text-align: center; }
.tajoka-ornament-dimensions { color: #29384b; font-size: 14px; }

.tajoka-ornament-cart-form {
    display: flex !important;
    align-items: center;
    gap: 10px;
    width: 100%;
    max-width: 1180px;
    clear: both;
    margin: 0 auto 34px !important;
    padding: 16px 20px;
    border: 1px solid #d7dce3;
    border-radius: 12px;
    background: #fff;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
}
.tajoka-ornament-cart-form::before {
    content: "Patikrinkite pasirinkimus ir įdėkite žaisliuką į krepšelį";
    margin-right: auto;
    color: #263342;
    font-weight: 700;
}

@media (max-width: 920px) {
    .tajoka-ornament-configurator { grid-template-columns: 1fr; padding: 15px; }
    .tajoka-ornament-stage { height: clamp(360px, 88vw, 520px); }
    .tajoka-ornament-cart-form { flex-wrap: wrap; }
    .tajoka-ornament-cart-form::before { flex-basis: 100%; }
}

@media (max-width: 480px) {
    .tajoka-ornament-model-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
    .tajoka-ornament-model-card { min-height: 72px; font-size: 7px; }
    .tajoka-ornament-model-card > span { min-height: 28px; padding: 2px 1px; }
}

@media (prefers-reduced-motion: reduce) {
    .tajoka-ornament-stage canvas { scroll-behavior: auto; }
}