*{box-sizing:border-box}body{margin:0;background:#070505;color:#d8cec3;font-family:Arial;background-image:radial-gradient(circle at 55% 0,#54171055,transparent 35%)}button,input{font:inherit}button{cursor:pointer;background:#17100e;color:#cbb9a9;border:1px solid #54362f;border-radius:7px;padding:9px}button:hover{border-color:#ba5145;color:#fff}button:disabled{opacity:.3}header{max-width:1500px;margin:auto;padding:19px 22px 10px;display:flex;justify-content:space-between;border-bottom:1px solid #38231f}header small,.panel small{color:#b84d41;font-size:9px;letter-spacing:2px}h1{font:30px Georgia;margin:4px 0;color:#ead8c2}h1 span{font:11px Arial;color:#76574d}header p{margin:0;font:italic 13px Georgia;color:#776861}main{max-width:1500px;margin:auto;padding:12px 22px 35px}.panel{background:linear-gradient(145deg,#15100e,#0b0807);border:1px solid #392621;border-radius:12px;box-shadow:0 15px 35px #0008}.top{padding:13px 17px;display:flex;justify-content:space-between}.top h2{font:21px Georgia;margin:3px 0;color:#e3ceb5}.top p{margin:0;color:#8c7d74}.stats{display:flex;gap:6px;align-items:center}.stats b{background:#090706;border:1px solid #30201d;padding:8px;border-radius:6px;font-size:9px}.stats span{color:#d89974}.progress{display:flex;gap:4px;margin:9px 0}.progress div{height:5px;flex:1;background:#281915;border-radius:5px}.progress div.done{background:#6f2b25}.progress div.now{background:#cf5a4c;box-shadow:0 0 10px #c33}.layout{display:grid;grid-template-columns:245px 1fr 245px;gap:11px}.lesson,.notebook{padding:13px}.lesson h3,.notebook h3{font:18px Georgia;color:#dfc9af;margin:5px 0 9px}.lesson p{font:11px Georgia;line-height:1.55;color:#a5968c}.warn{background:#180b09;border-left:2px solid #9b382f;padding:8px;margin:12px 0}.warn b{font-size:8px;color:#d27869}.warn p{margin:4px 0}.more{font-size:10px;line-height:1.5;background:#090706;padding:9px;margin-top:6px;color:#8f8177}.hidden{display:none!important}.lab{min-height:660px;position:relative;overflow:hidden;background:radial-gradient(circle at 82% 5%,#711c1655,transparent 27%),#0b0807}.redlamp{position:absolute;right:18px;top:12px;color:#c8493e;font-size:8px;text-align:center;z-index:5}.redlamp i{display:block;width:36px;height:18px;background:#d42d22;border-radius:30px 30px 4px 4px;box-shadow:0 0 35px #f33;margin:auto}.stage{display:none;min-height:660px;padding:55px 30px 100px}.stage.active{display:flex;align-items:center;justify-content:center;gap:30px}.upload{width:380px;height:230px;border:2px dashed #6f3a32;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;background:#110a09}.upload input{display:none}.upload b{font:18px Georgia;color:#d9b297}.upload span{font-size:9px;color:#705f56;margin-top:7px}#uploadStage{flex-direction:column}.tank{width:230px;height:300px;background:linear-gradient(90deg,#171717,#45413e,#121212);border:8px solid #2f2b29;border-radius:20px;position:relative;overflow:hidden}.reel{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);width:140px;height:140px;border:18px dashed #777;border-radius:50%;display:grid;place-items:center;color:#888}.liquid{position:absolute;left:0;right:0;bottom:0;height:0;background:linear-gradient(#55221d99,#180c0b);transition:height 1s}.timerbox{width:210px;text-align:center}.timerbox>b{font:42px Georgia;color:#d99c74}.zones{height:14px;display:grid;grid-template-columns:28% 44% 28%;position:relative;margin:10px 0 14px}.zones i:nth-child(1){background:#a47d28}.zones i:nth-child(2){background:#39774b}.zones i:nth-child(3){background:#8b302b}.zones span{position:absolute;top:-5px;width:3px;height:24px;background:white;left:0}.primary{background:linear-gradient(#8e3028,#591b17);border-color:#b74c41;color:#fff;font-weight:bold}.timerbox button{width:100%;margin-top:6px}.preview{width:260px;height:195px;border:10px solid #1c1b19;position:relative}.preview canvas{width:100%;height:100%}.preview span{position:absolute;bottom:-28px;left:0;font-size:8px;color:#74655d}.trays{display:grid;grid-template-columns:repeat(3,190px);gap:12px}.trays>div{height:130px;border:8px solid #453a35;background:#150a09;position:relative;padding:10px;cursor:pointer}.trays b{font-size:9px;color:#ce9573}.trays span{display:block;font-size:8px;color:#74665f;margin-top:4px}.trays i{position:absolute;left:8px;right:8px;bottom:8px;height:65px;background:linear-gradient(#481913,#160908);border-radius:50%;transition:.3s}.trays>div.active{border-color:#a34b40;box-shadow:0 0 18px #8b2d25}.chemTimer{width:210px;text-align:center}.chemTimer strong{font:38px Georgia;color:#d59b75}.chemTimer p{font-size:10px;color:#8a7a71}.filmstrip{width:75%;height:170px;background:#201b18;border:14px solid #151312;box-shadow:0 20px 30px #000;position:relative;overflow:hidden}.filmstrip canvas{height:100%;width:100%;object-fit:cover;filter:invert(1) grayscale(1)}.dryline{position:absolute;top:70px;left:10%;right:10%;height:2px;background:#76665b}.enlarger{width:150px;height:360px;position:relative}.head{height:80px;background:linear-gradient(130deg,#403833,#111);border:2px solid #5e5048;padding:28px;text-align:center;font-size:9px}.neck{height:260px;width:13px;background:#574e48;margin:auto}.lens{position:absolute;top:82px;left:48px;width:55px;height:35px;background:#050505;border:5px solid #3c3531}.cone{position:absolute;top:112px;left:20px;width:110px;height:245px;background:#b33a2820;clip-path:polygon(42% 0,58% 0,100% 100%,0 100%)}.paper{width:430px;height:325px;background:#e9e0d0;padding:14px;position:relative;box-shadow:0 15px 35px #000}.paper canvas{width:100%;height:100%;background:#eee}.paper #exposureFlash{position:absolute;inset:14px;background:#f8d8a533;opacity:0}.enlargeControls{width:220px}.enlargeControls label{font-size:9px}.enlargeControls input{width:100%;accent-color:#96352d}.papertray{width:500px;height:375px;border:15px solid #453a35;background:#160b09;padding:15px;position:relative}.papertray canvas{width:100%;height:100%;background:#eee}.papertray .fluid{position:absolute;inset:8px;background:linear-gradient(#6b241a22,#240c0955);pointer-events:none;animation:ripple 2s infinite alternate}@keyframes ripple{from{transform:skewX(-.3deg)}to{transform:skewX(.3deg)}}.finalgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%}.finalgrid div{background:#080606;padding:8px}.finalgrid canvas{width:100%;height:190px;object-fit:contain;background:#ddd}.result{width:200px;text-align:center}.result strong{font:52px Georgia;color:#d79b74}.result span{color:#776860}.result p{font-size:9px;line-height:1.6}.notebook #notes{font-size:10px;line-height:1.55}.note{padding:8px 0;border-bottom:1px solid #291c19}.note b{display:block;color:#c99474}.chemTimer button,.result button{width:100%}#toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:#291310;border:1px solid #813a31;padding:9px 15px;border-radius:7px;opacity:0;transition:.2s;z-index:30}#toast.show{opacity:1}@media(max-width:1050px){.layout{grid-template-columns:220px 1fr}.notebook{grid-column:1/-1}.stage.active{flex-wrap:wrap}.trays{grid-template-columns:repeat(3,1fr)}}@media(max-width:700px){header,.top{flex-direction:column;gap:10px}.stats{flex-wrap:wrap}.layout{grid-template-columns:1fr}.stage{padding:70px 12px 110px}.stage.active{flex-direction:column}.trays{grid-template-columns:1fr;width:100%}.trays>div{height:90px}.paper,.papertray{width:92vw;max-width:430px;height:310px}.finalgrid{grid-template-columns:1fr}.notebook{grid-column:auto}}@keyframes swing{0%{transform:rotate(0)}35%{transform:rotate(2deg)}70%{transform:rotate(-2deg)}100%{transform:rotate(0)}}
/* v3.1 */
.thermo{background:#090706;border:1px solid #39231e;padding:9px;margin-bottom:12px;text-align:left}.thermo span,.thermo small{display:block;font-size:8px;color:#817169}.thermo b{display:block;color:#d69b75;margin:4px 0}.thermo input{width:100%;accent-color:#a13c32}
.trays em{display:block;font-style:normal;font-size:8px;margin-top:7px;color:#71645d}.trays em.good{color:#83bc8e}.trays em.warnstatus{color:#d1ad61}.trays em.badstatus{color:#d87568}
.paper #maskCanvas{position:absolute;inset:14px;width:calc(100% - 28px);height:calc(100% - 28px);cursor:crosshair;background:transparent}
.masktools{margin:9px 0;padding:8px;background:#090706;border:1px solid #30201d}.masktools>b,.masktools small{display:block;font-size:8px;color:#8b776b;margin-bottom:5px}.masktools button{font-size:8px;padding:6px;margin:2px}.masktools button.active{background:#762a24;border-color:#bb5549}.stripInfo{font-size:8px;line-height:1.4;color:#8d7d73;margin:5px 0 8px}.teststrip{display:grid;grid-template-columns:repeat(5,1fr);height:100%;width:100%}.teststrip canvas{width:100%;height:100%;object-fit:cover;border-right:1px solid #333}

/* v3.2 bath timing */
.trays .bathTimes{display:block!important;margin-top:6px;font:8px Arial!important;color:#c7aa8f!important;letter-spacing:0!important}
.trays>div.running .bathTimes{color:#f0c79e!important}
.trays>div.running{box-shadow:0 0 20px #9d3d32;border-color:#bc574b}
.trays>div.running:after{content:"IDŐZÍTÉS FUT";position:absolute;right:7px;top:7px;font-size:7px;color:#ef897b;letter-spacing:1px}

/* v3.3 visible dodge & burn */
.maskLegend{display:grid;gap:3px;margin:7px 0}.maskLegend span{font-size:8px;padding:5px;border-radius:4px}.maskLegend .dod{background:#d8b87518;color:#d9bd88}.maskLegend .bur{background:#5b171722;color:#d78778}#maskReadout{font-size:8px;color:#c99b7c;margin-top:5px}
.paper #maskCanvas{mix-blend-mode:normal}

/* v3.4 - bath recommended times: deliberately high contrast */
.trays>div{min-height:165px}
.bathTiming{position:absolute;left:10px;right:10px;bottom:77px;z-index:4;background:#080605e8;border:1px solid #8c4b3d;border-radius:5px;padding:6px 8px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 8px}
.bathTiming b{font:700 8px Arial!important;color:#e3b18c!important;letter-spacing:1px}
.bathTiming strong{font:700 16px Georgia;color:#fff0d9}
.bathTiming span{grid-column:1/-1;font:9px Arial;color:#d9c3b0}
.trays>div.running .bathTiming{border-color:#e06b57;box-shadow:0 0 12px #c3483666}
.trays>div.running .bathTiming span{color:#fff}
.trays>div>i{height:54px}

/* v3.5 enlargement masking rework */
.enlargeWork{display:grid;grid-template-columns:1fr 1fr;gap:16px;min-width:540px}
.negativeCarrier,.paper{position:relative}
.negativeCarrier>small,.paper>small{display:block;color:#c49373;font-size:8px;letter-spacing:1px;margin-bottom:5px}
.negFrame{position:relative;width:330px;height:245px;background:#111;border:12px solid #26221f;box-shadow:0 12px 30px #000}
.negFrame canvas{position:absolute;inset:0;width:100%;height:100%}
.negFrame #maskCanvas{z-index:4;cursor:crosshair}
.paper{width:330px;height:auto;background:#e9e0d0;padding:10px;box-shadow:0 15px 35px #000}
.paper #paperCanvas{width:100%;height:245px;background:#eee}
.paper #exposureFlash{inset:26px 10px 10px}
@media(max-width:1000px){.enlargeWork{grid-template-columns:1fr;min-width:0}.negFrame,.paper{width:min(90vw,430px)}}

/* v3.6 clean enlarger workbench */
#enlargeStage.active{display:block;padding:48px 22px 24px}
.enlargeBench{width:100%;max-width:1100px;margin:0 auto}
.benchVisual{display:grid;grid-template-columns:150px minmax(300px,1fr) minmax(300px,1fr);gap:18px;align-items:center;background:linear-gradient(180deg,#100a08,#080605);border:1px solid #35221d;border-radius:12px;padding:20px;min-height:390px}
.benchVisual .enlarger{width:130px;height:330px;margin:auto}
.workLabel{display:flex;justify-content:space-between;align-items:end;margin-bottom:7px;gap:8px}.workLabel b{font:13px Georgia;color:#e0b08b}.workLabel span{font-size:8px;color:#806c61;text-align:right}
.negativeCarrier{min-width:0}.negFrame{width:100%;aspect-ratio:4/3;height:auto;border:10px solid #28221f;background:#070606;box-shadow:0 12px 28px #000;position:relative}.negFrame canvas{position:absolute;inset:0;width:100%;height:100%}
#maskReadout{font-size:8px;color:#ad8068;padding-top:6px}
.paperPreviewBox{min-width:0}.paperPreviewBox .paper{width:100%;height:auto;aspect-ratio:4/3;background:#d8cfbf;padding:10px;position:relative;box-shadow:0 12px 28px #000}.paperPreviewBox .paper canvas{display:block;width:100%;height:100%;object-fit:contain;background:#ded8cc}.paperPreviewBox .paper #exposureFlash{position:absolute;inset:10px}
.previewHint{font-size:8px;color:#7f6d63;line-height:1.4;margin-top:6px}
.benchControls{display:grid;grid-template-columns:1.05fr 1.35fr .8fr;gap:10px;margin-top:11px}.controlCard{background:#0c0807;border:1px solid #35231f;border-radius:8px;padding:11px;min-height:145px}.controlCard>small{display:block;color:#a54a3e;letter-spacing:1.5px;font-size:7px;margin-bottom:7px}.exposureCard label{display:grid;grid-template-columns:1fr auto;gap:5px;font-size:9px}.exposureCard label input{grid-column:1/-1;width:100%;accent-color:#9d3b31}.controlCard button{font-size:9px}.maskButtons{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:7px 0}.maskButtons button.active{background:#722820;border-color:#c55749;color:#fff}.exposeCard{display:flex;flex-direction:column}.exposeCard p{font-size:9px;color:#8d7a70;line-height:1.45;flex:1}.exposeCard .primary{font-size:11px;padding:13px}
@media(max-width:1000px){.benchVisual{grid-template-columns:110px 1fr}.paperPreviewBox{grid-column:1/-1;margin:auto;width:min(100%,520px)}.benchControls{grid-template-columns:1fr 1fr}.exposeCard{grid-column:1/-1}}
@media(max-width:700px){.benchVisual{grid-template-columns:1fr}.benchVisual .enlarger{display:none}.benchControls{grid-template-columns:1fr}.exposeCard{grid-column:auto}.workLabel{align-items:start}.negativeCarrier,.paperPreviewBox{width:100%}}

.paperPreviewBox .teststrip{position:absolute;inset:10px;z-index:6;display:grid;grid-template-columns:repeat(5,1fr);background:#ddd8cc}.paperPreviewBox .teststrip>div{position:relative;overflow:hidden;border-right:1px solid #62584e}.paperPreviewBox .teststrip canvas{width:100%;height:100%;object-fit:cover}.paperPreviewBox .teststrip b{position:absolute;bottom:5px;left:5px;background:#090706cc;color:#f1d0af;padding:3px 5px;font-size:8px}

/* v3.7 reference values */
.referenceTime{background:#100a08;border:1px solid #704237;border-radius:6px;padding:8px;margin-bottom:10px;text-align:left}.referenceTime span,.referenceTime small{display:block;font-size:8px;color:#9f8273}.referenceTime b{display:block;font:17px Georgia;color:#f0c69e;margin:3px 0}.paperRef{margin-bottom:8px}.goodTarget{background:#0b160f;border:1px solid #315a3c;padding:7px;border-radius:5px;margin-bottom:8px}.goodTarget b{display:block;color:#87c798;font-size:9px}.goodTarget span{display:block;color:#799181;font-size:8px;margin-top:3px}

/* v3.8 enlargement cell overflow fixes */
#enlargeStage *{box-sizing:border-box}
.benchControls{align-items:stretch}
.controlCard{min-width:0;overflow:hidden}
.goodTarget{width:100%;max-width:100%;overflow-wrap:anywhere}
.goodTarget b,.goodTarget span{white-space:normal;line-height:1.35}
.exposureCard label{min-width:0}
.exposureCard input[type=range]{min-width:0;max-width:100%}
.paperzones{max-width:100%;overflow:hidden}
.maskButtons{min-width:0}.maskButtons button{min-width:0;white-space:normal;overflow-wrap:anywhere;line-height:1.25}
.controlCard button{max-width:100%;white-space:normal}
@media(max-width:1150px){.benchControls{grid-template-columns:1fr 1fr}.exposeCard{grid-column:1/-1}}
@media(max-width:760px){.benchControls{grid-template-columns:1fr}.exposeCard{grid-column:auto}}

/* v3.8 educational handbook */
.darkroomHandbook{max-width:1200px;margin:28px auto 60px;padding:24px;background:linear-gradient(180deg,#120b09,#090706);border:1px solid #39251f;border-radius:12px;color:#bba89c}
.handbookHead{max-width:850px;margin-bottom:20px}.handbookHead>span{font-size:8px;letter-spacing:2px;color:#b54d40}.handbookHead h2{font:28px Georgia;color:#ead5bf;margin:6px 0 10px}.handbookHead p{font-size:11px;line-height:1.7;color:#a58f82}
.handbookGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.handbookGrid article{background:#0b0807;border:1px solid #30201b;border-radius:7px;padding:14px;min-width:0}.handbookGrid article>b{display:block;color:#d99d76;font:16px Georgia;margin-bottom:7px}.handbookGrid article p{font-size:10px;line-height:1.6;margin:4px 0 9px;color:#a99589}.handbookGrid article strong{font-size:8px;letter-spacing:1px;color:#8eb097}.handbookGrid article em{color:#e0b58e}
.processSummary{margin-top:12px;border:1px solid #5b3a30;background:#120c09;padding:15px;border-radius:7px;display:grid;gap:5px}.processSummary b{color:#e2aa80;font-size:10px}.processSummary span{font-size:10px;line-height:1.5;color:#c6b3a5}.processSummary small{margin-top:7px;color:#86756b;font-size:8px;line-height:1.5}
.previewHint b{color:#c69474}
@media(max-width:760px){.darkroomHandbook{padding:15px}.handbookGrid{grid-template-columns:1fr}.handbookHead h2{font-size:22px}}

/* v3.9 iPad/tablet bath layout */
@media (min-width:700px) and (max-width:1180px){
  #paperChemStage.active,#chemStage.active{display:block}
  #paperChemStage .trays,#chemStage .trays{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(190px,1fr))!important;
    gap:14px!important;
    width:100%!important;
    max-width:760px!important;
    margin:34px auto 22px!important;
    padding:0 8px!important;
  }
  #paperChemStage .trays>div,#chemStage .trays>div{
    width:auto!important;min-width:0!important;min-height:220px!important;
    padding:14px!important;position:relative!important;
  }
  #paperChemStage .bathTiming,#chemStage .bathTiming{
    position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;
    margin:10px 0 8px!important;width:100%!important;display:grid!important;
    grid-template-columns:1fr!important;gap:2px!important;text-align:left!important;
  }
  #paperChemStage .bathTiming strong,#chemStage .bathTiming strong{
    font-size:20px!important;line-height:1.05!important;white-space:nowrap!important;
  }
  #paperChemStage .bathTiming span,#chemStage .bathTiming span{
    grid-column:auto!important;white-space:normal!important;overflow-wrap:anywhere!important;
  }
  #paperChemStage .trays em,#chemStage .trays em{
    position:relative!important;display:block!important;white-space:normal!important;
    overflow-wrap:anywhere!important;margin:6px 0!important;
  }
  #paperChemStage .trays>div>i,#chemStage .trays>div>i{
    display:block!important;height:64px!important;margin-top:10px!important;
  }
  #paperChemStage .timerbox,#chemStage .timerbox{
    margin:18px auto!important;max-width:420px!important;text-align:center!important;
  }
}
@media (max-width:820px){
  #paperChemStage .trays,#chemStage .trays{
    grid-template-columns:1fr!important;max-width:430px!important;
  }
  #paperChemStage .trays>div,#chemStage .trays>div{min-height:170px!important}
}
/* prevent any bath timing text escaping its card */
.trays>div{overflow:hidden}
.bathTiming{max-width:100%;box-sizing:border-box}
.bathTiming strong,.bathTiming span,.bathTiming b{max-width:100%;overflow-wrap:anywhere}