:root{--bg:#130b07;--bg2:#21120b;--card:#23150e;--panel:#1b100b;--gold:#e6b864;--gold2:#ad7534;--goldBright:#fbe0a6;--text:#f2e4d1;--muted:#c0aa8e;--line:rgba(211,152,68,.42);--line2:rgba(237,176,87,.2);--good:#56b781;--bad:#ec807a;--blue:#7cbbdf;--radius:19px;--serif:Georgia,'Times New Roman',serif;--sans:Inter,system-ui,'Noto Sans Myanmar',sans}
*{box-sizing:border-box}html{background:#0c0705}body{margin:0;color:var(--text);font-family:var(--sans);background:radial-gradient(ellipse at 68% 0,#3b2517 0,transparent 50%),radial-gradient(ellipse at 20% 85%,#302014 0,transparent 50%),var(--bg);min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.43}a{color:var(--goldBright)}.application{min-height:100vh}.app-top{height:79px;position:sticky;top:0;z-index:30;background:linear-gradient(120deg,#1c110aee,#130d09ef);backdrop-filter:blur(15px);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:8px 24px}.menu-trigger{display:none;border:1px solid var(--line);border-radius:11px;background:var(--panel);color:var(--gold);font-size:21px;padding:7px 12px}.brand-mark{display:flex;align-items:center;gap:13px}.brand-glyph{font-family:var(--serif);font-size:30px;border:1px solid var(--line);color:var(--gold);border-radius:50%;width:46px;height:46px;display:grid;place-items:center;background:radial-gradient(circle,#4e321c,#120d09)}.brand-title{font:26px var(--serif);color:var(--goldBright);line-height:1.05}.brand-title small{display:block;font:9px var(--sans);letter-spacing:2px;color:var(--muted);margin-top:5px}.top-pill{margin-left:auto;color:var(--gold);border:1px solid var(--line);background:#2f1b0f;border-radius:30px;padding:7px 13px;font-size:10px;letter-spacing:1.5px}.shell{display:grid;grid-template-columns:254px minmax(0,1fr);min-height:calc(100vh - 80px)}.sidebar{position:sticky;top:79px;height:calc(100vh - 79px);overflow:auto;border-right:1px solid var(--line2);background:linear-gradient(140deg,#291a11e8,#160d09f4);padding:20px 12px}.side-head{border-bottom:1px solid var(--line2);padding:0 13px 17px;letter-spacing:1.5px;color:var(--gold);font-size:11px}.side-head small{display:block;letter-spacing:0;font-size:10px;margin-top:6px;color:var(--muted);line-height:1.5}.side-navbtn{width:100%;display:flex;align-items:center;gap:10px;text-align:left;color:var(--text);margin:6px 0;padding:13px 12px;background:transparent;border:1px solid transparent;border-radius:12px;font-size:13px}.side-navbtn span:first-child{width:25px;color:var(--gold);font-family:var(--serif);font-size:18px}.side-navbtn:hover,.side-navbtn.active{background:linear-gradient(100deg,#5e391b,#26190e);border-color:var(--line);color:var(--goldBright)}.nav-small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.side-bottom{color:var(--muted);border-top:1px solid var(--line2);margin:26px 12px 0;padding-top:20px;line-height:1.7;font-size:11px}.side-bottom small{color:#968269}.main{min-width:0;padding:24px 30px 100px;max-width:1400px;width:100%;margin:auto}.main::before{content:'◆';position:fixed;right:-7vw;top:18vh;font-size:44vw;color:#d7a65005;pointer-events:none;z-index:-1}.page-head{border:1px solid var(--line);border-radius:21px;margin-bottom:19px;min-height:130px;padding:25px 30px;background:radial-gradient(circle at 100% 0,#68401e46,transparent 55%),linear-gradient(120deg,#2c1b10f0,#150d09f0);box-shadow:inset 0 1px #ffe5b52e;position:relative;overflow:hidden}.page-head::after{content:'◇';font:180px var(--serif);color:#c28d3d15;position:absolute;right:25px;top:-40px}.eyebrow{text-transform:uppercase;letter-spacing:2.8px;font-size:10px;color:var(--gold)}h1,h2,h3{font-family:var(--serif);font-weight:normal}h1{margin:7px 0 10px;font-size:clamp(30px,4vw,43px);color:var(--goldBright)}h2{font-size:27px;color:var(--goldBright);margin:0 0 9px}h3{font-size:20px;color:var(--goldBright);margin:0 0 9px}.page-desc{font-size:13px;color:var(--muted);margin:0;max-width:750px;line-height:1.65}.layout-two{display:grid;grid-template-columns:360px minmax(0,1fr);gap:19px;align-items:start}.luxe-panel{background:linear-gradient(145deg,#2a190ff0,#160e09f3);border:1px solid var(--line);border-radius:var(--radius);padding:19px;box-shadow:inset 0 1px 0 #ffdd991a,0 20px 50px #00000022}.luxe-panel.soft{background:#22160fbe}.gold-line{height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:15px 0}.subhead{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:16px}.caption,.note{color:var(--muted);font-size:12px;line-height:1.55}.strong-gold{color:var(--goldBright)}.mini{font-size:11px}.pill{display:inline-block;border:1px solid var(--line);padding:5px 10px;border-radius:25px;color:var(--goldBright);background:#412b18;font-size:10px}.pill.success{color:#abf1c6;background:#123922;border-color:#477b59}.pill.warning{color:#ffcd8d;background:#50301a;border-color:#825532}.pill.danger{color:#ffaaa1;background:#481d1c;border-color:#8e4644}.pill.info{color:#badbfc;background:#1a3347;border-color:#365f7d}.btn{border:1px solid var(--line);border-radius:11px;background:linear-gradient(#342110,#20120b);color:var(--goldBright);padding:11px 15px;font-size:12px;line-height:1.2;min-height:42px}.btn:hover{filter:brightness(1.15);border-color:var(--gold)}.btn.primary{color:#2b1707;background:linear-gradient(155deg,#fff0be,#e7b564 57%,#b98541);border-color:#f4c77e;font-weight:700;box-shadow:inset 0 2px #fffae4a1}.btn.bad{color:#fff1e9;background:linear-gradient(#913d39,#581d1b);border-color:#a96761}.btn.flat{background:transparent}.btn.small{padding:6px 11px;min-height:30px;font-size:11px}.button-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.button-row .btn{flex:1}.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 20px}.tabs .btn.selected{background:linear-gradient(#f1cc87,#bc813d);color:#201009;font-weight:700}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:19px}.stat{border:1px solid var(--line);background:linear-gradient(145deg,#3b2617,#1c110c);border-radius:15px;padding:17px 16px;min-width:0}.stat strong{display:block;font:31px var(--serif);color:var(--goldBright);margin:5px 0 2px}.stat:nth-child(2) strong{color:#9dcff4}.stat:nth-child(3) strong{color:#9ee5ac}.stat:nth-child(4) strong{color:#e99b91}.stat small{color:var(--muted);font-size:11px}.cards-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.tile-btn{text-align:left;background:linear-gradient(125deg,#322013,#1b100a);color:var(--text);border:1px solid var(--line);border-radius:16px;padding:20px 17px;min-height:108px}.tile-btn:hover{border-color:var(--gold)}.tile-btn b{display:block;font:23px var(--serif);color:var(--goldBright);margin:5px 0}.tile-btn small{font-size:11px;color:var(--muted)}.tile-icon{font:26px var(--serif);color:var(--gold)}.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 18px}.field{display:block;width:100%;min-width:0;background:#170f0b;color:var(--text);border:1px solid #97633290;border-radius:10px;padding:12px 13px;outline:none;font-size:13px;min-height:45px}.field:focus{border-color:var(--gold);box-shadow:0 0 0 2px #d09a4542}.field::placeholder{color:#96816e}.field.search{flex:1;min-width:155px}.toolbar .field{max-width:350px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin:18px 0}.form-grid label{color:var(--muted);font-size:12px;display:block}.form-grid .field{margin-top:8px}.form-grid .wide{grid-column:1/-1}textarea.field{min-height:92px;resize:vertical}.entry{display:flex;align-items:center;gap:13px;border:1px solid var(--line2);border-radius:13px;background:linear-gradient(100deg,#33201188,#20140c8c);padding:12px;margin:9px 0}.avatar{width:45px;height:45px;flex:none;border-radius:50%;display:grid;place-items:center;font:22px var(--serif);color:var(--goldBright);border:1px solid var(--line);background:#38220f}.entry-main{min-width:0;flex:1}.entry-title{font:17px var(--serif);color:var(--goldBright);margin:0 0 4px}.entry-info{font-size:11px;color:var(--muted);line-height:1.5}.entry-buttons{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.empty{text-align:center;padding:45px 22px;border:1px dashed var(--line);border-radius:15px;color:var(--muted);line-height:1.7}.preview-image{display:block;width:100%;max-width:510px;margin:auto;height:auto;border-radius:9px;border:1px solid #805327;background:#120a05}.preview-panel{display:flex;flex-direction:column;gap:12px}.preview-panel .preview-image{max-height:72vh;object-fit:contain;object-position:top}.screen-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:11px}.screen-thumb{padding:6px;background:#29190e;border:1px solid var(--line2);color:var(--text);border-radius:11px;overflow:hidden;text-align:left}.screen-thumb.active,.screen-thumb:hover{border-color:var(--gold);background:#422813}.screen-thumb img{width:100%;height:195px;object-fit:cover;object-position:top;border-radius:7px;display:block}.screen-thumb span{display:block;padding:7px 4px;font-size:11px}.gallery-grid{display:grid;grid-template-columns:minmax(260px,490px) minmax(250px,1fr);align-items:start;gap:20px}.visual-preview{background:#140b06;border:1px solid var(--line);border-radius:17px;padding:12px;text-align:center;position:relative}.visual-preview img{width:100%;max-height:71vh;object-fit:contain;object-position:top;border-radius:10px}.gallery-info{padding:14px}.gallery-info .button-row{margin-top:15px}.emblem{width:88px;height:88px;border-radius:50%;border:2px solid var(--gold2);box-shadow:0 0 28px #dda54a44;object-fit:cover;background:#402713}.hero-biker{display:flex;gap:18px;align-items:center;padding:5px 0 12px}.hero-biker h2{margin:0}.metric-table{border-collapse:collapse;width:100%;font-size:12px}.metric-table td,.metric-table th{border-bottom:1px solid var(--line2);padding:12px 8px;text-align:left}.metric-table th{color:var(--gold);font-weight:500}.bars{height:175px;display:flex;align-items:flex-end;gap:10px;border-bottom:1px solid var(--line);padding:20px 5px 0}.barcol{min-width:0;flex:1;display:flex;justify-content:end;flex-direction:column;align-items:center;gap:6px}.barcol .bar{width:100%;max-width:43px;background:linear-gradient(#ffe3a1,#ab6d29);border-radius:6px 6px 0 0;min-height:3px}.barcol small{font-size:10px;color:var(--muted)}.progress-track{height:9px;border:1px solid var(--line);background:#21150d;border-radius:12px;overflow:hidden}.progress-track>div{height:100%;background:linear-gradient(90deg,#946021,#f7d490);border-radius:10px}.timeline{margin:14px 0 0;border-left:1px solid var(--gold2);padding-left:21px}.event{position:relative;margin-bottom:19px;font-size:12px}.event:before{content:'◆';position:absolute;left:-28px;color:var(--gold);font-size:12px;top:1px}.event b{color:var(--goldBright)}.event small{display:block;color:var(--muted);margin-top:4px}.notice{border-left:3px solid var(--gold);padding:12px 15px;background:#4b311a5c;border-radius:4px 12px 12px 4px;font-size:12px;color:var(--muted);line-height:1.6;margin:12px 0}.status-pending{color:#f8c27f}.status-on-way{color:#9fd8ff}.status-done{color:#b1f0c0}.status-fail{color:#fbaba5}.toast{position:fixed;bottom:85px;right:18px;padding:14px 20px;border:1px solid var(--gold);background:#24160e;color:var(--goldBright);border-radius:14px;box-shadow:0 12px 45px #0009;z-index:40;opacity:0;pointer-events:none;transition:opacity .2s}.toast.show{opacity:1}.bottom-nav{display:none}.hidden{display:none!important}.page-foot{color:#aa9377;font-size:11px;padding:30px 8px 15px;text-align:center}
@media(max-width:1000px){.layout-two{grid-template-columns:1fr}.gallery-grid{grid-template-columns:minmax(200px,390px) 1fr}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.app-top{height:64px;padding:7px 13px}.brand-title{font-size:22px}.brand-title small{font-size:8px;letter-spacing:1px}.brand-glyph{width:37px;height:37px;font-size:23px}.menu-trigger{display:block}.top-pill{font-size:9px;letter-spacing:0;padding:6px 9px}.shell{display:block}.sidebar{position:fixed;top:64px;bottom:0;width:272px;height:auto;transform:translateX(-103%);transition:transform .2s;z-index:50;box-shadow:12px 0 30px #0008}.sidebar.open{transform:none}.main{padding:14px 12px 104px}.page-head{padding:20px 18px;min-height:110px;margin-bottom:15px}h1{font-size:31px}.page-desc{font-size:11px}.luxe-panel{padding:15px}.gallery-grid{grid-template-columns:1fr}.visual-preview{padding:8px}.visual-preview img{max-height:none;max-width:520px}.screen-thumbs{grid-template-columns:repeat(3,minmax(0,1fr))}.screen-thumb img{height:146px}.stats-grid{gap:8px}.stat{padding:12px 9px}.stat strong{font-size:26px}.cards-grid{gap:9px}.tile-btn{padding:14px 12px;min-height:95px}.entry{gap:9px;padding:10px}.entry-buttons{flex-direction:column;align-items:stretch}.entry-buttons .btn{min-height:30px}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:1}.bottom-nav{display:flex;position:fixed;bottom:0;left:0;right:0;height:73px;padding:7px 5px calc(7px + env(safe-area-inset-bottom));background:#1a100bf5;backdrop-filter:blur(10px);border-top:1px solid var(--line);z-index:20}.bottom-nav button{min-width:0;flex:1;border:none;background:transparent;color:var(--muted);font-size:10px;display:flex;flex-direction:column;align-items:center;gap:4px}.bottom-nav button b{font:21px var(--serif);color:var(--gold2)}.bottom-nav button.active,.bottom-nav button.active b{color:var(--goldBright)}.toast{bottom:90px;right:12px;left:12px}}
/* Family-consistency treatment derived from original gold-architecture approved artwork */
.page-head{background-image:linear-gradient(110deg,#1a1009ef 2%,#25160dcf 65%,#1b0e06b5),url('assets/gold_marble_architecture.webp');background-size:cover;background-position:center 20%;border:1px solid #bd8d48;box-shadow:0 16px 40px #0004,inset 0 0 0 1px #f4d39b25}
.luxe-panel{box-shadow:0 8px 40px #0003,inset 0 0 0 1px #ffd39415,inset 0 8px 40px #d69b2110}
.stat{box-shadow:inset 0 0 0 1px #e6a74a18,inset 0 10px 25px #e2b0580e}
.page-head h1:after{content:'  ◇  ';font-size:12px;vertical-align:middle;color:#c6913d}

/* FINAL DESIGN VIEW: single application screen, not a planning board/gallery */
body{background:#0e0805 url('assets/gold_marble_architecture.webp') center top/cover fixed no-repeat}
body:before{content:'';position:fixed;inset:0;pointer-events:none;background:linear-gradient(92deg,#0d0703d9,#120b06bc 55%,#0d0703e0);z-index:-1}
.brand-glyph{border-radius:50%;background:radial-gradient(circle at 35% 28%,#ffe5ac,#956020 60%,#271609)}
.brand-title{letter-spacing:.4px}
.stage-top{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;color:#d8ac64;padding:13px 14px;border:1px solid #ae7b38;border-radius:13px;margin:0 auto 12px;background:#1b1009df;font-size:13px}
.stage-top strong{font-weight:500;color:#ffe0a0}
.stage-sep{opacity:.4;margin:0 7px}
.stage-num{color:#f5d39c;font-variant-numeric:tabular-nums;white-space:nowrap}
.design-stage{max-width:630px;margin:0 auto;padding:0 0 25px;}
.stage-screen{max-width:460px;margin:0 auto;background:linear-gradient(#160c05,#0b0603);border:1px solid #c18a47;border-radius:9px;overflow:hidden;box-shadow:0 28px 70px #000b,0 0 35px #b57a2d2b}
.stage-img{display:block;width:100%;height:auto;margin:0;padding:0}
.stage-controls{margin:16px 0 12px;display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.stage-controls>.btn{flex:1;max-width:330px}
.stage-shortcuts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;flex-basis:100%}
.stage-shortcuts .btn{font-size:12px;min-height:42px;max-width:none}
.stage-choices{display:flex;gap:9px;overflow-x:auto;padding:4px 0 15px;scrollbar-width:thin}
.stage-choice{white-space:nowrap;color:#d5b17b;background:#1f140c;border:1px solid #75512f;border-radius:999px;padding:11px 15px;font-size:12px}
.stage-choice.current{background:linear-gradient(#f4d497,#ae7330);color:#211208;border-color:#ffe3af;font-weight:700}
.screen-mode .main{max-width:none;background:#0c0705ae}
.login-mode .bottom-nav{display:none}
.page-head{background-image:linear-gradient(110deg,#1a1009bb 2%,#25160dc0 65%,#1b0e06b5),url('assets/gold_marble_architecture.webp')}
.page-head h1{letter-spacing:-.8px}
.page-foot{font-size:10px;opacity:.75}
@media(max-width:760px){
 .screen-mode .main{padding:5px 0 86px}
 .login-mode .main{padding-bottom:18px}
 .design-stage{width:100%;padding:0 0 14px;max-width:none}
 .stage-top{border-radius:0;margin:0;border-left:0;border-right:0;padding:10px 13px;font-size:11px}
 .stage-screen{max-width:none;border:none;border-radius:0;box-shadow:none}
 .stage-img{width:100%;border-radius:0}
 .stage-controls{padding:0 14px;margin:14px 0 9px}
 .stage-controls>.btn{min-height:45px}
 .stage-choices{padding:5px 14px 15px}
 .stage-shortcuts{gap:8px}
 .luxe-panel{border-color:#b78244}
 .hero-biker .emblem{width:72px;height:72px;flex:none}
 .page-head{border-radius:10px}
}
/* Readability overrides: only material textures, never embedded labels behind live content */
body{background:radial-gradient(ellipse at 48% 0,#382415 0,#190f09 40%,#0e0805 78%) fixed}
body:before{z-index:-1;background:linear-gradient(94deg,transparent 8%,#cb9b4415 8.15%,transparent 8.5%,transparent 87%,#cb9b4415 87.15%,transparent 87.5%)}
.page-head{background-image:radial-gradient(circle at 92% 0,#7b4d1d55,transparent 48%),linear-gradient(135deg,#28180d,#150c07 78%);position:relative;overflow:hidden}
.page-head:before{content:'';position:absolute;inset:-35% auto -35% 70%;width:120px;transform:skew(-32deg);background:linear-gradient(90deg,transparent,#c08a3d12,transparent);pointer-events:none}
.page-head>*{position:relative}
.no-bottom-nav .bottom-nav{display:none}
@media(max-width:760px){.no-bottom-nav .main{padding-bottom:22px}}
