/*
Theme Name: Nothing.RRaj
Author: Ranjan Raj
Description: Interactive fictional screen simulators and display tools.
Version: 1.0.1
Text Domain: nothing-rraj
*/
:root{--red:#FF0800;--bg:#fff;--fg:#151515;--muted:#666;--border:#e6e6e6;--card:#fff}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer}a{color:inherit}.site-head,.site-foot{background:var(--red);color:#fff}.site-head{padding:18px 20px;position:relative;display:flex;justify-content:center;align-items:center;min-height:82px}.logo{font-size:clamp(27px,4vw,40px);font-weight:850;text-decoration:none;letter-spacing:-1.5px}.head-tools{position:absolute;right:20px;display:flex;gap:8px}.head-tools button{background:#ffffff25;border:1px solid #ffffff80;color:white;border-radius:12px;padding:10px}.wrap{max-width:1200px;margin:auto;padding:28px 20px}.intro{text-align:center;margin:6px 0 26px}.intro h1{font-size:clamp(28px,4vw,44px);margin:0 0 8px}.intro p{color:var(--muted);margin:0}.top-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:18px}.btn{background:var(--red);color:white;border:0;border-radius:10px;padding:11px 17px;font-weight:650}.btn.secondary{background:var(--card);color:var(--fg);border:1px solid var(--border)}.layout{display:grid;grid-template-columns:210px minmax(0,1fr) 255px;gap:18px;align-items:start}.panel{border:1px solid var(--border);background:var(--card);border-radius:16px;padding:16px}.panel h2{font-size:17px;margin:0 0 14px}.nav-item{display:block;width:100%;border:0;background:transparent;color:var(--fg);padding:11px 9px;text-align:left;border-radius:9px}.nav-item:hover,.nav-item.active{background:#ff080014;color:var(--red)}.screen-shell{background:#0b0e13;border:8px solid #17191e;border-radius:15px;overflow:hidden;aspect-ratio:16/10;position:relative}.screen-shell:fullscreen{width:100vw;height:100vh;aspect-ratio:auto;border:0;border-radius:0}.screen-shell canvas{display:block;width:100%;height:100%}.screen-overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;color:white;text-align:center}.screen-overlay.show{display:flex}.screen-overlay .flat{width:100%;height:100%}.preview-controls{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.field{display:grid;gap:5px;margin:0 0 14px;font-size:13px;font-weight:650}.field input,.field select{width:100%;border:1px solid var(--border);background:var(--bg);color:var(--fg);border-radius:9px;padding:10px}.help{font-size:12px;color:var(--muted);line-height:1.5}.cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:25px}.tile{border:1px solid var(--border);border-radius:12px;background:var(--card);padding:8px;color:var(--fg);text-align:center}.tile.active{outline:2px solid var(--red)}.tile .thumb{height:66px;border-radius:7px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#161c29,#39465a);font-size:27px}.tile strong{font-size:12px;display:block;margin-top:8px}.section-title{margin:35px 0 10px}.site-foot{text-align:center;padding:25px 15px;margin-top:40px}.site-foot a{color:white;font-weight:700}.caption{text-align:center;color:var(--muted);padding:28px 12px}.dark{--bg:#101115;--fg:#f5f5f5;--muted:#bbb;--border:#33353b;--card:#1b1c21}@media(max-width:1000px){.layout{grid-template-columns:180px minmax(0,1fr)}.settings{grid-column:1/-1}.cards{grid-template-columns:repeat(4,1fr)}}@media(max-width:650px){.site-head{padding:16px 70px 16px 12px}.logo{font-size:27px}.head-tools{right:10px}.wrap{padding:18px 12px}.layout{display:flex;flex-direction:column}.layout>*{width:100%}.side-nav{display:flex;overflow-x:auto;gap:5px}.side-nav h2{display:none}.nav-item{min-width:max-content}.cards{grid-template-columns:repeat(3,1fr)}.screen-shell{border-width:5px}.tile .thumb{height:55px}}