/* gate.css — Free / Pro marks for FLUX Studio (FLUX language: Courier, monochrome, hairlines, square). */

/* site config: no archive picker, no anonymous submissions on flux.photography */
#lib-archive, [data-submit] { display:none !important; }
.f:has(> .row > [data-submit]) { display:none !important; }
.hr:has(+ .f > .row > [data-submit]) { display:none !important; }

/* a control that needs Pro: still visible (so Pro is discoverable), quieter, tagged */
.ent-lock { position:relative; }
.ent-lock::after { content:attr(data-ent); position:absolute; top:-1px; right:-1px; background:var(--black,#000); color:var(--white,#fff);
                   font:700 6.5px/1 var(--font,'Courier New',monospace); letter-spacing:.12em; padding:2px 3px 2px 4px; pointer-events:none; }
.lay.ent-lock > *, .btn.ent-lock:not(.primary), .ent-lock.lay { color:#777; }
.lay.ent-lock svg { opacity:.5; }
.btn.ent-lock.primary { background:#fff; color:#000; border-color:#000; }
#rnd-btn.ent-lock, #rnd-btn-m.ent-lock { padding-right:26px; }
#rnd-btn.ent-lock::after, #rnd-btn-m.ent-lock::after { top:50%; right:5px; transform:translateY(-50%); }
input.ent-lock { background:#f6f6f6 !important; }

/* tier beside STUDIO */
.ent-tier { border:1px solid var(--black,#000); background:#fff; font:700 9px/1 var(--font,'Courier New',monospace); letter-spacing:.14em; padding:5px 7px; cursor:pointer; margin-left:-4px; white-space:nowrap; }
.ent-tier[data-t="pro"], .ent-tier[data-t="workshop"] { background:#000; color:#fff; }

/* STUDIO PRO sheet */
.ent-sheet { position:fixed; inset:0; z-index:200; background:rgba(0,0,0,.35); display:flex; align-items:center; justify-content:center; padding:16px; }
.ent-box { background:#fff; border:2px solid #000; width:min(520px,100%); max-height:min(86vh,760px); max-height:min(86dvh,760px); display:flex; flex-direction:column; font-family:var(--font,'Courier New',monospace); }
.ent-head { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid #000; font-size:11px; font-weight:700; letter-spacing:.16em; }
.ent-x { border:0; background:none; font-size:20px; line-height:1; cursor:pointer; padding:0 2px; }
.ent-body { padding:14px; overflow:auto; font-size:11px; line-height:1.5; }
.ent-feat { border:1px solid #000; padding:10px 12px; margin-bottom:12px; }
.ent-feat b { display:block; font-size:12px; letter-spacing:.06em; margin:6px 0 2px; }
.ent-feat p { margin:0; color:#333; }
.ent-tag { display:inline-block; background:#000; color:#fff; font-size:8px; letter-spacing:.16em; padding:2px 5px; }
.ent-p { margin:0 0 8px; }
.ent-list { list-style:none; margin:0 0 10px; padding:0; border-top:1px solid #ddd; }
.ent-list li { padding:7px 0; border-bottom:1px solid #ddd; }
.ent-list li b { display:block; font-size:10.5px; letter-spacing:.08em; }
.ent-list li span { color:#555; font-size:10px; }
.ent-list.dim li b { color:#777; }
.ent-sub { font-size:9px; letter-spacing:.16em; color:#777; margin:10px 0 2px; }
.ent-price { border-top:2px solid #000; padding-top:10px; margin-top:4px; font-size:10px; font-weight:700; letter-spacing:.12em; }
.ent-note { color:#666; font-size:9.5px; margin:6px 0 0; }
.ent-dev-row { display:flex; gap:6px; margin-top:12px; flex-wrap:wrap; }
.ent-btn { border:1px solid #000; background:#fff; font:700 9.5px/1 var(--font,'Courier New',monospace); letter-spacing:.1em; padding:8px 10px; cursor:pointer; }
.ent-btn.on { background:#000; color:#fff; }

/* DEV switch — local development hosts only */
.ent-dev { position:fixed; right:12px; bottom:12px; z-index:150; display:flex; align-items:center; gap:0; background:#fff; border:1px dashed #000;
           font:700 9px/1 var(--font,'Courier New',monospace); letter-spacing:.1em; box-shadow:0 2px 10px rgba(0,0,0,.12); }
.ent-dev span { padding:7px 8px; color:#777; }
.ent-dev button, .ent-dev a { border:0; border-left:1px solid #ddd; background:#fff; font:inherit; letter-spacing:inherit; padding:7px 9px; cursor:pointer; color:#000; text-decoration:none; }
.ent-dev button[aria-pressed="true"] { background:#000; color:#fff; }
.ent-dev.framed a { display:none; }
@media (max-width:900px) {
  .ent-dev { right:8px; bottom:auto; top:calc(var(--navh, 0px) + var(--top, 52px) + 8px); font-size:8px; }
  .ent-dev span, .ent-dev button, .ent-dev a { padding:6px 6px; }
  .ent-dev button[aria-pressed="false"], .ent-dev a { display:none; }      /* phone: DEV + the current tier; tap to cycle */
  .ent-dev button[aria-pressed="true"]::after { content:" ↻"; }
  .ent-tier { font-size:8px; padding:4px 5px; }
}
@media print { .ent-dev, .ent-sheet { display:none !important; } }

/* the PRO note beside a control: one slim line — lock · PRO · the tool · → (not a dialog: nothing closes) */
.ent-hint { position:fixed; z-index:180; display:flex; align-items:center; gap:8px; background:#000; color:#fff; height:34px; padding:0 4px 0 10px;
            font:10px/1 var(--font,'Courier New',monospace); letter-spacing:.14em; white-space:nowrap; box-shadow:0 3px 14px rgba(0,0,0,.22); }
.ent-hint[hidden] { display:none; }
.ent-hint svg { width:14px; height:14px; display:block; }
.ent-hint b { font-weight:700; }
.ent-hint-name { color:#bbb; }
.ent-hint [data-ent-more] { border:0; border-left:1px solid #444; background:transparent; color:#fff; height:34px; width:34px; padding:0; display:flex; align-items:center; justify-content:center; cursor:pointer; margin-left:2px; }
.ent-hint [data-ent-more]:hover { background:#222; }

/* STUDIO PRO overview — icons, one word each */
.ent-min { width:min(400px,100%); }
.ent-min .ent-body { padding:16px 16px 14px; }
.ent-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.ent-grid.small { grid-template-columns:repeat(3,1fr); }
.ent-tile { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; aspect-ratio:1; border:1px solid #ddd; background:#fff; color:#000; cursor:pointer;
            font:700 8.5px/1.2 var(--font,'Courier New',monospace); letter-spacing:.12em; text-align:center; padding:8px 4px; }
.ent-tile svg { width:34px; height:34px; display:block; }
.ent-tile:hover { border-color:#000; }
.ent-tile.on { background:#000; color:#fff; border-color:#000; }
.ent-grid.small .ent-tile { aspect-ratio:auto; flex-direction:row; gap:6px; padding:7px 4px; font-size:7.5px; }
.ent-grid.small .ent-tile svg { width:16px; height:16px; }
.ent-tile.dim:not(.on) { color:#999; border-style:dashed; }
.ent-line { margin:12px 0 4px; min-height:1.4em; font-size:11px; letter-spacing:.04em; text-align:center; }
.ent-line i { font-style:normal; font-size:8px; letter-spacing:.14em; color:#999; margin-left:6px; }
.ent-min .ent-sub { text-align:center; margin:12px 0 6px; }
.ent-foot { display:flex; justify-content:space-between; align-items:baseline; border-top:2px solid #000; margin-top:14px; padding-top:10px; font-size:10px; letter-spacing:.14em; }
.ent-foot span { color:#999; font-size:9px; }
.ent-min .ent-note { text-align:left; margin-top:6px; }
.ent-p.err, .err { color:#b00; }

/* projects on this device */
.pj-btn { border:1px solid var(--faint,#ccc); background:#fff; color:#000; font-family:var(--font,'Courier New',monospace); font-size:9.5px; line-height:14px; letter-spacing:.12em; padding:5px 8px; cursor:pointer; white-space:nowrap; }   /* the same box as LETTER / MAGAZINE (.st-format) */
.pj-btn:hover { border-color:#000; }
.pj-btn[data-state="saved"]::before { content:"● "; font-size:7px; vertical-align:1px; }
.pj-btn[data-state="error"] { border-color:#b00; color:#b00; }
.pj-top { margin:0 0 12px; }
.pj-imp { display:inline-flex; align-items:center; }
.pj-list { list-style:none; margin:0 0 10px; padding:0; border-top:1px solid #ddd; }
.pj-row { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid #ddd; }
.pj-row.cur .pj-meta b::after { content:" ●"; font-size:8px; }
.pj-meta { flex:1; min-width:0; }
.pj-meta b { display:block; font-size:11px; letter-spacing:.06em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pj-meta span { display:block; color:#666; font-size:9px; letter-spacing:.06em; }
.pj-acts { display:flex; gap:4px; flex:0 0 auto; }
.pj-acts .ent-btn { padding:6px 7px; font-size:8.5px; }
.pj-start { margin:0 0 18px; }
.pj-start .pj-list { max-width:720px; }
@media (max-width:900px) {
  .pj-btn { padding:4px 6px; font-size:8.5px; line-height:12px; letter-spacing:.12em; }   /* phone: sign + one word — ● SAVED · ◌ SAVING · ! NOT SAVED · ≡ PROJECTS — the same box as LETTER / MAGAZINE */
  .pj-btn::before { margin-right:4px; }
  .pj-btn .pj-t { display:none; }
  .pj-btn::before, .pj-btn[data-state="saved"]::before { content:"≡"; font-size:inherit; vertical-align:0; }
  .pj-btn[data-state="saved"]::before { content:"●"; }
  .pj-btn[data-state="saving"]::before { content:"◌"; }
  .pj-btn[data-state="error"]::before { content:"!"; font-weight:700; }
  .pj-row { flex-wrap:wrap; }
  .pj-acts { width:100%; justify-content:flex-end; }
}

/* load a backup: drop it anywhere */
.pj-drop { position:fixed; inset:10px; z-index:300; border:2px dashed #000; background:rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center; pointer-events:none;
           font-family:var(--font,'Courier New',monospace); text-align:center; }
.pj-drop[hidden] { display:none; }
.pj-drop b { display:block; font-size:14px; letter-spacing:.2em; }
.pj-drop span { display:block; margin-top:8px; font-size:10px; letter-spacing:.14em; color:#777; }
.pj-row.loaded { background:#f4f4f4; padding-left:10px; padding-right:10px; border-left:3px solid #000; }
.pj-new { display:inline-block; font-style:normal; background:#000; color:#fff; font-size:8px; letter-spacing:.16em; padding:2px 5px; margin-bottom:4px; }
.pj-dropzone { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; border:1px dashed #999; padding:12px 14px; margin-top:4px; max-width:720px;
               font-size:10.5px; letter-spacing:.06em; color:#555; }
.pj-dropzone b { color:#000; }

/* storage health — SAVED only after a confirmed, read-back save; NOT SAVED is never quiet */
.pj-btn .pj-t-short { display:none; }
.pj-btn[data-state="saving"] { color:#777; }
.pj-btn[data-state="error"] { background:#b00; border-color:#b00; color:#fff; font-weight:700; }
.pj-btn[data-state="error"]::before { content:"! "; }
.pj-health { margin:0 0 12px; padding:9px 11px; border:1px solid #ddd; font-size:10px; letter-spacing:.06em; line-height:1.5; }
.pj-health b { letter-spacing:.12em; }
.pj-health.bad { border-color:#b00; color:#b00; }
.pj-health .bad { color:#b00; }
@media (max-width:900px) {
  .pj-btn[data-state="error"] { width:46px; height:44px; padding:0 2px; font-size:8px; line-height:1.15; letter-spacing:.06em; white-space:normal; justify-content:center; text-align:center; }
  .pj-btn .pj-t-short { display:inline; }                     /* phones: the word beside the sign (after the desktop rule that hides it) */
  .pj-btn[data-state="error"]::before { content:""; }
}

/* contact sheet (Phase 1) */
.cs-open { display:block; width:calc(100% - 28px); margin:8px 14px 0; border:1px solid #000; background:#fff; font:700 10px/1 var(--font,'Courier New',monospace); letter-spacing:.14em; padding:9px 10px; cursor:pointer; text-align:left; }
.cs-open:hover { background:#000; color:#fff; }
.cs-box { width:min(560px,100%); }
.cs-row { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0 0 10px; }
.cs-l { width:100px; font-size:9px; letter-spacing:.16em; color:#777; }
.cs-note { margin:-4px 0 12px 106px; font-size:10px; color:#555; line-height:1.5; }
.cs-inter { color:#999 !important; border-style:dashed !important; cursor:not-allowed; }
.cs-sum { border-top:2px solid #000; padding-top:10px; margin-top:4px; font-size:10.5px; letter-spacing:.06em; }
@media (max-width:600px) { .cs-l { width:100%; } .cs-note { margin-left:0; } }
/* phones: the site nav right above already shows FLUX — drop Studio's second mark so PROJECTS / SAVED fits (2026-11-06) */
@media (max-width:480px) { .st-top .st-mark { display:none; } }
