/* The Seam Room - shared by /a/ and /b/ */
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;overflow:hidden;background:#2a2420;color:#f3ead8;
  font:13px/1.4 system-ui,-apple-system,sans-serif;overscroll-behavior:none;touch-action:none;
  -webkit-user-select:none;user-select:none}
#gl{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}
#loading{position:fixed;inset:0;z-index:100;background:#2a2420;display:flex;align-items:center;justify-content:center;
  font:600 13px/1.4 Georgia,serif;letter-spacing:.2em;color:#e8c98a;transition:opacity .5s}
#loading.off{opacity:0;pointer-events:none}

/* the seam panel: back link, counter, log, reset. Bottom-left, small, out of the way. */
#hudSeam{position:fixed;z-index:60;left:calc(8px + env(safe-area-inset-left));bottom:calc(10px + env(safe-area-inset-bottom));
  max-width:min(330px,calc(100vw - 112px));background:rgba(26,20,15,.72);border:1px solid rgba(232,180,90,.28);
  border-radius:12px;padding:6px 10px 8px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);pointer-events:none}
#hudSeam #hb-top{min-height:34px!important;font-size:12px!important}
#hudSeam a,#hudSeam button{pointer-events:auto}
#counter{font-weight:600;font-size:12px;color:#f3ead8;margin:1px 0 4px}
#counter b{color:#e8c98a}
#seamLog{font:10.5px/1.45 ui-monospace,Menlo,Consolas,monospace;color:#d8ccb4;opacity:.92}
#seamLog div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* right-aligned: the site's admin Edit button sits bottom-left over this panel (Jaron's iPhone, 11/1) */
#reset{display:block;margin:6px 0 0 auto;border:1px solid rgba(232,180,90,.4);background:rgba(232,180,90,.12);color:#e8c98a;border-radius:8px;
  font:600 11px system-ui,sans-serif;padding:6px 10px;cursor:pointer;min-height:30px}

/* keep the shell's prompt above the seam panel; this room has no jump or duck */
.hbs-prompt{bottom:calc(196px + env(safe-area-inset-bottom))!important}
.hbs-act:not(.go){display:none!important}

/* the property card */
#card{position:fixed;z-index:80;left:50%;top:50%;transform:translate(-50%,-50%);width:min(320px,92vw);max-height:70vh;overflow:auto;
  background:#f3ead8;color:#2c2118;border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.5);padding:12px 14px 14px;display:none;
  font:13px/1.45 Georgia,'Times New Roman',serif;-webkit-user-select:text;user-select:text}
#card.on{display:block}
#card .card-head{display:flex;justify-content:space-between;align-items:center;font-size:16px;margin-bottom:6px}
#card .card-head button{border:0;background:#2c2118;color:#f3ead8;width:32px;height:32px;border-radius:16px;font-size:18px;cursor:pointer}
#card dl{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;margin:0 0 8px}
#card dt{color:#7a6650;font:600 11px/1.9 system-ui,sans-serif;text-transform:uppercase;letter-spacing:.05em}
#card dd{margin:0;overflow-wrap:anywhere}
#card .card-sub{font:600 11px system-ui,sans-serif;text-transform:uppercase;letter-spacing:.05em;color:#7a6650}
#card ol{margin:4px 0 10px;padding-left:20px}
#card ol span{color:#8a7660;font-size:11px}
#card .card-act{width:100%;min-height:42px;border:0;border-radius:10px;background:#2c2118;color:#f3ead8;font:600 14px system-ui,sans-serif;cursor:pointer}
#card .card-note{font-size:12px;color:#7a6650}

/* talk to the AI - only built for the room's owner (Jaron). Top of the screen: the iPhone keyboard covers the bottom,
   and the floor/people stay clear. One slim row + the last 3 lines, which fade when nothing new is said. */
#chat{position:fixed;z-index:72;left:calc(8px + env(safe-area-inset-left));right:calc(8px + env(safe-area-inset-right));
  top:calc(46px + env(safe-area-inset-top));max-width:440px;margin:0 auto;pointer-events:none}
#chatForm{display:flex;gap:6px;pointer-events:auto}
#chatIn{flex:1;min-width:0;height:40px;border-radius:20px;border:1px solid rgba(232,180,90,.35);background:rgba(26,20,15,.72);
  color:#f3ead8;font:16px/1.2 system-ui,-apple-system,sans-serif;padding:0 14px;outline:none;
  -webkit-user-select:text;user-select:text;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#chatIn::placeholder{color:#b9a98c}
#chatIn:focus{border-color:#e8c98a;background:rgba(26,20,15,.9)}
#chatSay,#chatMute,#chatHist{height:40px;min-width:44px;border-radius:20px;border:1px solid rgba(232,180,90,.4);background:rgba(232,180,90,.16);
  color:#e8c98a;font:600 14px system-ui,sans-serif;padding:0 12px;cursor:pointer}
#chatSay{background:#e8c98a;color:#2a2014;border-color:#e8c98a}
#chatMute,#chatHist{padding:0;width:44px;background:rgba(26,20,15,.72)}
#chatHist.on{background:#e8c98a}
/* history: hidden until the clock button is tapped; a tap on it closes it (Jaron 11/1: never cover the room) */
#chatLog{margin:6px 0 0;font:12.5px/1.35 system-ui,-apple-system,sans-serif;color:#f3ead8;display:none;pointer-events:auto;
  max-height:38vh;overflow-y:auto;background:rgba(26,20,15,.9);border-radius:12px;padding:6px}
#chatLog.on{display:block}
#chatLog div{background:rgba(26,20,15,.55);border-radius:10px;padding:3px 9px;margin:0 0 3px;display:table;max-width:100%;overflow-wrap:anywhere}
#chatLog b{color:#e8c98a;font-weight:600;margin-right:4px}
#chatLog i{font-style:normal;font-size:9.5px;font-weight:800;background:#e8c98a;color:#2a2014;border-radius:4px;padding:0 4px;vertical-align:1px}
#chatLog .ai b{color:#cdb8ff}
/* page D: only when the news video cannot play here - a small link in this panel, never over the screen */
#newsLink{display:inline-block;margin:4px 0 0;color:#e8c98a;font:600 12px system-ui,sans-serif;pointer-events:auto}