:root{--bg:#0b0f19;--bg-2:#111827;--ink:#e8ecf5;--ink-dim:#9aa6bf;--line:#ffffff17;--cell-gap:4px;--c-alkalijski:#ff7a59;--c-zemnoalkalijski:#ffb443;--c-prijelazni:#7ec8e3;--c-postprijelazni:#8ee6b4;--c-polumetal:#c9a7ff;--c-nemetal:#6ee7d0;--c-halogeni:#ffe066;--c-plemeniti:#ff8fc7;--c-lantanoid:#a5b4fc;--c-aktinoid:#f0a6ca;--c-nepoznato:#9aa6bf}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;font-family:Inter,Segoe UI,system-ui,-apple-system,sans-serif}.app{flex-direction:column;gap:clamp(10px,1.6vh,20px);height:100%;padding:clamp(12px,2vh,24px) clamp(14px,2vw,32px);display:flex;overflow:hidden}.gornji-zaslon{flex-direction:column;flex:1;gap:clamp(10px,1.6vh,20px);min-height:0;padding-bottom:clamp(18px,4vh,52px);display:flex}.header{flex:none;justify-content:center;display:flex}.ime-elementi{justify-content:center;align-items:stretch;gap:clamp(4px,.7vw,10px);display:flex}.ime-tile{--bb:#6aa84f;aspect-ratio:1;text-align:center;background:linear-gradient(170deg,#1d2a1a,#0e1410 70%);border:1px solid #a0c88c47;border-radius:4px;flex-direction:column;justify-content:center;align-items:center;width:clamp(46px,5.6vw,78px);padding:6% 8%;animation:.7s cubic-bezier(.2,.9,.3,1) backwards ime-in;display:flex;position:relative;box-shadow:0 10px 30px #00000080,inset 0 1px #ffffff0f}.ime-slovo{letter-spacing:-.02em;color:#e8ecf5;align-items:center;padding:0 1px;font-size:clamp(26px,3.4vw,48px);font-weight:700;animation:.7s cubic-bezier(.2,.9,.3,1) backwards ime-in;display:flex}.ime-tile:first-child{animation-delay:50ms}.ime-tile:nth-child(2){animation-delay:.17s}.ime-tile:nth-child(3){animation-delay:.29s}.ime-tile:nth-child(4){animation-delay:.41s}.ime-tile:nth-child(5){animation-delay:.53s}@keyframes ime-in{0%{opacity:0;transform:translateY(14px)rotateX(-40deg)}to{opacity:1;transform:none}}.ime-num{color:#d2ebc8bf;font-variant-numeric:tabular-nums;font-size:clamp(8px,.72vw,11px);position:absolute;top:7%;left:11%}.ime-sym{letter-spacing:-.03em;color:#d9f0cf;text-shadow:0 0 18px #6aa84f59;font-size:clamp(20px,2.6vw,38px);font-weight:700;line-height:1}.ime-nm{color:#bed7b499;margin-top:2px;font-size:clamp(6px,.55vw,9px);line-height:1.1}.subtitle{letter-spacing:.18em;text-transform:uppercase;color:var(--ink-dim);margin:10px 0 0;font-size:clamp(12px,1.2vw,15px)}.intro{max-width:62ch;color:var(--ink-dim);margin:8px 0 0;font-size:clamp(12px,1.05vw,14px);line-height:1.55}.controls{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.btn{appearance:none;border:1px solid var(--line);color:var(--ink);font:inherit;cursor:pointer;background:#ffffff0a;border-radius:999px;padding:9px 16px;font-size:13px;transition:background .18s,border-color .18s,transform .12s}.btn:hover{background:#ffffff1a;border-color:#ffffff3d}.btn:active{transform:translateY(1px)}.btn-on{color:#cfeaff;background:#9ad8ff29;border-color:#9ad8ff80}.table-wrap{flex:1;justify-content:center;align-items:center;min-height:0;display:flex}.table{gap:var(--cell-gap);aspect-ratio:18/10.35;grid-template-rows:repeat(7,minmax(0,1fr)) .35fr repeat(2,minmax(0,1fr));grid-template-columns:repeat(18,minmax(0,1fr));width:100%;max-width:100%;height:100%;max-height:100%;margin:0 auto;display:grid}.f-gap{pointer-events:none}.cell{--tint:var(--c-nepoznato);perspective:800px;min-width:0;min-height:0;transition:opacity .25s,filter .25s;position:relative}.cell.cat-alkalijski{--tint:var(--c-alkalijski)}.cell.cat-zemnoalkalijski{--tint:var(--c-zemnoalkalijski)}.cell.cat-prijelazni{--tint:var(--c-prijelazni)}.cell.cat-postprijelazni{--tint:var(--c-postprijelazni)}.cell.cat-polumetal{--tint:var(--c-polumetal)}.cell.cat-nemetal{--tint:var(--c-nemetal)}.cell.cat-halogeni{--tint:var(--c-halogeni)}.cell.cat-plemeniti{--tint:var(--c-plemeniti)}.cell.cat-lantanoid{--tint:var(--c-lantanoid)}.cell.cat-aktinoid{--tint:var(--c-aktinoid)}.cell.cat-nepoznato{--tint:var(--c-nepoznato)}.cell.is-dimmed{opacity:.16;filter:saturate(.2)}.cell-inner{transform-style:preserve-3d;transform-origin:var(--origin-x,center) var(--origin-y,center);transition:transform .55s cubic-bezier(.34,1.3,.5,1);position:absolute;inset:0}.face{backface-visibility:hidden;text-align:center;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;padding:4% 5%;display:flex;position:absolute;inset:0;overflow:hidden}.face-front{background:linear-gradient(160deg, color-mix(in srgb, var(--tint) 22%, transparent), color-mix(in srgb, var(--tint) 7%, transparent)),  #0e141ee6;border:1px solid color-mix(in srgb, var(--tint) 34%, transparent);color:var(--ink)}.num{color:color-mix(in srgb, var(--tint) 85%, white);font-variant-numeric:tabular-nums;opacity:.85;font-size:clamp(6px,.62vw,11px);position:absolute;top:5%;left:8%}.sym{letter-spacing:-.01em;color:color-mix(in srgb, var(--tint) 55%, white);font-size:clamp(11px,1.55vw,27px);font-weight:650;line-height:1}.nm{color:var(--ink-dim);text-overflow:ellipsis;white-space:nowrap;max-width:100%;margin-top:2px;font-size:clamp(5px,.52vw,9px);line-height:1.1;overflow:hidden}.mass{color:#ffffff52;font-variant-numeric:tabular-nums;font-size:clamp(4.5px,.46vw,8px)}.year-tag{letter-spacing:.04em;color:color-mix(in srgb, var(--tint) 70%, white);opacity:.65;font-size:clamp(4.5px,.44vw,8px);position:absolute;bottom:4%;right:7%}.is-year{cursor:pointer}.is-year .face-front:after{content:"";border-radius:inherit;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--tint) 55%, transparent);opacity:0;transition:opacity .2s;position:absolute;inset:0}.is-year:hover .face-front:after,.is-year:focus-visible .face-front:after{opacity:1}.is-year:hover .cell-inner,.is-year:focus-visible .cell-inner{transform:translateZ(14px)scale(1.06)}.is-year:focus-visible{outline:none}.is-year:focus-visible .face-front{border-color:#fff}.is-locked .face-front{filter:saturate(.35)brightness(.82)}.is-locked .sym{color:color-mix(in srgb, var(--tint) 30%, #ffffff8c)}.lock-badge{opacity:.5;filter:grayscale();font-size:clamp(4.5px,.46vw,8px);position:absolute;bottom:5%;right:7%}.is-locked .face-back{background:linear-gradient(155deg,#161c2e,#0d1220 70%);border-color:#ffffff29}.back-lock{opacity:.55;filter:grayscale();margin-bottom:2px;font-size:clamp(6px,.62vw,11px)}.is-locked .back-title{color:#e8ecf58c}.is-locked .back-text strong,.is-locked .back-text{color:#e8ecf5cc}.odbrojavanje{border:1px solid var(--line);color:var(--ink-dim);background:#ffffff0d;border-radius:999px;align-items:center;gap:8px;padding:7px 14px;display:inline-flex}.odbrojavanje strong{color:var(--ink);font-variant-numeric:tabular-nums;font-weight:600}.lokot{filter:grayscale(.4);font-size:.95em}.cell.is-flipped{z-index:30}.cell.is-flipped .cell-inner{transform:rotateY(180deg) scale(var(--flip-scale,3.4))}.cell.is-flipped:hover .cell-inner{--flip-scale:3.55}.cell.ima-dogadaje .face-front{border-color:color-mix(in srgb, var(--c-halogeni) 42%, transparent)}.cell.ima-dogadaje:hover .cell-inner{transform:translateZ(16px)scale(1.1)}.cell.edge-left .cell-inner{--origin-x:right}.cell.edge-right .cell-inner{--origin-x:left}.cell.edge-top .cell-inner{--origin-y:top}.cell.edge-bottom .cell-inner{--origin-y:bottom}.table.no-zoom .cell.is-flipped .cell-inner,.table.no-zoom .cell.is-flipped:hover .cell-inner{--flip-scale:1}.table.no-zoom .is-year:not(.is-flipped):hover .cell-inner{transform:translateZ(10px)scale(1.03)}.face-back{background:linear-gradient(155deg, color-mix(in srgb, var(--tint) 30%, #0d1220), #0d1220 70%);border:1px solid color-mix(in srgb, var(--tint) 60%, transparent);gap:1px;padding:6% 7%;transform:rotateY(180deg);box-shadow:0 18px 46px #0009}.back-year{color:color-mix(in srgb, var(--tint) 70%, white);opacity:.6;font-variant-numeric:tabular-nums;font-size:clamp(5px,.5vw,9px);font-weight:700;position:absolute;top:4%;right:7%}.back-title{color:color-mix(in srgb, var(--tint) 45%, white);margin-bottom:1px;font-size:clamp(4.5px,.5vw,9px);font-weight:650;line-height:1.2}.back-text{color:#e8ecf5db;-webkit-line-clamp:7;-webkit-box-orient:vertical;font-size:clamp(3.4px,.36vw,6.5px);line-height:1.35;display:-webkit-box;overflow:hidden}.back-empty{color:#ffffff4d;letter-spacing:.05em;font-size:clamp(3.6px,.38vw,7px)}.legend{flex-wrap:wrap;justify-content:center;gap:6px 14px;display:flex}.legend-item{--tint:var(--c-nepoznato);appearance:none;color:var(--ink-dim);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:6px;align-items:center;gap:6px;padding:3px 6px;font-size:clamp(9px,.78vw,12px);transition:color .18s;display:inline-flex}.legend-item.cat-alkalijski{--tint:var(--c-alkalijski)}.legend-item.cat-zemnoalkalijski{--tint:var(--c-zemnoalkalijski)}.legend-item.cat-prijelazni{--tint:var(--c-prijelazni)}.legend-item.cat-postprijelazni{--tint:var(--c-postprijelazni)}.legend-item.cat-polumetal{--tint:var(--c-polumetal)}.legend-item.cat-nemetal{--tint:var(--c-nemetal)}.legend-item.cat-halogeni{--tint:var(--c-halogeni)}.legend-item.cat-plemeniti{--tint:var(--c-plemeniti)}.legend-item.cat-lantanoid{--tint:var(--c-lantanoid)}.legend-item.cat-aktinoid{--tint:var(--c-aktinoid)}.legend-item.cat-nepoznato{--tint:var(--c-nepoznato)}.legend-item:hover,.legend-item.is-active{color:var(--ink)}.swatch{background:var(--tint);opacity:.8;border-radius:3px;width:9px;height:9px}@media (width<=760px){.app{gap:10px;height:auto;min-height:100%;padding:10px;overflow-y:auto}.gornji-zaslon{justify-content:flex-start;min-height:auto;padding-bottom:0}.table-wrap{-webkit-overflow-scrolling:touch;flex:none;justify-content:flex-start;align-items:flex-start;overflow:auto hidden}.table{aspect-ratio:18/10.35;--cell-gap:3px;width:760px;min-width:760px;height:auto}.cell.is-flipped .cell-inner,.cell.is-flipped:hover .cell-inner,.cell.ima-dogadaje:hover .cell-inner,.is-year:hover .cell-inner{transform:none}.cell:active .cell-inner{transform:scale(.92)}.legend{gap:4px 10px}.legend-item{font-size:10px}}@media (height<=460px) and (orientation:landscape){.app{gap:6px;padding:8px 10px}.gornji-zaslon{gap:6px;min-height:auto}.ime-tile{width:clamp(30px,4.4vh,42px)}.legend{display:none}.table-wrap{-webkit-overflow-scrolling:touch;margin:0;padding:0;overflow:auto hidden}.table{aspect-ratio:auto;--cell-gap:2px;width:calc(173.913vh - 146.087px);min-width:calc(173.913vh - 146.087px);max-width:none;height:calc(100vh - 84px);max-height:none}}@media (prefers-reduced-motion:reduce){.cell-inner{transition:none}}.timeline{border-top:1px solid var(--line);margin-top:clamp(16px,3vh,32px);padding:clamp(28px,5vh,56px) 0 clamp(16px,3vh,32px)}.tl-crta{height:74px;margin:0 clamp(20px,4vw,60px) 8px;position:relative}.tl-linija{background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--c-prijelazni) 45%, transparent) 12%, color-mix(in srgb, var(--c-plemeniti) 45%, transparent) 88%, transparent);height:2px;position:absolute;top:15px;left:0;right:0}.tl-tocka{appearance:none;color:var(--ink-dim);font:inherit;cursor:pointer;background:0 0;border:0;flex-direction:column;align-items:center;gap:6px;padding:0 6px;transition:color .18s;display:flex;position:absolute;top:0;transform:translate(-50%)}.tl-kvrga{background:var(--bg-2);border:2px solid color-mix(in srgb, var(--c-prijelazni) 60%, transparent);border-radius:50%;width:12px;height:12px;margin-top:10px;transition:transform .18s,border-color .18s,box-shadow .18s}.tl-tocka.ima-istaknuto .tl-kvrga{border-color:var(--c-halogeni);box-shadow:0 0 0 4px color-mix(in srgb, var(--c-halogeni) 14%, transparent)}.tl-godina{font-variant-numeric:tabular-nums;letter-spacing:.02em;font-size:clamp(10px,.85vw,13px)}.tl-broj{background:color-mix(in srgb, var(--c-prijelazni) 26%, var(--bg-2));border:1px solid var(--line);min-width:15px;height:15px;color:var(--ink);border-radius:999px;padding:0 4px;font-size:9px;line-height:13px;position:absolute;top:4px;right:-2px}.tl-tocka:hover,.tl-tocka:focus-visible{color:var(--ink)}.tl-tocka:hover .tl-kvrga{transform:scale(1.35)}.tl-tocka.je-odabrana{color:var(--ink)}.tl-tocka.je-odabrana .tl-kvrga{background:var(--c-prijelazni);border-color:#fff;transform:scale(1.5)}.tl-panel{margin:20px clamp(20px,4vw,60px) 0;animation:.3s tl-in}@keyframes tl-in{0%{opacity:0;transform:translateY(-8px)}}.tl-panel-vrh{align-items:baseline;gap:12px;margin-bottom:14px;display:flex}.tl-panel-vrh h3{font-variant-numeric:tabular-nums;color:color-mix(in srgb, var(--c-prijelazni) 40%, white);margin:0;font-size:clamp(24px,3vw,38px);font-weight:700}.tl-zatvori{appearance:none;border:1px solid var(--line);color:var(--ink-dim);cursor:pointer;background:#ffffff0a;border-radius:50%;width:30px;height:30px;margin-left:auto;font-size:17px;line-height:1}.tl-zatvori:hover{color:var(--ink);background:#ffffff1a}.tl-kartice{grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px;display:grid}.tl-kartica{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;flex-direction:column;gap:9px;padding:16px 18px;display:flex}.tl-kartica.je-istaknuto{border-color:color-mix(in srgb, var(--c-halogeni) 34%, transparent);background:linear-gradient(155deg, color-mix(in srgb, var(--c-halogeni) 7%, var(--bg-2)), var(--bg-2) 60%)}.tl-kartica-vrh{align-items:flex-start;gap:8px;display:flex}.tl-kartica h4{color:var(--ink);margin:0;font-size:14px;font-weight:620;line-height:1.35}.tl-zvijezda{color:var(--c-halogeni);font-size:13px;line-height:1.4}.tl-opis{color:var(--ink-dim);margin:0;font-size:12.5px;line-height:1.5}.tl-isjecak{object-fit:contain;object-position:left center;border:1px solid var(--line);background:#fff;border-radius:7px;width:100%;max-height:150px;padding:4px}.tl-citat{border-left:2px solid color-mix(in srgb, var(--c-prijelazni) 45%, transparent);color:#e8ecf5b8;margin:0;padding-left:11px;font-size:11.5px;font-style:italic;line-height:1.55}.tl-napomena{color:#fff6;margin:0;font-size:11px}.tl-linkovi{flex-wrap:wrap;gap:6px 14px;margin-top:auto;padding-top:4px;display:flex}.tl-linkovi a{color:color-mix(in srgb, var(--c-prijelazni) 45%, white);border-bottom:1px solid #0000;font-size:11.5px;text-decoration:none}.tl-linkovi a:hover{border-bottom-color:currentColor}@media (width<=700px){.tl-crta{height:90px}.tl-godina{writing-mode:vertical-rl;font-size:10px}}.cell.ima-dogadaje .face-front{border-color:color-mix(in srgb, var(--c-halogeni) 60%, transparent);box-shadow:0 0 0 1px color-mix(in srgb, var(--c-halogeni) 26%, transparent), 0 0 16px color-mix(in srgb, var(--c-halogeni) 20%, transparent)}.oznaka-dogadaja{background:linear-gradient(225deg, var(--c-halogeni) 0%, var(--c-halogeni) 50%, transparent 50%);border-top-right-radius:5px;width:26%;min-width:7px;height:26%;min-height:7px;animation:3.4s ease-in-out infinite oznaka-kuca;position:absolute;top:0;right:0}@keyframes oznaka-kuca{0%,to{opacity:.85}50%{opacity:1}}@media (prefers-reduced-motion:reduce){.oznaka-dogadaja{animation:none}}.mg-pozadina{z-index:100;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#060911d1;justify-content:center;align-items:center;padding:clamp(12px,3vh,40px) clamp(12px,3vw,40px);animation:.22s mg-fade;display:flex;position:fixed;inset:0}@keyframes mg-fade{0%{opacity:0}}.mg-okvir{background:var(--bg);border:1px solid var(--line);border-radius:16px;flex-direction:column;width:min(1180px,100%);max-height:100%;animation:.28s cubic-bezier(.2,.9,.3,1) mg-up;display:flex;overflow:hidden;box-shadow:0 32px 90px #000000b3}@keyframes mg-up{0%{opacity:0;transform:translateY(18px)scale(.98)}}.mg-vrh{--tint:var(--c-nepoznato);border-bottom:1px solid var(--line);background:linear-gradient(120deg, color-mix(in srgb, var(--tint) 16%, transparent), transparent 62%);align-items:center;gap:clamp(14px,2vw,26px);padding:clamp(14px,2.2vh,22px) clamp(16px,2.4vw,28px);display:flex}.mg-vrh.cat-alkalijski{--tint:var(--c-alkalijski)}.mg-vrh.cat-zemnoalkalijski{--tint:var(--c-zemnoalkalijski)}.mg-vrh.cat-prijelazni{--tint:var(--c-prijelazni)}.mg-vrh.cat-postprijelazni{--tint:var(--c-postprijelazni)}.mg-vrh.cat-polumetal{--tint:var(--c-polumetal)}.mg-vrh.cat-nemetal{--tint:var(--c-nemetal)}.mg-vrh.cat-halogeni{--tint:var(--c-halogeni)}.mg-vrh.cat-plemeniti{--tint:var(--c-plemeniti)}.mg-vrh.cat-lantanoid{--tint:var(--c-lantanoid)}.mg-vrh.cat-aktinoid{--tint:var(--c-aktinoid)}.mg-vrh.cat-nepoznato{--tint:var(--c-nepoznato)}.mg-element{aspect-ratio:1;background:linear-gradient(158deg, color-mix(in srgb, var(--tint) 28%, transparent), color-mix(in srgb, var(--tint) 8%, transparent)), var(--bg-2);border:1px solid color-mix(in srgb, var(--tint) 46%, transparent);border-radius:11px;flex-direction:column;flex:none;justify-content:center;align-items:center;width:clamp(62px,7vw,92px);display:flex;position:relative}.mg-broj{color:color-mix(in srgb, var(--tint) 80%, white);font-variant-numeric:tabular-nums;opacity:.85;font-size:clamp(8px,.7vw,11px);position:absolute;top:7%;left:11%}.mg-simbol{color:color-mix(in srgb, var(--tint) 40%, white);font-size:clamp(24px,3vw,40px);font-weight:700;line-height:1}.mg-naziv{color:var(--ink-dim);margin-top:3px;font-size:clamp(7px,.62vw,10px)}.mg-naslovi h2{font-variant-numeric:tabular-nums;color:color-mix(in srgb, var(--tint) 34%, white);margin:0;font-size:clamp(26px,3.4vw,44px);font-weight:700;line-height:1}.mg-naslovi p{color:var(--ink-dim);margin:6px 0 0;font-size:clamp(11px,1vw,13.5px)}.mg-zatvori{appearance:none;border:1px solid var(--line);color:var(--ink-dim);cursor:pointer;background:#ffffff0d;border-radius:50%;align-self:flex-start;width:34px;height:34px;margin-left:auto;font-size:19px;line-height:1;transition:color .16s,background .16s}.mg-zatvori:hover{color:var(--ink);background:#ffffff1f}.mg-sadrzaj{flex-direction:column;gap:18px;padding:clamp(16px,2.4vh,24px) clamp(16px,2.4vw,28px) clamp(20px,3vh,30px);display:flex;overflow-y:auto}.mg-poruka{border:1px solid var(--line);background:#ffffff09;border-radius:11px;padding:14px 18px}.mg-poruka h3{color:var(--ink);margin:0 0 6px;font-size:15px;font-weight:620}.mg-poruka p{color:#e8ecf5d1;margin:0;font-size:13.5px;line-height:1.6}.mg-prazno{text-align:center;color:var(--ink-dim);margin:0;padding:26px 0;font-size:13px}.mg-zakljucano{text-align:center;color:#e8ecf5c7;flex-direction:column;align-items:center;gap:12px;margin:0;padding:30px 18px;font-size:15px;line-height:1.5;display:flex}.mg-lokot{opacity:.5;filter:grayscale();font-size:30px}.mg-navigacija{padding:10px clamp(16px, 2.4vw, 28px) calc(10px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);background:#ffffff05;justify-content:space-between;gap:10px;display:flex}.mg-strelica{appearance:none;border:1px solid var(--line);color:var(--ink-dim);font:inherit;font-variant-numeric:tabular-nums;cursor:pointer;background:#ffffff0a;border-radius:9px;min-height:40px;padding:9px 16px;font-size:13px;transition:color .18s,background .18s}.mg-strelica:hover:not(:disabled){color:var(--ink);background:#ffffff17}.mg-strelica:disabled{opacity:.3;cursor:default}.mg-sadrzaj .tl-isjecak{max-height:190px}@media (width<=760px){.mg-pozadina{padding:0}.mg-okvir{border:0;border-radius:0;width:100%;height:100dvh;max-height:none}.mg-sadrzaj{flex:1}.mg-vrh{padding-top:calc(14px + env(safe-area-inset-top,0px));gap:14px}.mg-element{width:58px}.mg-zatvori{min-width:40px;min-height:40px}}.pin{justify-content:center;align-items:center;min-height:100%;padding:24px;display:flex}.pin-okvir{flex-direction:column;align-items:center;gap:clamp(18px,3vh,30px);animation:.5s backwards ime-in;display:flex}.pin-tocke{gap:12px;display:flex}.pin-tocke.je-greska{animation:.45s pin-trese}@keyframes pin-trese{0%,to{transform:translate(0)}20%,60%{transform:translate(-8px)}40%,80%{transform:translate(8px)}}.pin-tocka{border:1.5px solid #a0c88c66;border-radius:50%;width:12px;height:12px;transition:background .15s,border-color .15s}.pin-tocka.puna{background:#6aa84f;border-color:#8fce6f;box-shadow:0 0 12px #6aa84f80}.pin-tocke.je-greska .pin-tocka{box-shadow:none;background:#e06a5a;border-color:#e06a5a}.pin-tipke{grid-template-columns:repeat(3,1fr);gap:clamp(10px,1.6vh,16px);display:grid}.pin-tipka{appearance:none;aspect-ratio:1;color:#d9f0cf;width:clamp(58px,8vh,74px);font:inherit;cursor:pointer;background:linear-gradient(170deg,#1a2418,#0e1310 70%);border:1px solid #a0c88c38;border-radius:50%;font-size:clamp(19px,2.4vh,24px);font-weight:500;transition:background .14s,transform .1s}.pin-tipka:hover{background:linear-gradient(170deg,#24331f,#131a14 70%)}.pin-tipka:active{transform:scale(.94)}.pin-brisi{color:var(--ink-dim);font-size:clamp(15px,2vh,19px)}@media (height<=460px) and (orientation:landscape){.pin-okvir{gap:12px}.pin-tipke{gap:7px}.pin-tipka{width:clamp(40px,11vh,54px);font-size:16px}}.pin-zagonetka{gap:clamp(8px,1.6vw,16px);margin-bottom:2px;display:flex}.pin-simbol{aspect-ratio:1;color:#d9f0cf;letter-spacing:-.03em;text-shadow:0 0 18px #6aa84f59;background:linear-gradient(170deg,#1d2a1a,#0e1410 70%);border:1px solid #a0c88c47;border-radius:4px;justify-content:center;align-items:center;width:clamp(52px,7vh,72px);font-size:clamp(21px,3vh,30px);font-weight:700;display:flex}@media (height<=460px) and (orientation:landscape){.pin-simbol{width:clamp(34px,9vh,46px);font-size:clamp(15px,4vh,20px)}}.back-naziv{color:color-mix(in srgb, var(--tint) 45%, white);letter-spacing:.03em;margin-bottom:1.5px;font-size:clamp(3.6px,.38vw,6.5px)}.back-kalendarska{color:#fffffff0;font-variant-numeric:tabular-nums;font-size:clamp(7px,.75vw,13px);font-weight:700;line-height:1}.back-dob{color:#e8ecf599;margin-top:2px;font-size:clamp(3.4px,.36vw,6px)}.pozadina{z-index:-1;pointer-events:none;--nebo-1:#0d1b2a;--nebo-2:#1b3a2f;--polje-1:#14351f;--polje-2:#0b1d13;--sunce:#ffd98a;--sunce-sjaj:#ffd98a38;--brda:#163224;transition:opacity .6s;position:fixed;inset:0;overflow:hidden}.doba-zora{--nebo-1:#2a2140;--nebo-2:#7c4a52;--polje-1:#1f3a24;--polje-2:#10241a;--sunce:#ffb37a;--sunce-sjaj:#ffa06e4d;--brda:#23342a}.doba-dan{--nebo-1:#1d4e6b;--nebo-2:#63a68a;--polje-1:#2f6b34;--polje-2:#17381f;--sunce:#fff2c4;--sunce-sjaj:#fff0b457;--brda:#2b5738}.doba-kasnoPopodne{--nebo-1:#2d4360;--nebo-2:#c98b5a;--polje-1:#2c5c30;--polje-2:#16301c;--sunce:#ffc978;--sunce-sjaj:#ffbe6e57;--brda:#294c33}.doba-sumrak{--nebo-1:#16203a;--nebo-2:#4a3358;--polje-1:#1a3d24;--polje-2:#0d2116;--sunce:#ff9d6e;--sunce-sjaj:#ff8c6438;--brda:#1d3527}.doba-noc{--nebo-1:#060d18;--nebo-2:#10243a;--polje-1:#0f2618;--polje-2:#071410;--sunce:#cfe0ff;--sunce-sjaj:#bed7ff29;--brda:#102019}.poz-nebo{background:linear-gradient(180deg, var(--nebo-1) 0%, var(--nebo-2) 62%);transition:background 1.4s;position:absolute;inset:0}.poz-sunce{aspect-ratio:1;background:radial-gradient(circle, var(--sunce) 0%, var(--sunce-sjaj) 42%, transparent 70%);filter:blur(1px);border-radius:50%;width:clamp(120px,17vw,280px);transition:background 1.4s;animation:9s ease-in-out infinite poz-disi;position:absolute;top:9%;right:13%}@keyframes poz-disi{0%,to{opacity:.9;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}}.poz-brda{background:var(--brda);opacity:.75;clip-path:polygon(0% 100%,0% 62%,9% 48%,17% 58%,26% 39%,35% 52%,44% 34%,53% 50%,62% 41%,71% 55%,80% 44%,89% 57%,100% 46%,100% 100%);height:24%;transition:background 1.4s;position:absolute;bottom:31%;left:-5%;right:-5%}.poz-polje{background:linear-gradient(180deg, var(--polje-1), var(--polje-2));clip-path:polygon(0% 22%,12% 14%,27% 20%,41% 11%,58% 18%,72% 10%,86% 17%,100% 12%,100% 100%,0% 100%);height:38%;transition:background 1.4s;position:absolute;bottom:0;left:0;right:0}.pozadina:after{content:"";background:linear-gradient(#060c0a57 0%,#060c0a70 52%,#060c0a8f 100%);position:absolute;inset:0}.poz-oblaci{position:absolute;inset:0}.poz-oblak{filter:blur(6px);background:radial-gradient(at 50% 60%,#ffffff26,#ffffff0a 60%,#0000 72%);border-radius:999px;animation:linear infinite poz-plovi;position:absolute}.poz-oblak.o1{width:42vw;height:12vh;animation-duration:120s;top:14%}.poz-oblak.o2{opacity:.75;width:33vw;height:9vh;animation-duration:165s;animation-delay:-40s;top:27%}.poz-oblak.o3{opacity:.55;width:26vw;height:7vh;animation-duration:200s;animation-delay:-90s;top:8%}@keyframes poz-plovi{0%{transform:translate(-45vw)}to{transform:translate(115vw)}}.vrijeme-oblacno .poz-oblak{background:radial-gradient(at 50% 60%,#ffffff3d,#ffffff12 60%,#0000 74%)}.poz-oborina{position:absolute;inset:0}.poz-oborina span{animation-name:poz-pada;animation-timing-function:linear;animation-iteration-count:infinite;position:absolute;top:-8%}.poz-oborina.kisa span,.poz-oborina.grmljavina span{background:linear-gradient(#0000,#bedcff80);width:1px;height:46px}.poz-oborina.snijeg span{background:#ffffffbf;border-radius:50%;animation-name:poz-veje}@keyframes poz-pada{to{transform:translateY(116vh)}}@keyframes poz-veje{to{transform:translate(14px,116vh)}}.poz-magla{background:linear-gradient(#0000 20%,#c8d7e129 55%,#c8d7e142 100%);animation:14s ease-in-out infinite poz-disi;position:absolute;inset:0}.poz-munja{opacity:0;background:radial-gradient(at 62% 22%,#dcebff80,#c8e1ff24 45%,#0000 72%);animation:14s step-end infinite poz-bljesak;position:absolute;inset:0 0 40%}@keyframes poz-bljesak{0%,96%,to{opacity:0}96.6%{opacity:.85}97.2%{opacity:0}97.8%{opacity:.55}98.4%{opacity:0}}.poz-zvijezde{opacity:.55;background-image:radial-gradient(1.4px 1.4px at 12% 18%,#fff,#0000),radial-gradient(1.2px 1.2px at 27% 9%,#fff,#0000),radial-gradient(1.6px 1.6px at 41% 26%,#fff,#0000),radial-gradient(1.1px 1.1px at 58% 12%,#fff,#0000),radial-gradient(1.5px 1.5px at 69% 31%,#fff,#0000),radial-gradient(1.2px 1.2px at 82% 16%,#fff,#0000),radial-gradient(1.3px 1.3px at 91% 28%,#fff,#0000),radial-gradient(1px 1px at 34% 38%,#fff,#0000),radial-gradient(1.2px 1.2px at 6% 33%,#fff,#0000),radial-gradient(1px 1px at 74% 7%,#fff,#0000);animation:5s ease-in-out infinite poz-trepti;position:absolute;inset:0 0 40%}@keyframes poz-trepti{0%,to{opacity:.4}50%{opacity:.68}}.vrijeme-znak{z-index:5;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#d6e8d0bf;pointer-events:none;background:#0a100c73;border:1px solid #a0c88c29;border-radius:999px;align-items:center;gap:7px;padding:6px 13px;font-size:clamp(10px,.85vw,12.5px);display:flex;position:fixed;bottom:clamp(10px,1.6vh,18px);right:clamp(12px,2vw,24px)}.vz-ikona{font-size:1.15em;line-height:1}.vrijeme-znak strong{color:#e6f3df;font-variant-numeric:tabular-nums;font-weight:620}@media (prefers-reduced-motion:reduce){.poz-oblak,.poz-oborina span,.poz-munja,.poz-sunce,.poz-zvijezde,.poz-magla{animation:none}}@media (height<=460px) and (orientation:landscape){.vrijeme-znak{padding:4px 9px;font-size:9.5px}}.poz-trava{pointer-events:none;height:40%;position:absolute;bottom:0;left:0;right:0}.poz-trava span{background:linear-gradient(180deg, color-mix(in srgb, var(--polje-1) 25%, #8fd97a) 0%, var(--polje-1) 100%);transform-origin:bottom;opacity:.85;border-radius:2px 2px 0 0;width:2.5px;animation-name:poz-njise;animation-timing-function:ease-in-out;animation-iteration-count:infinite;position:absolute;bottom:0}@keyframes poz-njise{0%,to{transform:rotate(-5deg)scaleY(1)}50%{transform:rotate(6deg)scaleY(1.04)}}.poz-ptice,.poz-leptiri{z-index:3;pointer-events:none;position:fixed;inset:0}.poz-jato{gap:18px;animation:linear infinite poz-preleti;display:flex;position:absolute}.poz-jato.j1{animation-duration:58s;top:17%}.poz-jato.j2{opacity:.75;gap:13px;animation-duration:82s;animation-delay:-26s;top:25%;transform:scale(.72)}.poz-jato i{width:16px;height:7px;animation:.9s ease-in-out infinite poz-krila;position:relative}.poz-jato i:nth-child(2){margin-top:9px;animation-delay:.15s}.poz-jato i:nth-child(3){margin-top:-4px;animation-delay:.3s}.poz-jato i:before,.poz-jato i:after{content:"";background:#101a16c7;border-radius:2px;width:9px;height:2px;position:absolute;top:0}.poz-jato i:before{transform-origin:100%;left:0;transform:rotate(-24deg)}.poz-jato i:after{transform-origin:0;right:0;transform:rotate(24deg)}@keyframes poz-preleti{0%{transform:translate(-14vw)}to{transform:translate(112vw)}}@keyframes poz-krila{0%,to{transform:scaleY(1)}50%{transform:scaleY(.42)}}.poz-leptir{width:15px;height:12px;animation:ease-in-out infinite poz-lebdi;position:absolute}.poz-leptir.l1{--pomak:32vw;animation-duration:17s;bottom:21%;left:12%}.poz-leptir.l2{--pomak:-26vw;filter:hue-rotate(48deg);animation-duration:23s;animation-delay:-6s;bottom:15%;left:46%}.poz-leptir.l3{--pomak:20vw;filter:hue-rotate(-32deg);animation-duration:20s;animation-delay:-13s;bottom:27%;left:74%}.poz-leptir i{background:#ffd878e6;border-radius:60% 60% 50% 50%;width:7px;height:12px;animation:.42s ease-in-out infinite poz-leptir-krila;position:absolute;top:0;box-shadow:0 0 6px #ffd27859}.poz-leptir i:first-child{transform-origin:100%;left:0}.poz-leptir i:last-child{transform-origin:0;animation-delay:60ms;right:0}@keyframes poz-leptir-krila{0%,to{transform:scaleX(1)rotate(0)}50%{transform:scaleX(.3)rotate(6deg)}}@keyframes poz-lebdi{0%{transform:translate(0)}25%{transform:translate(calc(var(--pomak) * .3), -26px)}50%{transform:translate(calc(var(--pomak) * .6), 12px)}75%{transform:translate(calc(var(--pomak) * .85), -18px)}to{transform:translate(var(--pomak), 0)}}.poz-svici{position:absolute;inset:0}.poz-svici span{background:#ffe98a;border-radius:50%;width:3px;height:3px;animation-name:poz-svitac;animation-timing-function:ease-in-out;animation-iteration-count:infinite;position:absolute;box-shadow:0 0 8px 2px #ffe98a99}@keyframes poz-svitac{0%,to{opacity:0;transform:translate(0)}20%{opacity:.9}50%{opacity:.25;transform:translate(14px,-12px)}80%{opacity:.85;transform:translate(-6px,-20px)}}@media (prefers-reduced-motion:reduce){.poz-trava span,.poz-jato,.poz-jato i,.poz-leptir,.poz-leptir i,.poz-svici span{animation:none}}.cell.osobna-godina .face-front{border-color:#ff9ebe9e;box-shadow:0 0 0 1px #ff9ebe42,0 0 16px #ff9ebe38}.cell.osobna-godina .oznaka-dogadaja{background:linear-gradient(225deg,#ff9ebe 0% 50%,#0000 50%)}.tl-foto{object-fit:cover;object-position:center;border:1px solid var(--line);background:#00000040;border-radius:8px;width:100%;max-height:260px}.tl-kartica.je-osobno{background:linear-gradient(155deg, #ff9ebe12, var(--bg-2) 60%);border-color:#ff9ebe4d}.tl-kartica.je-osobno h4{color:#ffd9e5}.mg-sadrzaj .tl-foto{max-height:380px}.ime-skupina{perspective:1200px;cursor:pointer;border-radius:10px;padding:7px;transition:background .2s,box-shadow .2s}.ime-skupina:hover,.ime-skupina:focus-visible{background:#78af6412;outline:none;box-shadow:0 0 0 1px #a0c88c66,0 0 22px #6aa84f2e}.ime-unutra{transform-style:preserve-3d;transition:transform .7s cubic-bezier(.34,1.25,.5,1);position:relative}.ime-skupina.je-okrenuta .ime-unutra{transform:rotateY(180deg)}.ime-lice{backface-visibility:hidden}.ime-poledina{backface-visibility:hidden;background:linear-gradient(170deg,#1d2a1a,#0e1410 70%);border:1px solid #a0c88c47;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:8px 18px;display:flex;position:absolute;inset:0;transform:rotateY(180deg);box-shadow:0 10px 30px #00000080}.ip-ime{letter-spacing:-.01em;color:#d9f0cf;text-shadow:0 0 18px #6aa84f4d;white-space:nowrap;font-size:clamp(15px,1.7vw,23px);font-weight:700}.ip-datum{color:#bed7b4b8;white-space:nowrap;font-size:clamp(9px,.9vw,12.5px)}@media (prefers-reduced-motion:reduce){.ime-unutra{transition:none}}