:root{--ink:#213b52;--accent:#af8f61;--paper:#f8f6ef;--muted:#737b82;--line:#dddcd6;--card:#fffefb;--male:#eaf0f6;--female:#f7eeee}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Microsoft YaHei',sans-serif;color:var(--ink);background:var(--paper)}body.theme-cinnabar{--ink:#793e38;--accent:#ae8a65;--paper:#f7f0e5}body.theme-charcoal{--ink:#363c42;--accent:#9b8d79;--paper:#f5f5f2}body.paper-mi{background-color:#f5eee0}body.paper-plain{background-image:none}.paper-xuan{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23777777' opacity='.035' filter='url(%23n)' d='M0 0h200v200H0z'/%3E%3C/svg%3E")}[hidden]{display:none!important}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);padding:12px 15px;min-height:44px}button:disabled{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:2px}a{color:var(--ink);text-decoration:none}.primary{background:var(--ink);color:#fff;border-color:var(--ink)}.muted{color:var(--muted);font-size:13px;line-height:1.7}.c28-top{height:80px;padding:12px 28px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.c28-brand{display:flex;align-items:center;gap:12px}.c28-brand b{font-size:25px;font-family:serif;letter-spacing:2px}.c28-brand small{font-size:12px;color:var(--muted)}.brand-mark{border:1px solid var(--accent);padding:7px;border-radius:7px;color:var(--accent);font-family:serif}.c28-account{font-size:15px}.c28-main{max-width:1600px;margin:auto}.c28-bar{padding:12px 24px;position:relative;z-index:3}.c28-title{display:flex;align-items:center;gap:12px;margin-bottom:10px;flex-wrap:wrap}.plain{border:0;background:none;padding:4px 0;font-weight:600;font-size:18px}.c28-title>span{font-size:12px;color:var(--muted)}.c28-toolbar{display:flex;gap:8px;max-width:800px}.c28-toolbar input{min-width:0;flex:1;border:1px solid var(--line);border-radius:12px;background:var(--card);padding:12px 14px;color:var(--ink)}.c28-viewport{position:relative;height:calc(100dvh - 315px);min-height:320px;overflow:hidden;background-image:radial-gradient(#7b889433 .8px,transparent .8px);background-size:20px 20px;border-block:1px solid #deded655}.c28-viewport svg{width:100%;height:100%;display:block;touch-action:none;user-select:none;cursor:grab}.c28-viewport svg:active{cursor:grabbing}.c28-tools{position:absolute;right:12px;bottom:55px;display:grid;gap:7px}.c28-tools button{width:46px;padding:6px;background:#fffefbe8;font-size:14px;box-shadow:0 2px 8px #23374b0c}.c28-tools button:first-child,.c28-tools button:nth-child(2){font-size:24px}.c28-gesture{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);font-size:12px;color:var(--muted);white-space:nowrap;pointer-events:none;background:#fffaf0b8;border-radius:20px;padding:7px 13px}.c28-loading{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;background:var(--paper)}.c28-actions{padding:14px 24px 10px;text-align:center}.c28-actions .buttons{display:flex;gap:10px;max-width:650px;margin:auto}.c28-actions button,.c28-actions .button{flex:1;display:block;padding:14px;min-height:48px;border-radius:13px;border:1px solid var(--line)}.c28-actions p{margin:7px 0;font-size:12px;color:var(--muted)}.c28-nav{display:flex;border-top:1px solid var(--line);background:var(--card);padding:8px 15px max(8px,env(safe-area-inset-bottom));justify-content:space-around}.c28-nav a{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:80px;font-size:12px;color:var(--muted)}.c28-nav a span{font-size:23px;line-height:26px}.c28-nav .active{color:var(--ink);font-weight:bold}.c28-banner{background:var(--card);border:1px solid var(--accent);border-radius:12px;padding:9px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;margin-top:10px}.c28-banner button{padding:5px 9px;white-space:nowrap;min-height:36px}.c28-error{color:#9a3932;font-size:13px;line-height:1.7;margin:8px 0}.c28-modal{position:fixed;inset:0;z-index:30;background:#142a3b66;display:flex;align-items:flex-end;justify-content:center}.c28-sheet{width:min(100%,680px);max-height:88dvh;overflow:auto;background:var(--card);border-radius:24px 24px 0 0;padding:18px 22px max(24px,env(safe-area-inset-bottom));box-shadow:0 -10px 60px #142a3b22}.c28-sheet-head{display:flex;align-items:center;justify-content:space-between}.c28-sheet h2{font-size:20px;margin:5px 0 18px}.c28-sheet-head button{border:0;font-size:26px;min-height:38px;background:none;padding:4px 10px;margin-top:-10px}.sheet-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}.sheet-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.sheet-grid button,.sheet-grid a{padding:14px 8px;border:1px solid var(--line);border-radius:12px;text-align:center;font-size:15px;background:#faf9f5}.person-head{display:flex;gap:14px;align-items:center;padding-bottom:12px}.person-head img,.person-head .avatar{width:66px;height:66px;border-radius:50%;object-fit:cover;background:var(--male);display:grid;place-items:center;font-size:28px}.person-head h3{font-size:25px;margin:0 0 6px}.person-head p{font-size:13px;margin:0;color:var(--muted)}.c28-sheet label{display:block;margin:14px 0 7px;font-size:14px}.c28-sheet input:not([type=checkbox]),.c28-sheet select{width:100%;border:1px solid var(--line);background:#faf9f5;border-radius:12px;min-height:48px;padding:12px;color:var(--ink)}.c28-sheet input[type=checkbox]{width:20px;height:20px;vertical-align:middle;accent-color:var(--ink)}.form-submit{width:100%;margin-top:18px}.color-choice{min-height:70px!important;font-weight:bold}.color-choice[aria-pressed=true]{outline:2px solid var(--accent)}#searchResults{position:absolute;top:108px;left:24px;right:24px;max-height:260px;overflow:auto;background:var(--card);border:1px solid var(--line);box-shadow:0 6px 20px #142a3b1a;border-radius:12px;z-index:10}#searchResults button{display:block;width:100%;text-align:left;border:0;border-radius:0}.wide-mode{position:fixed!important;inset:0!important;z-index:20!important;height:100dvh!important;background-color:var(--paper)}.wide-mode .c28-tools{bottom:45px}.c28-me{max-width:1050px;margin:auto;padding:20px 18px}.c28-me .account{padding:20px;background:var(--card);border:1px solid var(--line);border-radius:16px}.c28-me .tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:20px 0}.tool-grid a{display:grid;place-items:center;min-height:86px;border:1px solid var(--line);border-radius:14px;background:var(--card);text-align:center;padding:10px;font-size:14px}.tool-grid a span{display:block;font-size:24px;margin-bottom:5px}.c28-me section{margin-bottom:20px}.c28-me h2{font-size:18px}.c28-me .simple-link{display:block;border-block-end:1px solid var(--line);padding:14px 2px}.c28-me .account h1{margin:0 0 8px}.c28-me footer{color:var(--muted);font-size:12px;padding:15px 0;line-height:1.8}@media(max-width:650px){.c28-top{height:66px;padding:9px 16px}.c28-brand b{font-size:23px}.c28-brand small{display:none}.c28-bar{padding:8px 14px}.c28-title{gap:8px;margin-bottom:7px}.plain{font-size:16px}.c28-toolbar button{padding:9px 12px}.c28-toolbar input{padding:10px;font-size:14px}.c28-viewport{height:calc(100dvh - 292px);min-height:280px}.c28-actions{padding:10px 14px 5px}.c28-gesture{font-size:11px}.c28-tools{right:8px;gap:5px}.c28-tools button{width:40px;min-height:40px}.c28-banner{flex-wrap:wrap}.c28-sheet{padding-inline:18px}#searchResults{left:14px;right:14px;top:99px}}@media(min-width:900px){.c28-modal{align-items:center}.c28-sheet{border-radius:24px;padding:24px 30px;max-height:85dvh}.c28-viewport{height:calc(100dvh - 318px)}.c28-nav{gap:80px;justify-content:center}.c28-me .tool-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* The canvas takes the remaining viewport height; controls and navigation stay visible. */
.c28-canvas{height:100dvh;display:flex;flex-direction:column;overflow:hidden}.c28-canvas .c28-top,.c28-canvas .c28-nav{flex:none}.c28-canvas .c28-main{flex:1;min-height:0;width:100%;display:flex;flex-direction:column;margin:0 auto}.c28-canvas .c28-bar,.c28-canvas .c28-actions{flex:none}.c28-canvas .c28-viewport{flex:1;height:auto;min-height:140px}.c28-tools button{white-space:nowrap;padding-inline:2px}.c28-me{padding-bottom:90px}.c28-me+.c28-nav{position:fixed;bottom:0;left:0;right:0;z-index:5}.paper-mi{--paper:#f4ead8;background-color:var(--paper)}.paper-plain{--paper:#ffffff;background-color:var(--paper)}.paper-plain .c28-viewport{background-image:none}

.c28-portal-v281 .tool-grid a{gap:7px;min-height:120px;padding:14px 5px}.c28-portal-v281 .tool-grid a>span{height:42px;display:flex;align-items:center;justify-content:center;margin:0}.c28-portal-v281 .tool-grid a b{font-weight:500;font-size:13px}.c28-portal-v281 .stg281-book-tile{background:#eaf0f5;border-color:#c3cfd9}.stg281-mini-book{position:relative;width:33px;height:44px!important;box-shadow:2px 3px 4px #132b3d30;background:#213b52 url('book-premium-v281/navy-cover.jpg') center/cover;border-radius:1px;border-left:3px solid #15283b}.stg281-mini-book i{position:absolute;right:4px;top:7px;writing-mode:vertical-rl;font-family:serif;font-style:normal;font-size:8px;line-height:1;background:#f5ead2;color:#2e3d48;padding:2px}.stg281-service-section{padding:0!important}.stg281-service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.stg281-service-grid>a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-height:132px;background:#fffefb;border:1px solid #dddcd6;border-radius:15px;padding:16px 8px;text-align:center}.stg281-service-grid span{height:34px;color:#40596e}.stg281-service-grid b{font-size:15px;font-weight:550}.stg281-service-grid small{font-size:11px;color:#7b858c;line-height:1.5}@media(min-width:900px){.stg281-service-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

.stg281-canvas-more{position:relative;flex:none}.stg281-canvas-more summary{cursor:pointer;list-style:none;background:var(--card);border:1px solid var(--line);padding:11px 15px;min-height:44px;border-radius:12px}.stg281-canvas-more summary::-webkit-details-marker{display:none}.stg281-canvas-more>div{position:absolute;right:0;top:49px;min-width:155px;background:var(--card);border:1px solid var(--line);border-radius:13px;padding:7px;box-shadow:0 8px 24px #213b5225;display:grid;gap:4px;z-index:15}.stg281-canvas-more button{text-align:left;border:0;border-radius:8px}.c28-portal-v281 .tool-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.c28-portal-v281 .tool-grid a{min-height:100px;padding:11px 4px}.c28-portal-v281 .tool-grid a b{font-size:12px;line-height:1.5}.stg281-service-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.stg281-service-grid>a{min-height:100px;padding:12px 4px;gap:7px}.stg281-service-grid b{font-size:12px}.stg281-service-grid small{display:none}@media(max-width:360px){.c28-portal-v281 .tool-grid,.stg281-service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.c28-portal-v281 .account{padding:16px}.c28-portal-v281 .account h1{font-size:24px}.c28-portal-v281 .account p{font-size:14px}.c28-portal-v281 .account .simple-link{padding:10px 0}