@charset "UTF-8";
:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#23213d;background:#f4f4fa;font-size:16px;--primary:#5b45e0;--muted:#66657a;--border:#e0dfeb;--surface:#fff}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #f0ab32;outline-offset:4px}a{color:inherit;text-decoration:none}button[hidden],[hidden]{display:none!important}
.topbar{max-width:1240px;margin:auto;padding:24px 36px;display:flex;align-items:center;gap:40px;border-bottom:1px solid var(--border)}.brand{display:flex;align-items:center;gap:10px;font-size:24px;font-weight:800;letter-spacing:-1px}.brand-mark{width:40px;height:40px;border-radius:12px;color:#fff;background:var(--primary);text-align:center;line-height:36px;font-size:30px}.topbar nav{display:flex;gap:26px;font-size:.94rem;font-weight:600}.topbar nav a:hover{color:var(--primary)}.local-badge{margin-left:auto;background:#e5f2ec;color:#246548;border-radius:20px;padding:9px 14px;font-size:.8rem;font-weight:650}
main{max-width:1168px;margin:0 auto;padding:44px 0 50px}.intro{padding:0 0 24px}.eyebrow{color:var(--primary);letter-spacing:.12em;font-size:.76rem;font-weight:750;margin:0 0 12px}h1{font-size:clamp(2rem,4vw,3rem);letter-spacing:-.05em;line-height:1.1;margin:0}h1 br{display:none}.lead{color:var(--muted);line-height:1.6;margin:14px 0 0}.notice{background:#fff7e3;border:1px solid #e9dcae;border-radius:14px;padding:16px 20px;display:flex;flex-wrap:wrap;gap:4px 12px;font-size:.88rem;line-height:1.55;margin-bottom:24px}.notice strong{color:#7b4d0a}.notice span{color:#6c6048}
.workspace{display:grid;grid-template-columns:340px minmax(0,1fr);gap:24px}.panel{border:1px solid var(--border);border-radius:20px;background:var(--surface);padding:26px;box-shadow:0 6px 20px #20204a04}.section-label{display:flex;align-items:center;gap:12px;margin-bottom:22px}.section-label>span{font-size:.8rem;background:#efedff;color:var(--primary);border-radius:8px;padding:6px 8px;font-weight:700}h2{font-size:1.25rem;letter-spacing:-.025em;margin:0}h3{font-size:1.25rem;letter-spacing:-.025em}.field{display:flex;flex-direction:column;gap:8px;margin:0 0 18px;font-size:.87rem;font-weight:650}select,input{width:100%;min-height:44px;border:1px solid #ceccdE;border-radius:9px;background:#fff;color:inherit;padding:10px 12px}fieldset{padding:16px 0 0;border:0;border-top:1px solid var(--border);margin:20px 0 0;min-width:0}legend{font-size:.85rem;color:var(--muted);padding:0 8px 0 0}input[type=checkbox]{width:22px;min-height:22px}.field .help{font-size:.8rem;color:var(--muted);font-weight:400;line-height:1.5}.small{font-size:.83rem;color:var(--muted);line-height:1.6}.primary,.secondary{min-height:44px;border-radius:10px;padding:12px 16px;font-size:.88rem;font-weight:650}.primary{border:1px solid var(--primary);background:var(--primary);color:white;width:100%;display:flex;justify-content:space-between;gap:14px}.primary:hover{background:#4b36ca}.secondary{border:1px solid var(--border);background:#fff;color:var(--primary)}.secondary:hover{background:#f4f2ff}#stop{width:100%;margin-top:10px}.result-panel{min-height:490px}.empty{min-height:350px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:var(--muted);padding:24px}.empty-symbol{background:#f0edff;color:var(--primary);font-size:48px;width:84px;height:84px;border-radius:24px;line-height:76px}.empty h3{color:#393650;margin:22px 0 4px}.empty p{max-width:340px;line-height:1.6}#player-area{height:80px}#progress{font-size:.9rem;color:var(--muted)}#progress:empty{display:none}
.result-top{display:flex;align-items:center;gap:14px;margin-bottom:20px}.score{font-size:2.8rem;letter-spacing:-.07em;font-weight:750;color:var(--primary)}.result-description{font-size:.85rem;color:var(--muted);line-height:1.6}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:.87rem}th{font-size:.77rem;color:var(--muted);font-weight:600}th,td{padding:13px 8px;border-bottom:1px solid #eeedf4}th:first-child,td:first-child{padding-left:0}.verdict{font-size:.78rem;border-radius:6px;padding:4px 6px;background:#e9f4ee;color:#276447;white-space:nowrap}.verdict.retry{background:#fff2dd;color:#815506}.tags{font-size:.75rem;color:var(--muted);margin-top:4px}.history{margin-top:42px}.history-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.history-heading h2{font-size:1.6rem}.history-heading .eyebrow{margin-bottom:7px}.history-card{display:flex;align-items:center;justify-content:space-between;gap:16px;background:white;border:1px solid var(--border);border-radius:14px;padding:18px 22px;margin-top:12px}.history-card strong{display:block;font-size:.95rem}.history-card p{margin:5px 0 0;color:var(--muted);font-size:.83rem}.history-score{display:flex;align-items:center;gap:18px}.history-score span{font-weight:750;font-size:1.2rem;color:var(--primary)}.empty-history{border:1px dashed #c8c5d9;border-radius:14px;padding:28px;text-align:center;color:var(--muted)}#message:not(:empty){padding:14px 18px;border-radius:10px;background:#e6efe9;margin-bottom:18px;font-size:.9rem}#message.error{background:#fff0ee;color:#a3322b}footer{max-width:1168px;margin:0 auto;padding:22px 0 30px;border-top:1px solid var(--border);display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:.8rem}
@media(max-width:1240px){main,footer{margin-left:28px;margin-right:28px}}@media(max-width:760px){.topbar{padding:18px 20px;gap:16px;flex-wrap:wrap}.topbar nav{margin-left:auto;gap:16px;font-size:.85rem}.local-badge{display:none}main{padding-top:30px;margin:0 16px}.workspace{grid-template-columns:1fr}.panel{padding:22px}.intro h1{font-size:2rem;max-width:420px}.intro h1 br{display:block}.notice{font-size:.83rem}.history-heading{align-items:flex-start;flex-direction:column}.history-card{align-items:flex-start;padding:16px;flex-wrap:wrap}.history-score{width:100%;justify-content:space-between}.result-panel{min-height:340px}.empty{min-height:240px;padding:8px}.result-top{flex-wrap:wrap}footer{margin:0 16px;flex-direction:column;gap:8px}th,td{padding:11px 6px}.brand{font-size:21px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* Store: tamna arkadna polica, sa velikim dodirnim metama za telefon. */
.store-body{background:#071225;color:#f7f8ff;min-height:100vh;--muted:#aeb9d4;--border:#253657;--surface:#101d36;--primary:#72f1b8}
.store-topbar{border-color:#253657}.store-topbar nav a{color:#aeb9d4}.store-topbar nav a.active,.store-topbar nav a:hover{color:#72f1b8}.store-topbar .brand-mark{background:linear-gradient(135deg,#72f1b8,#36a5ff);color:#061126}.store-badge{background:#12352f;color:#8ff5c9}.store-main{padding-top:34px}
.store-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:24px}.store-heading h1{font-size:clamp(2.1rem,5vw,4rem);color:#fff}.store-heading .lead{color:#aeb9d4}.play-link{display:flex;align-items:center;gap:10px;border:1px solid #3d5075;border-radius:14px;padding:13px 18px;color:#dce6ff;font-weight:750;white-space:nowrap}.play-link span{color:#72f1b8}.play-link:hover{background:#132542}
#store-message{margin:0 0 18px;color:#aeb9d4;font-size:.9rem}.store-count{display:inline-flex;border:1px solid #294a4d;background:#0c292c;border-radius:99px;padding:8px 13px;color:#8ff5c9!important}
.module-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.module-card{min-width:0;background:#101d36;border:1px solid #2a3b5e;border-radius:22px;overflow:hidden;box-shadow:0 18px 44px #02071166;transition:transform .18s,border-color .18s}.module-card:hover{transform:translateY(-4px);border-color:var(--game-a)}
.module-art{height:166px;position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--game-a) 30%,transparent),transparent 45%),linear-gradient(135deg,#111d3b,#080d1d)}.module-art:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff0b 1px,transparent 1px),linear-gradient(90deg,#ffffff0b 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(to bottom,#000,transparent)}
.art-orbit{position:absolute;width:126px;height:126px;border:2px dashed color-mix(in srgb,var(--game-b) 65%,transparent);border-radius:50%;animation:store-spin 14s linear infinite;animation-delay:var(--delay)}.art-orbit:before,.art-orbit:after{content:"";position:absolute;width:12px;height:12px;border-radius:3px;background:var(--game-a);box-shadow:0 0 14px var(--game-a)}.art-orbit:before{left:5px;top:18px}.art-orbit:after{right:0;bottom:27px;background:var(--game-b)}.art-icon{position:relative;font-size:64px;filter:drop-shadow(0 10px 14px #0008);animation:store-float 2.4s ease-in-out infinite alternate;animation-delay:var(--delay)}.art-pixels{position:absolute;left:16px;bottom:12px;color:var(--game-b);font-size:13px;letter-spacing:.25em}
.module-card-body{padding:18px}.module-kicker{display:flex;justify-content:space-between;color:#8fa1c5;font-size:.72rem;font-weight:850;letter-spacing:.12em}.module-kicker span:first-child{color:var(--game-a)}.module-card h2{margin:12px 0 7px;font-size:1.28rem;color:#fff}.module-card p{margin:0;color:#c3cee7;line-height:1.5;min-height:48px;font-size:.91rem}.module-card small{display:block;margin-top:10px;color:#8091b3;font-size:.76rem}.module-actions{display:grid;grid-template-columns:1fr auto;gap:9px;margin-top:16px}.download-module,.preview-module{min-height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:850}.download-module{background:linear-gradient(135deg,var(--game-a),var(--game-b));color:#081126}.preview-module{border:1px solid #384d76;color:#dbe6ff;padding:0 15px}.preview-module:hover{background:#172844}
.install-strip{margin-top:30px;border:1px solid #26395e;background:#0c1930;border-radius:22px;padding:24px;display:grid;grid-template-columns:240px 1fr;gap:28px;align-items:center}.install-strip h2{font-size:1.5rem;color:#fff}.install-strip ol{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.install-strip li{display:flex;align-items:center;gap:11px;background:#132441;border-radius:14px;padding:14px}.install-strip li>span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#72f1b8;color:#061126;font-weight:950}.install-strip strong,.install-strip small{display:block}.install-strip small{color:#92a3c2;margin-top:3px;line-height:1.3}
@keyframes store-spin{to{transform:rotate(360deg)}}@keyframes store-float{to{transform:translateY(-8px) rotate(2deg)}}
@media(max-width:930px){.module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.install-strip{grid-template-columns:1fr}.install-strip ol{grid-template-columns:1fr}}
@media(max-width:600px){.store-heading{align-items:flex-start;flex-direction:column}.store-heading .play-link{width:100%;justify-content:center}.module-grid{grid-template-columns:1fr}.module-art{height:150px}.module-card p{min-height:0}.store-main{margin:0 14px}.store-topbar nav{width:100%;order:3;margin:0;justify-content:space-between}.store-topbar{padding-bottom:14px}}
@media(prefers-reduced-motion:reduce){.art-orbit,.art-icon{animation:none}}
/* Ratings remain visible on compact Store cards, independently of details. */
.module-rating{display:flex;flex-direction:column;align-items:flex-start;gap:4px;margin-top:14px;padding-top:12px;border-top:1px solid var(--border);font-size:.82rem;line-height:1.4;overflow-wrap:anywhere}.module-rating-summary{font-weight:700}.module-card .module-rating small{margin:0;color:inherit;font-size:.72rem;opacity:.8}.module-feedback{display:inline-flex;align-items:center;min-height:44px;margin-top:2px;text-decoration:underline;text-underline-offset:3px;font-weight:700}
.setup-message:empty{display:none}.setup-message{margin:4px 0 10px;padding:10px 12px;border-radius:10px;background:#eef2ff;color:#26336a;font-size:.88rem}.setup-message.error{background:#fff0f2;color:#a31635}

/* Player: igralište ima prednost nad uvodom i koristi i širinu i visinu ekrana. */
.play-main{max-width:min(1540px,calc(100% - 40px));padding:22px 0 50px}.play-topbar{flex-wrap:wrap}.play-language{display:grid;gap:3px;min-width:150px;max-width:100%;font-size:.72rem;color:var(--muted);font-weight:650}.play-language select{width:auto;min-width:150px;max-width:100%;min-height:40px;padding:7px 32px 7px 10px}.play-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:14px}.play-heading .intro{padding:0}.play-heading h1{font-size:clamp(1.8rem,3vw,2.65rem)}.play-heading .lead{margin-top:8px}.setup-toggle{min-height:48px;white-space:normal}.play-body .notice{margin-bottom:10px;padding:11px 16px}.play-body .notice .translation-fallback,.translation-fallback{color:#9c3d1c;font-weight:700}.play-body .intro-detail{margin:8px 0 14px}.play-body .workspace{grid-template-columns:minmax(280px,330px) minmax(0,1fr);align-items:start}.play-body .workspace.setup-collapsed{grid-template-columns:1fr}.play-body .setup{max-height:calc(100dvh - 32px);overflow:auto}.setup-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.setup-header .section-label{margin-bottom:22px}.setup-header #close-setup{min-height:48px;padding:8px 10px;white-space:normal}.stage-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.stage-header .section-label{margin-bottom:10px}.stage-actions{display:grid;grid-template-columns:repeat(4,minmax(0,auto));gap:8px;margin:0 0 10px auto;max-width:100%}.stage-actions button{min-width:86px;min-height:48px;padding:8px 11px;margin:0;white-space:normal;overflow-wrap:anywhere}.stage-actions .danger{color:#a3322b;border-color:#e7bbb7}.result-panel{min-width:0;min-height:clamp(480px,68dvh,850px);padding:18px}#player-area{width:100%;height:clamp(430px,64dvh,780px);min-width:0;overflow:hidden;border-radius:14px;background:#080e24;box-shadow:inset 0 0 0 1px #ffffff18}#player-area.echo-player{height:100px;background:#f4f4fa}#player-area iframe{max-width:100%}#progress{min-height:22px;margin:7px 2px 0}#stop{width:auto;margin:0}
.operation-group{border:1px solid var(--border);border-radius:12px;padding:12px;margin:10px 0}.operation-group .operation-toggle{display:grid;grid-template-columns:1fr 24px;align-items:center;margin:0;font-size:.92rem}.operation-group .operation-toggle input{grid-column:2;grid-row:1}.operation-group .operation-bounds{padding-top:12px}.operation-group .operation-bounds .field:last-child{margin-bottom:0}.operation-group.operation-disabled{background:#f8f8fc}.operation-group.operation-disabled .operation-toggle{color:var(--muted)}

.round-active{overflow:hidden}.round-active .play-topbar{max-width:none;padding:7px 16px}.round-active .play-topbar nav,.round-active .local-badge{display:none}.round-active .play-main{max-width:none;margin:0;padding:8px 12px}.round-active .play-heading,.round-active #module-notice,.round-active .intro-detail,.round-active .history,.round-active footer{display:none}.round-active .workspace{display:grid;grid-template-columns:1fr;gap:0}.round-active .result-panel{min-height:calc(100dvh - 70px);padding:10px 12px}.round-active #player-area{height:calc(100dvh - 180px);min-height:330px}.round-active #player-area.echo-player{height:100px;min-height:100px}.round-active #message:not(:empty){position:fixed;z-index:1400;left:50%;bottom:12px;transform:translateX(-50%);width:min(620px,calc(100% - 24px));margin:0;box-shadow:0 8px 30px #1115}.round-active #setup:not([hidden]){display:block!important;position:fixed;z-index:1300;left:12px;top:68px;width:min(360px,calc(100vw - 24px));max-height:calc(100dvh - 80px);overflow:auto;box-shadow:0 18px 60px #17152c55}.round-active #setup:not([hidden]) .primary{display:none}

.stage-expanded .result-panel{position:fixed;z-index:1200;inset:0;border:0;border-radius:0;padding:8px;min-height:100dvh;background:#080e24}.stage-expanded .stage-header{color:#fff}.stage-expanded .stage-header .section-label>span{background:#282055;color:#dcd6ff}.stage-expanded .stage-actions .secondary{background:#111d36;border-color:#52617d;color:#fff}.stage-expanded #player-area{height:calc(100dvh - 78px);min-height:0;border-radius:10px}.stage-expanded #progress{color:#d8def0}.stage-expanded #result{display:none}

@media(max-width:760px){.play-main{max-width:none;margin:0 12px;padding-top:16px}.play-topbar nav{order:3;width:100%;margin:0;justify-content:space-between;overflow-x:auto}.play-language{margin-left:auto;min-width:132px}.play-language select{min-width:132px}.play-heading{align-items:flex-start;flex-wrap:wrap}.play-heading .lead{display:none}.play-body .notice{margin-bottom:8px}.play-body .workspace{grid-template-columns:1fr}.play-body .setup{max-height:none}.result-panel{padding:12px;min-height:440px}.stage-header{display:block}.stage-actions{width:100%;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.stage-actions button{min-width:0;padding:6px 4px;font-size:.8rem}.round-active .play-topbar .brand-mark{width:36px;height:36px;line-height:33px}.round-active .play-main{margin:0;padding:6px}.round-active .result-panel{padding:7px;min-height:calc(100dvh - 58px)}.round-active #player-area{height:calc(100dvh - 178px);min-height:320px}.round-active #progress{font-size:.78rem}.round-active #setup:not([hidden]){left:6px;top:56px;width:calc(100vw - 12px);max-height:calc(100dvh - 62px)}}
@media(max-width:350px){.play-heading{display:block}.setup-toggle{width:100%;margin-top:12px}.stage-actions button span{display:none}.round-active #player-area{height:calc(100dvh - 164px)}}
