
:root{--bg:#070707;--panel:#15100b;--panel2:#0e0b08;--line:#3b2b1b;--gold:#c99a45;--gold2:#f0d18a;--copper:#9b5d2e;--wood:#3a2415;--text:#eee7dc;--muted:#9d9387;--green:#6ab77a;--red:#d26059}
*{box-sizing:border-box}body{margin:0;background:
radial-gradient(circle at 50% 10%,#2c1d12 0,#120d09 34%,#070707 68%);color:var(--text);font:14px Arial,sans-serif}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.07;background:
repeating-linear-gradient(90deg,#fff1 0 1px,transparent 1px 4px),
repeating-linear-gradient(0deg,#0003 0 1px,transparent 1px 7px)}
.topbar{height:60px;border-bottom:1px solid #4a3421;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1450px)/2));background:#090705ef;position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:15px}.brand a{color:var(--gold2);text-decoration:none;border:1px solid #76532c;border-radius:8px;padding:7px 10px}.brand b{letter-spacing:3px;color:var(--gold2)}.brand span{font-size:11px;color:#837565}.top-actions{display:flex;gap:8px}
button{background:#1d1712;border:1px solid #4b3927;color:#ddd0bf;border-radius:8px;padding:10px 14px;cursor:pointer}button:hover{border-color:#b7883e}.gold{background:linear-gradient(135deg,#9f6f2d,#e4bd68);color:#1d1208;border:0;font-weight:800}.big{padding:14px 22px}.wide{width:100%;margin-top:8px}
main{max-width:1450px;margin:20px auto;padding:0 18px}.panel{background:linear-gradient(145deg,#1b140e,#100d0a);border:1px solid #4b3724;border-radius:16px;box-shadow:0 18px 45px #0007,inset 0 1px #ffffff0b}
.hero{padding:30px;position:relative;overflow:hidden}.hero:after{content:"";position:absolute;width:320px;height:320px;border:28px double #5c4328;border-radius:50%;right:-90px;top:-100px;opacity:.18}.hero-watch{font-size:52px;float:right;color:var(--gold2);filter:drop-shadow(0 0 10px #b9803066)}.hero h1,.mission h2,h3{font-family:Georgia,serif;margin:5px 0 8px}.hero h1{font-size:40px}.hero small,.section-head small,#caseNo{color:var(--gold);font-weight:bold;letter-spacing:2px}.hero p{max-width:850px;color:#b1a79a;line-height:1.55}.case-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0}.case-card{text-align:left;min-height:125px;padding:15px;background:linear-gradient(145deg,#19120d,#0d0b09)}.case-card.active{border-color:var(--gold);box-shadow:inset 0 0 0 1px #a77b2d,0 0 20px #b8872530}.case-card b{display:block;color:var(--gold2);font-size:16px;margin-bottom:8px}.case-card span{color:#9e9488;font-size:12px;line-height:1.4}.hidden{display:none!important}
.mission{padding:18px 20px;display:flex;justify-content:space-between;gap:20px;margin-bottom:12px}.mission p{color:#aaa094;margin:0;max-width:700px}.mission-goal{display:grid;grid-template-columns:repeat(3,150px);gap:8px}.mission-goal div,.meter{background:#0c0907;border:1px solid #49331f;border-radius:8px;padding:10px}.mission-goal span,.meter span{display:block;color:#827768;font-size:10px}.mission-goal b{display:block;color:var(--gold2);margin-top:4px}
.workbench{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:12px}.machine,.instruments,.inspector,.log,.repair-reference{padding:14px}.section-head{display:flex;justify-content:space-between;align-items:center}.bench-tools{display:flex;gap:10px;align-items:center;color:#8e806f;font-size:11px}.lamp{font-size:10px;border:1px solid #64513b;border-radius:20px;padding:6px 10px;color:#998f84}.lamp.on{color:#8ddd9c;border-color:#376c43;box-shadow:0 0 18px #4ebc6644}
.watch-stage{padding:14px;border-radius:16px;background:linear-gradient(135deg,#4b2e18,#2c1a0f 45%,#1b120c);box-shadow:inset 0 0 40px #0008}
#mechanism{width:100%;height:auto;display:block;background:
radial-gradient(circle at 50% 48%,#463621 0 20%,#241a10 21% 58%,#0c0a08 59%);
border:10px solid #6b4c2d;border-radius:24px;box-shadow:inset 0 0 0 2px #b58a4f,inset 0 0 70px #000}
.plate{fill:#3c2d1d;stroke:#b88b44;stroke-width:5}.bridge{fill:#4c3822;stroke:#d2a558;stroke-width:4}.screw{fill:#b08a55;stroke:#f3d89a;stroke-width:2}.jewel{fill:#8e1736;stroke:#ff9aac;stroke-width:3;filter:drop-shadow(0 0 5px #d52e5c88)}
.gear{fill:#20180f;stroke:#c99b42;stroke-width:5;cursor:pointer}.gear:hover,.selectedPart{stroke:#ffe092!important;filter:drop-shadow(0 0 8px #d7a94a88)}.hub{fill:#090705;stroke:#766a58;stroke-width:3}.mech-line{stroke:#6c5b48;stroke-width:10;stroke-linecap:round}.spring{fill:none;stroke:#d2a348;stroke-width:7}.pendulum{stroke:#c6a04f;stroke-width:8;stroke-linecap:round}.bob{fill:#b88b37;stroke:#f0d17c;stroke-width:4;cursor:pointer}.hand{stroke:#dbc078;stroke-width:5;stroke-linecap:round}.part-label{fill:#e0d4c2;font:14px Georgia;text-anchor:middle}.sub-label{fill:#847665;font:10px Arial;text-anchor:middle}
.machine-legend{display:flex;gap:20px;padding:8px 2px;color:#807465;font-size:11px}.good{color:#69b97a}.warn{color:#c8a354}
.meters{display:grid;grid-template-columns:1fr 1fr;gap:8px}.meter b{display:block;font:23px Georgia;color:#eee;margin:5px 0}.meter small{color:#776b5f}.diagnostic{margin-top:10px;background:#0b0806;border:1px solid #49351f;border-radius:8px;padding:11px;color:#9d9387;line-height:1.45}.lower{display:grid;grid-template-columns:1.2fr .8fr;gap:12px;margin-top:12px}.part-info{background:#0b0806;border:1px solid #49351f;border-radius:10px;padding:13px;color:#aaa094;min-height:70px}.controls{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:10px}.control-card{background:#0c0907;border:1px solid #49351f;border-radius:9px;padding:10px}.control-card b{display:block;color:var(--gold2);margin-bottom:7px}.control-card input[type=range]{width:100%}.control-card select{width:100%;background:#1a130e;color:#ddd;border:1px solid #5a432d;padding:8px}.control-card button{width:100%}.log-list{max-height:245px;overflow:auto}.log-item{border-left:2px solid #826130;padding:7px 9px;margin:5px 0;background:#0b0806;color:#9f9588}.log-item b{color:#d8c28c}
.reference-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.reference-grid>div{background:#0b0806;border:1px solid #49351f;border-radius:8px;padding:10px}.reference-grid b{display:block;color:#e4c579;font-size:12px}.reference-grid span{display:block;color:#8d8275;font-size:11px;margin-top:5px}
.modal{position:fixed;inset:0;background:#000c;display:grid;place-items:center;padding:20px;z-index:50}.modal-box{position:relative;max-width:680px;width:100%;background:#17110d;border:1px solid #74542d;border-radius:14px;padding:25px;box-shadow:0 25px 80px #000}.x{position:absolute;right:10px;top:10px}.success-box{text-align:center}.seal{width:62px;height:62px;border:2px solid var(--gold);border-radius:50%;display:grid;place-items:center;margin:auto;font-size:28px}.success-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0}.success-grid div{background:#0b0806;border:1px solid #49351f;border-radius:8px;padding:9px}.success-grid span{display:block;color:#7e7265;font-size:9px}.success-grid b{display:block;color:#e4c579;margin-top:4px}.name-label{display:block;text-align:left;color:#95897b;font-size:11px}.name-label input{width:100%;margin-top:5px;padding:10px;background:#0b0806;border:1px solid #49351f;color:#eee;border-radius:7px}.success-actions,.share-panel{display:flex;gap:7px;justify-content:center;flex-wrap:wrap;margin-top:12px}.share-panel{padding:10px;background:#0b0806;border:1px solid #49351f;border-radius:9px}
#toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,20px);opacity:0;background:#20160e;border:1px solid #80652e;padding:10px 16px;border-radius:9px;transition:.2s;pointer-events:none;z-index:60}#toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1100px){.case-grid{grid-template-columns:repeat(3,1fr)}.workbench,.lower{grid-template-columns:1fr}.mission{display:block}.mission-goal{grid-template-columns:repeat(3,1fr);margin-top:12px}}
@media(max-width:760px){.case-grid{grid-template-columns:1fr 1fr}.reference-grid,.controls{grid-template-columns:1fr 1fr}.mission-goal{grid-template-columns:1fr}.meters{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.case-grid,.reference-grid,.controls{grid-template-columns:1fr}.brand span{display:none}.topbar{padding:0 10px}.top-actions button{padding:8px;font-size:11px}.success-grid{grid-template-columns:1fr 1fr}}

/* v4.2 - műhelyesebb hangulat + azonnali visszacsatolás */
.reaction-box{margin-top:10px;background:linear-gradient(145deg,#120d09,#0a0806);border:1px solid #634826;border-radius:10px;padding:11px}
.reaction-box small{display:block;color:#b88a45;letter-spacing:1px;font-size:8px}.reaction-box b{display:block;color:#e8d3a0;margin-top:4px}.reaction-box p{color:#8f8478;font-size:11px;line-height:1.45;margin:5px 0 8px}
.delta-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px}.delta{padding:6px 7px;background:#090705;border-radius:6px;font-size:10px}.delta.up{border-left:3px solid #66b678;color:#8bd298}.delta.down{border-left:3px solid #d15e58;color:#e18a84}.delta.same{border-left:3px solid #6a6258;color:#8e857b}
.workshop-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:11px;margin-top:12px;background:linear-gradient(135deg,#21150e,#100b07)}
.workshop-strip>div{background:linear-gradient(145deg,#3a2416,#24160e);border:1px solid #6f4b29;border-radius:8px;padding:10px;box-shadow:inset 0 0 20px #0005}
.workshop-strip b{display:block;color:#e0bb70;font-family:Georgia,serif}.workshop-strip span{display:block;color:#a08d78;font-size:10px;margin-top:4px}
.watch-stage:before{content:"";display:block;height:7px;background:repeating-linear-gradient(90deg,#7d552f 0 40px,#5a371f 40px 80px);border-radius:5px 5px 0 0;margin:-14px -14px 12px}
@media(max-width:760px){.workshop-strip{grid-template-columns:1fr}.delta-grid{grid-template-columns:1fr}}

/* v4.3 - egyértelmű interaktív csapágykövek */
.jewel{cursor:pointer;transition:.18s;filter:drop-shadow(0 0 7px #d52e5c99)}
.jewel:hover{stroke:#ffe3aa;stroke-width:5;filter:drop-shadow(0 0 12px #ff406d)}
.jewel.selected-jewel{stroke:#ffe28b;stroke-width:6;filter:drop-shadow(0 0 18px #ff4d77)}
.jewel-ring{fill:none;stroke:#8f6a36;stroke-width:3;pointer-events:none}
.jewel-halo{fill:none;stroke:#f0c768;stroke-width:3;stroke-dasharray:7 6;opacity:.95;filter:drop-shadow(0 0 8px #d6a744)}
.jewel-label{fill:#efc66e;font:bold 12px Georgia;text-anchor:middle;pointer-events:none}
.interactive-tag{fill:#160d08;stroke:#9a7137;stroke-width:1.5;rx:8;ry:8;pointer-events:none}
.interactive-tag-text{fill:#e7c476;font:bold 10px Arial;text-anchor:middle;pointer-events:none}
.name-label.required input:invalid{border-color:#a85a44}

.bridge{pointer-events:none}.jewel-hit{fill:transparent;stroke:transparent;cursor:pointer;pointer-events:all}.jewel-hit:hover{fill:#ff4b6b18;stroke:#f1c56a;stroke-width:2}
.operation-library{padding:14px;margin-top:12px}.op-note{font-size:10px;color:#8c7e6d}.operation-library-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:9px}
.op-chip{background:#0b0806;border:1px solid #4a3622;border-radius:7px;padding:8px;color:#a79a89;font-size:10px;text-align:left}.op-chip b{display:block;color:#dfbd78;font-size:11px;margin-bottom:3px}.op-chip.done{border-color:#477850;background:#0d160f;color:#83bd8c}
.action-button{width:100%;margin-top:5px;text-align:left}.action-button small{display:block;color:#7e7367;margin-top:3px}@media(max-width:900px){.operation-library-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:600px){.operation-library-grid{grid-template-columns:1fr 1fr}}
